Skip to content

Instantly share code, notes, and snippets.

Sean Hunter freshcutdevelopment

Block or report user

Report or block freshcutdevelopment

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View country-picker.js
import {HttpClient} from 'aurelia-fetch-client';
import {bindable} from 'aurelia-framework';
export class CountryPicker{
@bindable country;
constructor(){
this.selected = {"name" : 'Australia', "code" : 'AU'};
this.templateUrl = 'templates/country-template.html';
View country-picker.html
<template>
<require from="../attributes/ux-selectize"></require>
<require from="selectize/dist/css/selectize.default.css"></require>
<require from="flag-icon-css/flag-icon.css"></require>
<label for="options">Select country</label>
<select id="select-country" if.bind="selected"
ux-selectize="httpQuery.bind: getCountries; selected.bind: selected; templateUrl.bind:templateUrl; valueField: code; labelField:name; searchField:name; "
class="demo-default"
@freshcutdevelopment
freshcutdevelopment / ux-selectize.js
Created Oct 1, 2017
ux-selectize Aurelia custom element
View ux-selectize.js
import selectize from "selectize";
import {
inject,
bindable,
Container,
ViewEngine,
bindingMode,
dynamicOptions
} from "aurelia-framework";
import { DOM } from "aurelia-pal";
@freshcutdevelopment
freshcutdevelopment / build.js
Created Oct 1, 2017
Modify the build.js file to include the copy flags step
View build.js
import gulp from 'gulp';
import {CLIOptions, build as buildCLI} from 'aurelia-cli';
import transpile from './transpile';
import processMarkup from './process-markup';
import processCSS from './process-css';
import copyFiles from './copy-files';
import watch from './watch';
import project from '../aurelia.json';
import copyFlags from './copy-flags';
@freshcutdevelopment
freshcutdevelopment / copy-flags.js
Created Oct 1, 2017
Copy the flags into the root of the Aurelia project
View copy-flags.js
import gulp from 'gulp';
import project from '../aurelia.json';
export default function copyFlags() {
console.log("copying flags");
return gulp.src(project.paths.flagsInput)
.pipe(gulp.dest(project.paths.flagsOutput));
}
@freshcutdevelopment
freshcutdevelopment / aurelia.json
Last active Oct 1, 2017
Country-picker aurelia.json file
View aurelia.json
...
"jquery",
"text",
{
"name": "selectize",
"main": "dist/js/standalone/selectize.js",
"path": "../node_modules/selectize",
"deps": [
"jquery"
],
@freshcutdevelopment
freshcutdevelopment / app.html
Last active Sep 29, 2017
Aurelia Gist - Disabled binding
View app.html
<template>
<require from="style.css"></require>
<section>
<h1>${message}</h1>
<hr/>
<div class="form-inline">
<div class="input-group input-group mb-2 mr-sm-2 mb-sm-0">
<input class="form-control mb-2 mr-sm-2 mb-sm-0"
View app.html
<template>
<require from="style.css"></require>
<require from="list-group"></require>
<require from="pokemon.html"></require>
<section>
<h1>${message}</h1>
<hr/>
<h3>custom template</h3>
@freshcutdevelopment
freshcutdevelopment / pokemon.html
Created Sep 24, 2017
Pokemon component - blog
View pokemon.html
<template bindable="model">
<div class="d-flex w-100 justify-content-between">
<h5 class="mb-1 ${model.color}">${model.name}</h5>
<small>${model.category}</small>
</div>
<hr/>
<div class="d-flex w-100 justify-content-between">
<img src="${model.imageSource}"/>
<p class="mb-1">
${model.description}
View list-group.html
<template>
<ul class="list-group">
<li repeat.for="item of itemsSource" class="list-group-item">
<template replaceable part="item-template">${defaultValue(item)}</template>
</li>
</ul>
</template>
You can’t perform that action at this time.