Turn the simfile display into a directive.
authorCameron Ball <cameron@getapproved.com.au>
Tue, 25 Nov 2014 09:00:50 +0000 (17:00 +0800)
committerCameron Ball <cameron@getapproved.com.au>
Tue, 25 Nov 2014 09:00:50 +0000 (17:00 +0800)
app/components/hello/hello-service.js
app/components/simfiles/simfile-directive.js [new file with mode: 0644]
app/components/simfiles/simfile.html [new file with mode: 0644]
app/components/simfiles/simfiles-service.js
app/divinelegy.js
app/index.html
app/pages/simfiles/simfiles.html
app/pages/simfiles/simfiles.js
app/pages/upload/upload.html
app/pages/upload/upload.js

index d7afcde..37302ee 100644 (file)
@@ -38,6 +38,11 @@ factory("HelloService", ['rockEndpoint', '$http', '$location', '$q', function(ro
         window.hello.utils.store('facebook', facebookObj);
     };
     
+    hello.getAccessToken = function()
+    {
+        return hello.utils.store('facebook').access_token;
+    };
+    
     hello.facebookLogin = function()
     {
         // get the short term token
diff --git a/app/components/simfiles/simfile-directive.js b/app/components/simfiles/simfile-directive.js
new file mode 100644 (file)
index 0000000..3ce3470
--- /dev/null
@@ -0,0 +1,28 @@
+'use strict'
+
+//don't put ,[] because that declares a new module. This gets the existing one
+angular.module('DivinElegy.components.simfiles').
+        
+directive('simfile', function() 
+{
+    return {
+        restrict: 'E',
+        scope: {
+            simfile: '=',
+            rockEndpoint: '=',
+            banner: '=',
+            title: '=',
+            artist: '=',
+            steps: '=',
+            bpmChanges: '=',
+            bgChanges: '=',
+            fgChanges: '='
+        },
+        templateUrl: 'components/simfiles/simfile.html',
+        link: function(scope, element, attrs){
+            
+            console.log(scope.simfile);
+            console.log(scope.bpmChanges);
+        }
+    };
+});
\ No newline at end of file
diff --git a/app/components/simfiles/simfile.html b/app/components/simfiles/simfile.html
new file mode 100644 (file)
index 0000000..02681db
--- /dev/null
@@ -0,0 +1,44 @@
+<img ng-src="{{rockEndpoint}}{{banner}}" alt="swage" />
+<table>
+    <tr>
+        <th>Title:</th>
+        <td>{{title}}</td>
+    </tr>
+    <tr>
+        <th>Artist:</th>
+        <td>{{artist}}</td>
+    </tr>
+    <tr ng-if="steps.single">
+        <th>Steps-single:</th>
+        <td>
+            <ul>
+                <li ng-repeat="stepchart in steps.single">
+                    <div class="difficulty {{stepchart.difficulty}}">{{stepchart.rating}} ({{stepchart.artist}})</div>
+                </li>
+            </ul>
+        </td>
+    </tr>
+    <tr ng-if="steps.double">
+        <th>Steps-double:</th>
+        <td>
+            <ul>
+                <li ng-repeat="stepchart in steps.double">
+                    <span>{{stepchart.difficulty}} {{stepchart.rating}}</span>
+                </li>
+            </ul>
+        </td>
+    </tr>
+    <tr>
+        <th>BPMChanges:</th>
+        <td>{{bpmChanges}}</td>
+    </tr>
+    <tr>
+        <th>BGChanges:</th>
+        <td>{{bgChanges}}</td>
+    </tr>
+    <tr>
+        <th>FGChanges:</th>
+        <td>{{fgChanges}}</td>
+    </tr>
+</table>
+<div class="clearfix"></div>
\ No newline at end of file
index 3907334..5628e38 100644 (file)
@@ -2,16 +2,52 @@
 
 angular.module("DivinElegy.components.simfiles", ['DivinElegy.components.config']).
       
-factory("SimfileService", ['rockEndpoint', '$http', function(rockEndpoint, $http)
+factory("SimfileService", ['rockEndpoint', '$http', '$q', function(rockEndpoint, $http, $q)
 {
     var simfileAPI = {};
     
     simfileAPI.getSimfiles = function()
     {
-        return $http({
-            url: rockEndpoint + "simfiles/",
-            method: "GET"
-        });
+        var deferred = $q.defer();
+        
+        if(this.cache)
+        {
+            deferred.resolve(this.cache.simfiles);
+        } else {
+            $http({
+                url: rockEndpoint + "simfiles/",
+                method: "GET"
+            }).
+            success(function (data)
+            {
+                simfileAPI.cache = data;
+                deferred.resolve(data.simfiles);
+            });
+        }
+        
+        return deferred.promise;
+    };
+    
+    simfileAPI.getPacks = function()
+    {
+        var deferred = $q.defer();
+        
+        if(this.cache)
+        {
+            deferred.resolve(this.cache.packs);
+        } else {
+            $http({
+                url: rockEndpoint + "simfiles/",
+                method: "GET"
+            }).
+            success(function (data)
+            {
+                simfileAPI.cache = data;
+                deferred.resolve(data.packs);
+            });
+        }
+        
+        return deferred.promise;
     };
     
     return simfileAPI;
index f30203c..d53d25e 100644 (file)
@@ -3,9 +3,10 @@
 // Declare app level module which depends on views, and components
 angular.module('DivinElegy', [
   'ngRoute',
-  'DivinElegy.components.hello',
+  //'DivinElegy.components.hello',
   'DivinElegy.components.menu',
   'DivinElegy.components.userMenu',
+  'DivinElegy.components.simfiles',
   'DivinElegy.pages.index',
   'DivinElegy.pages.upload',
   'DivinElegy.pages.simfiles'
index 2fbaf49..5de5f42 100644 (file)
@@ -27,6 +27,7 @@
         <script src="components/menu/menu-directive.js"></script>
         <script src="components/userMenu/userMenu-directive.js"></script>
         <script src="components/simfiles/simfiles-service.js"></script>
+        <script src="components/simfiles/simfile-directive.js"></script>
         
         <!-- pages -->
         <script src="pages/index/index.js"></script>
index dc66e7d..7e27d17 100644 (file)
@@ -24,50 +24,16 @@ BPM changes: <input type="checkbox" ng-model="bpmChangesFilterKeyword">
     ">\r
         <a ng-click="openListing($index)">{{simfile.title}}</a>\r
         <div class="content" ng-show="isListingActive($index)">\r
-            <img ng-src="{{rockEndpoint}}{{simfile.banner}}" alt="swage" />\r
-            <table>\r
-                <tr>\r
-                    <th>Title:</th>\r
-                    <td>{{simfile.title}}</td>\r
-                </tr>\r
-                <tr>\r
-                    <th>Artist:</th>\r
-                    <td>{{simfile.artist}}</td>\r
-                </tr>\r
-                <tr ng-if="simfile.steps.single">\r
-                    <th>Steps-single:</th>\r
-                    <td>\r
-                        <ul>\r
-                            <li ng-repeat="stepchart in simfile.steps.single">\r
-                                <div class="difficulty {{stepchart.difficulty}}">{{stepchart.rating}} ({{stepchart.artist}})</div>\r
-                            </li>\r
-                        </ul>\r
-                    </td>\r
-                </tr>\r
-                <tr ng-if="simfile.steps.double">\r
-                    <th>Steps-double:</th>\r
-                    <td>\r
-                        <ul>\r
-                            <li ng-repeat="stepchart in simfile.steps.double">\r
-                                <span>{{stepchart.difficulty}} {{stepchart.rating}}</span>\r
-                            </li>\r
-                        </ul>\r
-                    </td>\r
-                </tr>\r
-                <tr>\r
-                    <th>BPMChanges:</th>\r
-                    <td>{{simfile.bpmChanges}}</td>\r
-                </tr>\r
-                <tr>\r
-                    <th>BGChanges:</th>\r
-                    <td>{{simfile.bgChanges}}</td>\r
-                </tr>\r
-                <tr>\r
-                    <th>FGChanges:</th>\r
-                    <td>{{simfile.fgChanges}}</td>\r
-                </tr>\r
-            </table>\r
-            <div class="clearfix"></div>\r
+            <simfile rock-endpoint="rockEndpoint"\r
+                     simfile="simfile"\r
+                     banner="simfile.banner"\r
+                     title="simfile.title"\r
+                     artist="simfile.artist"\r
+                     steps="simfile.steps"\r
+                     bpm-changes="simfile.bpmChanges"\r
+                     bg-changes="simfile.bgChanges"\r
+                     fg-changes="simfile.fgChanges"\r
+            />\r
         </div>\r
     </li>\r
 </ul>
\ No newline at end of file
index 5aa57b7..17e1923 100644 (file)
@@ -122,8 +122,13 @@ angular.module("DivinElegy.pages.simfiles", ["DivinElegy.components.simfiles","D
             return !$scope.bpmChangesFilterKeyword || simfile.bpmChanges === 'Yes';
     };
     
-    SimfileService.getSimfiles().success(function(response)
+    SimfileService.getSimfiles().then(function(simfiles)
     {
-        $scope.simfileList = response;
+        $scope.simfileList = simfiles;
+    });
+    
+    SimfileService.getPacks().then(function(packs)
+    {
+        $scope.packList = packs;
     });
 }]);
\ No newline at end of file
index 154791b..74df3a0 100644 (file)
@@ -7,6 +7,7 @@
 <br />
 <!-- Example: nv-file-select="" uploader="{Object}" options="{Object}" filters="{String}" -->
 <input type="file" nv-file-select="" uploader="uploader" multiple />
+<input type="hidden" name="token" value="{{token}}" />
 <h2>The queue. Length: {{ uploader.queue.length}}</h2>
 <ul>
     <li ng-repeat="item in uploader.queue">
index f0a23ea..512274c 100644 (file)
@@ -1,9 +1,12 @@
 'use strict';
 
-angular.module("DivinElegy.pages.upload", ['angularFileUpload', 'DivinElegy.components.config'])
+angular.module("DivinElegy.pages.upload", ['angularFileUpload', 'DivinElegy.components.config', 'DivinElegy.components.hello'])
 
-.controller("UploadController", ['rockEndpoint', '$scope', 'FileUploader', function(rockEndpoint, $scope, FileUploader)
+.controller("UploadController", ['rockEndpoint', 'HelloService', '$scope', 'FileUploader', function(rockEndpoint, HelloService, $scope, FileUploader)
 {
+    
+    $scope.token = HelloService.getAccessToken();
+    
     var uploader = $scope.uploader = new FileUploader(
     {
         url: rockEndpoint + 'simfiles/upload'