diff --git a/common/static/css/vendor/ova/share-annotator.css b/common/static/css/vendor/ova/share-annotator.css index afbb458807..b70638744f 100644 --- a/common/static/css/vendor/ova/share-annotator.css +++ b/common/static/css/vendor/ova/share-annotator.css @@ -1,5 +1,5 @@ /* Editor */ -.share-container-annotator{ +.share-container-annotator { display: block; min-width: 100%; border: none; @@ -16,16 +16,16 @@ height: 3.1em; } -.share-container-annotator .share-text-annotator{ +.share-container-annotator .share-text-annotator { float:left; padding-top: 1em; } -.annotator-editor .share-container-annotator .share-text-annotator{ +.annotator-editor .share-container-annotator .share-text-annotator { height: 2.1em; } -.share-container-annotator .share-button, .annotator-wrapper .share-button{ +.share-container-annotator .share-button, .annotator-wrapper .share-button { top: 0.3em; outline: 0; float:left; @@ -40,14 +40,14 @@ background-size: 2.5em; } -.share-container-annotator .share-button:hover, .annotator-wrapper .share-button:hover{ +.share-container-annotator .share-button:hover, .annotator-wrapper .share-button:hover { opacity: .6; cursor: pointer; } /* Popup */ -.annotator-wrapper .share-popup-overlay-bg{ +.annotator-wrapper .share-popup-overlay-bg { display: none; position: fixed; top: 0; @@ -59,7 +59,7 @@ background: rgba(0,0,0,0.75); padding: 0; } -.annotator-wrapper .share-popup-overlay-bg .share-popup{ +.annotator-wrapper .share-popup-overlay-bg .share-popup { background: #fff; padding: 1% !important; width: 30%; @@ -72,7 +72,7 @@ box-shadow: 0 0 5px rgba(0,0,0,0.9); } .annotator-wrapper .share-popup-overlay-bg .share-popup-copy, -.annotator-wrapper .share-popup-overlay-bg .share-popup-title{ +.annotator-wrapper .share-popup-overlay-bg .share-popup-title { font-style: normal; font-weight: bold; font-size: 21px; @@ -80,20 +80,20 @@ padding-bottom: 20px; color: #222; } -.annotator-wrapper .share-popup-overlay-bg .share-popup-uri{ +.annotator-wrapper .share-popup-overlay-bg .share-popup-uri { width:100%; border: 1px solid rgb(144, 144, 144); height: 24px; margin-bottom: 10px; } -.annotator-wrapper .share-popup-overlay-bg .share-popup-copy{ +.annotator-wrapper .share-popup-overlay-bg .share-popup-copy { font-size: 15px; float: left; width: 100%; padding:0; margin: 1.0em 0em 0.5em 0em !important; } -.annotator-wrapper .share-popup-overlay-bg .share-popup .share-button{ +.annotator-wrapper .share-popup-overlay-bg .share-popup .share-button { width: 50%; padding: 0; -webkit-box-sizing: border-box; @@ -163,7 +163,7 @@ .annotator-viewer .share-viewer-annotator div.share-text-annotator, .annotator-viewer .share-viewer-annotator div.share-button, .annotator-wrapper div.share-button, -.annotator-wrapper div.share-text-annotator{ +.annotator-wrapper div.share-text-annotator { border-top: 0; padding: 0; background-size: 2em; @@ -185,12 +185,12 @@ } -.share-container-annotator .share-google-annotator, .annotator-wrapper .share-google-annotator{ +.share-container-annotator .share-google-annotator, .annotator-wrapper .share-google-annotator { background-image: url('data:image/png;base64,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'); } -.share-container-annotator .share-email-annotator, .annotator-wrapper .share-email-annotator{ +.share-container-annotator .share-email-annotator, .annotator-wrapper .share-email-annotator { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAABIUExURf///7KysrKyss/Pz9DQ0NHR0dLS0u7u7vDw8PHx8fLy8vPz8/T09PX19fb29vf39/j4+Pn5+fr6+vv7+/z8/P39/f7+/v///37mbPQAAAACdFJOUwCWb//7SQAAAQNJREFUSMft1M2SgyAQRtHkC0RtbP6V93/TWZikFDuQ2c7krrCKU1gKXC7f/lNX9LvuAVB6AUdw78y/V2CEXltpjEcwmabQMNMR0GwbQsPOVAF2AXqR0wiOK2DYh/RGaKTg2VTA+pgXUWgsOXorghUq1ymsDVBOQqE0QYFK+xRKBxyFQumCvVAoH4ACFbe2+f0VnkKhfLICnmsoPJ46X2l7q1u4PUYdgNdxeY2aQDp4b/40+5AyxM2NLGw+YhcisrhbM+J5e9NsPWLKUinCnw7QZBg+hCgVggfXR3QksHVezlkGVZfAADIzs5Ving1hqO6lYZyIjBzRNA7He+nXV+W3v98P7gg+L5LCf08AAAAASUVORK5CYII='); } diff --git a/common/static/js/vendor/ova/OpenSeaDragonAnnotation.js b/common/static/js/vendor/ova/OpenSeaDragonAnnotation.js index 2ef2a23856..37d674dbb8 100644 --- a/common/static/js/vendor/ova/OpenSeaDragonAnnotation.js +++ b/common/static/js/vendor/ova/OpenSeaDragonAnnotation.js @@ -44,18 +44,18 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. .subscribe("annotationsLoaded", function (annotations){ if (!self.annotationInstance) { - //annotation instance should include the OSD item and annotator + // annotation instance should include the OSD item and annotator self.annotationInstance = new $._annotation({ viewer: self, annotator: annotator, }); - //this collection of items is included as an item of annotator so - //that there is a method to communicate back and forth. + // this collection of items is included as an item of annotator so + // that there is a method to communicate back and forth. annotator.osda = self.annotationInstance; - //Because it takes a while for both OSD to open and for annotator - //to get items from the backend, we wait until we get the "open" call + // Because it takes a while for both OSD to open and for annotator + // to get items from the backend, we wait until we get the "open" call function refreshDisplay(){ if(!isOpenViewer){ setTimeout(refreshDisplay,200); @@ -75,48 +75,48 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * @constructor */ $._annotation = function(options) { - //options + // options options = options || {}; if (!options.viewer) { throw new Error("A viewer must be specified."); } - //variables + // variables this.viewer = options.viewer; this.annotator = options.annotator; this.options = options; - this.isAnnotating = false; //If the user is annotating - this.isDrawing = false; //if the user is drawing something + this.isAnnotating = false; // If the user is annotating + this.isDrawing = false; // if the user is drawing something this.rectPosition = undefined; - //Init + // Init this.init(); }; //-- Methods $._annotation.prototype = { - /** - * This function makes sure that the OSD buttons are created, that the - * panning and zooming functionality is created and the annotation events. - */ + /** + * This function makes sure that the OSD buttons are created, that the + * panning and zooming functionality is created and the annotation events. + */ init: function(){ var viewer = this.viewer; - //create Buttons + // create Buttons this._createNewButton(); /* canvas Events */ - //- Bind canvas functions + // Bind canvas functions var onCanvasMouseDown = this.__bind(this._onCanvasMouseDown,this); var onCanvasMouseMove = this.__bind(this._onCanvasMouseMove,this); var onDocumentMouseUp = this.__bind(this._onDocumentMouseUp,this); - //- Add canvas events + // Add canvas events $.addEvent(viewer.canvas, "mousedown", onCanvasMouseDown, true); $.addEvent(viewer.canvas, "mousemove", onCanvasMouseMove, true); $.addEvent(document, "mouseup", onDocumentMouseUp, true); - //Viewer events + // Viewer events var self = this; }, @@ -128,17 +128,17 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. newAnnotation:function(){ var annotator = this.annotator; - //This variable tells editor that we want create an image annotation + // This variable tells editor that we want create an image annotation annotator.editor.OpenSeaDragon = this.viewer.id; - - //allows the adder to actually show up + + // allows the adder to actually show up annotator.adder.show(); - //takes into account the various wrappers and instances to put the shape - //over the correct place. + // takes into account the various wrappers and instances to put the shape + // over the correct place. this._setOverShape(annotator.adder); - //Open a new annotator dialog + // Open a new annotator dialog annotator.onAdderClick(); }, @@ -148,16 +148,16 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * @param {TinyMCEEditor} editor The item that pops up when you edit an annotation. */ editAnnotation: function(annotation,editor){ - //Stupid check: is the annotation you're trying to edit an image? + // Stupid check: is the annotation you're trying to edit an image? if (this._isOpenSeaDragon(annotation)){ var editor = editor || this.annotator.editor; - //set the editor over the highlighted element + // set the editor over the highlighted element this._setOverShape(editor.element); editor.checkOrientation(); - //makes sure that we are making an image annotation + // makes sure that we are making an image annotation editor.OpenSeaDragon = this.viewer.id; } }, @@ -171,23 +171,23 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. var allannotations = this.annotator.plugins['Store'].annotations; var annotator = this.annotator; - //Sort the annotations by date + // Sort the annotations by date this._sortByDate(allannotations); - //remove all of the overlays + // remove all of the overlays this.viewer.drawer.clearOverlays(); for (var item in allannotations) { var an = allannotations[item]; - //check if the annotation is an OpenSeaDragon annotation + // check if the annotation is an OpenSeaDragon annotation if (this._isOpenSeaDragon(an)){ this.drawRect(an); - } - } - - //if the colored highlights by tags plugin it is notified to colorize - annotator.publish('colorizeHighlight', [an]); + } + } + + // if the colored highlights by tags plugin it is notified to colorize + annotator.publish('colorizeHighlight', [an]); }, /** @@ -199,15 +199,15 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. this._reset(); var viewer = this.viewer; if (!this.isAnnotating){ - //When annotating, the cursor turns into a crosshair and there is a - //green border around the OSD instance. + // When annotating, the cursor turns into a crosshair and there is a + // green border around the OSD instance. jQuery('.openseadragon1').css('cursor', 'crosshair'); jQuery('.openseadragon1').css('border', '2px solid rgb(51,204,102)'); e.eventSource.imgGroup.src = this.resolveUrl( viewer.prefixUrl,"newan_hover.png"); e.eventSource.imgRest.src = this.resolveUrl( viewer.prefixUrl,"newan_hover.png"); e.eventSource.imgHover.src = this.resolveUrl( viewer.prefixUrl,"newan_grouphover.png"); }else{ - //Otherwise, the cursor is a cross with four arrows to indicate movement + // Otherwise, the cursor is a cross with four arrows to indicate movement jQuery('.openseadragon1').css('cursor', 'all-scroll'); jQuery('.openseadragon1').css('border', 'inherit'); e.eventSource.imgGroup.src = this.resolveUrl( viewer.prefixUrl,"newan_grouphover.png"); @@ -215,7 +215,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. e.eventSource.imgHover.src = this.resolveUrl( viewer.prefixUrl,"newan_hover.png"); } - //toggles the annotating flag + // toggles the annotating flag this.isAnnotating = !this.isAnnotating?true:false; }, @@ -225,28 +225,28 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * @param {Object} an Annotation item from the list in the Annotator instance. */ drawRect:function(an){ - //Stupid check: Does this annotation actually have an area of annotation + // Stupid check: Does this annotation actually have an area of annotation if (typeof an.rangePosition!='undefined'){ - //Sets up the visual aspects of the area for the user + // Sets up the visual aspects of the area for the user var span = document.createElement('span'); var rectPosition = an.rangePosition; span.className = "annotator-hl"; span.style.border = '2px solid rgba(0,0,0,0.5)'; span.style.background = 'rgba(0,0,0,0)'; - //Adds listening items for the viewer and editor + // Adds listening items for the viewer and editor var onAnnotationMouseMove = this.__bind(this._onAnnotationMouseMove,this); var onAnnotationClick = this.__bind(this._onAnnotationClick,this); $.addEvent(span, "mousemove", onAnnotationMouseMove, true); $.addEvent(span, "click", onAnnotationClick, true); - //Set the object in the div + // Set the object in the div jQuery.data(span, 'annotation', an); - //Add the highlights to the annotation + // Add the highlights to the annotation an.highlights = jQuery(span); - - //Sends the element created to the proper location within the OSD instance + + // Sends the element created to the proper location within the OSD instance var olRect = new OpenSeadragon.Rect(rectPosition.left, rectPosition.top, rectPosition.width, rectPosition.height); return this.viewer.drawer.addOverlay({ element: span, @@ -262,19 +262,19 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * screen coordinates and OSD image coordinates. */ setRectPosition:function(){ - //Get the actual locations of the rectangle + // Get the actual locations of the rectangle var left = parseInt(this.rect.style.left); var top = parseInt(this.rect.style.top); - var width = parseInt(this.rect.style.left)+parseInt(this.rect.style.width); - var height = parseInt(this.rect.style.top)+parseInt(this.rect.style.height); + var width = parseInt(this.rect.style.left) + parseInt(this.rect.style.width); + var height = parseInt(this.rect.style.top) + parseInt(this.rect.style.height); var startPoint = new $.Point(left,top); var endPoint = new $.Point(width,height); - //return the proper value of the rectangle + // return the proper value of the rectangle this.rectPosition = {left:this._physicalToLogicalXY(startPoint).x, top:this._physicalToLogicalXY(startPoint).y, - width:this._physicalToLogicalXY(endPoint).x-this._physicalToLogicalXY(startPoint).x, - height:this._physicalToLogicalXY(endPoint).y-this._physicalToLogicalXY(startPoint).y + width:this._physicalToLogicalXY(endPoint).x - this._physicalToLogicalXY(startPoint).x, + height:this._physicalToLogicalXY(endPoint).y - this._physicalToLogicalXY(startPoint).y }; }, @@ -287,18 +287,18 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ _onCanvasMouseDown: function(event) { - //action is ONLY performed if we are in annotation creation mode + // action is ONLY performed if we are in annotation creation mode if (this.isAnnotating){ var viewer = this.viewer; event.preventDefault(); - //reset the display + // reset the display this._reset(); - //set mode drawing + // set mode drawing this.isDrawing = true; - //Create rect element + // Create rect element var mouse = $.getMousePosition( event ); var elementPosition = $.getElementPosition(viewer.canvas); var position = mouse.minus( elementPosition ); @@ -308,18 +308,18 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. this.rect.style.border = '2px solid rgba(0,0,0,0.5)'; this.rect.style.position = 'absolute'; this.rect.className = 'DrawingRect'; - //set the initial position - this.rect.style.top = position.y+"px"; - this.rect.style.left = position.x+"px"; + // set the initial position + this.rect.style.top = position.y + "px"; + this.rect.style.left = position.x + "px"; this.rect.style.width = "1px"; this.rect.style.height = "1px"; - //save the start Position + // save the start Position this.startPosition = position; - //save rectPosition as initial rectangle parameter to Draw in the canvas + // save rectPosition as initial rectangle parameter to Draw in the canvas this.setRectPosition(); - //append Child to the canvas + // append Child to the canvas viewer.canvas.appendChild(this.rect); } }, @@ -330,31 +330,31 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ _onCanvasMouseMove: function(event) { - //of course, this only runs when we are in annotation creation mode and - //when the user has clicked down (and is therefore drawing the rectangle) + // of course, this only runs when we are in annotation creation mode and + // when the user has clicked down (and is therefore drawing the rectangle) if (this.isAnnotating && this.isDrawing){ var viewer = this.viewer; - //Calculate the new end position + // Calculate the new end position var mouse = $.getMousePosition( event ); var elementPosition = $.getElementPosition(viewer.canvas); var endPosition = mouse.minus( elementPosition ); - //retrieve start position + // retrieve start position var startPosition = this.startPosition; var newWidth= endPosition.x-startPosition.x; var newHeight =endPosition.y-startPosition.y; - //Set new position - this.rect.style.width = (newWidth<0) ? (-1*newWidth) +'px' : newWidth +'px'; - this.rect.style.left = (newWidth<0) ? (startPosition.x + newWidth) +'px' : startPosition.x +'px'; - this.rect.style.height = (newHeight<0) ? (-1*newHeight) +'px' : newHeight +'px'; - this.rect.style.top = (newHeight<0) ? (startPosition.y + newHeight) +'px' : startPosition.y +'px'; + // Set new position + this.rect.style.width = (newWidth < 0) ? (-1*newWidth) + 'px' : newWidth + 'px'; + this.rect.style.left = (newWidth < 0) ? (startPosition.x + newWidth) + 'px' : startPosition.x + 'px'; + this.rect.style.height = (newHeight < 0) ? (-1*newHeight) + 'px' : newHeight + 'px'; + this.rect.style.top = (newHeight < 0) ? (startPosition.y + newHeight) + 'px' : startPosition.y + 'px'; - //Modify the rectPosition with the new this.rect values + // Modify the rectPosition with the new this.rect values this.setRectPosition(); - //Show adder and hide editor + // Show adder and hide editor this.annotator.editor.element[0].style.display = 'none'; this._setOverShape(this.annotator.adder); } @@ -366,21 +366,21 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ _onDocumentMouseUp: function() { - //Stupid check: only do it when in annotation creation mode and - //when the user has begun making a rectangle over the annotation area + // Stupid check: only do it when in annotation creation mode and + // when the user has begun making a rectangle over the annotation area if (this.isAnnotating && this.isDrawing){ var viewer = this.viewer; viewer.innerTracker.setTracking(true); this.isDrawing = false; - //Set the new position for the rectangle + // Set the new position for the rectangle this.setRectPosition(); - //Open Annotator editor + // Open Annotator editor this.newAnnotation(); - //Hide adder and show editor + // Hide adder and show editor this.annotator.editor.element[0].style.display = 'block'; this._setOverShape(this.annotator.editor.element); this.annotator.editor.checkOrientation(); @@ -396,11 +396,11 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. var annotator = this.annotator; var elem = jQuery(event.target).parents('.annotator-hl').andSelf(); - //if there is a opened annotation then show the new annotation mouse over + // if there is a opened annotation then show the new annotation mouse over if (typeof annotator!='undefined' && elem.hasClass("annotator-hl") && !this.isDrawing){ - //hide the last open viewer + // hide the last open viewer annotator.viewer.hide(); - //get the annotation over the mouse + // get the annotation over the mouse var annotations = jQuery(event.target.parentNode).find('.annotator-hl').map(function() { var self = jQuery(this); var offset = self.offset(); @@ -414,21 +414,21 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. var maxx = l + w; var maxy = t + h; - //if the current position of the mouse is within the bounds of an area - //change the background of that area to a light yellow to simulate - //a hover. Otherwise, keep it translucent. + // if the current position of the mouse is within the bounds of an area + // change the background of that area to a light yellow to simulate + // a hover. Otherwise, keep it translucent. this.style.background = (y <= maxy && y >= t) && (x <= maxx && x >= l)? 'rgba(255, 255, 10, 0.05)':'rgba(0, 0, 0, 0)'; return (y <= maxy && y >= t) && (x <= maxx && x >= l)? jQuery(this).data("annotation") : null; }); - //show the annotation in the viewer + // show the annotation in the viewer var mousePosition = { top:$.getMousePosition(event).y, left:$.getMousePosition(event).x, }; - //if the user is hovering over multiple annotation areas, - //they will be stacked as usual + // if the user is hovering over multiple annotation areas, + // they will be stacked as usual if (annotations.length>0) annotator.showViewer(jQuery.makeArray(annotations), mousePosition); } }, @@ -438,17 +438,17 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * @param {Event} event The actual action of clicking down within an annotation area. */ _onAnnotationClick: function(event){ - //gets the annotation from the data stored in the element + // gets the annotation from the data stored in the element var an = jQuery.data(event.target, 'annotation'); - //gets the bound within the annotation data + // gets the bound within the annotation data var bounds = typeof an.bounds!='undefined'?an.bounds:{}; var currentBounds = this.viewer.drawer.viewport.getBounds(); - //if the area is not already panned and zoomed in to the correct area + // if the area is not already panned and zoomed in to the correct area if (typeof bounds.x!='undefined') currentBounds.x = bounds.x; if (typeof bounds.y!='undefined') currentBounds.y = bounds.y; if (typeof bounds.width!='undefined') currentBounds.width = bounds.width; if (typeof bounds.height!='undefined') currentBounds.height = bounds.height; - //change the zoom to the saved parameter + // change the zoom to the saved parameter this.viewer.drawer.viewport.fitBounds(currentBounds); }, @@ -459,13 +459,13 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * @param {String} type Either 'asc' for ascending or 'desc' for descending */ _sortByDate: function (annotations,type){ - var type = type || 'asc'; //asc => The value [0] will be the most recent date + var type = type || 'asc'; // asc => The value [0] will be the most recent date annotations.sort(function(a,b){ - //gets the date from when they were last updated + // gets the date from when they were last updated a = new Date(typeof a.updated!='undefined'?createDateFromISO8601(a.updated):''); b = new Date(typeof b.updated!='undefined'?createDateFromISO8601(b.updated):''); - //orders them based on type passed in + // orders them based on type passed in if (type == 'asc') return ba?1:0; else @@ -481,22 +481,22 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. var onFocusHandler = $.delegate( this, onFocus ); var onBlurHandler = $.delegate( this, onBlur ); var onModeAnnotationHandler = $.delegate( this, this.modeAnnotation ); - /* Buttons */ - var viewer = this.viewer; - var self = this; - viewer.modeAnnotation = new $.Button({ - element: viewer.modeAnnotation ? $.getElement( viewer.modeAnnotation ) : null, - clickTimeThreshold: viewer.clickTimeThreshold, - clickDistThreshold: viewer.clickDistThreshold, - tooltip: "New Annotation", - srcRest: self.resolveUrl( viewer.prefixUrl,"newan_rest.png"), - srcGroup: self.resolveUrl( viewer.prefixUrl,"newan_grouphover.png"), - srcHover: self.resolveUrl( viewer.prefixUrl,"newan_hover.png"), - srcDown: self.resolveUrl( viewer.prefixUrl,"newan_pressed.png"), - onRelease: onModeAnnotationHandler, - onFocus: onFocusHandler, - onBlur: onBlurHandler - }); + /* Buttons */ + var viewer = this.viewer; + var self = this; + viewer.modeAnnotation = new $.Button({ + element: viewer.modeAnnotation ? $.getElement( viewer.modeAnnotation ) : null, + clickTimeThreshold: viewer.clickTimeThreshold, + clickDistThreshold: viewer.clickDistThreshold, + tooltip: "New Annotation", + srcRest: self.resolveUrl( viewer.prefixUrl,"newan_rest.png"), + srcGroup: self.resolveUrl( viewer.prefixUrl,"newan_grouphover.png"), + srcHover: self.resolveUrl( viewer.prefixUrl,"newan_hover.png"), + srcDown: self.resolveUrl( viewer.prefixUrl,"newan_pressed.png"), + onRelease: onModeAnnotationHandler, + onFocus: onFocusHandler, + onBlur: onBlurHandler + }); //- Wrapper Annotation Menu viewer.wrapperAnnotation = new $.ButtonGroup({ @@ -507,8 +507,8 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. clickDistThreshold: viewer.clickDistThreshold }); - //area makes sure that the annotation button only appears when everyone is - //allowed to annotate or if you are an instructor + // area makes sure that the annotation button only appears when everyone is + // allowed to annotate or if you are an instructor if(this.options.viewer.annotation_mode == "everyone" || this.options.viewer.flags){ /* Set elements to the control menu */ viewer.annotatorControl = viewer.wrapperAnnotation.element; @@ -531,10 +531,10 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * the last rectangle you drew (but didn't save) gets destroyed. */ _reset: function(){ - //Find and remove DrawingRect. This is the previous rectangle + // Find and remove DrawingRect. This is the previous rectangle this._removeElemsByClass('DrawingRect',this.viewer.canvas); - //Show adder and hide editor + // Show adder and hide editor this.annotator.editor.element[0].style.display = 'none'; }, @@ -569,21 +569,21 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. var annotator = this.annotator; var rp = an.rangePosition; - //Makes sure OSD exists and that annotation is an image annotation - //with a position in the OSD instance + // Makes sure OSD exists and that annotation is an image annotation + // with a position in the OSD instance var isOpenSeaDragon = (typeof annotator.osda != 'undefined'); var isContainer = (typeof an.target!='undefined' && an.target.container==this.viewer.id ); var isImage = (typeof an.media!='undefined' && an.media=='image'); var isRP = (typeof rp!='undefined'); var isSource = false; - //Double checks that the image being displayed matches the annotations - var source = this.viewer.source; - var tilesUrl = typeof source.tilesUrl!='undefined'?source.tilesUrl:''; - var functionUrl = typeof source.getTileUrl!='undefined'?source.getTileUrl:''; - var compareUrl = tilesUrl!=''?tilesUrl:(''+functionUrl).replace(/\s+/g, ' '); - if(isContainer) isSource = (an.target.src == compareUrl); - + // Double checks that the image being displayed matches the annotations + var source = this.viewer.source; + var tilesUrl = typeof source.tilesUrl!='undefined'?source.tilesUrl:''; + var functionUrl = typeof source.getTileUrl!='undefined'?source.getTileUrl:''; + var compareUrl = tilesUrl!=''?tilesUrl:('' + functionUrl).replace(/\s+/g, ' '); + if(isContainer) isSource = (an.target.src == compareUrl); + return (isOpenSeaDragon && isContainer && isImage && isRP && isSource); }, @@ -594,25 +594,25 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. * @param {HTMLElement} elem Element where shape is overlayed */ _setOverShape: function(elem){ - //Calculate Point absolute positions + // Calculate Point absolute positions var rectPosition = this.rectPosition || {}; var startPoint = this._logicalToPhysicalXY(new $.Point(rectPosition.left,rectPosition.top)); - var endPoint = this._logicalToPhysicalXY(new $.Point(rectPosition.left+rectPosition.width,rectPosition.top+rectPosition.height)); + var endPoint = this._logicalToPhysicalXY(new $.Point(rectPosition.left + rectPosition.width,rectPosition.top + rectPosition.height)); - //Calculate Point absolute positions + // Calculate Point absolute positions var wrapper = jQuery('.annotator-wrapper')[0]; var positionAnnotator = $.getElementPosition(wrapper); var positionCanvas = $.getElementPosition(this.viewer.canvas); var positionAdder = {}; - //Fix with positionCanvas based on annotator wrapper and OSD area + // Fix with positionCanvas based on annotator wrapper and OSD area startPoint = startPoint.plus(positionCanvas); endPoint = endPoint.plus(positionCanvas); - elem[0].style.display = 'block'; //Show the adder + elem[0].style.display = 'block'; // Show the adder positionAdder.left = (startPoint.x - positionAnnotator.x) + (endPoint.x - startPoint.x) / 2; - positionAdder.top = (startPoint.y - positionAnnotator.y) + (endPoint.y - startPoint.y) / 2; //It is not necessary fix with - positionAnnotator.y + positionAdder.top = (startPoint.y - positionAnnotator.y) + (endPoint.y - startPoint.y) / 2; // It is not necessary fix with - positionAnnotator.y elem.css(positionAdder); }, @@ -717,12 +717,12 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { this.pluginSubmit = __bind(this.pluginSubmit, this); _ref = OpenSeaDragon.__super__.constructor.apply(this, arguments); - //To facilitate calling items, we want to be able to get the index of a value + // To facilitate calling items, we want to be able to get the index of a value this.__indexOf = [].indexOf; if(!this.__indexOf){ - //Basically you iterate through every item on the list, if it matches - //the item you are looking for return the current index, otherwise return -1 + // Basically you iterate through every item on the list, if it matches + // the item you are looking for return the current index, otherwise return -1 this.__indexOf = function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) @@ -737,13 +737,13 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { OpenSeaDragon.prototype.field = null; OpenSeaDragon.prototype.input = null; - - /** - * This function initiates the editor that will apear when you edit/create an - * annotation and the viewer that appears when you hover over an item. - */ + + /** + * This function initiates the editor that will apear when you edit/create an + * annotation and the viewer that appears when you hover over an item. + */ OpenSeaDragon.prototype.pluginInit = function() { - //Check that annotator is working + // Check that annotator is working if (!Annotator.supported()) { return; } @@ -751,12 +751,12 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { //-- Editor this.field = this.annotator.editor.addField({ id: 'osd-input-rangePosition-annotations', - type: 'input', //options (textarea,input,select,checkbox) + type: 'input', // options (textarea,input,select,checkbox) submit: this.pluginSubmit, EditOpenSeaDragonAn: this.EditOpenSeaDragonAn }); - //Modify the element created with annotator to be an invisible span + // Modify the element created with annotator to be an invisible span var select = '
    • '; var newfield = Annotator.$(select); Annotator.$(this.field).replaceWith(newfield); @@ -774,40 +774,40 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { * metadata for the image in an object that will be passed to the backend. */ OpenSeaDragon.prototype.pluginSubmit = function(field, annotation) { - //Select the new JSON for the Object to save + // Select the new JSON for the Object to save if (this.EditOpenSeaDragonAn()){ var annotator = this.annotator; var osda = annotator.osda; var position = osda.rectPosition || {}; var isNew = typeof annotation.media=='undefined'; if(isNew){ - //if it's undefined, we know it's an image because the editor within - //the OSD instance was open + // if it's undefined, we know it's an image because the editor within + // the OSD instance was open if (typeof annotation.media == 'undefined') annotation.media = "image"; // - media annotation.target = annotation.target || {}; // - target annotation.target.container = osda.viewer.id || ""; // - target.container - //Save source url + // Save source url var source = osda.viewer.source; var tilesUrl = typeof source.tilesUrl!='undefined'?source.tilesUrl:''; var functionUrl = typeof source.getTileUrl!='undefined'?source.getTileUrl:''; - annotation.target.src = tilesUrl!=''?tilesUrl:(''+functionUrl).replace(/\s+/g, ' '); // - target.src (media source) + annotation.target.src = tilesUrl!=''?tilesUrl:('' + functionUrl).replace(/\s+/g, ' '); // - target.src (media source) annotation.target.ext = source.fileFormat || ""; // - target.ext (extension) - //Gets the bounds in order to save them for zooming in and highlight properties + // Gets the bounds in order to save them for zooming in and highlight properties annotation.bounds = osda.viewer.drawer.viewport.getBounds() || {}; // - bounds - var finalimagelink = source["@id"].replace("/info.json", ""); + var finalimagelink = source["@id"].replace("/info.json", ""); var highlightX = Math.round(position.left * source["width"]); var highlightY = Math.round(position.top * source["width"]); var highlightWidth = Math.round(position.width * source["width"]); var highlightHeight = Math.round(position.height * source["width"]); - //creates a link to the OSD server that contains the image to get - //the thumbnail of the selected portion of the image + // creates a link to the OSD server that contains the image to get + // the thumbnail of the selected portion of the image annotation.target.thumb = finalimagelink + "/" + highlightX + "," + highlightY + "," + highlightWidth + "," + highlightHeight + "/full/0/native." + source["formats"][0]; if(isNew) annotation.rangePosition = position || {}; // - rangePosition - //updates the dates associated with creation and update + // updates the dates associated with creation and update annotation.updated = new Date().toISOString(); // - updated if (typeof annotation.created == 'undefined') annotation.created = annotation.updated; // - created @@ -830,30 +830,30 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { }; /** - * Detect if the annotation is an image annotation and there's a target, open - * OSD instance. - * @param {Object} an Annotation from the Annotator instance - */ + * Detect if the annotation is an image annotation and there's a target, open + * OSD instance. + * @param {Object} an Annotation from the Annotator instance + */ OpenSeaDragon.prototype.isOpenSeaDragon = function (an){ var annotator = this.annotator; - var rp = an.rangePosition; - - //Makes sure OSD exists and that annotation is an image annotation - //with a position in the OSD instance - var isOpenSeaDragon = (typeof annotator.osda != 'undefined'); - var isContainer = (typeof an.target!='undefined' && an.target.container==this.viewer.id ); - var isImage = (typeof an.media!='undefined' && an.media=='image'); - var isRP = (typeof rp!='undefined'); - var isSource = false; - - //Double checks that the image being displayed matches the annotations - var source = this.viewer.source; - var tilesUrl = typeof source.tilesUrl!='undefined'?source.tilesUrl:''; - var functionUrl = typeof source.getTileUrl!='undefined'?source.getTileUrl:''; - var compareUrl = tilesUrl!=''?tilesUrl:(''+functionUrl).replace(/\s+/g, ' '); - if(isContainer) isSource = (an.target.src == compareUrl); - - return (isOpenSeaDragon && isContainer && isImage && isRP && isSource); + var rp = an.rangePosition; + + // Makes sure OSD exists and that annotation is an image annotation + // with a position in the OSD instance + var isOpenSeaDragon = (typeof annotator.osda != 'undefined'); + var isContainer = (typeof an.target!='undefined' && an.target.container==this.viewer.id ); + var isImage = (typeof an.media!='undefined' && an.media=='image'); + var isRP = (typeof rp!='undefined'); + var isSource = false; + + // Double checks that the image being displayed matches the annotations + var source = this.viewer.source; + var tilesUrl = typeof source.tilesUrl!='undefined'?source.tilesUrl:''; + var functionUrl = typeof source.getTileUrl!='undefined'?source.getTileUrl:''; + var compareUrl = tilesUrl!=''?tilesUrl:('' + functionUrl).replace(/\s+/g, ' '); + if(isContainer) isSource = (an.target.src == compareUrl); + + return (isOpenSeaDragon && isContainer && isImage && isRP && isSource); }; /** @@ -861,14 +861,14 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { * @param {Object} an Annotation object from the Annotator instance */ OpenSeaDragon.prototype._deleteAnnotation = function(an){ - //Remove the annotation of the plugin Store + // Remove the annotation of the plugin Store var annotations = this.annotator.plugins['Store'].annotations; - //Failsafe in case annotation is not immediately removed from annotations list + // Failsafe in case annotation is not immediately removed from annotations list if (annotations.indexOf(an)>-1) annotations.splice(annotations.indexOf(an), 1); - //Refresh the annotations in the display + // Refresh the annotations in the display this.annotator.osda.refreshDisplay(); }; @@ -881,12 +881,12 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { var isOpenSeaDragon = this.isOpenSeaDragon; var self = this; - //local functions + // local functions //-- Editor function annotationEditorHidden(editor) { if (EditOpenSeaDragonAn()){ annotator.osda._reset(); - annotator.osda.refreshDisplay(); //Reload the display of annotations + annotator.osda.refreshDisplay(); // Reload the display of annotations } annotator.editor.OpenSeaDragon=-1; annotator.unsubscribe("annotationEditorHidden", annotationEditorHidden); @@ -910,7 +910,7 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { function annotationViewerShown(viewer,annotations) { var wrapper = jQuery('.annotator-wrapper').offset(); - //Fix with positionCanvas + // Fix with positionCanvas var startPoint = {x: parseFloat(viewer.element[0].style.left), y: parseFloat(viewer.element[0].style.top)}; @@ -921,12 +921,12 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { }; viewer.element.css(newpos); - //Remove the time to wait until disapear, to be more faster that annotator by default + // Remove the time to wait until disapear, to be more faster that annotator by default viewer.element.find('.annotator-controls').removeClass(viewer.classes.showControls); annotator.viewer.subscribe("hide", hideViewer); }; - //subscribe to Annotator + // subscribe to Annotator annotator.subscribe("annotationEditorShown", annotationEditorShown) .subscribe("annotationDeleted", annotationDeleted) .subscribe("annotationViewerShown", annotationViewerShown); @@ -940,18 +940,18 @@ Annotator.Plugin.OpenSeaDragon = (function(_super) { //----------------PUBLIC OBJECT TO CONTROL THE ANNOTATIONS----------------// -//The name of the plugin that the user will write in the html +// The name of the plugin that the user will write in the html OpenSeadragonAnnotation = ("OpenSeadragonAnnotation" in window) ? OpenSeadragonAnnotation : {}; OpenSeadragonAnnotation = function (element, options) { - //local variables + // local variables var $ = jQuery; var options = options || {}; options.optionsOpenSeadragon = options.optionsOpenSeadragon || {}; options.optionsOSDA = options.optionsOSDA || {}; options.optionsAnnotator = options.optionsAnnotator || {}; - //if there isn't store optinos it will create a uri and limit variables for the Back-end of Annotations + // if there isn't store optinos it will create a uri and limit variables for the Back-end of Annotations if (typeof options.optionsAnnotator.store=='undefined') options.optionsAnnotator.store = {}; var store = options.optionsAnnotator.store; @@ -968,11 +968,11 @@ OpenSeadragonAnnotation = function (element, options) { if (typeof store.loadFromSearch.limit=='undefined') store.loadFromSearch.limit = 10000; - //global variables + // global variables this.currentUser = null; //-- Init all the classes --/ - //Annotator + // Annotator this.annotator = $(element).annotator(options.optionsAnnotator.annotator).data('annotator'); //-- Activate all the Annotator plugins --// @@ -1011,10 +1011,10 @@ OpenSeadragonAnnotation = function (element, options) { //- OpenSeaDragon Plugins this.viewer.annotation(options.optionsOSDA); - //Set annotator.editor.OpenSeaDragon by default + // Set annotator.editor.OpenSeaDragon by default this.annotator.editor.OpenSeaDragon=-1; - //We need to make sure that osda is accessible via annotator + // We need to make sure that osda is accessible via annotator this.annotator.osda = this; function reloadEditor(){ diff --git a/common/static/js/vendor/ova/share-annotator.js b/common/static/js/vendor/ova/share-annotator.js index dfd1e82df4..3bf1f57920 100644 --- a/common/static/js/vendor/ova/share-annotator.js +++ b/common/static/js/vendor/ova/share-annotator.js @@ -23,480 +23,484 @@ var _ref, __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }; Annotator.Plugin.Share = (function(_super) { - __extends(Share, _super); - - //Default Share configuration - Share.prototype.options = { - shareIn:['facebook','twitter','email','google'], - getUrl:{ - 'facebook':function(title,link,noteText){ - return 'https://www.facebook.com/sharer/sharer.php?s=100&p[url]='+link+'&p[title]='+encodeURIComponent('Open Video Annotation')+'&p[summary]='+noteText; - }, - 'twitter':function(title,link,noteText){ - return 'https://twitter.com/intent/tweet?original_referer='+link+'&source=tweetbutton&url='+link+ "&via=OpenVideoAnnotation&text=" +encodeURIComponent('I want to share the following Open Video Annotation: '); - }, - 'google':function(title,link,noteText){ - return 'https://plus.google.com/share?url='+link; - }, - 'email': function(title,link,noteText){ - return 'mailto:?subject='+title+'&body='+link; - } - }, - baseUrl:'', //baseUrl = the base url for all the shared annotations - }; + __extends(Share, _super); + + // Default Share configuration + Share.prototype.options = { + shareIn: ['facebook', 'twitter', 'email', 'google'], + getUrl: { + 'facebook':function(title, link, noteText){ + return 'https://www.facebook.com/sharer/sharer.php?s=100&p[url]=' + link + '&p[title]=' + encodeURIComponent('Open Video Annotation') + '&p[summary]=' + noteText; + }, + 'twitter':function(title, link, noteText){ + return 'https://twitter.com/intent/tweet?original_referer=' + link + '&source=tweetbutton&url=' + link + "&via=OpenVideoAnnotation&text=" + encodeURIComponent('I want to share the following Open Video Annotation: '); + }, + 'google':function(title, link, noteText){ + return 'https://plus.google.com/share?url=' + link; + }, + 'email': function(title, link, noteText){ + return 'mailto:?subject=' + title + '&body=' + link; + } + }, + baseUrl: '', // baseUrl = the base url for all the shared annotations + }; - function Share(element,options) { - if (typeof options!='undefined') - this.options.shareIn = typeof options.shareIn!='undefined'?options.shareIn:this.options.shareIn; - this.buildHTMLShareButton = __bind(this.buildHTMLShareButton, this); - this.runningAPI = __bind(this.runningAPI, this); - this.updateViewer = __bind(this.updateViewer, this); - _ref = Share.__super__.constructor.apply(this, arguments); - return _ref; - } + function Share(element, options) { + if (typeof options!='undefined') + this.options.shareIn = typeof options.shareIn!='undefined'?options.shareIn:this.options.shareIn; + this.buildHTMLShareButton = __bind(this.buildHTMLShareButton, this); + this.runningAPI = __bind(this.runningAPI, this); + this.updateViewer = __bind(this.updateViewer, this); + _ref = Share.__super__.constructor.apply(this, arguments); + return _ref; + } - Share.prototype.field = null; + Share.prototype.field = null; - Share.prototype.input = null; + Share.prototype.input = null; - Share.prototype.pluginInit = function() { - //Check that annotator is working - if (!Annotator.supported()) { - return; - } - - //-- Editor - this.field = this.annotator.editor.addField({ - type: 'input', //options (textarea,input,select,checkbox) - }); + Share.prototype.pluginInit = function() { + // Check that annotator is working + if (!Annotator.supported()) { + return; + } + + // -- Editor + this.field = this.annotator.editor.addField({ + type: 'input', // options (textarea, input, select, checkbox) + }); - //Modify the element created with annotator to be an invisible span - var newfield = Annotator.$('
  • '+this.buildHTMLShareButton('Share without saving:')+'
    • '); - Annotator.$(this.field).replaceWith(newfield); - this.field=newfield[0]; - - //Create the actions for the buttons - this.buttonsActions(this.field,2,this.options.baseUrl); //2 is the method of the API that will be for share without saving - - //Init the API plugin - var APIoptions = this.initAPI(); - - this.runAPI(APIoptions); - - //-- Viewer - var newview = this.annotator.viewer.addField({ - load: this.updateViewer, - }); + // Modify the element created with annotator to be an invisible span + var newfield = Annotator.$('
  • ' + this.buildHTMLShareButton('Share without saving:') + '
    • '); + Annotator.$(this.field).replaceWith(newfield); + this.field=newfield[0]; + + // Create the actions for the buttons + this.buttonsActions(this.field, 2, this.options.baseUrl); // 2 is the method of the API that will be for share without saving + + // Init the API plugin + var APIoptions = this.initAPI(); + + this.runAPI(APIoptions); + + // -- Viewer + var newview = this.annotator.viewer.addField({ + load: this.updateViewer, + }); - return this.input = $(this.field).find(':input'); - }; - - //Share button HTML - Share.prototype.buildHTMLShareButton = function(title,id) { - var title = title || '', - id = typeof id!='undefined'?'annotationId="'+id+'"':'', - titleText = title!=''?'
    '+title+'
    ':'', - shareButton = '
    ', - popup = '
    '; - if($('.share-popup-overlay-bg').length === 0) - $('.annotator-wrapper').append(popup); - return '
    '+titleText+shareButton+'
    '; - } - - //template for the design of the Share Plugin - Share.prototype.buildHTMLPopup = function(title) { - var buttons = ''; - if (typeof this.options.shareIn!='undefined'){ - this.options.shareIn.forEach(function(item) { - buttons += '
    '+item.charAt(0).toUpperCase() + item.slice(1)+'
    '; - }); - } - this.uri = typeof this.uri!='undefined'?this.uri:''; - var title = '
    '+title.replace(":","")+'
    ', - copy = '
    Copy and Share:
    ', - uri = '', - popup = title + buttons + copy + uri; - return popup; - } - - //Create the actions for the buttons - Share.prototype.buttonsActions = function(field,method,url, annotation) { - var share = this; - - // hide popup when user clicks on close button - $('.close-btn').click(function() { - $('.share-popup-overlay-bg').hide(); - }); - // hides the popup if user clicks anywhere outside the container - $('.share-popup-overlay-bg').click(function() { - $('.share-popup-overlay-bg').hide(); - }); - // prevents the overlay from closing if user clicks inside the popup overlay - $('.share-popup').click(function() { - return false; - }); - // Share button - $(field).find('.share-button-annotator.share-button').click(function(event) { - event.preventDefault(); // disable normal link function so that it doesn't refresh the page - annotation = share.getAnnotationFromId(event.currentTarget.attributes.annotationid); - var _field = this, - ovaId = annotation.id, - title = method == 1?'Share':'Share without saving'; - - // share.uri will be useful for buildHTMLPopup functions - share.uri = share.createAPIURL(method,ovaId,url, annotation); - - //display your popup - $('.share-popup-overlay-bg').show(); - - //build buttons - $('.share-popup-items').html(share.buildHTMLPopup(title)); - - //buttons actions - if (typeof share.options.shareIn!='undefined'){ - share.options.shareIn.forEach(function(item) { - $('.share-'+item+'-annotator.share-button').click(function() { - var url = share.createAPIURL(method,ovaId,url, annotation), - title = "Sharing a annotation with Open Video Annotation"; - link = encodeURIComponent(url), - noteText = share.getSource('ovaText'), - finalUrl = ''; - if (method==1){ - var viewer = share.annotator.viewer, - textarea = $(viewer.element).find('div:first').html(); - noteText = encodeURIComponent(textarea); - } - finalUrl = typeof share.options.getUrl[item]!='undefined'?share.options.getUrl[item](title,link,noteText):''; - if(typeof share.options.getUrl[item]!='undefined') - window.open(finalUrl); - }); - }); - } - }); - }; - - - Share.prototype.createAPIURL = function(method,ovaId,url, annotation) { - var annotator = this.annotator, - editor = annotator.editor, - method = method || 1, - //url = location.protocol + '//' + location.host + location.pathname, - url = annotation.uri || window.location.href; - - url += (url.indexOf('?') >= 0)?'&':'?'; - - if (method === 1){ - var ovaId = typeof ovaId!='undefined'?ovaId:''; - url += 'ovaId=' + ovaId; - }else if (method === 2){ - var ovaStart = this.getSource('ovaStart'), - ovaEnd = this.getSource('ovaEnd'), - ovaText = this.getSource('ovaText'); - url += 'ovaStart='+ ovaStart - +'&ovaEnd='+ ovaEnd - +'&ovaText='+ ovaText; - if(typeof editor.VideoJS!='undefined' && editor.VideoJS !== -1){//Video Annotation - var ovaContainer = this.getSource('ovaContainer'), - ovaSrc = this.getSource('ovaSrc'); - url += '&ovaContainer='+ovaContainer - +'&ovaSrc='+ ovaSrc; - }else{//Text Annotation - var ovastartOffset = this.getSource('ovastartOffset'), - ovaendOffset = this.getSource('ovaendOffset'); - url += '&ovastartOffset='+ovastartOffset - +'&ovaendOffset='+ ovaendOffset; - } - } - return url; - }; - - Share.prototype.getSource = function(source) { - var source = source || ''; - if (source == 'ovaId') {//method 1 - source=this.annotation.id; - }else{//method 2 - var annotator = this.annotator, - editor = annotator.editor, - textarea = $(editor.element).find('textarea')[0]; - if(source == 'ovaText') - source = textarea.value; - if (typeof editor.VideoJS!='undefined' && editor.VideoJS !== -1){//Video Annotation - if(source == 'ovaContainer') - source = editor.VideoJS; - else if(source == 'ovaSrc') - source = annotator.mplayer[editor.VideoJS].tech.options_.source.src; - else if(source == 'ovaStart') - source = annotator.mplayer[editor.VideoJS].rangeslider.getValues().start; - else if(source == 'ovaEnd') - source = annotator.mplayer[editor.VideoJS].rangeslider.getValues().end; - - }else{//Text Annotation - var annotation = editor.annotation; - if(source == 'ovastartOffset') - source = annotation.ranges[0].startOffset; - else if(source == 'ovaendOffset') - source = annotation.ranges[0].endOffset; - else if(source == 'ovaStart') - source = annotation.ranges[0].start; - else if(source == 'ovaEnd') - source = annotation.ranges[0].end; - } - } - return encodeURIComponent(source); - }; - - Share.prototype.initAPI = function() { - // -- Detect API in the URL -- // - /* - The first option is to give a known id of an annotation - Example http://url.com/#id=rTcpOjIMT2aF1apDtboC-Q - */ - var API = {}, - ovaId = this.getParameterByName('ovaId'), //Method 1 (Obligatory) - start = this.getParameterByName('ovaStart'), //Method 2 (Obligatory) - end = this.getParameterByName('ovaEnd'), //Method 2 (Obligatory) - container = this.getParameterByName('ovaContainer'), //Method 2 (Obligatory) - src = this.getParameterByName('ovaSrc'),//Method 2 (Obligatory) - text = this.getParameterByName('ovaText'),//Method 2 - user = this.getParameterByName('ovaUser'),//Method 2 - startOffset = this.getParameterByName('ovastartOffset'),//Method 2 - endOffset = this.getParameterByName('ovaendOffset');//Method 2 - - //remove the variables from the url browser - var stripped_url = top.location.href; - if (ovaId != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaId'); - if (start != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaStart'); - if (end != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaEnd'); - if (container != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaContainer'); - if (src != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaSrc'); - if (text != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaText'); - if (user != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaUser'); - if (startOffset != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovastartOffset'); - if (endOffset != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaendOffset'); - window.history.pushState("object or string", "Title", stripped_url); - - - // Method 1 API with the Id of the annotation - //Example: http://danielcebrian.com/annotations/demo.html?&ovaId=wtva_SjnQb2HtqppDihKug - if(ovaId != ''){ - $.extend(API,{method:1,ovaId:ovaId}); - } - //Method 2 API with all the parameter to load the annotation - //Example with video: http://danielcebrian.com/annotations/demo.html?ovaContainer=vid1&ovaSrc=http%3A%2F%2Fvideo-js.zencoder.com%2Foceans-clip.mp4&ovaStart=2&ovaEnd=10&ovaText=This%20is%20test&ovaUser=Test%20User - //Example with text: http://danielcebrian.com/annotations/demo.html?ovaStart=%2Fp%5B1%5D&ovaEnd=%2Fp%5B1%5D&ovastartOffset=542&ovaendOffset=572&ovaText=API - - if(start!='' && end!='' && container!='' && src!=''){//video api - $.extend(API,{method:2,start:start,end:end,container:container,src:src,text:text,user:user}); - }else if(start!='' && end!='' && startOffset!='' && endOffset!=''){//text api - $.extend(API,{method:2,start:start,end:end,startOffset:startOffset,endOffset:endOffset,text:text,user:user}); - } - return API; - } - Share.prototype.runningAPI = function (annotations,API){ - var wrapper = $('.annotator-wrapper').parent()[0], - mplayer, - osda, - self=this; - - //Set Annotator in wrapper to fix quick DOM - $.data(wrapper, 'annotator', self.annotator);//Set the object in the span - annotator = window.annotator = $.data(wrapper, 'annotator'); - mplayer = typeof annotator.mplayer!='undefined'?annotator.mplayer:[]; - osda = typeof annotator.osda!='undefined'?annotator.osda:[]; - - //Detect if the URL has an API element - if (typeof API!='undefined' && typeof API.method!='undefined' && (API.method=='1'||API.method=='2')) { - if(API.method=='1'){ - var allannotations = annotator.plugins['Store'].annotations, - ovaId = decodeURIComponent(API.ovaId); - - for (var item in allannotations) { - var an = allannotations[item]; - if (typeof an.id!='undefined' && an.id == ovaId){//this is the annotation - if(self._isVideo(an)){//It is a video - if (typeof mplayer[an.target.container]!='undefined'){ - var player = mplayer[an.target.container]; - if (player.id_ == an.target.container){ - var anFound = an; - videojs(player.id_).ready(function(){ - if (player.techName != 'Youtube'){ - player.preload('auto'); - } - player.autoPlayAPI = anFound; - player.play(); - }); - } - } - }else if(self._isImage(an)){//It is a OpenSeaDragon Annotation - var bounds = new OpenSeadragon.Rect(an.bounds.x, an.bounds.y, an.bounds.width, an.bounds.height); - setTimeout(function(){ - osda.viewer.viewport.fitBounds(bounds, false); - $('html,body').animate({ - scrollTop: $("#"+an.target.container).offset().top - },'slow'); - },250); - }else{//It is a text - var hasRanges = typeof an.ranges!='undefined' && typeof an.ranges[0] !='undefined', - startOffset = hasRanges?an.ranges[0].startOffset:'', - endOffset = hasRanges?an.ranges[0].endOffset:''; - - if(typeof startOffset!='undefined' && typeof endOffset!='undefined'){ - //change the color - $(an.highlights).addClass('api'); - //animate to the annotation - $('html,body').animate({ - scrollTop: $(an.highlights[0]).offset().top}, - 'slow'); - } - } - } - } - }else if (API.method=='2'){ - if (typeof mplayer!='undefined'){ - //variable for Video - var container = decodeURIComponent(API.container), - player = mplayer[container], - isVideo = (typeof player!='undefined' && container==player.id_), - isNumber = (!isNaN(parseFloat(API.start)) && isFinite(API.start) && !isNaN(parseFloat(API.end)) && isFinite(API.end)), - isSource = false; - - if(isVideo){ - //Compare without extension - var src = decodeURIComponent(API.src), - targetSrc = src.substring(0,src.lastIndexOf(".")), - playerSrc = player.tech.options_.source.src==''?player.tag.currentSrc:player.tech.options_.source.src; - playerSrc = playerSrc.substring(0,playerSrc.lastIndexOf(".")) - isSource = (targetSrc == playerSrc); - } - - //Open Video Annotation - if(isVideo && isNumber && isSource){ - var annotation = { - rangeTime: { - start:API.start, - end:API.end - }, - created: new Date().toISOString(), - updated: new Date().toISOString(), - target:{ - container: container, - src: src - }, - media: 'video', - text:decodeURIComponent(API.text), - user:decodeURIComponent(API.user) - }; - videojs(player.id_).ready(function(){ - if (player.techName != 'Youtube'){ - player.preload('auto'); - } - player.autoPlayAPI = annotation; - player.play(); - }); - } - } - //variable for text - var startOffset = API.startOffset, - endOffset = API.endOffset; - - //Text Annotation - if(!isVideo && typeof startOffset!='undefined' && typeof endOffset!='undefined'){ - var annotation = { - ranges: [{ - start:decodeURIComponent(API.start), - end:decodeURIComponent(API.end), - startOffset:decodeURIComponent(API.startOffset), - endOffset:decodeURIComponent(API.endOffset), - }], - created: new Date().toISOString(), - updated: new Date().toISOString(), - media: 'text', - text:decodeURIComponent(API.text), - user:decodeURIComponent(API.user) - }; - //show the annotation - annotator.setupAnnotation(annotation); - //to change the color - $(annotation.highlights).addClass('api'); - //animate to the annotation - $('html,body').animate({ - scrollTop: $(annotation.highlights[0]).offset().top}, - 'slow'); - } - - } - } - //Let know to others API that this plugin is loaded - annotator.isShareLoaded = true; - annotator.publish('shareloaded'); - } - Share.prototype.runAPI = function(API) { - var self = this; - var func = function (annotations){ - self.runningAPI(annotations,API); - self.annotator.unsubscribe("annotationsLoaded",func); - }; - this.annotator - //-- Finished the Annotator DOM - .subscribe("annotationsLoaded",func); - } - - Share.prototype._isVideo = function(an){ - //Detect if the annotation is a Open Video Annotation - var an = an || {} - rt = an.rangeTime, - isVideo = (typeof an.media!='undefined' && an.media=='video'), - hasContainer = (typeof an.target!='undefined' && typeof an.target.container!='undefined' ), - isNumber = (typeof rt!='undefined' && !isNaN(parseFloat(rt.start)) && isFinite(rt.start) && !isNaN(parseFloat(rt.end)) && isFinite(rt.end)); - return (isVideo && hasContainer && isNumber); - } - - Share.prototype._isImage = function(annotation){ - return annotation.media === 'image'; - } - - Share.prototype.getParameterByName = function(name) { - name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]"); - var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), - //results = regex.exec(location.search), - results = regex.exec('?'+window.location.href.split('?')[1]); - return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); - }; - - Share.prototype.removeVariableFromURL = function(url_string, variable_name) { - var URL = String(url_string); - var regex = new RegExp( "\\?" + variable_name + "=[^&]*&?", "gi"); - URL = URL.replace(regex,'?'); - regex = new RegExp( "\\&" + variable_name + "=[^&]*&?", "gi"); - URL = URL.replace(regex,'&'); - URL = URL.replace(/(\?|&)$/,''); - regex = null; - return URL; - } - - Share.prototype.getAnnotationFromId = function(ovaId){ - var annotationList = this.annotator.plugins.Store.annotations; - return $.grep(annotationList, function(elementOfArray, indexInArray){ - return parseInt(elementOfArray.id) === parseInt(ovaId.nodeValue); - })[0]; - } + return this.input = $(this.field).find(':input'); + }; + + // Share button HTML + Share.prototype.buildHTMLShareButton = function(title, id) { + var title = title || ''; + var id = typeof id!='undefined'?'annotationId="' + id + '"':''; + var titleText = title!=''?'
    ' + title + '
    ':''; + var shareButton = '
    '; + var popup = '
    '; + // checks to make sure that no popup overlay already exists (though hidden) and creates a new one if it does not exist + if($('.share-popup-overlay-bg').length === 0) + $('.annotator-wrapper').append(popup); + return '
    ' + titleText + shareButton + '
    '; + } + + // template for the design of the Share Plugin + Share.prototype.buildHTMLPopup = function(title) { + var buttons = ''; + if (typeof this.options.shareIn != 'undefined'){ + this.options.shareIn.forEach(function(item) { + buttons += '
    ' + item.charAt(0).toUpperCase() + item.slice(1) + '
    '; + }); + } + this.uri = (typeof this.uri != 'undefined') ? this.uri : ''; + var title = '
    ' + title.replace(":", "") + '
    '; + var copy = '
    Copy and Share:
    '; + var uri = ''; + var popup = title + buttons + copy + uri; + return popup; + } + + // Create the actions for the buttons + Share.prototype.buttonsActions = function(field, method, url, annotation) { + var share = this; + + // hide popup when user clicks on close button + $('.close-btn').click(function() { + $('.share-popup-overlay-bg').hide(); + }); + // hides the popup if user clicks anywhere outside the container + $('.share-popup-overlay-bg').click(function() { + $('.share-popup-overlay-bg').hide(); + }); + // prevents the overlay from closing if user clicks inside the popup overlay + $('.share-popup').click(function() { + return false; + }); + // Share button + $(field).find('.share-button-annotator.share-button').click(function(event) { + event.preventDefault(); // disable normal link function so that it doesn't refresh the page + annotation = share.getAnnotationFromId(event.currentTarget.attributes.annotationid); + var _field = this; + var ovaId = annotation.id, + var title; + if (method == 1) { + title = 'Share'; + } else { + title = 'Share without saving'; + } + + // share.uri will be useful for buildHTMLPopup functions + share.uri = share.createAPIURL(method, ovaId, url, annotation); + + // display your popup + $('.share-popup-overlay-bg').show(); + + // build buttons + $('.share-popup-items').html(share.buildHTMLPopup(title)); + + // buttons actions + if (typeof share.options.shareIn!='undefined'){ + share.options.shareIn.forEach(function(item) { + $('.share-' + item + '-annotator.share-button').click(function() { + var url = share.createAPIURL(method, ovaId, url, annotation); + var title = "Sharing a annotation with Open Video Annotation"; + var link = encodeURIComponent(url); + var noteText = share.getSource('ovaText'); + var finalUrl = ''; + if (method==1){ + var viewer = share.annotator.viewer; + var textarea = $(viewer.element).find('div:first').html(); + noteText = encodeURIComponent(textarea); + } + finalUrl = typeof share.options.getUrl[item]!='undefined'?share.options.getUrl[item](title, link, noteText):''; + if (typeof share.options.getUrl[item]!='undefined') + window.open(finalUrl); + }); + }); + } + }); + }; + + + Share.prototype.createAPIURL = function(method, ovaId, url, annotation) { + var annotator = this.annotator; + var editor = annotator.editor; + var method = method || 1; + var url = annotation.uri || window.location.href; + + url += (url.indexOf('?') >= 0)? '&' : '?'; + + if (method === 1){ + var ovaId = (typeof ovaId !='undefined') ? ovaId : ''; + url += 'ovaId=' + ovaId; + } else if (method === 2){ + var ovaStart = this.getSource('ovaStart'); + var ovaEnd = this.getSource('ovaEnd'); + var ovaText = this.getSource('ovaText'); - Share.prototype.updateViewer = function(field, annotation) { - this.annotation = annotation; - - var self = this, - field = $(field), - ret = field.addClass('share-viewer-annotator').html(function() { - var string; - return self.buildHTMLShareButton('Share:',self.getSource('ovaId')); - }); - - //Create the actions for the buttons - this.buttonsActions(field[0],1,this.options.baseUrl, annotation); //1 is the method of the API that will be for share some annotation in the database - return ret; - }; + url += 'ovaStart=' + ovaStart + + '&ovaEnd=' + ovaEnd + + '&ovaText=' + ovaText; + if (typeof editor.VideoJS != 'undefined' && editor.VideoJS !== -1){// Video Annotation + var ovaContainer = this.getSource('ovaContainer'); + var ovaSrc = this.getSource('ovaSrc'); + url += '&ovaContainer=' + ovaContainer + + '&ovaSrc=' + ovaSrc; + } else {// Text Annotation + var ovastartOffset = this.getSource('ovastartOffset'); + var ovaendOffset = this.getSource('ovaendOffset'); + url += '&ovastartOffset=' + ovastartOffset + '&ovaendOffset=' + ovaendOffset; + } + } + return url; + }; + + Share.prototype.getSource = function(source) { + var source = source || ''; + if (source == 'ovaId') {// method 1 + source=this.annotation.id; + } else {// method 2 + var annotator = this.annotator; + var editor = annotator.editor, + var textarea = $(editor.element).find('textarea')[0]; - return Share; + if (source == 'ovaText') + source = textarea.value; + + if (typeof editor.VideoJS!='undefined' && editor.VideoJS !== -1){// Video Annotation + if (source == 'ovaContainer') + source = editor.VideoJS; + else if (source == 'ovaSrc') + source = annotator.mplayer[editor.VideoJS].tech.options_.source.src; + else if (source == 'ovaStart') + source = annotator.mplayer[editor.VideoJS].rangeslider.getValues().start; + else if (source == 'ovaEnd') + source = annotator.mplayer[editor.VideoJS].rangeslider.getValues().end; + + } else {// Text Annotation + var annotation = editor.annotation; + if(source == 'ovastartOffset') + source = annotation.ranges[0].startOffset; + else if (source == 'ovaendOffset') + source = annotation.ranges[0].endOffset; + else if (source == 'ovaStart') + source = annotation.ranges[0].start; + else if (source == 'ovaEnd') + source = annotation.ranges[0].end; + } + } + return encodeURIComponent(source); + }; + + Share.prototype.initAPI = function() { + // -- Detect API in the URL -- // + /* + The first option is to give a known id of an annotation + Example http:// url.com/#id=rTcpOjIMT2aF1apDtboC-Q + */ + var API = {}, + var ovaId = this.getParameterByName('ovaId'); // Method 1 (Obligatory) + var start = this.getParameterByName('ovaStart'); // Method 2 (Obligatory) + var end = this.getParameterByName('ovaEnd'); // Method 2 (Obligatory) + var container = this.getParameterByName('ovaContainer'); // Method 2 (Obligatory) + var src = this.getParameterByName('ovaSrc'); // Method 2 (Obligatory) + var text = this.getParameterByName('ovaText'); // Method 2 + var user = this.getParameterByName('ovaUser'); // Method 2 + var startOffset = this.getParameterByName('ovastartOffset'); // Method 2 + var endOffset = this.getParameterByName('ovaendOffset');// Method 2 + + // remove the variables from the url browser + var stripped_url = top.location.href; + if (ovaId != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaId'); + if (start != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaStart'); + if (end != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaEnd'); + if (container != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaContainer'); + if (src != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaSrc'); + if (text != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaText'); + if (user != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaUser'); + if (startOffset != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovastartOffset'); + if (endOffset != '') stripped_url = this.removeVariableFromURL(stripped_url, 'ovaendOffset'); + window.history.pushState("object or string", "Title", stripped_url); + + + // Method 1 API with the Id of the annotation + // Example: http://danielcebrian.com/annotations/demo.html?&ovaId=wtva_SjnQb2HtqppDihKug + if (ovaId != '') { + $.extend(API, {method:1, ovaId:ovaId}); + } + // Method 2 API with all the parameter to load the annotation + // Example with video: http://danielcebrian.com/annotations/demo.html?ovaContainer=vid1&ovaSrc=http%3A%2F%2Fvideo-js.zencoder.com%2Foceans-clip.mp4&ovaStart=2&ovaEnd=10&ovaText=This%20is%20test&ovaUser=Test%20User + // Example with text: http://danielcebrian.com/annotations/demo.html?ovaStart=%2Fp%5B1%5D&ovaEnd=%2Fp%5B1%5D&ovastartOffset=542&ovaendOffset=572&ovaText=API + + if (start!='' && end!='' && container!='' && src!='') {// video api + $.extend(API, {method:2, start:start, end:end, container:container, src:src, text:text, user:user}); + } else if(start!='' && end!='' && startOffset!='' && endOffset!='') {// text api + $.extend(API, {method:2, start:start, end:end, startOffset:startOffset, endOffset:endOffset, text:text, user:user}); + } + return API; + } + Share.prototype.runningAPI = function (annotations, API) { + var wrapper = $('.annotator-wrapper').parent()[0]; + var mplayer; + var osda; + var self=this; + + // Set Annotator in wrapper to fix quick DOM + $.data(wrapper, 'annotator', self.annotator);// Set the object in the span + annotator = window.annotator = $.data(wrapper, 'annotator'); + mplayer = (typeof annotator.mplayer != 'undefined') ? annotator.mplayer : []; + osda = (typeof annotator.osda != 'undefined') ? annotator.osda : []; + + // Detect if the URL has an API element + if (typeof API != 'undefined' && typeof API.method != 'undefined' && (API.method == '1' || API.method == '2')) { + if (API.method=='1'){ + var allannotations = annotator.plugins['Store'].annotations; + var ovaId = decodeURIComponent(API.ovaId); + + for (var item in allannotations) { + var an = allannotations[item]; + if (typeof an.id!='undefined' && an.id == ovaId){// this is the annotation + if (self._isVideo(an)){// It is a video + if (typeof mplayer[an.target.container] != 'undefined'){ + var player = mplayer[an.target.container]; + if (player.id_ == an.target.container){ + var anFound = an; + videojs(player.id_).ready(function(){ + if (player.techName != 'Youtube'){ + player.preload('auto'); + } + player.autoPlayAPI = anFound; + player.play(); + }); + } + } + } else if (self._isImage(an)) {// It is a OpenSeaDragon Annotation + var bounds = new OpenSeadragon.Rect(an.bounds.x, an.bounds.y, an.bounds.width, an.bounds.height); + setTimeout(function() { + osda.viewer.viewport.fitBounds(bounds, false); + $('html, body').animate( { + scrollTop: $("#" + an.target.container).offset().top + }, 'slow'); + }, 250); + } else {// It is a text + var hasRanges = typeof an.ranges != 'undefined' && typeof an.ranges[0] != 'undefined'; + var startOffset = hasRanges?an.ranges[0].startOffset:''; + var endOffset = hasRanges?an.ranges[0].endOffset:''; + + if (typeof startOffset != 'undefined' && typeof endOffset != 'undefined'){ + // change the color + $(an.highlights).addClass('api'); + // animate to the annotation + $('html, body').animate({ + scrollTop: $(an.highlights[0]).offset().top}, 'slow'); + } + } + } + } + } else if (API.method == '2'){ + if (typeof mplayer != 'undefined'){ + // variable for Video + var container = decodeURIComponent(API.container); + var player = mplayer[container]; + var isVideo = (typeof player != 'undefined' && container == player.id_); + var isNumber = (!isNaN(parseFloat(API.start)) && isFinite(API.start) && !isNaN(parseFloat(API.end)) && isFinite(API.end)); + var isSource = false; + + if (isVideo){ + // Compare without extension + var src = decodeURIComponent(API.src); + var targetSrc = src.substring(0, src.lastIndexOf(".")); + var playerSrc = (player.tech.options_.source.src == '') ? player.tag.currentSrc : player.tech.options_.source.src; + playerSrc = playerSrc.substring(0, playerSrc.lastIndexOf(".")) + isSource = (targetSrc == playerSrc); + } + + // Open Video Annotation + if (isVideo && isNumber && isSource){ + var annotation = { + rangeTime: { + start: API.start, + end: API.end + }, + created: new Date().toISOString(), + updated: new Date().toISOString(), + target: { + container: container, + src: src + }, + media: 'video', + text: decodeURIComponent(API.text), + user: decodeURIComponent(API.user) + }; + videojs(player.id_).ready(function(){ + if (player.techName != 'Youtube'){ + player.preload('auto'); + } + player.autoPlayAPI = annotation; + player.play(); + }); + } + } + // variable for text + var startOffset = API.startOffset; + var endOffset = API.endOffset; + + // Text Annotation + if (!isVideo && typeof startOffset != 'undefined' && typeof endOffset != 'undefined'){ + var annotation = { + ranges: [{ + start: decodeURIComponent(API.start), + end: decodeURIComponent(API.end), + startOffset: decodeURIComponent(API.startOffset), + endOffset: decodeURIComponent(API.endOffset), + }], + created: new Date().toISOString(), + updated: new Date().toISOString(), + media: 'text', + text: decodeURIComponent(API.text), + user: decodeURIComponent(API.user) + }; + // show the annotation + annotator.setupAnnotation(annotation); + // to change the color + $(annotation.highlights).addClass('api'); + // animate to the annotation + $('html, body').animate({ + scrollTop: $(annotation.highlights[0]).offset().top}, + 'slow'); + } + + } + } + // Let know to others API that this plugin is loaded + annotator.isShareLoaded = true; + annotator.publish('shareloaded'); + } + Share.prototype.runAPI = function(API) { + var self = this; + var func = function(annotations) { + self.runningAPI(annotations, API); + self.annotator.unsubscribe("annotationsLoaded", func); + }; + this.annotator + // -- Finished the Annotator DOM + .subscribe("annotationsLoaded", func); + } + + Share.prototype._isVideo = function(an){ + // Detect if the annotation is a Open Video Annotation + var an = an || {}; + var rt = an.rangeTime; + var isVideo = (typeof an.media != 'undefined' && an.media == 'video'); + var hasContainer = (typeof an.target != 'undefined' && typeof an.target.container != 'undefined' ); + var isNumber = (typeof rt != 'undefined' && !isNaN(parseFloat(rt.start)) && isFinite(rt.start) && !isNaN(parseFloat(rt.end)) && isFinite(rt.end)); + return (isVideo && hasContainer && isNumber); + } + + Share.prototype._isImage = function(annotation) { + return annotation.media === 'image'; + } + + Share.prototype.getParameterByName = function(name) { + name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]"); + var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"); + var results = regex.exec('?' + window.location.href.split('?')[1]); + return results == null ? "" : decodeURIComponent(results[1].replace(/\ + /g, " ")); + }; + + Share.prototype.removeVariableFromURL = function(url_string, variable_name) { + var URL = String(url_string); + var regex = new RegExp( "\\?" + variable_name + "=[^&]*&?", "gi"); + URL = URL.replace(regex,'?'); + regex = new RegExp( "\\&" + variable_name + "=[^&]*&?", "gi"); + URL = URL.replace(regex,'&'); + URL = URL.replace(/(\?|&)$/,''); + regex = null; + return URL; + } + + Share.prototype.getAnnotationFromId = function(ovaId) { + var annotationList = this.annotator.plugins.Store.annotations; + return $.grep(annotationList, function(elementOfArray, indexInArray){ + return parseInt(elementOfArray.id, 10) === parseInt(ovaId.nodeValue, 10); + })[0]; + } + + Share.prototype.updateViewer = function(field, annotation) { + this.annotation = annotation; + + var self = this; + var field = $(field); + var ret = field.addClass('share-viewer-annotator').html(function() { + return self.buildHTMLShareButton('Share:', self.getSource('ovaId')); + }); + + // Create the actions for the buttons + this.buttonsActions(field[0], 1, this.options.baseUrl, annotation); // 1 is the method of the API that will be for share some annotation in the database + return ret; + }; + + return Share; })(Annotator.Plugin);