checkpoint

css/less/workspace.less

@@ -99,4 +99,7 @@
     left: 0;
     display: none;
   }
+  .v-direction-rtl {
+    direction: rtl;
+  }
 }

js/src/manifests/manifest.js

@@ -141,6 +141,9 @@
       };
       return versionMap[this.jsonLd['@context']];
     },
+    getViewingDirection: function() {
+      return this.jsonLd.viewingDirection || 'right-to-left';
+    },
     getCanvases : function() {
       var _this = this;
       return _this.jsonLd.sequences && _this.jsonLd.sequences[0].canvases;

js/src/widgets/bookView.js

@@ -21,7 +21,8 @@
         zoomLevel:        null
       },
       stitchTileMargin: 10,
-      eventEmitter: null
+      eventEmitter: null,
+      vDirectionStatus: ''
     }, options);
 
     this.init();
@@ -32,6 +33,9 @@
 
     init: function() {
       var _this = this;
+      if(this.vDirectionStatus == 'rtl'){
+        this.imagesList =  this.imagesListRtl.concat();
+      }
       if (this.canvasID !== null) {
         this.currentImgIndex = $.getImageIndexById(this.imagesList, this.canvasID);
       }

js/src/widgets/imageView.js

@@ -9,6 +9,7 @@
       canvasID:         null,
       canvases:         null,
       imagesList:       [],
+      imagesListRtl:    [],
       element:          null,
       elemOsd:          null,
       manifest:         null,
@@ -22,7 +23,8 @@
       annoCls:          'annotation-canvas',
       annotationsLayer: null,
       forceShowControls: false,
-      eventEmitter:     null
+      eventEmitter:     null,
+      vDirectionStatus: ''
     }, options);
 
     this.init();
@@ -37,6 +39,10 @@
 
       // check (for thumbnail view) if the canvasID is set.
       // If not, make it page/item 1.
+      if(this.vDirectionStatus == 'rtl'){
+        this.imagesList =  this.imagesListRtl.concat();
+      }
+
       if (this.canvasID !== null) {
         this.currentImgIndex = $.getImageIndexById(this.imagesList, this.canvasID);
       }

js/src/widgets/scrollView.js

@@ -13,11 +13,12 @@
       thumbInfo:            {thumbsHeight: 150, listingCssCls: 'listing-thumbs', thumbnailCls: 'thumbnail-view'},
       windowId:             null,
       panel:                false,
-      lazyLoadingFactor:    1.5  //should be >= 1
+      lazyLoadingFactor:    1.5,  //should be >= 1
+      vDirectionStatus: ''
     }, options);
-    
+
     jQuery.extend($.ScrollView.prototype, $.ThumbnailsView.prototype);
     this.init();
   };
-  
+
 }(Mirador));

js/src/widgets/thumbnailsView.js

@@ -9,6 +9,8 @@
       manifest:             null,
       element:              null,
       imagesList:           [],
+      imagesListLtr:        [],
+      vDirectionStatus:     '',
       appendTo:             null,
       thumbInfo:            {thumbsHeight: 150, listingCssCls: 'listing-thumbs', thumbnailCls: 'thumbnail-view'},
       defaultThumbHeight:   150,
@@ -21,15 +23,28 @@
     this.init();
   };
 
