From 403351d12b0c4d18ec4ee0d26fc1c73237f61637 Mon Sep 17 00:00:00 2001
From: Markus Grigull <web@grigull.me>
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 @@
 </tr>
 {{#each entities as |entity|}}
   <tr>
-    <td>{{#link-to 'lab-mashup.entity' entity}}{{entity.id}}{{/link-to}}</td>
+    <td>{{#link-to 'entities.entity' entity}}{{entity.id}}{{/link-to}}</td>
     <td>{{entity.type}}</td>
   </tr>
 {{/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 @@
 </tr>
 {{#each entity.properties as |property|}}
   <tr>
-    <td>{{property.name}}</td>
+    <td>{{#link-to 'entities.entity.property' property}}{{property.name}}{{/link-to}}</td>
     <td>{{property.value}} {{property.type}}</td>
     <td>{{property.timestamp}}</td>
   </tr>
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 @@
+<section id="main">
+	<h2>Entities</h2>
+
+	{{entities-table entities=model}}
+
+	{{outlet}}
+</section>
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 @@
+<p>{{model.name}}: {{model.value}} {{model.type}}</p>
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 @@
-<section id="main">
-	<section id="main-left">
-		<h2>Entities</h2>
-
-		{{entities-table entities=model}}
-	</section>
-
-	<section id="main-right">
-		{{outlet}}
-	</section>
-</section>
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