adding sort support for all levels

README

@@ -7,3 +7,6 @@ Inspired by the store example by Elf M. Sternberg I decided to try taking this c
 
 Issue 3 with bookmarking closed. The status of bookmarking is that I've now moved over to Backbone's 'at' allowing direct index references rather than cid lookups. What this means is that subalbums and photos now have fully working bookmarks (which actually weren't correct in the last commit). You can now use index.html#imageid/1/subalbum/1 to access an image inside a subalbum however I might alter this to subalbum/n/imageid/m or something similar. Quite a lot of refactoring to be done within the codebase.
 
+## Updates
+
+We now support customized sorting on all levels. In order to set the current view's order for an item, all you need to do is set its 'pid' value. In the album view and subalbum view, this will allow you to define whether you want an album cover to be displayed first, second, third etc. It also means that you can define an array of images in no particular order then order them based on your needs. Note: an order *must* be defined otherwise you'll run into issues with bookmarking (however the basic views should still function)

data/album1.json

@@ -6,8 +6,18 @@
     "image": "images/1.jpg",
     "large_image": "images/1.jpg",
     "price": 13.98,
+    "pid" : 0,
     "url": "http://www.amazon.com/Bitte-Orca-Dirty-Projectors/dp/B0026T4RTI/ref=pd_sim_m_12?tag=quirkey-20",
 	"subalbum": [
+				  	{
+					"title": "Michael",
+					"artist": "Michael",
+					"image": "images/michael_small.jpg",
+					"large_image": "images/michael_large.jpg",
+					"price": 13.99,
+					"pid": 1,
+					"url": "http://www.amazon.co.uk/19-Adele/dp/B000XGDO04"
+				  },
 				  {
 					"title": "19",
 					"artist": "Adele",
@@ -16,44 +26,47 @@
 					"price": 13.99,
 					"pid": 0,
 					"url": "http://www.amazon.co.uk/19-Adele/dp/B000XGDO04"
-				  },
-				  {
-					"title": "Doo Wops and Hooligans",
-					"artist": "Bruno Mars",
-					"image": "images/5.jpg",
-					"large_image": "images/5large.jpg",
-					"price": 13.99,
-					"pid": 1,
-					"url": "http://www.amazon.com/Doo-Wops-Hooligans-Bruno-Mars/dp/B003ZJ0ZX0"
 				  }
 				 ]
   },
   {
-    "title": "Pop Music 2",
+    "title": "R & B Music",
     "artist": "Bruno Mars and Others",
     "image": "images/54.jpg",
     "large_image": "images/54.jpg",
     "price": 13.98,
+    "pid" : 1,
     "url": "http://www.amazon.com/Bitte-Orca-Dirty-Projectors/dp/B0026T4RTI/ref=pd_sim_m_12?tag=quirkey-20",
 	"subalbum": [
-				  {
-					"title": "19",
-					"artist": "Adele 2",
-					"image": "images/4.jpg",
-					"large_image": "images/4large.jpg",
+				  	{
+					"title": "Doo Wops and Hooligans",
+					"artist": "Bruno Mars",
+					"image": "images/bruno_small.jpg",
+					"large_image": "images/bruno_large.jpg",
 					"price": 13.99,
 					"pid": 0,
-					"url": "http://www.amazon.co.uk/19-Adele/dp/B000XGDO04"
+					"url": "http://www.amazon.com/Doo-Wops-Hooligans-Bruno-Mars/dp/B003ZJ0ZX0"
 				  },
+
 				  {
-					"title": "Doo Wops and Hooligans 2",
-					"artist": "Bruno Mars 2",
-					"image": "images/5.jpg",
-					"large_image": "images/5large.jpg",
+					"title": "The Lady Killer",
+					"artist": "Cee Lo Green",
+					"image": "images/ceelow_small.jpg",
+					"large_image": "images/ceelow_large.jpg",
 					"price": 13.99,
 					"pid": 1,
+					"url": "http://www.amazon.co.uk/19-Adele/dp/B000XGDO04"
+				  },
+				  {
+					"title": "Whats my name?",
+					"artist": "Rihanna",
+					"image": "images/rihanna_small.jpg",
+					"large_image": "images/rihanna_large.jpg",
+					"price": 13.99,
+					"pid": 2,
 					"url": "http://www.amazon.com/Doo-Wops-Hooligans-Bruno-Mars/dp/B003ZJ0ZX0"
-				  }
+				  },
+
 				 ]
   },
   {
@@ -62,6 +75,7 @@
     "image": "images/testfolder.jpg",
     "large_image": "images/testfolder.jpg",
     "price": 13.99,
+    "pid" : 2,
     "url": "http://www.amazon.com/"
   },
   {
@@ -70,6 +84,7 @@
     "image": "images/testfolder.jpg",
     "large_image": "images/testfolder.jpg",
     "price": 13.99,
+    "pid" : 3,
     "url": "http://www.amazon.com/"
   }
 ]

gallery.js

@@ -2,8 +2,10 @@ var Photo = Backbone.Model.extend({});
 
 var PhotoCollection = Backbone.Collection.extend({
     model: Photo,
+    /*Define what we're sorting based on across all albums - pid is the sort id*/
+
     comparator: function(item) {
-        return item.get('title');
+        return item.get('pid');
     }
 });
 

index.html

@@ -24,7 +24,7 @@
 				<!-- Subalbum template -->
 				<script id="subindexTmpl" type="text/x-jquery-tmpl">
                 <div class="item">
-                 <div class="item-image">
+                 <div class="item-image subalbum">
                      <a href="#imageid/${attributes.pid}/subalbum/"><img src="${attributes.image}" alt="${attributes.title}" alt="No images in this folder"/></a>
                  </div>
                  <div class="item-artist">${attributes.artist}</div>

jsongallery.css

@@ -53,6 +53,7 @@ img {
 	text-align:center;
 	width:250px;
 	}
+
 .item-title {
   font-weight: bold;
 }
@@ -65,4 +66,9 @@ img {
 }
 .item-detail .item-info {
   padding: 100px 10px 0px 10px;
+}
+
+.subalbum img{
+   width:170px;
+
 }