Skip to content

Instantly share code, notes, and snippets.

View avrahamcool's full-sized avatar

Avraham Essoudry avrahamcool

View GitHub Profile
@avrahamcool
avrahamcool / app.html
Created August 16, 2018 07:02
repeat.for length bug
<template>
<button click.trigger="resetBySetting0()">resetBySetting0</button>
<button click.trigger="resetByNewReference()">resetByNewReference</button>
<button click.trigger="add()">add</button>
<p>items.length = ${items.length}</p>
<p repeat.for="item of items">${item.name}</p>
</template>
@avrahamcool
avrahamcool / app.html
Last active October 16, 2017 18:44 — forked from jdanyow/app.html
Aurelia Gist
<template>
<style>
.dummy
{
display: none;
}
</style>
input type number (max = 99): <input type="number" max="99" value.bind="val" />
<input class="dummy" type="range" max="99" value.bind="val" />
@avrahamcool
avrahamcool / app.html
Last active March 22, 2017 09:26 — forked from Thanood/app.html
Aurelia-Materialize bridge modal options
<template>
<require from="materialize/dist/css/materialize.css"></require>
<div>
<div>
<p><a md-button href="#modal1">show modal from 60% to 70%</a></p>
<p><a md-button href="#modal2">show modal from 10% to 70%</a></p>
</div>
<div id="modal1" md-modal="
dismissible: true;
in-duration: 500;
@avrahamcool
avrahamcool / app.html
Created March 22, 2017 08:21 — forked from Thanood/app.html
Aurelia-Materialize bridge tabs api
<template>
<require from="materialize/dist/css/materialize.css"></require>
<div class="row">
<div style="margin-bottom: 10px;">
<button md-button click.delegate="selectTab2()">select tab 2</button><br /><br />
Selected tab: ${demotabs.selectedTab | stringify}
</div>
<ul md-tabs md-tabs.ref="demotabs" class="z-depth-1">
<li md-waves="color: primary;"><a class="active" href="#tab_1">Tab 1</a></li>
@avrahamcool
avrahamcool / app.html
Created March 19, 2017 12:50 — forked from Thanood/app.html
Aurelia-Materialize bridge input fields character counter
<template>
<div>
<md-input md-label="put some text here" md-value.bind="textValue" md-char-counter="length: 120;"></md-input><br />
You entered: ${textValue}<br />
<button md-button="flat: true;" md-waves class="accent-text" click.delegate="setText()">set text to something</button>
</div>
</template>
@avrahamcool
avrahamcool / app.html
Last active March 16, 2017 13:17 — forked from Thanood/app.html
Aurelia-Materialize bridge modal.open() from attached event
<template>
<require from="./my-component-not-working"></require>
<p><button md-button click.delegate="showComponentNotWorking = true">show component who has a modal</button></p>
<my-component-not-working if.bind="showComponentNotWorking"></my-component-not-working>
</template>
@avrahamcool
avrahamcool / _autoresize.md
Created March 14, 2017 13:35 — forked from Thanood/_autoresize.md
Aurelia-Materialize bridge input fields textarea

Textareas don't autoresize

The reason for that is there's a "hiddendiv" created on document.ready() to determine the height of the resized textarea. That hidden div doesn't exist anymore when the sample app creates real textareas (see here). After Aurelia takes control, it replaces the content of its container (meaning aurelia-app="main").


The reference to hiddenDiv (a variable) is essentially broken once Aurelia kicks in. I'm not sure if there is any good workaround apart from creating such a div manually and outside of Aurelia scope.