From fa5f8fad0c3d80ef7c10611f6ca89c2645652ac0 Mon Sep 17 00:00:00 2001
From: AnthonyCapirchio <a.capirchio@synapse-studio.fr>
Date: Sat, 18 Apr 2015 19:45:26 +0200
Subject: [PATCH 1/2] return template directly from the templates object
 instead of switch / case

---
 data/templates.json |  6 +++---
 js/app.js           | 16 +---------------
 2 files changed, 4 insertions(+), 18 deletions(-)

diff --git a/data/templates.json b/data/templates.json
index cf7ac49..4902f62 100644
--- a/data/templates.json
+++ b/data/templates.json
@@ -1,6 +1,6 @@
 {
-  "imageTemplate": "<div class='entry-photo'><h2>&nbsp;</h2><div class='entry-img'><span><a href='{{rootDirectory}}{{content.data}}'><img ng-src='{{rootDirectory}}{{content.data}}' alt='entry photo'></a></span></div><div class='entry-text'><div class='entry-title'>{{content.title}}</div><div class='entry-copy'>{{content.description}}</div></div></div>",
-  "videoTemplate": "<div class='entry-video'><h2>&nbsp;</h2><div class='entry-vid'><iframe ng-src='{{content.data}}' width='280' height='200' frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div><div class='entry-text'><div class='entry-title'>{{content.title}}</div><div class='entry-copy'>{{content.description}}</div></div></div>",
-  "noteTemplate": "<div class='entry-note'><h2>&nbsp;</h2><div class='entry-text'><div class='entry-title'>{{content.title}}</div><div class='entry-copy'>{{content.data}}</div></div></div>"
+  "image": "<div class='entry-photo'><h2>&nbsp;</h2><div class='entry-img'><span><a href='{{rootDirectory}}{{content.data}}'><img ng-src='{{rootDirectory}}{{content.data}}' alt='entry photo'></a></span></div><div class='entry-text'><div class='entry-title'>{{content.title}}</div><div class='entry-copy'>{{content.description}}</div></div></div>",
+  "video": "<div class='entry-video'><h2>&nbsp;</h2><div class='entry-vid'><iframe ng-src='{{content.data}}' width='280' height='200' frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div><div class='entry-text'><div class='entry-title'>{{content.title}}</div><div class='entry-copy'>{{content.description}}</div></div></div>",
+  "notes": "<div class='entry-note'><h2>&nbsp;</h2><div class='entry-text'><div class='entry-title'>{{content.title}}</div><div class='entry-copy'>{{content.data}}</div></div></div>"
 }
 
diff --git a/js/app.js b/js/app.js
index a9afb10..19e779b 100644
--- a/js/app.js
+++ b/js/app.js
@@ -42,21 +42,7 @@ app.controller('ContentCtrl', function (DataService) {
 
 app.directive('contentItem', function ($compile, TemplateService) {
     var getTemplate = function (templates, contentType) {
-        var template = '';
-
-        switch (contentType) {
-            case 'image':
-                template = templates.imageTemplate;
-                break;
-            case 'video':
-                template = templates.videoTemplate;
-                break;
-            case 'notes':
-                template = templates.noteTemplate;
-                break;
-        }
-
-        return template;
+        return templates[contentType] || '';
     };
 
     var linker = function (scope, element, attrs) {

From 383ad58ea3e4c58ffe4224d4112aba844baf037f Mon Sep 17 00:00:00 2001
From: AnthonyCapirchio <a.capirchio@synapse-studio.fr>
Date: Sat, 18 Apr 2015 20:14:42 +0200
Subject: [PATCH 2/2] TemplateService refacto to have more reusable service

---
 js/app.js | 54 +++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 43 insertions(+), 11 deletions(-)

diff --git a/js/app.js b/js/app.js
index 19e779b..8d64822 100644
--- a/js/app.js
+++ b/js/app.js
@@ -16,13 +16,44 @@ app.factory('DataService', function ($http, URL) {
     };
 });
 
-app.factory('TemplateService', function ($http, URL) {
-    var getTemplates = function () {
-        return $http.get(URL + 'templates.json');
+app.factory('TemplateService', function ($http, $compile, $q, URL) {
+    
+    var deferred    = $q.defer(),
+        templates   = null,
+        loadPromise = deferred.promise;
+
+    var loadTemplates = function () {
+        $http.get(URL + 'templates.json').then(function(res){
+            templates = res.data;
+            deferred.resolve();
+        });
+    };
+
+    var getTemplate = function (name) {
+        return templates[name] || '';
     };
 
     return {
-        getTemplates: getTemplates
+        load: function(){
+            loadTemplates();
+
+            return this;
+        },
+
+        compile:function(params){
+            var _compile = function(){
+                params.element.html( getTemplate(params.templateName) );
+
+                $compile( params.element.contents() )(params.scope);
+            }
+
+            if(null !== templates){
+                _compile();
+            }
+            else{
+                loadPromise.then(_compile);
+            }
+        }
     };
 });
 
@@ -40,7 +71,7 @@ app.controller('ContentCtrl', function (DataService) {
     ctrl.fetchContent();
 });
 
-app.directive('contentItem', function ($compile, TemplateService) {
+app.directive('contentItem', function (TemplateService) {
     var getTemplate = function (templates, contentType) {
         return templates[contentType] || '';
     };
@@ -48,13 +79,14 @@ app.directive('contentItem', function ($compile, TemplateService) {
     var linker = function (scope, element, attrs) {
         scope.rootDirectory = 'images/';
 
-        TemplateService.getTemplates().then(function (response) {
-            var templates = response.data;
+        TemplateService
+            .load()
+            .compile({
+                templateName    : scope.content.content_type,
+                scope           : scope,
+                element         : element
+            });
 
-            element.html(getTemplate(templates, scope.content.content_type));
-
-            $compile(element.contents())(scope);
-        });
     };
 
     return {