Merge branch 'release/0.1.18'

build/paths.js

@@ -7,6 +7,9 @@ module.exports = {
   source: appRoot + '**/*.js',
   html: appRoot + '**/*.html',
   style: 'styles/**/*.css',
+  sass: 'styles/styles.scss',
+  saasStyle: 'styles/**/*.sass',
+  styleFolder: './styles',
   output: 'dist/',
   doc:'./doc',
   e2eSpecsSrc: 'test/e2e/src/*.js',

build/tasks/build.js

@@ -5,12 +5,17 @@ var paths = require('../paths');
 var compilerOptions = require('../babel-options');
 var assign = Object.assign || require('object.assign');
 
+gulp.task('build-styles-es6', function () {
+  return gulp.src(paths.style)
+    .pipe(gulp.dest(paths.output + 'es6'));
+});
+
 gulp.task('build-html-es6', function () {
   return gulp.src(paths.html)
     .pipe(gulp.dest(paths.output + 'es6'));
 });
 
-gulp.task('build-es6', ['build-html-es6'], function () {
+gulp.task('build-es6', ['build-html-es6','build-styles-es6'], function () {
   return gulp.src(paths.source)
     .pipe(gulp.dest(paths.output + 'es6'));
 });
@@ -20,7 +25,12 @@ gulp.task('build-html-commonjs', function () {
     .pipe(gulp.dest(paths.output + 'commonjs'));
 });
 
-gulp.task('build-commonjs', ['build-html-commonjs'], function () {
+gulp.task('build-styles-commonjs', function () {
+  return gulp.src(paths.style)
+    .pipe(gulp.dest(paths.output + 'commonjs'));
+});
+
+gulp.task('build-commonjs', ['build-html-commonjs', 'build-styles-commonjs'], function () {
   return gulp.src(paths.source)
     .pipe(to5(assign({}, compilerOptions, {modules:'common'})))
     .pipe(gulp.dest(paths.output + 'commonjs'));
@@ -31,7 +41,12 @@ gulp.task('build-html-amd', function () {
     .pipe(gulp.dest(paths.output + 'amd'));
 });
 
-gulp.task('build-amd', ['build-html-amd'], function () {
+gulp.task('build-styles-amd', function () {
+  return gulp.src(paths.style)
+    .pipe(gulp.dest(paths.output + 'amd'));
+});
+
+gulp.task('build-amd', ['build-html-amd','build-styles-amd'], function () {
   return gulp.src(paths.source)
     .pipe(to5(assign({}, compilerOptions, {modules:'amd'})))
     .pipe(gulp.dest(paths.output + 'amd'));
@@ -42,7 +57,12 @@ gulp.task('build-html-system', function () {
     .pipe(gulp.dest(paths.output + 'system'));
 });
 
-gulp.task('build-system', ['build-html-system'], function () {
+gulp.task('build-styles-system', function () {
+  return gulp.src(paths.style)
+    .pipe(gulp.dest(paths.output + 'system'));
+});
+
+gulp.task('build-system', ['build-html-system','build-styles-system'], function () {
   return gulp.src(paths.source)
     .pipe(to5(assign({}, compilerOptions, {modules:'system'})))
     .pipe(gulp.dest(paths.output + 'system'));

build/tasks/sass.js

@@ -0,0 +1,34 @@
+var gulp = require('gulp');
+var minifyCSS = require('gulp-minify-css');
+var plumber = require('gulp-plumber');
+var sass = require('gulp-ruby-sass');
+var gulpFilter = require('gulp-filter');
+var sourcemaps = require('gulp-sourcemaps');
+var paths = require('../paths');
+var runSequence = require('run-sequence');
+
+
+/**
+ * Generate CSS from SCSS
+ * Build sourcemaps
+ */
+gulp.task('sass', function () {
+
+    var sassConfig = {
+        noCache: true,
+        compass: true,
+        sourcemap: false,
+        force: false
+    };
+
+    // Don’t write sourcemaps of sourcemaps
+    var filter = gulpFilter(['*.css', '!*.map']);
+
+     return sass(paths.sass, sassConfig)
+     .pipe(plumber())
+     .pipe(sourcemaps.init())
+     .pipe(filter) // Don’t write sourcemaps of sourcemaps
+     .pipe(sourcemaps.write())
+     .pipe(filter.restore()) // Restore original files
+     .pipe(gulp.dest(paths.styleFolder));
+});

config.js

@@ -22,6 +22,7 @@ System.config({
     "babel-runtime": "npm:babel-runtime@5.5.6",
     "core-js": "npm:core-js@0.9.15",
     "css": "github:systemjs/plugin-css@0.1.12",
+    "devbridge/jQuery-Autocomplete": "github:devbridge/jQuery-Autocomplete@1.2.21",
     "jquery": "github:components/jquery@2.1.4",
     "select2": "github:select2/select2@3.5.2",
     "github:aurelia/binding@0.7.1": {

dist/amd/autocomplete-abstract.js

@@ -0,0 +1,30 @@
+define(['exports'], function (exports) {
+  'use strict';
+
+  var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+  var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+
+  Object.defineProperty(exports, '__esModule', {
+    value: true
+  });
+
+  var AutoCompleteAbstract = (function () {
+    function AutoCompleteAbstract() {
+      _classCallCheck(this, AutoCompleteAbstract);
+    }
+
+    _createClass(AutoCompleteAbstract, [{
+      key: 'search',
+      value: function search(item) {
+        return new Promise(function (resolve) {
+          resolve({ suggestions: [{ value: 'Code and Description', data: '01234' }] });
+        });
+      }
+    }]);
+
+    return AutoCompleteAbstract;
+  })();
+
+  exports.AutoCompleteAbstract = AutoCompleteAbstract;
+});

dist/amd/autocomplete-widget.html

@@ -0,0 +1,4 @@
+<template>
+  <label class="control-label" show.bind="isShowing">${title}</label>
+  <input class="form-control" type="text" class="autocomplete-widget" />
+</template>

dist/amd/autocomplete-widget.js

@@ -0,0 +1,77 @@
+define(['exports', 'aurelia-framework', 'jquery', 'devbridge/jQuery-Autocomplete'], function (exports, _aureliaFramework, _jquery, _devbridgeJQueryAutocomplete) {
+  'use strict';
+
+  var _interopRequire = function (obj) { return obj && obj.__esModule ? obj['default'] : obj; };
+
+  var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+  var _createDecoratedClass = (function () { function defineProperties(target, descriptors, initializers) { for (var i = 0; i < descriptors.length; i++) { var descriptor = descriptors[i]; var decorators = descriptor.decorators; var key = descriptor.key; delete descriptor.key; delete descriptor.decorators; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor || descriptor.initializer) descriptor.writable = true; if (decorators) { for (var f = 0; f < decorators.length; f++) { var decorator = decorators[f]; if (typeof decorator === 'function') { descriptor = decorator(target, key, descriptor) || descriptor; } else { throw new TypeError('The decorator for method ' + descriptor.key + ' is of the invalid type ' + typeof decorator); } } if (initializers) initializers[key] = descriptor.initializer; } Object.defineProperty(target, key, descriptor); } } return function (Constructor, protoProps, staticProps, protoInitializers, staticInitializers) { if (protoProps) defineProperties(Constructor.prototype, protoProps, protoInitializers); if (staticProps) defineProperties(Constructor, staticProps, staticInitializers); return Constructor; }; })();
+
+  Object.defineProperty(exports, '__esModule', {
+    value: true
+  });
+
+  var _$ = _interopRequire(_jquery);
+
+  var _autocomplete = _interopRequire(_devbridgeJQueryAutocomplete);
+
+  var AutoCompleteWidget = (function () {
+    function AutoCompleteWidget(element) {
+      _classCallCheck(this, _AutoCompleteWidget);
+
+      this.element = element;
+    }
+
+    var _AutoCompleteWidget = AutoCompleteWidget;
+
+    _createDecoratedClass(_AutoCompleteWidget, [{
+      key: 'bind',
+      value: function bind() {
+        this.apply();
+      }
+    }, {
+      key: 'isShowing',
+      decorators: [_aureliaFramework.computedFrom('title')],
+      get: function () {
+        return this.title != undefined && this.title.length > 0;
+      }
+    }, {
+      key: 'apply',
+      value: function apply() {
+        _$(this.element).find('input').autocomplete({
+          lookup: this.lookup.bind(this),
+          onSelect: this.onSelect.bind(this)
+        });
+      }
+    }, {
+      key: 'lookup',
+      value: function lookup(query, done) {
+        this.controller.search(query).then(function (results) {
+          done(results);
+        });
+      }
+    }, {
+      key: 'onSelect',
+      value: function onSelect(suggestion) {
+        this.selectedItem = suggestion.data;
+      }
+    }]);
+
+    AutoCompleteWidget = _aureliaFramework.bindable('title')(AutoCompleteWidget) || AutoCompleteWidget;
+    AutoCompleteWidget = _aureliaFramework.bindable({
+      name: 'selectedItem',
+      attribute: 'selected-item',
+      defaultBindingMode: _aureliaFramework.bindingMode.twoWay
+    })(AutoCompleteWidget) || AutoCompleteWidget;
+    AutoCompleteWidget = _aureliaFramework.bindable({
+      name: 'controller',
+      attribute: 'controller',
+      defaultBindingMode: _aureliaFramework.bindingMode.twoWay
+    })(AutoCompleteWidget) || AutoCompleteWidget;
+    AutoCompleteWidget = _aureliaFramework.customElement('autocomplete-widget')(AutoCompleteWidget) || AutoCompleteWidget;
+    AutoCompleteWidget = _aureliaFramework.inject(Element)(AutoCompleteWidget) || AutoCompleteWidget;
+    return AutoCompleteWidget;
+  })();
+
+  exports.AutoCompleteWidget = AutoCompleteWidget;
+});

dist/amd/index.js

@@ -8,5 +8,6 @@ define(['exports'], function (exports) {
 
 	function configure(aurelia) {
 		aurelia.globalizeResources('./lookup-widget');
+		aurelia.globalizeResources('./autocomplete-widget');
 	}
 });

dist/commonjs/autocomplete-abstract.js

@@ -0,0 +1,28 @@
+'use strict';
+
+var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var AutoCompleteAbstract = (function () {
+  function AutoCompleteAbstract() {
+    _classCallCheck(this, AutoCompleteAbstract);
+  }
+
+  _createClass(AutoCompleteAbstract, [{
+    key: 'search',
+    value: function search(item) {
+      return new Promise(function (resolve) {
+        resolve({ suggestions: [{ value: 'Code and Description', data: '01234' }] });
+      });
+    }
+  }]);
+
+  return AutoCompleteAbstract;
+})();
+
+exports.AutoCompleteAbstract = AutoCompleteAbstract;

dist/commonjs/autocomplete-widget.html

@@ -0,0 +1,4 @@
+<template>
+  <label class="control-label" show.bind="isShowing">${title}</label>
+  <input class="form-control" type="text" class="autocomplete-widget" />
+</template>

dist/commonjs/autocomplete-widget.js

@@ -0,0 +1,81 @@
+'use strict';
+
+var _interopRequireWildcard = function (obj) { return obj && obj.__esModule ? obj : { 'default': obj }; };
+
+var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+var _createDecoratedClass = (function () { function defineProperties(target, descriptors, initializers) { for (var i = 0; i < descriptors.length; i++) { var descriptor = descriptors[i]; var decorators = descriptor.decorators; var key = descriptor.key; delete descriptor.key; delete descriptor.decorators; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor || descriptor.initializer) descriptor.writable = true; if (decorators) { for (var f = 0; f < decorators.length; f++) { var decorator = decorators[f]; if (typeof decorator === 'function') { descriptor = decorator(target, key, descriptor) || descriptor; } else { throw new TypeError('The decorator for method ' + descriptor.key + ' is of the invalid type ' + typeof decorator); } } if (initializers) initializers[key] = descriptor.initializer; } Object.defineProperty(target, key, descriptor); } } return function (Constructor, protoProps, staticProps, protoInitializers, staticInitializers) { if (protoProps) defineProperties(Constructor.prototype, protoProps, protoInitializers); if (staticProps) defineProperties(Constructor, staticProps, staticInitializers); return Constructor; }; })();
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var _inject$bindable$customElement$bindingMode$computedFrom = require('aurelia-framework');
+
+var _$ = require('jquery');
+
+var _$2 = _interopRequireWildcard(_$);
+
+var _autocomplete = require('devbridge/jQuery-Autocomplete');
+
+var _autocomplete2 = _interopRequireWildcard(_autocomplete);
+
+var AutoCompleteWidget = (function () {
+  function AutoCompleteWidget(element) {
+    _classCallCheck(this, _AutoCompleteWidget);
+
+    this.element = element;
+  }
+
+  var _AutoCompleteWidget = AutoCompleteWidget;
+
+  _createDecoratedClass(_AutoCompleteWidget, [{
+    key: 'bind',
+    value: function bind() {
+      this.apply();
+    }
+  }, {
+    key: 'isShowing',
+    decorators: [_inject$bindable$customElement$bindingMode$computedFrom.computedFrom('title')],
+    get: function () {
+      return this.title != undefined && this.title.length > 0;
+    }
+  }, {
+    key: 'apply',
+    value: function apply() {
+      _$2['default'](this.element).find('input').autocomplete({
+        lookup: this.lookup.bind(this),
+        onSelect: this.onSelect.bind(this)
+      });
+    }
+  }, {
+    key: 'lookup',
+    value: function lookup(query, done) {
+      this.controller.search(query).then(function (results) {
+        done(results);
+      });
+    }
+  }, {
+    key: 'onSelect',
+    value: function onSelect(suggestion) {
+      this.selectedItem = suggestion.data;
+    }
+  }]);
+
+  AutoCompleteWidget = _inject$bindable$customElement$bindingMode$computedFrom.bindable('title')(AutoCompleteWidget) || AutoCompleteWidget;
+  AutoCompleteWidget = _inject$bindable$customElement$bindingMode$computedFrom.bindable({
+    name: 'selectedItem',
+    attribute: 'selected-item',
+    defaultBindingMode: _inject$bindable$customElement$bindingMode$computedFrom.bindingMode.twoWay
+  })(AutoCompleteWidget) || AutoCompleteWidget;
+  AutoCompleteWidget = _inject$bindable$customElement$bindingMode$computedFrom.bindable({
+    name: 'controller',
+    attribute: 'controller',
+    defaultBindingMode: _inject$bindable$customElement$bindingMode$computedFrom.bindingMode.twoWay
+  })(AutoCompleteWidget) || AutoCompleteWidget;
+  AutoCompleteWidget = _inject$bindable$customElement$bindingMode$computedFrom.customElement('autocomplete-widget')(AutoCompleteWidget) || AutoCompleteWidget;
+  AutoCompleteWidget = _inject$bindable$customElement$bindingMode$computedFrom.inject(Element)(AutoCompleteWidget) || AutoCompleteWidget;
+  return AutoCompleteWidget;
+})();
+
+exports.AutoCompleteWidget = AutoCompleteWidget;

dist/commonjs/index.js

@@ -7,4 +7,5 @@ exports.configure = configure;
 
 function configure(aurelia) {
 	aurelia.globalizeResources('./lookup-widget');
+	aurelia.globalizeResources('./autocomplete-widget');
 }