Merge branch 'develop' into fix_packages

Gruntfile.js

@@ -28,6 +28,7 @@ module.exports = function(grunt) {
     'node_modules/bootstrap/js/transition.js',
     'node_modules/bootbox/bootbox.js',
     'node_modules/jquery.scrollto/jquery.scrollTo.min.js',
+    'node_modules/jstree/dist/jstree.min.js',
     'js/lib/jquery.qtip.min.js',
     'node_modules/javascript-state-machine/state-machine.min.js',
     'node_modules/tinymce/tinymce.min.js',
@@ -94,6 +95,8 @@ module.exports = function(grunt) {
           'css/normalize.css',
           'node_modules/font-awesome/css/font-awesome.min.css',
           'css/jquery-ui.min.css',
+          'node_modules/jstree/dist/themes/default/style.min.css',
+          'css/collection-tree-mod.css',
           'css/jquery.qtip.min.css',
           'node_modules/spectrum-colorpicker/spectrum.css',
           'node_modules/select2/dist/css/select2.min.css',

README.md

@@ -2,24 +2,26 @@
 [![Stories in Ready](https://badge.waffle.io/ProjectMirador/mirador.svg?label=ready&title=Ready)](http://waffle.io/iiif/mirador)
 
 # Mirador
-![mirador banner](http://projectmirador.github.io/mirador/img/banner.jpg)
+![mirador banner](https://projectmirador.github.io/mirador/img/banner.jpg)
 **Mirador is a multi-repository, configurable, extensible, and easy-to-integrate viewer and annotation creation and comparison environment for IIIF resources, ranging from deep-zooming artwork, to complex manuscript objects. It provides a tiling windowed environment for comparing multiple image-based resources, synchronised structural and visual navigation of content using openSeadragon, Open Annotation compliant annotation creation and viewing on deep-zoomable canvases, metadata display, bookreading, and bookmarking.**
 
 ### [See a Demo](http://projectmirador.org/demo/)
 ### [Getting Started](http://projectmirador.org/docs/docs/getting-started.html)
 
 ### Run in Development
-Mirador uses [node.js](http://nodejs.org/) and a build system to assemble, test, and manage the development resources. If you have never used these tools before, you may need to install them.
+Mirador uses [Node.js](https://nodejs.org/) and a build system to assemble, test, and manage the development resources. If you have never used these tools before, you may need to install them.
 
- 1. Install Node, if you haven't already (available at the link above)  
- 1. Clone the mirador repository (if you haven't already done so above)
- 1. On the command line, go into the mirador folder
- 1. Install all dependencies with `npm install`. Run `npm start'.
+ 1. Install [Node.js](https://nodejs.org/)
+ 2. Install the Grunt command line runner i.e. `npm install -g grunt-cli`
+ 3. Install the Bower command line utility i.e. `npm install -g bower`
+ 1. Clone the Mirador repository
+ 1. Change into the Mirador directory
+ 1. Install all dependencies with `npm install`. Run `npm start`.
 
 ### Run Tests
 `npm test`
 
-For more information, see the [Docs](http://projectmirador.org/docs/docs/getting-started.html), submit an [issue](https://github.com/projectmirador/mirador/issues), or ask on [slack](http://bit.ly/iiif-slack).
+For more information, see the [Docs](http://projectmirador.org/docs/docs/getting-started.html), submit an [issue](https://github.com/projectmirador/mirador/issues), or ask on [Slack](http://bit.ly/iiif-slack).
 
 ### Project Diagnostics
  [![Coverage Status](https://coveralls.io/repos/github/ProjectMirador/mirador/badge.svg?branch=master&upToDate=true)](https://coveralls.io/github/ProjectMirador/mirador?branch=master&upToDate=true)

css/less/main.less

@@ -25,3 +25,4 @@
 @import 'panels/bottom-panel';
 @import 'panels/layers-tab';
 @import 'panels/search-tab';
+@import 'panels/collection-tree-mod';

css/less/panels/side-panel.less

@@ -33,7 +33,7 @@
       color: @gray-66;
       font-size: .9em;
     }
-  
+
     .tab:not(.selected):hover {
       background: @light-gray;
       color: @black-33;
@@ -52,7 +52,7 @@
       list-style-type: none;
       border-left:0;
       border-right:0;
-      padding:10px 10px 0 10px;
+      padding:10px 10px 10px 10px;
     }
 
     .annotationListItem:after {
@@ -125,10 +125,26 @@
     margin-top: 8px;
   }
 
-  .annotationsPanel ul {
-    padding:0;
-    margin:0;
-  }
+  .annotationsPanel {
+    margin: 0;
+    margin-bottom: 10px;
+    padding-bottom: 100px;
+    overflow-y: scroll;
+    width: 280px;
+    padding-right: 10px;
+    position: absolute;
+    box-sizing: border-box;
+    left: 0;
+    top: 0px;
+    bottom: 0;
+    list-style-type: none;
+    font-size: 75%;
+
+    ul {
+      padding:0;
+      margin:0;
+     }
+   }
 
   .toc {
     margin:0;

docs/getting-started.md

@@ -43,11 +43,11 @@ To initialize Mirador, it needs to be attached to an existing HTML **div** throu
 
 Changing the height and width of Mirador's root element allows you to place it in an HTML page with other content.
 
-#### Manifests
+#### Manifests and Collections
 
-There are several different ways to add a manifest to your Mirador instance.
+There are several different ways to add content to your Mirador instance.
 
-The first way is to pass an object into the data array that identifies the desired manifestUri:
+The first way is to pass an object into the data array that identifies the desired manifest URI:
 
 ```` javascript
 Mirador({
@@ -58,7 +58,7 @@ Mirador({
 });
 ````
 
-Second, you can pass in an object pointing to a collectionUri, which contains a list of manifests that Mirador will parse:
+Second, you can pass in an object pointing to a collection URI, which contains a list of manifests that Mirador will parse:
 
 ```` javascript
 Mirador({
@@ -70,13 +70,15 @@ Mirador({
 ]);
 ````
 
-Note that the current version of Mirador can **only **parse collections that are one level deep. So if your collection data is a collection of collections, Mirador will not be able to find all of your manifests. However, supporting more deeply nested collections is on the Mirador roadmap.
+The current version of Mirador supports collections of any nesting depth. Collections are displayed on the content tree as folder entries, which can be clicked on to display manifests filed under them. Sub-collections can also be accessed by clicking on the drop-down caret (if available).
+
+![Collection tree](image_collection_tree.png)
 
 Within the application itself, there are two other ways for end users to add manifests to Mirador:
 
-1. If showAddFromURLBox has not been disabled, an end user can add a known IIIF manifest URL through the Add new object from URL box:
+1. If showAddFromURLBox has not been disabled, an end user can add a known IIIF manifest or collection URL through the Add new object from URL box:
 
-![image alt text](image_1.png)
+![image alt text](image_add_object_box.png)
 
 2. Mirador can handle an end user dropping a IIIF manifest into a window using [IIIF Drag-and-drop](http://zimeon.github.io/iiif-dragndrop/):
 

index.html

@@ -72,16 +72,20 @@
            { "manifestUri": "http://demos.biblissima-condorcet.fr/iiif/metadata/BVMM/chateauroux/manifest.json", "location": "Biblissima"},
            { "manifestUri": "https://manifests.britishart.yale.edu/Osbornfa1", "location": "Yale Beinecke"},
            /* { "manifestUri": "http://demos.biblissima-condorcet.fr/iiif/metadata/florus-dispersus/manifest.json", "location": "Biblissima"}*/
-           { "manifestUri": "https://media.nga.gov/public/manifests/multispectral_demo.json", "location": "National Gallery of Art"}
+           { "manifestUri": "https://media.nga.gov/public/manifests/multispectral_demo.json", "location": "National Gallery of Art"},
+           { "manifestUri": "https://scta.info/iiif/codex/sorb/manifest"},
+           { "manifestUri": "https://scta.info/iiif/graciliscommentary/lon/manifest"},
+           { "manifestUri": "https://scta.info/iiif/plaoulcommentary/sorb/manifest"}
          ],
          "windowObjects": [],
          "annotationEndpoint": { "name":"Local Storage", "module": "LocalStorageEndpoint" },
          "sidePanelOptions" : {
            "tocTabAvailable": true,
            "layersTabAvailable": true,
-           "searchTabAvailable": true
-         }
-       });
+           "searchTabAvailable": true,
+           "annotations" : true
+         },
+      });
      });
     </script>
     <!-- This enables live reloading of assets for improved developer experience. -->

js/src/annotations/osd-region-draw-tool.js

@@ -109,6 +109,8 @@
           if (shapeArray.length > 0) {
             _this.svgOverlay.restoreLastView(shapeArray);
             _this.annotationsToShapesMap[annotation['@id']] = shapeArray;
+          } else {
+            console.log("ERROR couldn't find a strategy for " + annotation["@id"]);
           }
         } catch(e) {
           console.log('ERROR OsdRegionDrawTool#render anno:', annotation, 'error:', e);