-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
gabesnider
authored and
gabesnider
committed
Oct 27, 2016
1 parent
13079fb
commit 544ec13
Showing
13 changed files
with
741 additions
and
65 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| Copyright (c) 2015 Daniel Montague | ||
|
|
||
|
|
||
| Permission is hereby granted, free of charge, to any person obtaining a copy | ||
| of this software and associated documentation files (the "Software"), to deal | ||
| in the Software without restriction, including without limitation the rights | ||
| to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
| copies of the Software, and to permit persons to whom the Software is | ||
| furnished to do so, subject to the following conditions: | ||
|
|
||
|
|
||
| The above copyright notice and this permission notice shall be included in | ||
| all copies or substantial portions of the Software. | ||
|
|
||
|
|
||
| THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
| IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
| FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
| AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
| LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
| OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN | ||
| THE SOFTWARE. | ||
|
|
||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,235 @@ | ||
| /* | ||
| * Leaflet.Sleep | ||
| */ | ||
|
|
||
| /* | ||
| * Default Button (touch devices only) | ||
| */ | ||
|
|
||
| L.Control.SleepMapControl = L.Control.extend({ | ||
|
|
||
| initialize: function(opts){ | ||
| L.setOptions(this,opts); | ||
| }, | ||
|
|
||
| options: { | ||
| position: 'topright', | ||
| prompt: 'disable map', | ||
| styles: { | ||
| 'backgroundColor': 'white', | ||
| 'padding': '5px', | ||
| 'border': '2px solid gray' | ||
| } | ||
| }, | ||
|
|
||
| buildContainer: function(){ | ||
| var self = this; | ||
| var container = L.DomUtil.create('p', 'sleep-button'); | ||
| var boundEvent = this._nonBoundEvent.bind(this); | ||
| container.appendChild( document.createTextNode( this.options.prompt )); | ||
| L.DomEvent.addListener(container, 'click', boundEvent); | ||
| L.DomEvent.addListener(container, 'touchstart', boundEvent); | ||
|
|
||
| Object.keys(this.options.styles).map(function(key) { | ||
| container.style[key] = self.options.styles[key]; | ||
| }); | ||
|
|
||
| return (this._container = container); | ||
| }, | ||
|
|
||
| onAdd: function () { | ||
| return this._container || this.buildContainer(); | ||
| }, | ||
|
|
||
| _nonBoundEvent: function(e) { | ||
| L.DomEvent.stop(e); | ||
| if (this._map) this._map.sleep._sleepMap(); | ||
| return false; | ||
| } | ||
|
|
||
| }); | ||
|
|
||
| L.Control.sleepMapControl = function(){ | ||
| return new L.Control.SleepMapControl(); | ||
| }; | ||
|
|
||
|
|
||
| /* | ||
| * The Sleep Handler | ||
| */ | ||
|
|
||
| L.Map.mergeOptions({ | ||
| sleep: true, | ||
| sleepTime: 750, | ||
| wakeTime: 750, | ||
| wakeMessageTouch: 'Touch to Wake', | ||
| sleepNote: true, | ||
| hoverToWake: true, | ||
| sleepOpacity:.7, | ||
| sleepButton: L.Control.sleepMapControl | ||
| }); | ||
|
|
||
| L.Map.Sleep = L.Handler.extend({ | ||
|
|
||
| addHooks: function () { | ||
| var self = this; | ||
| this.sleepNote = L.DomUtil.create('p', 'sleep-note', this._map._container); | ||
| this._enterTimeout = null; | ||
| this._exitTimeout = null; | ||
|
|
||
| /* | ||
| * If the device has only a touchscreen we will never get | ||
| * a mouseout event, so we add an extra button to put the map | ||
| * back to sleep manually. | ||
| * | ||
| * a custom control/button can be provided by the user | ||
| * with the map's `sleepButton` option | ||
| */ | ||
| this._sleepButton = this._map.options.sleepButton(); | ||
|
|
||
| if (this._map.tap) { | ||
| this._map.addControl(this._sleepButton); | ||
| } | ||
|
|
||
| var mapStyle = this._map._container.style; | ||
| mapStyle.WebkitTransition += 'opacity .5s'; | ||
| mapStyle.MozTransition += 'opacity .5s'; | ||
|
|
||
| this._setSleepNoteStyle(); | ||
| this._sleepMap(); | ||
| }, | ||
|
|
||
| removeHooks: function () { | ||
| if (!this._map.scrollWheelZoom.enabled()){ | ||
| this._map.scrollWheelZoom.enable(); | ||
| } | ||
| L.DomUtil.setOpacity( this._map._container, 1); | ||
| L.DomUtil.setOpacity( this.sleepNote, 0); | ||
| this._removeSleepingListeners(); | ||
| this._removeAwakeListeners(); | ||
| }, | ||
|
|
||
| _setSleepNoteStyle: function() { | ||
| var noteString = ''; | ||
| var style = this.sleepNote.style; | ||
|
|
||
| if(this._map.tap) { | ||
| noteString = this._map.options.wakeMessageTouch; | ||
| } else if (this._map.options.wakeMessage) { | ||
| noteString = this._map.options.wakeMessage; | ||
| } else if (this._map.options.hoverToWake) { | ||
| noteString = 'click or hover to wake'; | ||
| } else { | ||
| noteString = 'click to wake'; | ||
| } | ||
|
|
||
| if( this._map.options.sleepNote ){ | ||
| this.sleepNote.appendChild(document.createTextNode( noteString )); | ||
| style.pointerEvents = 'none'; | ||
| style.maxWidth = '150px'; | ||
| style.transitionDuration = '.2s'; | ||
| style.zIndex = 5000; | ||
| style.opacity = '.6'; | ||
| style.margin = 'auto'; | ||
| style.textAlign = 'center'; | ||
| style.borderRadius = '4px'; | ||
| style.top = '50%'; | ||
| style.position = 'relative'; | ||
| style.padding = '5px'; | ||
| style.border = 'solid 2px black'; | ||
| style.background = 'white'; | ||
|
|
||
| if(this._map.options.sleepNoteStyle) { | ||
| var noteStyleOverrides = this._map.options.sleepNoteStyle; | ||
| Object.keys(noteStyleOverrides).map(function(key) { | ||
| style[key] = noteStyleOverrides[key]; | ||
| }); | ||
| } | ||
| } | ||
| }, | ||
|
|
||
| _wakeMap: function (e) { | ||
| this._stopWaiting(); | ||
| this._map.scrollWheelZoom.enable(); | ||
| if (this._map.tap) { | ||
| this._map.touchZoom.enable(); | ||
| this._map.dragging.enable(); | ||
| this._map.tap.enable(); | ||
| this._map.addControl(this._sleepButton); | ||
| } | ||
| L.DomUtil.setOpacity( this._map._container, 1); | ||
| this.sleepNote.style.opacity = 0; | ||
| this._addAwakeListeners(); | ||
| }, | ||
|
|
||
| _sleepMap: function () { | ||
| this._stopWaiting(); | ||
| this._map.scrollWheelZoom.disable(); | ||
|
|
||
| if (this._map.tap) { | ||
| this._map.touchZoom.disable(); | ||
| this._map.dragging.disable(); | ||
| this._map.tap.disable(); | ||
| this._map.removeControl(this._sleepButton); | ||
| } | ||
|
|
||
| L.DomUtil.setOpacity( this._map._container, this._map.options.sleepOpacity); | ||
| this.sleepNote.style.opacity = .4; | ||
| this._addSleepingListeners(); | ||
| }, | ||
|
|
||
| _wakePending: function () { | ||
| this._map.once('mousedown', this._wakeMap, this); | ||
| if (this._map.options.hoverToWake){ | ||
| var self = this; | ||
| this._map.once('mouseout', this._sleepMap, this); | ||
| self._enterTimeout = setTimeout(function(){ | ||
| self._map.off('mouseout', self._sleepMap, self); | ||
| self._wakeMap(); | ||
| } , self._map.options.wakeTime); | ||
| } | ||
| }, | ||
|
|
||
| _sleepPending: function () { | ||
| var self = this; | ||
| self._map.once('mouseover', self._wakeMap, self); | ||
| self._exitTimeout = setTimeout(function(){ | ||
| self._map.off('mouseover', self._wakeMap, self); | ||
| self._sleepMap(); | ||
| } , self._map.options.sleepTime); | ||
| }, | ||
|
|
||
| _addSleepingListeners: function(){ | ||
| this._map.once('mouseover', this._wakePending, this); | ||
| this._map.tap && | ||
| this._map.once('click', this._wakeMap, this); | ||
| }, | ||
|
|
||
| _addAwakeListeners: function(){ | ||
| this._map.once('mouseout', this._sleepPending, this); | ||
| }, | ||
|
|
||
| _removeSleepingListeners: function(){ | ||
| this._map.options.hoverToWake && | ||
| this._map.off('mouseover', this._wakePending, this); | ||
| this._map.off('mousedown', this._wakeMap, this); | ||
| this._map.tap && | ||
| this._map.off('click', this._wakeMap, this); | ||
| }, | ||
|
|
||
| _removeAwakeListeners: function(){ | ||
| this._map.off('mouseout', this._sleepPending, this); | ||
| }, | ||
|
|
||
| _stopWaiting: function () { | ||
| this._removeSleepingListeners(); | ||
| this._removeAwakeListeners(); | ||
| var self = this; | ||
| if(this._enterTimeout) clearTimeout(self._enterTimeout); | ||
| if(this._exitTimeout) clearTimeout(self._exitTimeout); | ||
| this._enterTimeout = null; | ||
| this._exitTimeout = null; | ||
| } | ||
| }); | ||
|
|
||
| L.Map.addInitHook('addHandler', 'sleep', L.Map.Sleep); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,57 @@ | ||
| # Leaflet.Sleep | ||
|
|
||
| Leaflet's stock maps are event-greedy and interfere with scrolling. | ||
|
|
||
| `Leaflet.Sleep` is an interaction manager, helping your | ||
| map do what you want when you want. | ||
|
|
||
| ### [demo](http://cliffcloud.github.io/Leaflet.Sleep) | ||
|
|
||
| ## Use | ||
|
|
||
| Available on [npm](#npm), [bower](#bower), and straight from the single | ||
| [source](https://github.com/CliffCloud/Leaflet.Sleep/blob/master/Leaflet.Sleep.js) | ||
| file | ||
|
|
||
| `Leaflet.Sleep` is enabled by default, and can be disabled with the map's `sleep` | ||
| option. | ||
|
|
||
| ### npm | ||
|
|
||
| [`npm install leaflet-sleep`](https://www.npmjs.com/package/leaflet-sleep) | ||
|
|
||
| ### bower | ||
|
|
||
| `bower install leaflet-sleep` | ||
|
|
||
| ## Config | ||
|
|
||
| These are the new options available for `L.map` and their defaults. | ||
|
|
||
| { | ||
| // false if you want an unruly map | ||
| sleep: true, | ||
|
|
||
| // time(ms) until map sleeps on mouseout | ||
| sleepTime: 750, | ||
|
|
||
| // time(ms) until map wakes on mouseover | ||
| wakeTime: 750, | ||
|
|
||
| // should the user receive wake instrurctions? | ||
| sleepNote: true, | ||
|
|
||
| // should hovering wake the map? (non-touch devices only) | ||
| hoverToWake: true, | ||
|
|
||
| // a message to inform users about waking the map | ||
| wakeMessage: 'Click or Hover to Wake', | ||
|
|
||
| // a constructor for a control button | ||
| sleepButton: L.Control.sleepMapControl, | ||
|
|
||
| // opacity for the sleeping map | ||
| sleepOpacity: .7 | ||
| } | ||
|
|
||
| ## MIT Licensed |
Oops, something went wrong.