Directives for latest simfiles, latest packs and most downloaded file.
authorCameron Ball <cameron@getapproved.com.au>
Wed, 10 Dec 2014 06:05:08 +0000 (14:05 +0800)
committerCameron Ball <cameron@getapproved.com.au>
Wed, 10 Dec 2014 06:05:08 +0000 (14:05 +0800)
13 files changed:
app/components/menu/menu.html
app/components/simfiles/latest-pack.html [new file with mode: 0644]
app/components/simfiles/latest-simfile.html [new file with mode: 0644]
app/components/simfiles/latestpack-directive.js [new file with mode: 0644]
app/components/simfiles/latestsimfile-directive.js [new file with mode: 0644]
app/components/simfiles/most-downloaded.html [new file with mode: 0644]
app/components/simfiles/mostdownloaded-directive.js [new file with mode: 0644]
app/components/simfiles/simfile-directive.js
app/components/simfiles/simfile.html
app/divinelegy.css
app/index.html
app/pages/packs/packs.html
app/pages/simfiles/simfiles.html

index 60c1188..6a335b9 100644 (file)
@@ -4,4 +4,9 @@
     <li><a href="#/">Home</a></li>
     <li><a href="#/simfiles">Simfiles</a></li>
     <li><a href="#/packs">Packs</a></li>
