blacklight-spotlight 0.33.3 → 0.34.0

data/vendor/assets/javascripts/Path.Drag.js

@@ -0,0 +1,137 @@
+'use strict';
+
+/* A Draggable that does not update the element position
+and takes care of only bubbling to targetted path in Canvas mode. */
+L.PathDraggable = L.Draggable.extend({
+
+  initialize: function (path) {
+    this._path = path;
+    this._canvas = (path._map.getRenderer(path) instanceof L.Canvas);
+    var element = this._canvas ? this._path._map.getRenderer(this._path)._container : this._path._path;
+    L.Draggable.prototype.initialize.call(this, element, element, true);
+  },
+
+  _updatePosition: function () {
+    var e = {originalEvent: this._lastEvent};
+    this.fire('drag', e);
+  },
+
+  _onDown: function (e) {
+    var first = e.touches ? e.touches[0] : e;
+    this._startPoint = new L.Point(first.clientX, first.clientY);
+    if (this._canvas && !this._path._containsPoint(this._path._map.mouseEventToLayerPoint(first))) { return; }
+    L.Draggable.prototype._onDown.call(this, e);
+  }
+
+});
+
+
+L.Handler.PathDrag = L.Handler.extend({
+
+  initialize: function (path) {
+    this._path = path;
+  },
+
+  getEvents: function () {
+    return {
+      dragstart: this._onDragStart,
+      drag: this._onDrag,
+      dragend: this._onDragEnd
+    };
+  },
+
+  addHooks: function () {
+    if (!this._draggable) { this._draggable = new L.PathDraggable(this._path); }
+    this._draggable.on(this.getEvents(), this).enable();
+    L.DomUtil.addClass(this._draggable._element, 'leaflet-path-draggable');
+  },
+
+  removeHooks: function () {
+    this._draggable.off(this.getEvents(), this).disable();
+    L.DomUtil.removeClass(this._draggable._element, 'leaflet-path-draggable');
+  },
+
+  moved: function () {
+    return this._draggable && this._draggable._moved;
+  },
+
+  _onDragStart: function () {
+    this._startPoint = this._draggable._startPoint;
+    this._path
+        .closePopup()
+        .fire('movestart')
+        .fire('dragstart');
+  },
+
+  _onDrag: function (e) {
+    var path = this._path,
+        event = (e.originalEvent.touches && e.originalEvent.touches.length === 1 ? e.originalEvent.touches[0] : e.originalEvent),
+        newPoint = L.point(event.clientX, event.clientY),
+        latlng = path._map.layerPointToLatLng(newPoint);
+
+    this._offset = newPoint.subtract(this._startPoint);
+    this._startPoint = newPoint;
+
+    this._path.eachLatLng(this.updateLatLng, this);
+    path.redraw();
+
+    e.latlng = latlng;
+    e.offset = this._offset;
+    path.fire('move', e)
+        .fire('drag', e);
+  },
+
+  _onDragEnd: function (e) {
+    if (this._path._bounds) this.resetBounds();
+    this._path.fire('moveend')
+        .fire('dragend', e);
+  },
+
+  latLngToLayerPoint: function (latlng) {
+    // Same as map.latLngToLayerPoint, but without the round().
+    var projectedPoint = this._path._map.project(L.latLng(latlng));
+    return projectedPoint._subtract(this._path._map.getPixelOrigin());
+  },
+
+  updateLatLng: function (latlng) {
+    var oldPoint = this.latLngToLayerPoint(latlng);
+    oldPoint._add(this._offset);
+    var newLatLng = this._path._map.layerPointToLatLng(oldPoint);
+    latlng.lat = newLatLng.lat;
+    latlng.lng = newLatLng.lng;
+  },
+
+  resetBounds: function () {
+    this._path._bounds = new L.LatLngBounds();
+    this._path.eachLatLng(function (latlng) {
+      this._bounds.extend(latlng);
+    });
+  }
+
+});
+
+L.Path.include({
+
+  eachLatLng: function (callback, context) {
+    context = context || this;
+    var loop = function (latlngs) {
+      for (var i = 0; i < latlngs.length; i++) {
+        if (L.Util.isArray(latlngs[i])) loop(latlngs[i]);
+        else callback.call(context, latlngs[i]);
+      }
+    };
+    loop(this.getLatLngs ? this.getLatLngs() : [this.getLatLng()]);
+  }
+
+});
+
+L.Path.addInitHook(function () {
+
+  this.dragging = new L.Handler.PathDrag(this);
+  if (this.options.draggable) {
+    this.once('add', function () {
+      this.dragging.enable();
+    });
+  }
+
+});

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: blacklight-spotlight
 version: !ruby/object:Gem::Version
