From 403351d12b0c4d18ec4ee0d26fc1c73237f61637 Mon Sep 17 00:00:00 2001 From: Markus Grigull Date: Wed, 7 Oct 2015 15:09:26 +0200 Subject: [PATCH] Added property route The list of properties of an entity is clickable and redirects to the detailed view of the property (not programmed yet). The routes have changed (renamed lab-mashup to entities). The layout has changed and is work in progress. The data model has changed. Properties have an own model and are connected via relationships to the entity model. --- app/components/entities-table.js | 2 +- app/mirage/factories/entity.js | 11 ++----- app/models/entity.js | 6 ++-- app/models/property.js | 9 ++++++ app/router.js | 6 ++-- app/routes/{lab-mashup.js => entities.js} | 1 + app/routes/entities/entity.js | 8 +++++ .../{lab-mashup => entities/entity}/index.js | 0 app/routes/entities/entity/property.js | 8 +++++ app/routes/entities/index.js | 4 +++ app/routes/lab-mashup/entity.js | 7 ---- app/serializers/application.js | 32 +++++++++++++++---- app/styles/app.css | 13 ++++++-- app/templates/components/entities-table.hbs | 2 +- app/templates/components/properties-table.hbs | 2 +- app/templates/entities.hbs | 7 ++++ .../{lab-mashup => entities}/entity.hbs | 2 ++ app/templates/entities/entity/index.hbs | 0 app/templates/entities/entity/property.hbs | 1 + .../{lab-mashup => entities}/index.hbs | 0 app/templates/lab-mashup.hbs | 11 ------- config/environment.js | 2 +- 22 files changed, 90 insertions(+), 44 deletions(-) create mode 100644 app/models/property.js rename app/routes/{lab-mashup.js => entities.js} (81%) create mode 100644 app/routes/entities/entity.js rename app/routes/{lab-mashup => entities/entity}/index.js (100%) create mode 100644 app/routes/entities/entity/property.js create mode 100644 app/routes/entities/index.js delete mode 100644 app/routes/lab-mashup/entity.js create mode 100644 app/templates/entities.hbs rename app/templates/{lab-mashup => entities}/entity.hbs (84%) create mode 100644 app/templates/entities/entity/index.hbs create mode 100644 app/templates/entities/entity/property.hbs rename app/templates/{lab-mashup => entities}/index.hbs (100%) delete mode 100644 app/templates/lab-mashup.hbs diff --git a/app/components/entities-table.js b/app/components/entities-table.js index 555fdc6..4f1e003 100644 --- a/app/components/entities-table.js +++ b/app/components/entities-table.js @@ -2,5 +2,5 @@ import Ember from 'ember'; export default Ember.Component.extend({ tagName: 'table', - classNames: ['data-table'] + classNames: ['data-table', 'entity-table'] }); diff --git a/app/mirage/factories/entity.js b/app/mirage/factories/entity.js index c8d2cfc..ad6de03 100644 --- a/app/mirage/factories/entity.js +++ b/app/mirage/factories/entity.js @@ -8,14 +8,9 @@ export default Mirage.Factory.extend({ properties: function(i) { var data = []; - for (var j = 0; j < 10; j++) { - data.push({ - name: faker.random.arrayElement(['Current', 'Max. Current', 'Voltage', 'Max. Voltage', 'Power', 'Max. Power']), - value: faker.finance.amount(-100, 100, 4), - type: faker.random.arrayElement(['A', 'kV', 'MW']), - timestamp: faker.date.past() - }) - } + data.push({name: 'Current', value: faker.finance.amount(-100, 100, 4), type: 'A', timestamp: faker.date.past()}); + data.push({name: 'Voltage', value: faker.finance.amount(-100, 100, 4), type: 'kV', timestamp: faker.date.past()}); + data.push({name: 'Power', value: faker.finance.amount(-100, 100, 4), type: 'MW', timestamp: faker.date.past()}); return data; } diff --git a/app/models/entity.js b/app/models/entity.js index 885c899..8b945cb 100644 --- a/app/models/entity.js +++ b/app/models/entity.js @@ -3,13 +3,13 @@ import DS from 'ember-data'; export default DS.Model.extend({ type: DS.attr('string'), - properties: DS.attr(), + properties: DS.hasMany('property'), - poll: function() { + /*poll: function() { var _this = this; Ember.run.later( function() { _this.reload(); _this.poll(); }, 1000); - }.on('didLoad') + }.on('didLoad')*/ }); diff --git a/app/models/property.js b/app/models/property.js new file mode 100644 index 0000000..a0bccae --- /dev/null +++ b/app/models/property.js @@ -0,0 +1,9 @@ +import DS from 'ember-data'; + +export default DS.Model.extend({ + name: DS.attr('string'), + value: DS.attr('number'), + type: DS.attr('string'), + timestamp: DS.attr('date'), + entity: DS.belongsTo('entity') +}); diff --git a/app/router.js b/app/router.js index d4875f9..5e68bea 100644 --- a/app/router.js +++ b/app/router.js @@ -6,8 +6,10 @@ var Router = Ember.Router.extend({ }); Router.map(function() { - this.route('lab-mashup', { path: '/' }, function() { - this.route('entity', { path: '/:entity_id' }); + this.route('entities', { path: '/' }, function() { + this.route('entity', { path: '/:entity_id' }, function() { + this.route('property', { path: '/:property_id'}); + }); }); }); diff --git a/app/routes/lab-mashup.js b/app/routes/entities.js similarity index 81% rename from app/routes/lab-mashup.js rename to app/routes/entities.js index 3ac0567..44a5d51 100644 --- a/app/routes/lab-mashup.js +++ b/app/routes/entities.js @@ -2,6 +2,7 @@ import Ember from 'ember'; export default Ember.Route.extend({ model() { + console.log('entities'); return this.store.findAll('entity'); } }); diff --git a/app/routes/entities/entity.js b/app/routes/entities/entity.js new file mode 100644 index 0000000..b423a80 --- /dev/null +++ b/app/routes/entities/entity.js @@ -0,0 +1,8 @@ +import Ember from 'ember'; + +export default Ember.Route.extend({ + model(params) { + console.log("entity: " + params.entity_id); + return this.store.findRecord('entity', params.entity_id); + } +}); diff --git a/app/routes/lab-mashup/index.js b/app/routes/entities/entity/index.js similarity index 100% rename from app/routes/lab-mashup/index.js rename to app/routes/entities/entity/index.js diff --git a/app/routes/entities/entity/property.js b/app/routes/entities/entity/property.js new file mode 100644 index 0000000..e583ed5 --- /dev/null +++ b/app/routes/entities/entity/property.js @@ -0,0 +1,8 @@ +import Ember from 'ember'; + +export default Ember.Route.extend({ + model(params) { + console.log("property: " + params.property_id); + return this.store.findRecord('property', params.property_id); + } +}); diff --git a/app/routes/entities/index.js b/app/routes/entities/index.js new file mode 100644 index 0000000..26d9f31 --- /dev/null +++ b/app/routes/entities/index.js @@ -0,0 +1,4 @@ +import Ember from 'ember'; + +export default Ember.Route.extend({ +}); diff --git a/app/routes/lab-mashup/entity.js b/app/routes/lab-mashup/entity.js deleted file mode 100644 index 5ac36df..0000000 --- a/app/routes/lab-mashup/entity.js +++ /dev/null @@ -1,7 +0,0 @@ -import Ember from 'ember'; - -export default Ember.Route.extend({ - model(params) { - return this.store.findRecord('entity', params.entity_id); - } -}); diff --git a/app/serializers/application.js b/app/serializers/application.js index e388765..06eaf75 100644 --- a/app/serializers/application.js +++ b/app/serializers/application.js @@ -24,6 +24,8 @@ export default DS.RESTSerializer.extend({ }, _normalizePayload: function(payload, handleEntity) { + var propertyIndex = 0; + // check if payload has context responses if (payload.contextResponses) { payload.contextResponses.forEach(function(item) { @@ -34,21 +36,37 @@ export default DS.RESTSerializer.extend({ type: 'entity', id: item.contextElement.id, attributes: { - type: item.contextElement.type, - properties: [] + type: item.contextElement.type//, + //properties: [] + }, + relationships: { + properties: { + data: [] + } } } if (item.contextElement.attributes) { item.contextElement.attributes.forEach(function(attribute) { var property = { - name: attribute.name, - value: attribute.value, - type: attribute.type, - timestamp: attribute.metadatas[0].value + type: 'property', + id: 'property_' + propertyIndex++, + attributes: { + name: attribute.name, + type: attribute.type, + value: attribute.value, + timestamp: attribute.metadatas[0].value + }, + relationships: { + entity: { + data: { type: 'entity', id: entity.id } + } + } } - entity.attributes.properties.push(property); + entity.relationships.properties.data.push({ type: 'property', id: property.id }); + + handleEntity(property); }); } diff --git a/app/styles/app.css b/app/styles/app.css index f5a1e36..2523d8d 100644 --- a/app/styles/app.css +++ b/app/styles/app.css @@ -58,16 +58,20 @@ body { float: left; width: 45%; + margin-top: 20px; + padding-top: 10px; - padding-left: 25px; + /*padding-left: 25px;*/ } #main-right { float: right; width: 45%; + margin-top: 20px; + padding-top: 10px; - padding-right: 25px; + /*padding-right: 25px;*/ } #main::after { @@ -122,3 +126,8 @@ body { font-size: 14px; } + +.data-table.entity-table { + width: 45%; + margin: 0; +} diff --git a/app/templates/components/entities-table.hbs b/app/templates/components/entities-table.hbs index a1981b0..bc6c889 100644 --- a/app/templates/components/entities-table.hbs +++ b/app/templates/components/entities-table.hbs @@ -4,7 +4,7 @@ {{#each entities as |entity|}} - {{#link-to 'lab-mashup.entity' entity}}{{entity.id}}{{/link-to}} + {{#link-to 'entities.entity' entity}}{{entity.id}}{{/link-to}} {{entity.type}} {{/each}} diff --git a/app/templates/components/properties-table.hbs b/app/templates/components/properties-table.hbs index 16a83ea..df26ea2 100644 --- a/app/templates/components/properties-table.hbs +++ b/app/templates/components/properties-table.hbs @@ -5,7 +5,7 @@ {{#each entity.properties as |property|}} - {{property.name}} + {{#link-to 'entities.entity.property' property}}{{property.name}}{{/link-to}} {{property.value}} {{property.type}} {{property.timestamp}} diff --git a/app/templates/entities.hbs b/app/templates/entities.hbs new file mode 100644 index 0000000..654b8f4 --- /dev/null +++ b/app/templates/entities.hbs @@ -0,0 +1,7 @@ +
+

Entities

+ + {{entities-table entities=model}} + + {{outlet}} +
diff --git a/app/templates/lab-mashup/entity.hbs b/app/templates/entities/entity.hbs similarity index 84% rename from app/templates/lab-mashup/entity.hbs rename to app/templates/entities/entity.hbs index eb6e543..592aa67 100644 --- a/app/templates/lab-mashup/entity.hbs +++ b/app/templates/entities/entity.hbs @@ -1,3 +1,5 @@ {{entity-title entity=model}} {{properties-table entity=model}} + +{{outlet}} diff --git a/app/templates/entities/entity/index.hbs b/app/templates/entities/entity/index.hbs new file mode 100644 index 0000000..e69de29 diff --git a/app/templates/entities/entity/property.hbs b/app/templates/entities/entity/property.hbs new file mode 100644 index 0000000..76b21c4 --- /dev/null +++ b/app/templates/entities/entity/property.hbs @@ -0,0 +1 @@ +

{{model.name}}: {{model.value}} {{model.type}}

diff --git a/app/templates/lab-mashup/index.hbs b/app/templates/entities/index.hbs similarity index 100% rename from app/templates/lab-mashup/index.hbs rename to app/templates/entities/index.hbs diff --git a/app/templates/lab-mashup.hbs b/app/templates/lab-mashup.hbs deleted file mode 100644 index b31228d..0000000 --- a/app/templates/lab-mashup.hbs +++ /dev/null @@ -1,11 +0,0 @@ -
-
-

Entities

- - {{entities-table entities=model}} -
- -
- {{outlet}} -
-
diff --git a/config/environment.js b/config/environment.js index b14f4c1..cdce1b9 100644 --- a/config/environment.js +++ b/config/environment.js @@ -38,7 +38,7 @@ module.exports = function(environment) { // ENV.APP.LOG_TRANSITIONS_INTERNAL = true; // ENV.APP.LOG_VIEW_LOOKUPS = true; - ENV.APP.API_HOST = 'http://46.101.131.212:4200'; + ENV.APP.API_HOST = 'http://localhost:4200'; ENV['ember-cli-mirage'] = { enabled: true