-</ul>
\ No newline at end of file
+</ul>
+<hr />
+<div latest-simfile></div>
+<div latest-pack></div>
+<hr />
+<div most-downloaded></div>
\ No newline at end of file
diff --git a/app/components/simfiles/latest-pack.html b/app/components/simfiles/latest-pack.html
new file mode 100644 (file)
index 0000000..f47340b
--- /dev/null
@@ -0,0 +1,23 @@
+<h2>Latest Pack</h2>
+<img class="banner" ng-src="{{rockEndpoint}}{{pack.banner}}" alt="swage" />
+<table>
+    <tr>
+        <th>Title:</th>
+        <td>{{pack.title}}</td>
+    </tr>
+    <tr>
+        <th>By:</th>
+        <td>{{contributors}}<td>
+    </tr>
+    <tr ng-if="pack.mirrors">
+        <th>Download:</th>
+        <td>
+            <ul>
+                <li class="mirrorListing" ng-repeat="mirror in pack.mirrors">
+                    <a ng-if="mirror.source == 'DivinElegy'" ng-click="downloadFromDe(pack)" class="de-link">{{mirror.source}}</a>
+                    <a ng-if="mirror.source != 'DivinElegy'" href="{{mirror.uri}}">{{mirror.source}}</a>
+                </li>
+            </ul>
+        </td>
+    </tr>
+</table>
\ No newline at end of file
diff --git a/app/components/simfiles/latest-simfile.html b/app/components/simfiles/latest-simfile.html
new file mode 100644 (file)
index 0000000..c2f72a7
--- /dev/null
@@ -0,0 +1,16 @@
+<h2>Latest Simfile</h2>
+<img class="banner" ng-src="{{rockEndpoint}}{{simfile.banner}}" alt="swage" />
+<table>
+    <tr>
+        <th>Title:</th>
+        <td>{{simfile.title}}</td>
+    </tr>
+    <tr>
+        <th>By:</th>
+        <td>{{authors}}<td>
+    </tr>
+    <tr>
+        <th>Download:</th>
+        <td><a ng-click="downloadFromDe(simfile)" class="de-link">DivinElegy</a></td>
+    </tr>
+</table>
\ No newline at end of file
diff --git a/app/components/simfiles/latestpack-directive.js b/app/components/simfiles/latestpack-directive.js
new file mode 100644 (file)
index 0000000..3fd6799
--- /dev/null
@@ -0,0 +1,70 @@
+'use strict'
+
+//don't put ,[] because that declares a new module. This gets the existing one
+angular.module('DivinElegy.components.simfiles').
+        
+directive('latestPack', ['rockEndpoint', '$http', 'UserService', 'HelloService', '$rootScope', function(rockEndpoint, $http, UserService, HelloService, $rootScope) 
+{
+    return {
+        templateUrl: 'components/simfiles/latest-pack.html',
+        link: function($scope) {
+            $http({
+                url: rockEndpoint + "simfiles/latest/pack",
+                method: "GET"
+            }).
+            success(function (data)
+            {
+                var filesizeBytes = function(size)  
+                {  
+                    //units are already bytes
+                    if(!isNaN(size.substring(size.length-2, size.length-1)))
+                    {
+                        return size.substring(0, size.length-1);
+                    }
+
+                    var units = size.substring(size.length-2, size.length);
+                    var size = size.substring(0, size.length-2);
+                    var fileUnits = ["B", "kB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];  
+
+                    for(var i=0; i<fileUnits.length; i++)
+                    {
+                        if(fileUnits[i] == units) { break; }
+                        size = size*1000;
+                    }
+
+                    return Number(size);  
+                };
+                
+                //TODO: This is duplicated in a few places. What do?
+                $scope.downloadFromDe = function(simfile)
+                {      
+                    if(!UserService.getCurrentUser())
+                    {
+                        $rootScope.$broadcast('message.error', 'You need to be logged in to download from DivinElegy.'); 
+                        return;
+                    }
+
+                    UserService.getCurrentUser().then(function(user)
+                    {
+                        var size = filesizeBytes(simfile.size);
+                        var quotaRemaining = filesizeBytes(user.quotaRemaining);
+
+                        if(quotaRemaining < size)
+                        {
+                            $rootScope.$broadcast('message.error', 'Sorry, you do not have enough quota to download that file. Quota resets at 00:00 UTC+0'); 
+                        } else {
+                            //TODO: Maybe access token should be in user obj?
+                            var url = rockEndpoint + '' + simfile.mirrors[0].uri + '?token=' + HelloService.getAccessToken(); //0th mirror will always be de
+                            $rootScope.$broadcast('message.warning', 'You are about to download ' + simfile.title + ' which is ' + simfile.size + '. Your current quota is ' + user.quotaRemaining + ' click <a ng-click="updateUserCache()" href="' + url + '">here</a> to confirm.'); 
+                        }
+                    });
+                };
+                $scope.asdf = 'hello';
+                $scope.pack = data;
+                $scope.rockEndpoint = rockEndpoint;
+                $scope.contributors = data.contributors.join(', ');
+                $scope.$$phase || $scope.$apply();
+            });
+        }
+    };
+}]);
\ No newline at end of file
diff --git a/app/components/simfiles/latestsimfile-directive.js b/app/components/simfiles/latestsimfile-directive.js
new file mode 100644 (file)
index 0000000..4c1e23e
--- /dev/null
@@ -0,0 +1,79 @@
+'use strict'
+
+//don't put ,[] because that declares a new module. This gets the existing one
+angular.module('DivinElegy.components.simfiles').
+        
+directive('latestSimfile', ['rockEndpoint', '$http', 'UserService', 'HelloService', '$rootScope', function(rockEndpoint, $http, UserService, HelloService, $rootScope) 
+{
+    return {
+        templateUrl: 'components/simfiles/latest-simfile.html',
+        link: function($scope) {
+            $http({
+                url: rockEndpoint + "simfiles/latest/simfile",
+                method: "GET"
+            }).
+            success(function (data)
+            {
+                var authors = [];
+                for(var i=0; i<data.steps.single.length; i++)
+                {
+                    if(authors.indexOf(data.steps.single[i].artist) === -1)
+                    {
+                        authors.push(data.steps.single[i].artist);
+                    }
+                }
+                
+                var filesizeBytes = function(size)  
+                {  
+                    //units are already bytes
+                    if(!isNaN(size.substring(size.length-2, size.length-1)))
+                    {
+                        return size.substring(0, size.length-1);
+                    }
+
+                    var units = size.substring(size.length-2, size.length);
+                    var size = size.substring(0, size.length-2);
+                    var fileUnits = ["B", "kB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];  
+
+                    for(var i=0; i<fileUnits.length; i++)
+                    {
+                        if(fileUnits[i] == units) { break; }
+                        size = size*1000;
+                    }
+
+                    return Number(size);  
+                };
+                
+                //TODO: This is duplicated in a few places. What do?
+                $scope.downloadFromDe = function(simfile)
+                {      
+                    if(!UserService.getCurrentUser())
+                    {
+                        $rootScope.$broadcast('message.error', 'You need to be logged in to download from DivinElegy.'); 
+                        return;
+                    }
+
+                    UserService.getCurrentUser().then(function(user)
+                    {
+                        var size = filesizeBytes(simfile.size);
+                        var quotaRemaining = filesizeBytes(user.quotaRemaining);
+
+                        if(quotaRemaining < size)
+                        {
+                            $rootScope.$broadcast('message.error', 'Sorry, you do not have enough quota to download that file. Quota resets at 00:00 UTC+0'); 
+                        } else {
+                            //TODO: Maybe access token should be in user obj?
+                            var url = rockEndpoint + '' + simfile.download + '?token=' + HelloService.getAccessToken(); //0th mirror will always be de
+                            $rootScope.$broadcast('message.warning', 'You are about to download ' + simfile.title + ' which is ' + simfile.size + '. Your current quota is ' + user.quotaRemaining + ' click <a ng-click="updateUserCache()" href="' + url + '">here</a> to confirm.'); 
+                        }
+                    });
+                };
+                
+                $scope.simfile = data;
+                $scope.rockEndpoint = rockEndpoint;
+                $scope.authors = authors.join(', ');
+                $scope.$$phase || $scope.$apply();
+            });
+        }
+    };
+}]);
\ No newline at end of file
diff --git a/app/components/simfiles/most-downloaded.html b/app/components/simfiles/most-downloaded.html
new file mode 100644 (file)
index 0000000..18bca0f
--- /dev/null
@@ -0,0 +1,23 @@
+<h2>Most Popular</h2>
+<img class="banner" ng-src="{{rockEndpoint}}{{banner}}" alt="swage" />
+<table>
+    <tr>
+        <th>Title:</th>
+        <td>{{title}}</td>
+    </tr>
+    <tr>
+        <th>By:</th>
+        <td>{{contributors}}<td>
+    </tr>
+    <tr>
+        <th>Download:</th>
+        <td>
+            <ul>
+                <li class="mirrorListing" ng-repeat="download in downloads">
+                    <a ng-if="download.source == 'DivinElegy'" ng-click="downloadFromDe(packOrSimfile)" class="de-link">{{download.source}}</a>
+                    <a ng-if="download.source != 'DivinElegy'" href="{{download.uri}}">{{download.source}}</a>
+                </li>
+            </ul>
+        </td>
+    </tr>
+</table>
\ No newline at end of file
diff --git a/app/components/simfiles/mostdownloaded-directive.js b/app/components/simfiles/mostdownloaded-directive.js
new file mode 100644 (file)
index 0000000..8bf3684
--- /dev/null
@@ -0,0 +1,98 @@
+'use strict'
+
+//don't put ,[] because that declares a new module. This gets the existing one
+angular.module('DivinElegy.components.simfiles').
+        
+directive('mostDownloaded', ['rockEndpoint', '$http', 'UserService', 'HelloService', '$rootScope', function(rockEndpoint, $http, UserService, HelloService, $rootScope) 
+{
+    return {
+        templateUrl: 'components/simfiles/most-downloaded.html',
+        scope: {}, //this is needed as we use some of the same names as latestpack directive. This makes a new scope for this directive, isolated from latestpack.
+        link: function($scope) {
+            $http({
+                url: rockEndpoint + "simfiles/popular",
+                method: "GET"
+            }).
+            success(function (data)
+            {
+                var filesizeBytes = function(size)  
+                {  
+                    //units are already bytes
+                    if(!isNaN(size.substring(size.length-2, size.length-1)))
+                    {
+                        return size.substring(0, size.length-1);
+                    }
+
+                    var units = size.substring(size.length-2, size.length);
+                    var size = size.substring(0, size.length-2);
+                    var fileUnits = ["B", "kB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];  
+
+                    for(var i=0; i<fileUnits.length; i++)
+                    {
+                        if(fileUnits[i] == units) { break; }
+                        size = size*1000;
+                    }
+
+                    return Number(size);  
+                };
+                
+                //TODO: This is duplicated in a few places. What do?
+                $scope.downloadFromDe = function(simfile)
+                {      
+                    if(!UserService.getCurrentUser())
+                    {
+                        $rootScope.$broadcast('message.error', 'You need to be logged in to download from DivinElegy.'); 
+                        return;
+                    }
+
+                    UserService.getCurrentUser().then(function(user)
+                    {
+                        var size = filesizeBytes(simfile.size);
+                        var quotaRemaining = filesizeBytes(user.quotaRemaining);
+
+                        if(quotaRemaining < size)
+                        {
+                            $rootScope.$broadcast('message.error', 'Sorry, you do not have enough quota to download that file. Quota resets at 00:00 UTC+0'); 
+                        } else {
+                            //TODO: Maybe access token should be in user obj?
+                            var url;
+                            if(data.contributors)
+                            {
+                                url = rockEndpoint + '' + simfile.mirrors[0].uri + '?token=' + HelloService.getAccessToken(); //0th mirror will always be de
+                            } else {
+                                url = rockEndpoint + '' + simfile.download + '?token=' + HelloService.getAccessToken(); //0th mirror will always be de
+                            }
+                            $rootScope.$broadcast('message.warning', 'You are about to download ' + simfile.title + ' which is ' + simfile.size + '. Your current quota is ' + user.quotaRemaining + ' click <a ng-click="updateUserCache()" href="' + url + '">here</a> to confirm.'); 
+                        }
+                    });
+
+                };
+                $scope.rockEndpoint = rockEndpoint;
+                $scope.title = data.title;
+                $scope.banner = data.banner;
+                $scope.packOrSimfile = data;
+                
+                if(data.contributors)
+                {
+                    $scope.contributors = data.contributors.join(', ');
+                    $scope.downloads = data.mirrors;
+                } else {
+                    var authors = [];
+                    for(var i=0; i<data.steps.single.length; i++)
+                    {
+                        if(authors.indexOf(data.steps.single[i].artist) === -1)
+                        {
+                            authors.push(data.steps.single[i].artist);
+                        }
+                    }
+                    
+                    $scope.contributors = authors.join(', ');
+                    $scope.downloads = [{source: 'DivinElegy', 'uri': data.download}];
+                }
+
+                //have to use rootScope here since we are no longer sharing scope with other directives.
+                $rootScope.$$phase || $rootScope.$apply();
+            });
+        }
+    };
+}]);
\ No newline at end of file
index 7f42793..f7dfe9f 100644 (file)
@@ -18,7 +18,8 @@ directive('simfile', ['$rootScope', 'UserService', 'HelloService', 'rockEndpoint
             bgChanges: '=',
             fgChanges: '=',
             size: '=',
-            download: '='
+            download: '=',
+            uploaded: '='
         },
         templateUrl: 'components/simfiles/simfile.html',
         link: function($scope) {
index 9b0f22a..5bbc503 100644 (file)
@@ -8,8 +8,8 @@
         <th>Artist:</th>
         <td>{{artist}}</td>
     </tr>
-    <tr ng-if="steps.single">
-        <th>Steps-single:</th>
+    <tr ng-if="steps.single.length">
+        <th>Singles:</th>
         <td>
             <ul>
                 <li ng-repeat="stepchart in steps.single">
@@ -18,8 +18,8 @@
             </ul>
         </td>
     </tr>
-    <tr ng-if="steps.double">
-        <th>Steps-double:</th>
+    <tr ng-if="steps.double.length">
+        <th>Doubles:</th>
         <td>
             <ul>
                 <li ng-repeat="stepchart in steps.double">
@@ -28,6 +28,7 @@
             </ul>
         </td>
     </tr>
+    <tr><td colspan="2">&nbsp;</td></tr>
     <tr>
         <th>BPMChanges:</th>
         <td>{{bpmChanges}}</td>
         <th>FGChanges:</th>
         <td>{{fgChanges}}</td>
     </tr>
+    <tr><td colspan="2">&nbsp;</td></tr>
     <tr ng-if="size">
         <th>Size:</th>
         <td>{{size}}</td>
     </tr>
+    <tr ng-if="uploaded">
+        <th>Upload Date:</th>
+        <td>{{uploaded}}</td>
+    </tr>
     <tr ng-if="download">
         <th>Download:</th>
         <td><a ng-click="downloadFromDe(simfile)" class="de-link">DivinElegy</a></td>
index 391c487..933a211 100644 (file)
@@ -24,6 +24,23 @@ body {
     line-height: normal;
 }
 
+table {
+    text-align: left;
+}
+
+#navigation table {
+    border-collapse: separate;
+    border-spacing: 0 5px;
+}
+
+th {
+    font-weight: bold;
+}
+
+td {
+    padding-left: 5px;
+}
+
 .panel {
     background: #1C2C3C;
     border: 3px solid #000000;
@@ -34,9 +51,13 @@ body {
     padding: 7px;
 }
 
-.panel h1 {
+#navigation hr {
+    margin-top: 18px;
+    border-color: black;
+}
+
+.panel h1, .panel h2 {
     color: white;
-    font-size: 21px;
     font-weight: bold;
     margin: 18px 0px 0px 0px;
     text-shadow:1px 1px 0 #000,
@@ -50,6 +71,24 @@ body {
     -webkit-font-smoothing: antialiased;
 }
 
+.panel h1 {
+    font-size: 21px;
+}
+
+.panel h2 {
+    font-size:15px;
+    margin-bottom: 2px;
+}
+
+.panel .banner {
+    max-width: 130px;
+    border: 2px solid #000000;
+    border-radius: 10px;
+    -moz-border-radius: 10px;
+    -webkit-border-radius: 10px;
+    margin-left: -2px;
+}
+
 
 #navigation,
 #controlPanel {
@@ -153,8 +192,8 @@ body {
     margin-right:5px;
 }
 
-.simfileListing table {
-    text-align: left;
+.simfileListing .panel-body {
+    margin-top: 5px;
 }
 
 a {
@@ -167,10 +206,6 @@ a:hover {
     text-decoration: underline;
 }
 
-.simfileListing th {
-    font-weight: bold;
-}
-
 .simfileListing.active {
     background: rgba(0,0,0,0.5);
     border: 2px solid rgba(0,0,0,1);
index 17a9188..bb6295d 100644 (file)
@@ -3,7 +3,7 @@
     <head>
         <meta charset="utf-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <title>DivinElegy - Rock n Roll</title>
+        <title>DivinElegy - Rock 'n' Roll</title>
         
         <!-- Styles -->
         <link rel="stylesheet" href="reset.css"/>
@@ -31,6 +31,9 @@
         <script src="components/userMenu/userMenu-directive.js"></script>
         <script src="components/simfiles/simfiles-service.js"></script>
         <script src="components/simfiles/simfile-directive.js"></script>
+        <script src="components/simfiles/latestsimfile-directive.js"></script>
+        <script src="components/simfiles/latestpack-directive.js"></script>
+        <script src="components/simfiles/mostdownloaded-directive.js"></script>
         <script src="components/messages/messagebox-controller.js"></script>
         <script src="components/messages/messagebox-directive.js"></script>
         
index a23e27d..9267208 100644 (file)
@@ -19,7 +19,7 @@ BPM changes: <input type="checkbox" ng-model="bpmChangesFilterKeyword">
     <accordion-group class     = "simfileListing"\r
                      is-open   = "isOpen"\r
                      ng-class  = "{active: isOpen}"\r
-                     heading   = "{{pack.title}}"\r
+                     heading   = "{{isOpen ? '- ' + pack.title : '+ ' + pack.title}}"\r
                      ng-init   = "contributors=getContributors(pack.contributors)"\r
                      ng-repeat = "pack in packList | filter: packTitleFilter\r
                                                    | filter: artistFilter\r
@@ -39,10 +39,15 @@ BPM changes: <input type="checkbox" ng-model="bpmChangesFilterKeyword">
                 <th>Contributors:</th>\r
                 <td>{{contributors}}</td>\r
             </tr>\r
+            <tr><td>&nbsp;</td></tr>\r
             <tr ng-if="pack.size">\r
                 <th>Size:</th>\r
                 <td>{{pack.size}}</td>\r
             </tr>\r
+            <tr>\r
+                <th>Uploaded Date:</th>\r
+                <td>{{pack.uploaded}}</td>\r
+            </tr>\r
             <tr ng-if="pack.mirrors">\r
                 <th>Downloads:</th>\r
                 <td>\r
@@ -58,7 +63,7 @@ BPM changes: <input type="checkbox" ng-model="bpmChangesFilterKeyword">
         <div class="clearfix"></div>\r
         <h1>Charts</h1>\r
         <accordion>\r
-            <accordion-group class="simfileListing" ng-class="{active: isOpen}" heading="{{simfile.title}}" ng-repeat="simfile in pack.simfiles">\r
+            <accordion-group class="simfileListing" is-open="isOpen2" ng-class="{active: isOpen2}" heading="{{isOpen2 ? '- ' + simfile.title : '+ ' + simfile.title}}" ng-repeat="simfile in pack.simfiles">\r
                 <simfile rock-endpoint="rockEndpoint"\r
                          simfile="simfile"\r
                          banner="simfile.banner"\r
index 53ddaa8..c440742 100644 (file)
@@ -18,7 +18,7 @@ BPM changes: <input type="checkbox" ng-model="bpmChangesFilterKeyword">
     <accordion-group class     = "simfileListing"\r
                      is-open   = "isOpen"\r
                      ng-class  = "{active: isOpen}"\r
-                     heading   = "{{simfile.title}}"\r
+                     heading   = "{{isOpen ? '- ' + simfile.title : '+ ' + simfile.title}}"\r
                      ng-repeat = "simfile in simfileList | filter: artistFilter\r
                                                          | filter: titleFilter\r
                                                          | filter: stepsFilter\r
@@ -34,9 +34,10 @@ BPM changes: <input type="checkbox" ng-model="bpmChangesFilterKeyword">
                  steps="simfile.steps"\r
                  bpm-changes="simfile.bpmChanges"\r
                  bg-changes="simfile.bgChanges"\r
-                 fg-changes="simfile.fgChanges",\r
-                 size="simfile.size",\r
+                 fg-changes="simfile.fgChanges"\r
+                 size="simfile.size"\r
                  download="simfile.download"\r
+                 uploaded="simfile.uploaded"\r
         />\r
     </accordion-group>\r
 </accordion>
\ No newline at end of file