Created initial aurelia-multiple-select plugin

.gitignore

@@ -0,0 +1,20 @@
+node_modules
+jspm_packages
+bower_components
+.idea
+.DS_STORE
+build/reports
+typings/
+dev/
+
+sample/node_modules
+sample/jspm_packages
+sample/bower_components
+sample/.idea
+sample/.DS_STORE
+sample/dist
+sample/build/reports
+sample/coverage
+sample/test/e2e/dist
+sample/typings
+sample/export

.npmignore

@@ -0,0 +1,3 @@
+jspm_packages
+bower_components
+.idea

.vscode/extensions.json

@@ -0,0 +1,7 @@
+{
+  "recommendations": [
+    "eg2.tslint",
+    "HookyQR.beautify",
+    "joelday.docthis"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,5 @@
+// Place your settings in this file to overwrite default and user settings.
+{
+"typescript.tsdk": "node_modules/typescript/lib",
+"vsicons.presets.angular": false
+}

CONTRIBUTING.md

@@ -0,0 +1,3 @@
+# Contributing
+
+We'd love for you to contribute and to make this project even better than it is today! If this interests you, please fork the repository and help us improve the control.

README.md

@@ -1,2 +1,156 @@
-# aurelia-multiple-select
-Aurelia Multiple Select Component
+# *aurelia multi select*
+
+  This is an **[Aurelia](http://aurelia.io/)** plugin in order for developers to create star-rate elements in their apps.
+
+
+# 1. Installation
+
+* ##  Aurelia CLI
+
+  run the following command :
+
+  ```
+  npm install aurelia-multi-select --save
+  ```
+  or if you are using *[yarn](https://yarnpkg.com/)*
+
+  ```
+  yarn add aurelia-multi-select
+  ```
+
+  then update the ```aurelia.json``` with the following : 
+
+  ```
+  {
+      "name": "aurelia-multi-select",
+      "path": "../node_modules/aurelia-multi-select/dist/amd",
+      "main": "aurelia-multi-select",
+      "resources": [
+        "elements/multi-select.html"
+      ]
+   }
+  ``` 
+
+  no need to mention that you should have added *[jquery](https://www.npmjs.com/package/jquery)* and *[bootstrap](https://www.npmjs.com/package/bootstrap)* 
+  in ```aurelia.json``` file
+
+  ```
+  "jquery",
+    {
+      "name": "bootstrap",
+      "path": "../node_modules/bootstrap/dist",
+      "main": "js/bootstrap.min",
+      "deps": ["jquery"],
+      "exports": "$",
+      "resources": [
+        "css/bootstrap.css"
+      ]
+    }
+  ```
+
+  then add the plugin in your ```main.ts``` or ```main.js``` file. 
+
+  ``` .plugin("aurelia-multi-select") ```
+
+* ## JSPM  
+
+  Run the jspm install command : 
+
+  ```
+  jspm instal npm:aurelia-multi-select@^1.0.0
+  ```
+
+  then update your ```main.ts``` or ```main.js``` file. 
+
+    ``` .plugin("aurelia-multi-select") ```
+
+
+# 2. Usage
+
+## Simple
+
+Using the control in your .html files is so simple ;-)
+
+```
+<star-rate color="darkgoldenrod" read-only.bind="false" rate.bind="viewmodel.rate & validate" max-rate.bind="5"></star-rate>
+```
+keep in mind that once again you need the following line somwhere in your htmls : 
+
+```
+<require from="bootstrap/css/bootstrap.css"></require>
+```
+
+## Events
+
+You can handle the callback for star rate clicked or changed in two forms : 
+
+1. **Globally** :
+  When any of the star-rate elemnts in your dom which are not read only change the rate a ```StarRateClicked``` message will be published which has *```newRate```* and *```oldRate```* as its data 
+
+  ```
+  import { EventAggregator } from 'aurelia-event-aggregator';
+  import { StarRateClicked } from 'aurelia-multi-select';
+
+  ```
+  and then subscribe fo the message : 
+
+  ```
+  @autoinject
+  export class Welcome {
+    
+    constructor(ea: EventAggregator) {
+      ea.subscribe(StarRateClicked, x => console.info(`E.Aggregator : Rate changed from  ${x.oldRate} to ${x.newRate}`));
+    }
+
+  }
+
+  ```
+
+
+2. **Element based** : You can handle seperate event callbacks for individual star-rate elements 
+ in your *```.html```* file use **```clicked.call```** as follows
+```
+ <star-rate clicked.call="star_clicked(newRate,oldRate)" max-rate.bind="8" rate.one-way="6" read-only.bind="false" color="darkgoldenrod"></star-rate>
+```
+and then in your ```.js``` or ```.ts``` file add your event handler : 
+
+```
+private star_clicked(newRate, oldRate) {
+    console.info(`clicked: Rate changed from  ${oldRate} to ${newRate}`);
+}
+```
+
+
+# 3. Building The Code
+
+To build the code, follow these steps.
+
+1. Ensure that [NodeJS](http://nodejs.org/) is installed. This provides the platform on which the build tooling runs.
+2. Ensure that [Gulp](http://gulpjs.com/) is installed. If you need to install it, use the following command:
+
+  ```shell
+  npm install -g gulp
+  ```
+3. From the project folder (root), execute the following command:
+  ```shell
+  npm install && jspm install
+  ```
+
+4. Install the typings from the root
+  ```
+  typings install
+  ```
+5. To build the plugin, you can now run:
+
+  ```shell
+  gulp build
+  ```
+  * You will find the compiled code in the `dist` folder, available in three module formats: AMD, CommonJS and ES2015.
+
+6. to run the sample do the followings : 
+
+  * run ```npm install && jsmp install`` in the sample older
+  * run ```gulp watch```
+
+
+7. See `gulpfile.js` for other tasks related to generating the docs and linting.

build/args.js

@@ -0,0 +1,14 @@
+var yargs = require('yargs');
+
+var argv = yargs.argv;
+var validBumpTypes = 'major|minor|patch|prerelease'.split('|');
+var bump = (argv.bump || 'patch').toLowerCase();
+
+if (validBumpTypes.indexOf(bump) === -1) {
+  throw new Error('Unrecognized bump "' + bump + '".');
+}
+
+module.exports = {
+  bump: bump,
+  depth: parseInt(argv.depth || '0')
+};

build/pathsBuild.js

@@ -0,0 +1,19 @@
+var appRoot = 'src/';
+var outputRoot = 'dist/';
+var outputDev = './dev';
+
+module.exports = {
+  root: appRoot,
+  source: appRoot + '**/*.ts',
+  html: appRoot + '**/*.html',
+  css: appRoot + '**/*.css',
+  json: appRoot + '**/*.json',
+  woff2: appRoot + '**/*.woff2',
+  output: outputRoot,
+  outputDev: outputDev,
+  doc:'./doc',
+  dtsSrc: [
+    './typings/**/*.d.ts',
+    './custom_typings/**/*.d.ts'
+  ]
+};

build/pathsSample.js

@@ -0,0 +1,23 @@
+var appRoot = './sample/src/';
+var outputRoot = './sample/dist/';
+var plugin = "./dev/"
+var fs = require('fs');
+var pkg = JSON.parse(fs.readFileSync('./package.json', 'utf-8'));
+
+
+module.exports = {
+  root: appRoot,
+  source: appRoot + '**/*.ts',
+  html: appRoot + '**/*.html',
+  css: appRoot + '**/*.css',
+  json: appRoot + '**/*.json',
+  woff2: appRoot + '**/*.woff2',
+  plugin:plugin,
+  output: outputRoot,
+  doc:'./doc',
+  dtsSrc: [
+    './sample/typings/**/*.d.ts',
+    './sample/custom_typings/**/*.d.ts'
+  ],
+  packageName: pkg.name
+};

build/tasks/build.js

@@ -0,0 +1,130 @@
+var gulp = require('gulp');
+var ts = require('gulp-typescript');
+var sourcemaps = require('gulp-sourcemaps');
+var plumber = require('gulp-plumber');
+var assign = Object.assign || require('object.assign');
+var merge = require('merge2');
+var paths = require('../pathsBuild');
+var changed = require('gulp-changed');
+var runSequence = require('run-sequence');
+
+
+var tsProjectAMD = ts.createProject('./tsconfig.json', {
+  typescript: require('typescript'),
+  "declaration": true,
+  target: 'es5',
+  module: 'amd'
+});
+
+
+var tsProjectES6 = ts.createProject('./tsconfig.json', {
+  typescript: require('typescript'),
+  "declaration": true
+});
+
+
+var tsProjectCJS = ts.createProject('./tsconfig.json', {
+  typescript: require('typescript'),
+  "declaration": true,
+  target: 'es5',
+  module: 'commonjs'
+});
+
+
+var tsProjectSystem = ts.createProject('./tsconfig.json', {
+  typescript: require('typescript'),
+  "declaration": true,
+  target: 'es5',
+  module: 'system'
+});
+
+
+function build(tsProject, outputPath) {
+  var tsResult = gulp.src(paths.dtsSrc.concat(paths.source))
+    .pipe(plumber())
+    .pipe(changed(outputPath, {
+      extension: '.ts'
+    }))
+    .pipe(sourcemaps.init({
+      loadMaps: true
+    }))
+    .pipe(tsProject());
+
+  return merge([ // Merge the two output streams, so this task is finished when the IO of both operations is done. 
+      tsResult.dts.pipe(gulp.dest(outputPath)),
+      tsResult.js.pipe(gulp.dest(outputPath))
+    ])
+    .pipe(sourcemaps.write('.', {
+      includeContent: false,
+      sourceRoot: paths.root
+    }))
+    .pipe(gulp.dest(outputPath))
+}
+
+
+gulp.task('build-es2015', function () {
+  return build(tsProjectES6, paths.output + 'es2015');
+});
+
+
+gulp.task('build-commonjs', function () {
+  return build(tsProjectCJS, paths.output + 'commonjs');
+});
+
+
+gulp.task('build-amd', function () {
+  return build(tsProjectAMD, paths.output + 'amd');
+});
+
+
+gulp.task('build-system', function () {
+  return build(tsProjectSystem, paths.output + 'system');
+});
+
+
+gulp.task('build-html', function () {
+  return gulp.src(paths.html)
+    .pipe(gulp.dest(paths.output + 'es2015'))
+    .pipe(gulp.dest(paths.output + 'commonjs'))
+    .pipe(gulp.dest(paths.output + 'amd'))
+    .pipe(gulp.dest(paths.output + 'system'));
+});
+
+
+gulp.task('build-css', function () {
+  return gulp.src(paths.css)
+    .pipe(gulp.dest(paths.output + 'es2015'))
+    .pipe(gulp.dest(paths.output + 'commonjs'))
+    .pipe(gulp.dest(paths.output + 'amd'))
+    .pipe(gulp.dest(paths.output + 'system'));
+});
+
+
+gulp.task('build-json', function () {
+  return gulp.src(paths.json)
+    .pipe(gulp.dest(paths.output + 'es2015'))
+    .pipe(gulp.dest(paths.output + 'commonjs'))
+    .pipe(gulp.dest(paths.output + 'amd'))
+    .pipe(gulp.dest(paths.output + 'system'));
+});
+
+
+gulp.task('build-woff2', function () {
+  return gulp.src(paths.woff2)
+    .pipe(gulp.dest(paths.output + 'es2015'))
+    .pipe(gulp.dest(paths.output + 'commonjs'))
+    .pipe(gulp.dest(paths.output + 'amd'))
+    .pipe(gulp.dest(paths.output + 'system'));
+});
+
+
+
+
+
+gulp.task('build', function (callback) {
+  return runSequence(
+    'clean-build', ['build-json', 'build-woff2', 'build-css', 'build-html', 'build-es2015', 'build-amd', 'build-system', 'build-commonjs'],
+    callback
+  );
+});
+