-
   $.ThumbnailsView.prototype = {
 
     init: function() {
       if (this.canvasID !== null) {
         this.currentImgIndex = $.getImageIndexById(this.imagesList, this.canvasID);
       }
+      if(this.vDirectionStatus == 'rtl'){
+        this.imagesList =  this.imagesListLtr.concat();
+      }
 
       this.loadContent();
+
+      if(this.vDirectionStatus == 'rtl'){
+        console.log(this.imagesList);
+        var fCanvasId = this.imagesList[0]['@id'];
+        var fCanvasThumSelector = 'img.thumbnail-image[data-image-id="'+fCanvasId+'"]';
+        jQuery(fCanvasThumSelector).parents('.panel-thumbnail-view').addClass('v-direction-rtl');
+        jQuery(fCanvasThumSelector).parents('.thumbnail-view').find('li').each(function(){
+          jQuery(this).addClass('thumbnail-rtl');
+        });
+      }
+
       this.bindEvents();
       this.listenForActions();
     },

js/src/workspaces/window.js

@@ -82,6 +82,15 @@
 
       _this.removeBookView();
 
+      //reset imagemodes and then remove any imageModes that are not available as a focus
+      //add getting rtl value
+      if(_this.manifest.getViewingDirection() == 'right-to-left'){
+        _this.vDirectionStatus = 'rtl';
+      }
+      else{
+        _this.vDirectionStatus = '';
+      }
+
       //reset imagemodes and then remove any imageModes that are not available as a focus
       this.imageModes = this.originalImageModes;
       this.imageModes = jQuery.map(this.imageModes, function(value, index) {
@@ -96,6 +105,16 @@
       }
       _this.canvases = _this.buildCanvasesIndex(_this.manifest.getCanvases());
 
+      if(_this.vDirectionStatus == 'rtl'){
+        _this.imagesListLtr = _this.imagesList.concat();
+        _this.imagesListRtl = _this.imagesList.concat();
+        _this.imagesListRtl.reverse();
+      }
+      else{
+        _this.imagesListRtl = [];
+        _this.imagesListLtr = [];
+      }
+
       this.annoEndpointAvailable = !jQuery.isEmptyObject(_this.state.getStateProperty('annotationEndpoint'));
       if (!this.canvasControls.annotations.annotationLayer) {
         this.canvasControls.annotations.annotationCreation = false;
@@ -535,6 +554,7 @@
               canvasID: _this.canvasID,
               canvases: _this.canvases,
               imagesList: _this.imagesList,
+              vDirectionStatus: _this.vDirectionStatus,
               thumbInfo: {thumbsHeight: 80, listingCssCls: 'panel-listing-thumbs', thumbnailCls: 'panel-thumbnail-view'}
             });
           }
@@ -732,7 +752,8 @@
           eventEmitter: this.eventEmitter,
           windowId: this.id,
           canvasID: this.canvasID,
-          imagesList: this.imagesList
+          imagesList: this.imagesList,
+          vDirectionStatus: this.vDirectionStatus
         });
       } else {
         var view = this.focusModules.ThumbnailsView;
@@ -758,7 +779,8 @@
           bottomPanelAvailable: this.bottomPanelAvailable,
           annoEndpointAvailable: this.annoEndpointAvailable,
           canvasControls: this.canvasControls,
-          annotationState : this.canvasControls.annotations.annotationState
+          annotationState : this.canvasControls.annotations.annotationState,
+          vDirectionStatus: this.vDirectionStatus
         });
         } else {
           this.focusModules.ImageView.updateImage(canvasID);
@@ -788,6 +810,9 @@
     },
 
     toggleScrollView: function(canvasID) {
+      if(this.vDirectionStatus == 'rtl'){
+        this.imagesList = this.imagesListRtl.concat();
+      }
       this.canvasID = canvasID;
       if (this.focusModules.ScrollView === null) {
         var containerHeight = this.element.find('.view-container').height();
@@ -799,7 +824,8 @@
           windowId: this.id,
           canvasID: this.canvasID,
           imagesList: this.imagesList,
-          thumbInfo: {thumbsHeight: Math.floor(containerHeight * this.scrollImageRatio), listingCssCls: 'scroll-listing-thumbs', thumbnailCls: 'scroll-view'}
+          thumbInfo: {thumbsHeight: Math.floor(containerHeight * this.scrollImageRatio), listingCssCls: 'scroll-listing-thumbs', thumbnailCls: 'scroll-view'},
+          vDirectionStatus: this.vDirectionStatus
         });
       } else {
         var view = this.focusModules.ScrollView;