-  version: 0.33.3
+  version: 0.34.0
 platform: ruby
 authors:
 - Chris Beer
@@ -11,7 +11,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2017-02-08 00:00:00.000000000 Z
+date: 2017-02-10 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -1433,12 +1433,13 @@ files:
 - spec/views/spotlight/sites/edit_exhibits.html.erb_spec.rb
 - spec/views/spotlight/tags/index.html.erb_spec.rb
 - vendor/assets/images/sir-trevor-icons.svg
+- vendor/assets/javascripts/Leaflet.Editable.js
+- vendor/assets/javascripts/Path.Drag.js
 - vendor/assets/javascripts/bootstrap-tagsinput.js
 - vendor/assets/javascripts/eventable.js
 - vendor/assets/javascripts/handlebars-v1.3.0.js
 - vendor/assets/javascripts/jquery.serializejson.js
 - vendor/assets/javascripts/jquery.waitforimages.min.js
-- vendor/assets/javascripts/leaflet-areaselect.js
 - vendor/assets/javascripts/leaflet-iiif.js
 - vendor/assets/javascripts/leaflet.js
 - vendor/assets/javascripts/nestable.js

data/vendor/assets/javascripts/leaflet-areaselect.js

@@ -1,184 +0,0 @@
-L.AreaSelect = L.Class.extend({
-    includes: L.Mixin.Events,
-
-    options: {
-        width: 200,
-        height: 300,
-        keepAspectRatio: false,
-    },
-
-    initialize: function(options) {
-        L.Util.setOptions(this, options);
-
-        this._width = this.options.width;
-        this._height = this.options.height;
-    },
-
-    addTo: function(map) {
-        this.map = map;
-        this._createElements();
-        this._render();
-        return this;
-    },
-
-    getBounds: function() {
-        var size = this.map.getSize();
-        var topRight = new L.Point();
-        var bottomLeft = new L.Point();
-
-        bottomLeft.x = Math.round((size.x - this._width) / 2);
-        topRight.y = Math.round((size.y - this._height) / 2);
-        topRight.x = size.x - bottomLeft.x;
-        bottomLeft.y = size.y - topRight.y;
-
-        var sw = this.map.containerPointToLatLng(bottomLeft);
-        var ne = this.map.containerPointToLatLng(topRight);
-
-        return new L.LatLngBounds(sw, ne);
-    },
-
-    remove: function() {
-        this.map.off("moveend", this._onMapChange);
-        this.map.off("zoomend", this._onMapChange);
-        this.map.off("resize", this._onMapResize);
-
-        this._container.parentNode.removeChild(this._container);
-    },
-
-
-    setDimensions: function(dimensions) {
-        if (!dimensions)
-            return;
-
-        this._height = parseInt(dimensions.height) || this._height;
-        this._width = parseInt(dimensions.width) || this._width;
-        this._render();
-        this.fire("change");
-    },
-
-
-    _createElements: function() {
-        if (!!this._container)
-            return;
-
-        this._container = L.DomUtil.create("div", "leaflet-areaselect-container", this.map._controlContainer)
-        this._topShade = L.DomUtil.create("div", "leaflet-areaselect-shade leaflet-control", this._container);
-        this._bottomShade = L.DomUtil.create("div", "leaflet-areaselect-shade leaflet-control", this._container);
-        this._leftShade = L.DomUtil.create("div", "leaflet-areaselect-shade leaflet-control", this._container);
-        this._rightShade = L.DomUtil.create("div", "leaflet-areaselect-shade leaflet-control", this._container);
-
-        this._nwHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
-        this._swHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
-        this._neHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
-        this._seHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
-
-        this._setUpHandlerEvents(this._nwHandle);
-        this._setUpHandlerEvents(this._neHandle, -1, 1);
-        this._setUpHandlerEvents(this._swHandle, 1, -1);
-        this._setUpHandlerEvents(this._seHandle, -1, -1);
-
-        this.map.on("moveend", this._onMapChange, this);
-        this.map.on("zoomend", this._onMapChange, this);
-        this.map.on("resize", this._onMapResize, this);
-
-        this.fire("change");
-    },
-
-    _setUpHandlerEvents: function(handle, xMod, yMod) {
-        xMod = xMod || 1;
-        yMod = yMod || 1;
-
-        var self = this;
-        function onMouseDown(event) {
-            event.stopPropagation();
-            self.map.dragging.disable();
-            L.DomEvent.removeListener(this, "mousedown", onMouseDown);
-            var curX = event.pageX;
-            var curY = event.pageY;
-            var ratio = self._width / self._height;
-            var size = self.map.getSize();
-
-            function onMouseMove(event) {
-                if (self.options.keepAspectRatio) {
-                    var maxHeight = (self._height >= self._width ? size.y : (size.x / ratio) ) - 30;
-                    self._height += (curY - event.originalEvent.pageY) * 2 * yMod;
-                    self._height = Math.max(30, self._height);
-                    self._height = Math.min(maxHeight, self._height);
-                    self._width = self._height * ratio;
-                } else {
-                    self._width += (curX - event.originalEvent.pageX) * 2 * xMod;
-                    self._height += (curY - event.originalEvent.pageY) * 2 * yMod;
-                    self._width = Math.max(30, self._width);
-                    self._height = Math.max(30, self._height);
-                    self._width = Math.min(size.x-30, self._width);
-                    self._height = Math.min(size.y-30, self._height);
-
-                }
-
-                curX = event.originalEvent.pageX;
-                curY = event.originalEvent.pageY;
-                self._render();
-            }
-            function onMouseUp(event) {
-                self.map.dragging.enable();
-                L.DomEvent.removeListener(self.map, "mouseup", onMouseUp);
-                L.DomEvent.removeListener(self.map, "mousemove", onMouseMove);
-                L.DomEvent.addListener(handle, "mousedown", onMouseDown);
-                self.fire("change");
-            }
-
-            L.DomEvent.addListener(self.map, "mousemove", onMouseMove);
-            L.DomEvent.addListener(self.map, "mouseup", onMouseUp);
-        }
-        L.DomEvent.addListener(handle, "mousedown", onMouseDown);
-    },
-
-    _onMapResize: function() {
-        this._render();
-    },
-
-    _onMapChange: function() {
-        this.fire("change");
-    },
-
-    _render: function() {
-        var size = this.map.getSize();
-        var handleOffset = Math.round(this._nwHandle.offsetWidth/2);
-
-        var topBottomHeight = Math.round((size.y-this._height)/2);
-        var leftRightWidth = Math.round((size.x-this._width)/2);
-
-        function setDimensions(element, dimension) {
-            element.style.width = dimension.width + "px";
-            element.style.height = dimension.height + "px";
-            element.style.top = dimension.top + "px";
-            element.style.left = dimension.left + "px";
-            element.style.bottom = dimension.bottom + "px";
-            element.style.right = dimension.right + "px";
-        }
-
-        setDimensions(this._topShade, {width:size.x, height:topBottomHeight, top:0, left:0});
-        setDimensions(this._bottomShade, {width:size.x, height:topBottomHeight, bottom:0, left:0});
-        setDimensions(this._leftShade, {
-            width: leftRightWidth,
-            height: size.y-(topBottomHeight*2),
-            top: topBottomHeight,
-            left: 0
-        });
-        setDimensions(this._rightShade, {
-            width: leftRightWidth,
-            height: size.y-(topBottomHeight*2),
-            top: topBottomHeight,
-            right: 0
-        });
-
-        setDimensions(this._nwHandle, {left:leftRightWidth-handleOffset, top:topBottomHeight-7});
-        setDimensions(this._neHandle, {right:leftRightWidth-handleOffset, top:topBottomHeight-7});
-        setDimensions(this._swHandle, {left:leftRightWidth-handleOffset, bottom:topBottomHeight-7});
-        setDimensions(this._seHandle, {right:leftRightWidth-handleOffset, bottom:topBottomHeight-7});
-    }
-});
-
-L.areaSelect = function(options) {
-    return new L.AreaSelect(options);
-}