introducing templating! #7 customPosts can now be displayed #135

wordpress-clients · Dec 27, 2015 · c196234 · c196234
1 parent df213cf
commit c196234
Show file tree

Hide file tree

Showing 39 changed files with 234 additions and 173 deletions.
diff --git a/dist/index.js b/dist/index.js
@@ -0,0 +1,7 @@
+import templates from './templates/index.js';
+
+let mod = angular.module('wordpress-hybrid-client.overwriteModule', [
+    templates
+]);
+
+export default mod = mod.name;
diff --git a/dist/templates/customPost-example.html b/dist/templates/customPost-example.html
@@ -0,0 +1,3 @@
+<div class="post padding">
+    <h1 class="item-title" ng-bind-html="customPostCtrl.id"></h1>
+</div>
diff --git a/dist/templates/customPosts-example.html b/dist/templates/customPosts-example.html
@@ -0,0 +1,7 @@
+<div list="posts">
+    <div class="list card card-posts repeat-animation" ng-repeat="item in customPostsCtrl.list">
+        <a ui-sref="public.customPosts.id({ id: item.id, slug: customPostsCtrl.type})">
+            {{item.id}}
+        </a>
+    </div>
+</div>
diff --git a/dist/templates/index.js b/dist/templates/index.js
@@ -0,0 +1,8 @@
+let mod = angular.module('wordpress-hybrid-client.overwriteTemplates', []);
+
+mod.run(($templateCache) => {
+    $templateCache.put('customPost/example.html', require('!html!./customPost-example.html'));
+    $templateCache.put('customPosts/example.html', require('!html!./customPosts-example.html'))
+});
+
+export default mod = mod.name;
diff --git a/lib/abstract/AbstractItem.js b/lib/abstract/AbstractItem.js
@@ -29,6 +29,7 @@ export default class {
         if (!this.$stateParams.id){
             return this.$q.reject();
         }
+        console.log('this.service', this.service)
         return this.service.get(this.$stateParams.id, angular.merge(this.getQuery(), _.get(this.config, `[${this.type}].query`) || {})).then((response) => {
             self.item = response.data;
         });

diff --git a/lib/abstract/AbstractItemService.js b/lib/abstract/AbstractItemService.js
@@ -8,19 +8,20 @@ export default class extends AbstractList {
         super($injector);
     }
 
-    getHttpPromise(id) {
-        return this.service.get(id);
+    getHttpPromise(id, query) {
+        return this.service.get(id, query);
     }
 
-    get(id) {
+    get(id, query) {
+        let queryString = JSON.stringify(query);
         let deferred = this.$q.defer();
-        let hash = md5(this.config.api.baseUrl + id);
-        let itemCache = this.getCache().get('item-' + hash);
+        let hash = md5(`this.config.api.baseUrl${id}${queryString}`);
+        let itemCache = this.getCache().get(`item-${hash}`);
         if (itemCache) {
             deferred.resolve(itemCache);
         } else {
-            this.getHttpPromise(id).then((response) => {
-                    this.getCache().put('item-' + hash, response);
+            this.getHttpPromise(id, query).then((response) => {
+                    this.getCache().put(`item-${hash}`, response);
                     deferred.resolve(response);
                 })
                 .catch((error) => {

diff --git a/lib/abstract/AbstractListService.js b/lib/abstract/AbstractListService.js
@@ -41,13 +41,13 @@ export default class {
     get(query) {
         let queryString = JSON.stringify(query);
         let deferred = this.$q.defer();
-        let hash = md5(this.config.api.baseUrl + queryString);
-        let listCache = this.getCache().get('list-' + hash);
+        let hash = md5(`this.config.api.baseUrl${queryString}`);
+        let listCache = this.getCache().get(`list-${hash}`);
         if (listCache) {
             deferred.resolve(listCache);
         } else {
             this.getHttpPromise(query).then((response) => {
-                    this.getCache().put('list-' + hash, response);
+                    this.getCache().put(`list-${hash}`, response);
                     deferred.resolve(response);
                 })
                 .catch((error) => {

diff --git a/lib/bookmark/bookmark.html b/lib/bookmark/bookmark.html
@@ -4,7 +4,7 @@
         <wphc-empty-list list="bookmarkCtrl.posts" text="bookmark.emptyList" icon="ion-bookmark"></wphc-empty-list>
         <wphc-loader ng-if="!bookmarkCtrl.posts"></wphc-loader>
         <div class="list">
-            <div class="item item-button-right" collection-repeat="post in bookmarkCtrl.posts" ui-sref="public.post({ id: post.id, post: post })">
+            <div class="item item-button-right" collection-repeat="post in bookmarkCtrl.posts" ui-sref="public.posts.id({ id: post.id, post: post })">
                 <span ng-bind-html="post.title.rendered"></span>
                 <p class="text-muted">{{post.bookmarked | amTimeAgo}}</p>
                 <button class="button button-clear button-light button-large action-remove" ng-click="$event.stopPropagation(); bookmarkCtrl.remove(post)">

diff --git a/lib/cordova/cordova.pushNotifications.js b/lib/cordova/cordova.pushNotifications.js
@@ -61,7 +61,7 @@ module.exports = angular.module('wordpress-hybrid-client.cordova')
                     token: token
                 }
             }).finally(() => {
-                return $state.go('public.post', {
+                return $state.go('public.posts.id', {
                     id: postId
                 });
             });

diff --git a/lib/customPosts/customPost.controller.js b/lib/customPosts/customPost.controller.js
@@ -9,5 +9,6 @@ export default class extends AbstractItem {
         this.setType('customPost');
         // this.setTitle($filter('translate')('customPosts.title'));
         this.setService($WPHCCustomPost);
+        this.type = _.get(this.$stateParams, 'slug');
     }
 }
diff --git a/lib/customPosts/customPost.html b/lib/customPosts/customPost.html
@@ -3,6 +3,6 @@
     <ion-content>
         <wphc-loader ng-if="!customPostCtrl.item" on-load="customPostCtrl.init()"></wphc-loader>
         <ion-refresher pulling-text="{{ 'pullToRefresh' | translate}}" on-refresh="customPostCtrl.refresh()"></ion-refresher>
-        <wphc-customPost customPost="customPostCtrl.item" ng-if="customPostCtrl.item"></wphc-customPost>
+        <wphc-custom-post custom-post="customPostCtrl.item" type="{{customPostCtrl.type}}" ng-if="customPostCtrl.item"></wphc-custom-post>
     </ion-content>
 </ion-view>
diff --git a/lib/customPosts/customPosts.controller.js b/lib/customPosts/customPosts.controller.js
@@ -9,5 +9,6 @@ export default class extends AbstractList {
         this.setType('customPosts');
         this.setTitle($filter('translate')('customPosts.title'));
         this.setService($WPHCCustomPosts);
+        this.type = _.get(this.$stateParams, 'slug');
     }
 }
diff --git a/lib/customPosts/customPosts.html b/lib/customPosts/customPosts.html
@@ -4,7 +4,7 @@
         <wphc-empty-list list="customPostsCtrl.list"></wphc-empty-list>
         <wphc-loader ng-if="!customPostsCtrl.list" on-load="customPostsCtrl.init()"></wphc-loader>
         <ion-refresher pulling-text="{{ 'pullToRefresh' | translate}}" on-refresh="customPostsCtrl.refresh()"></ion-refresher>
-        <wphc-customPosts customPosts="customPostsCtrl.list"></wphc-customPosts>
+        <wphc-custom-posts custom-posts="customPostsCtrl.list" type="{{customPostsCtrl.type}}"></wphc-custom-posts>
         <ion-infinite-scroll immediate-check="true" ng-if="customPostsCtrl.list && !customPostsCtrl.isPaginationOver" on-infinite="customPostsCtrl.loadMore()" distance="1%">test</ion-infinite-scroll>
     </ion-content>
 </ion-view>
diff --git a/lib/customPosts/directives/customPost/index.js b/lib/customPosts/directives/customPost/index.js
@@ -0,0 +1,27 @@
+export default function() {
+    return {
+        bindToController: true,
+        replace: false,
+        controller: Controller,
+        controllerAs: 'customPostCtrl',
+        restrict: 'E',
+        scope: {
+            item: '=customPost',
+            type: '@'
+        },
+        template: `
+            <div ng-include="customPostCtrl.templateUrl" ng-if="customPostCtrl.type"></div>
+        `
+    };
+
+    function Controller($scope, $templateCache) {
+        'ngInject';
+
+        var vm = this;
+        vm.templateUrl = `customPost/${vm.type}.html`;
+
+        if (!$templateCache.get(vm.templateUrl)) {
+            throw new Error(`Template ${vm.templateUrl} does not exist`);
+        }
+    }
+}
diff --git a/lib/customPosts/directives/customPosts/index.js b/lib/customPosts/directives/customPosts/index.js
@@ -0,0 +1,27 @@
+export default function() {
+    return {
+        bindToController: true,
+        replace: false,
+        controller: Controller,
+        controllerAs: 'customPostsCtrl',
+        restrict: 'E',
+        scope: {
+            list: '=customPosts',
+            type: '@'
+        },
+        template: `
+            <div ng-include="customPostsCtrl.templateUrl" ng-if="customPostsCtrl.type"></div>
+        `
+    };
+
+    function Controller($scope, $templateCache) {
+        'ngInject';
+
+        var vm = this;
+        vm.templateUrl = `customPosts/${vm.type}.html`;
+
+        if (!$templateCache.get(vm.templateUrl)) {
+            throw new Error(`Template ${vm.templateUrl} does not exist`);
+        }
+    }
+}
diff --git a/lib/customPosts/index.js b/lib/customPosts/index.js
@@ -3,6 +3,8 @@ import modCustomPostController from './customPost.controller.js';
 import modCustomPostsController from './customPosts.controller.js';
 import modCustomPostService from './customPost.service.js';
 import modCustomPostsService from './customPosts.service.js';
+import wphcCustomPost from './directives/customPost/index.js';
+import wphcCustomPosts from './directives/customPosts/index.js';
 
 let mod = angular.module('wordpress-hybrid-client.customPosts', []);
 
@@ -11,5 +13,7 @@ mod.controller('WPHCCustomPostController', modCustomPostController);
 mod.controller('WPHCCustomPostsController', modCustomPostsController);
 mod.service('$WPHCCustomPost', modCustomPostService);
 mod.service('$WPHCCustomPosts', modCustomPostsService);
+mod.directive('wphcCustomPost', wphcCustomPost);
+mod.directive('wphcCustomPosts', wphcCustomPosts);
 
 export default mod = mod.name;
diff --git a/lib/directives/posts/posts.html b/lib/directives/posts/posts.html
@@ -1,6 +1,6 @@
 <div list="posts">
     <div class="list card card-posts repeat-animation" ng-repeat="post in postCtrl.posts">
-        <div ui-sref="public.post(::{ id: post.id })">
+        <div ui-sref="public.posts.id(::{ id: post.id })">
             <div class="item item-image" ng-if="::post.featured_image != 0" wphc-img-background-cache="{{::postCtrl.featureImages[post.id]}}">
                 <div class="img-border"></div>
                 <h1 class="item-title" ng-bind-html="::post.title.rendered | truncate: 50: '...': true"></h1>

diff --git a/lib/index.coffee b/lib/index.coffee
@@ -20,6 +20,8 @@ taxonomiesModule = require './taxonomies/index.js'
 filtersModule = require './filters/index.js'
 directivesModule = require './directives/index.js'
 languageModule = require './language/index.js'
+templatesModule = require './templates/index.js'
+overwriteModule = require '../config/index.js'
 
 # Style entry point
 require './scss/bootstrap'
@@ -42,7 +44,6 @@ module.exports = app = angular.module 'wordpress-hybrid-client', [
     authorsModule
     languageModule
     require('./bookmark/bookmark.module').name
-    require('./post/post.module').name
     require('./menu/menu.module').name
     require('./cordova/cordova.module').name
     require('./params/params.module').name
@@ -52,6 +53,8 @@ module.exports = app = angular.module 'wordpress-hybrid-client', [
     require('./syntaxHighlighter/syntaxHighlighter.module').name
     require('./init/init.module').name
     directivesModule
+    templatesModule
+    overwriteModule
 ]
 
 app.config ($stateProvider, $urlRouterProvider) ->

diff --git a/lib/pages/config.js b/lib/pages/config.js
@@ -6,15 +6,15 @@ export default function($stateProvider) {
             url: "/pages",
             views: {
                 'content': {
-                    template: require("./pages.html"),
+                    templateProvider: ($templateCache) => $templateCache.get('module/pages.html'),
                     controller: "WPHCPagesController as pagesCtrl"
                 }
             }
         }).state('public.pages.id', {
             url: "/:id",
             views: {
                 'content@public': {
-                    template: require("./page.html"),
+                    templateProvider: ($templateCache) => $templateCache.get('module/page.html'),
                     controller: "WPHCPageController as pageCtrl"
                 }
             }

diff --git a/lib/pages/page.controller.js b/lib/pages/page.controller.js
@@ -7,7 +7,6 @@ export default class extends AbstractItem {
 
         super($injector, $scope);
         this.setType('page');
-        // this.setTitle($filter('translate')('pages.title'));
         this.setService($WPHCPage);
     }
 }
diff --git a/lib/post/post.config.coffee b/lib/post/post.config.coffee
diff --git a/lib/post/post.controller.coffee b/lib/post/post.controller.coffee
diff --git a/lib/post/post.html b/lib/post/post.html
diff --git a/lib/post/post.module.coffee b/lib/post/post.module.coffee
diff --git a/lib/post/post.service.coffee b/lib/post/post.service.coffee
diff --git a/lib/posts/config.js b/lib/posts/config.js
@@ -1,13 +1,22 @@
 export default function($stateProvider) {
     'ngInject';
 
-    $stateProvider.state('public.posts', {
-        url: "/posts",
-        views: {
-            'content': {
-                template: require("./index.html"),
-                controller: "WPHCPostsController as postsCtrl"
+    $stateProvider
+        .state('public.posts', {
+            url: "/posts",
+            views: {
+                'content': {
+                    templateProvider: ($templateCache) => $templateCache.get('module/posts.html'),
+                    controller: "WPHCPostsController as postsCtrl"
+                }
             }
-        }
-    });
+        }).state('public.posts.id', {
+            url: "/:id",
+            views: {
+                'content@public': {
+                    templateProvider: ($templateCache) => $templateCache.get('module/post.html'),
+                    controller: "WPHCPostController as postCtrl"
+                }
+            }
+        });
 }