Merge branch 'develop'

Author: edeustace

gulpfile.js

@@ -1,34 +1,10 @@
 const gulp = require('gulp'),
-  releaseHelper = require('release-helper'),
-  runSequence = require('run-sequence'),
-  path = require('path'),
-  webpack = require('webpack'),
-  fs = require('fs-extra'),
-  exec = require('child_process').exec;
+  releaseHelper = require('release-helper');
 
 //Init custom release tasks
 releaseHelper.init(gulp);
 
-let glue = suffix => gulp.src(`src/**/*.${suffix}`).pipe(gulp.dest('lib'));
-
-let watch = (suffix, tasks) => {
-  tasks = tasks ? tasks : [suffix];
-  return gulp.watch(`src/**/*.${suffix}`, tasks);
-}
-
 gulp.task('test', ['build'], () => {
   throw new Error('todo...');
 });
 
-gulp.task('clean', (done) => {
-  fs.remove('dist', done);
-});
-
-gulp.task('build', (done) => {
-  let cfg = require('./webpack.config');
-  cfg.output.path = './dist';
-  webpack(cfg, done);
-});
-
-///gulp.task('dev', ['build', 'watch-pug', 'watch-ts']);
-

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pie-catalog-client",
-  "version": "0.1.0",
+  "version": "0.2.0-prerelease",
   "description": "The client code for the catalog",
   "scripts": {
     "test": "npm test"

src/catalog-demo/element-models.js

@@ -0,0 +1,54 @@
+import _ from 'lodash';
+
+export default class Elements {
+
+  constructor(root, models) {
+    this.root = root;
+    this.models = models;
+
+    let upgradePromises = _.map(models, (m) => customElements.whenDefined(m.element));
+
+    let returnElement = (m) => {
+      let el = root.querySelector(`${m.element}[data-id="${m.id}"]`);
+      if (el) {
+        return { id: m.id, element: el };
+      }
+    }
+
+    let setData = (d) => {
+      let { element, id } = d;
+
+      if (!element) {
+        throw new Error('el not defined');
+      }
+
+      if (this._env) {
+        element.env = this._env;
+      }
+
+      let data = _.find(this.models, { id: id });
+
+      _.forEach(data, (value, key) => {
+        if (key !== 'id' && key !== 'element') {
+          element[key] = value;
+        }
+      });
+    }
+
+    Promise.all(upgradePromises)
+      .then(() => {
+        this._elements = _(models).map(returnElement).compact().value();
+        _.forEach(this._elements, setData);
+      });
+  }
+
+  set env(e) {
+    this._env = e;
+
+    if (this._elements && this._env) {
+      _.forEach(this._elements, (d) => {
+        d.element.env = this._env;
+      });
+    }
+  }
+}

src/catalog-demo/index.js

@@ -1,4 +1,7 @@
-import { prepareTemplate, applyStyle, boxShadow } from '../styles';
+import { applyStyle, boxShadow, prepareTemplate } from '../styles';
+
+import ElementModels from './element-models';
+
 const templateHTML = `
     <style>
       :host{
@@ -29,6 +32,7 @@ export default class CatalogDemo extends HTMLElement {
   constructor() {
     super();
 
+
     /** Note: can't use shadow root if the inner element is dependentent 
      * on style definitions that uses markup from inside the element.
      */
@@ -74,6 +78,10 @@ export default class CatalogDemo extends HTMLElement {
       });
 
     this._updatePies();
+
+    if (this._config.elementModels) {
+      this._elementModels = new ElementModels(this, this._config.elementModels);
+    }
   }
 
   set controllers(c) {
@@ -91,6 +99,7 @@ export default class CatalogDemo extends HTMLElement {
     return session;
   }
 
+
   _updatePies() {
     if (!this._config || !this._controllers) {
       return;