diff --git a/build/build.bat b/build/build.bat index 04e927e0..3ca5fb0d 100644 --- a/build/build.bat +++ b/build/build.bat @@ -8,6 +8,9 @@ java -jar compiler.jar ^ --js ../src/dom/DomEvent.js ^ --js ../src/dom/DomUtil.js ^ --js ../src/dom/Draggable.js ^ +--js ../src/dom/transition/Transition.js ^ +--js ../src/dom/transition/Transition.Native.js ^ +--js ../src/dom/transition/Transition.Timer.js ^ --js ../src/geo/LatLng.js ^ --js ../src/geo/LatLngBounds.js ^ --js ../src/geo/Projection.js ^ diff --git a/dist/leaflet.js b/dist/leaflet.js index 2452b948..64db1bb7 100644 --- a/dist/leaflet.js +++ b/dist/leaflet.js @@ -7,7 +7,7 @@ var L={VERSION:"0.0.2",ROOT_URL:function(){for(var a=document.getElementsByTagNa b);a.apply(c,g)}}},deferExecByInterval:function(a,b,c){function d(){f=false;a.apply(c,e)}var e,f;return function(){e=arguments;if(!f){f=true;setTimeout(d,b)}}},falseFn:function(){return false},formatNum:function(a,b){var c=Math.pow(10,b);return Math.round(a*c)/c}};L.Class=function(){}; L.Class.extend=function(a){function b(){!L.Class._prototyping&&this.initialize&&this.initialize.apply(this,arguments)}L.Class._prototyping=true;var c=new this;L.Class._prototyping=false;c.constructor=b;b.prototype=c;c.superclass=this.prototype;if(a.statics){L.Util.extend(b,a.statics);delete a.statics}if(a.includes){L.Util.extend.apply(null,[c].concat(a.includes));delete a.includes}if(a.options&&c.options)a.options=L.Util.extend(c.options,a.options);L.Util.extend(c,a);b.extend=arguments.callee;b.include= function(e){L.Util.extend(this.prototype,e)};for(var d in this)if(this.hasOwnProperty(d)&&d!="prototype")b[d]=this[d];return b};L.Mixin={}; -L.Mixin.Events={addEventListener:function(a,b,c){var d=this._leaflet_events=this._leaflet_events||{};d[a]=d[a]||[];d[a].push({action:b,context:c});return this},hasEventListeners:function(a){return"_leaflet_events"in this&&a in this._leaflet_events&&this._leaflet_events[a].length>0},removeEventListener:function(a,b,c){if(!this.hasEventListeners(a))return this;for(var d=0,e=this._leaflet_events,f=e[a].length;d0},removeEventListener:function(a,b,c){if(!this.hasEventListeners(a))return this;for(var d=0,e=this._leaflet_events,f=e[a].length;d1)){if(a.touches&&a.touches.length==1)a=a.touches[0];this._dragStartPos=L.DomUtil.getPosition(this._element);this._startX=a.clientX;this._startY=a.clientY;this._disableTextSelection();this._setMovingCursor();L.DomEvent.addListener(document,L.Draggable.MOVE,this._onMove,this);L.DomEvent.addListener(document, L.Draggable.END,this._onUp,this)}}},_onMove:function(a){L.DomEvent.preventDefault(a);if(!(a.touches&&a.touches.length>1)){if(a.touches&&a.touches.length==1)a=a.touches[0];this._newPos=this._dragStartPos.add(new L.Point(a.clientX-this._startX,a.clientY-this._startY));this._updatePosition();if(!this._moved){this.fire("dragstart");this._moved=true}this.fire("drag")}},_updatePosition:function(){L.DomUtil.setPosition(this._element,this._newPos)},_onUp:function(){this._enableTextSelection();this._restoreCursor(); L.DomEvent.removeListener(document,L.Draggable.MOVE,this._onMove);L.DomEvent.removeListener(document,L.Draggable.END,this._onUp);if(this._moved){this.fire("dragend");this._moved=false}},_setMovingCursor:function(){this._bodyCursor=document.body.style.cursor;document.body.style.cursor="move"},_restoreCursor:function(){document.body.style.cursor=this._bodyCursor},_disableTextSelection:function(){document.selection&&document.selection.empty&&document.selection.empty();if(!this._onselectstart){this._onselectstart= -document.onselectstart;document.onselectstart=L.Util.falseFn}},_enableTextSelection:function(){document.onselectstart=this._onselectstart;this._onselectstart=null}});L.LatLng=L.Class.extend({statics:{DEG_TO_RAD:Math.PI/180,RAD_TO_DEG:180/Math.PI,MAX_MARGIN:1.0E-9},initialize:function(a,b,c){if(c!==true){a=Math.max(Math.min(a,90),-90);b=(b+180)%360+(b<-180?180:-180)}this.lat=a;this.lng=b},equals:function(a){if(!(a instanceof L.LatLng))return false;return Math.max(Math.abs(this.lat-a.lat),Math.abs(this.lng-a.lng))<=L.LatLng.MAX_MARGIN},toString:function(){return"LatLng( "+L.Util.formatNum(this.lat,5)+", "+L.Util.formatNum(this.lng,5)+" )"}});L.LatLngBounds=L.Class.extend({initialize:function(a,b){for(var c=a instanceof Array?a:[a,b],d=0,e=c.length;d= -b.lat&&a.lat<=c.lat&&d.lng>=b.lng&&a.lng<=c.lng}});L.Projection={};L.Projection.Mercator={MAX_LATITUDE:function(){var a=Math.exp(2*Math.PI);return Math.asin((a-1)/(a+1))*L.LatLng.RAD_TO_DEG}(),project:function(a){var b=L.LatLng.DEG_TO_RAD,c=L.Projection.Mercator.MAX_LATITUDE,d=a.lng*b;a=Math.max(Math.min(c,a.lat),-c)*b;a=Math.log(Math.tan(Math.PI/4+a/2));return new L.Point(d,a)},unproject:function(a,b){var c=L.LatLng.DEG_TO_RAD,d=a.x/c;return new L.LatLng((2*Math.atan(Math.exp(a.y))-Math.PI/2)/c,d,b)}};L.Point=function(a,b,c){this.x=c?Math.round(a):a;this.y=c?Math.round(b):b}; +b.lat&&a.lat<=c.lat&&d.lng>=b.lng&&a.lng<=c.lng}});L.Projection={};L.Projection.Mercator={MAX_LATITUDE:function(){var a=Math.exp(2*Math.PI);return Math.asin((a-1)/(a+1))*L.LatLng.RAD_TO_DEG}(),project:function(a){var b=L.LatLng.DEG_TO_RAD,c=L.Projection.Mercator.MAX_LATITUDE,d=a.lng*b;a=Math.max(Math.min(c,a.lat),-c)*b;a=Math.log(Math.tan(Math.PI/4+a/2));return new L.Point(d,a)},unproject:function(a,b){var c=L.LatLng.DEG_TO_RAD;return new L.LatLng((2*Math.atan(Math.exp(a.y))-Math.PI/2)/c,a.x/c,b)}};L.Point=function(a,b,c){this.x=c?Math.round(a):a;this.y=c?Math.round(b):b}; L.Point.prototype={add:function(a){return new L.Point(this.x+a.x,this.y+a.y)},subtract:function(a){return new L.Point(this.x-a.x,this.y-a.y)},divideBy:function(a,b){return new L.Point(this.x/a,this.y/a,b)},multiplyBy:function(a){return new L.Point(this.x*a,this.y*a)},distanceTo:function(a){var b=a.x-this.x;a=a.y-this.y;return Math.sqrt(b*b+a*a)},round:function(){return new L.Point(Math.round(this.x),Math.round(this.y))},toString:function(){return"Point( "+this.x+", "+this.y+" )"}};L.Bounds=L.Class.extend({initialize:function(a,b){for(var c=a instanceof Array?a:[a,b],d=0,e=c.length;d= this.min.x&&a.max.x<=this.max.x&&a.min.y>=this.min.y&&a.max.y<=this.max.y}});L.Transformation=L.Class.extend({initialize:function(a,b,c,d){this._a=a;this._b=b;this._c=c;this._d=d},transform:function(a,b){b=b||1;return new L.Point(b*(this._a*a.x+this._b),b*(this._c*a.y+this._d))},untransform:function(a,b){b=b||1;return new L.Point((a.x/b-this._b)/this._a,(a.y/b-this._d)/this._c)}});L.TileLayer=L.Class.extend({includes:L.Mixin.Events,options:{tileSize:256,minZoom:0,maxZoom:18,subdomains:"abc",copyright:"",unloadInvisibleTiles:L.Browser.mobileWebkit,updateWhenIdle:L.Browser.mobileWebkit,errorTileUrl:""},initialize:function(a,b){L.Util.extend(this.options,b);this._url=a;if(typeof this.options.subdomains=="string")this.options.subdomains=this.options.subdomains.split("")},onAdd:function(a){this._map=a;this._container=document.createElement("div");this._container.className="leaflet-layer"; a.getPanes().tilePane.appendChild(this._container);this._tileImg=document.createElement("img");this._tileImg.className="leaflet-tile";this._tileImg.galleryimg="no";var b=this.options.tileSize;this._tileImg.style.width=b+"px";this._tileImg.style.height=b+"px";a.on("viewreset",this._reset,this);if(this.options.updateWhenIdle)a.on("moveend",this._update,this);else{this._limitedUpdate=L.Util.limitExecByInterval(this._update,100,this);a.on("move",this._limitedUpdate,this)}this._reset();this._update()}, @@ -30,16 +35,16 @@ this._enabled=true}},disable:function(){if(this._enabled){this._draggable.disabl d=this._map.containerPointToLayerPoint(this._map.getSize().divideBy(2));this._startCenter=b.add(c).divideBy(2,true);this._startDist=b.distanceTo(c);this._startTransform=this._map._mapPane.style.webkitTransform;this._centerOffset=d.subtract(this._startCenter);L.DomEvent.addListener(document,"touchmove",this._onTouchMove,this);L.DomEvent.addListener(document,"touchend",this._onTouchEnd,this);L.DomEvent.preventDefault(a)}},_onTouchMove:function(a){if(!(!a.touches||a.touches.length!=2)){var b=this._map.mouseEventToLayerPoint(a.touches[0]), c=this._map.mouseEventToLayerPoint(a.touches[1]);this._scale=b.distanceTo(c)/this._startDist;this._delta=b.add(c).divideBy(2,true).subtract(this._startCenter);this._map._mapPane.style.webkitTransform=[this._startTransform,L.DomUtil.getTranslateString(this._delta),L.DomUtil.getTranslateString(this._startCenter),"scale("+this._scale+")",L.DomUtil.getTranslateString(this._startCenter.multiplyBy(-1))].join(" ");L.DomEvent.preventDefault(a)}},_onTouchEnd:function(a){if(!(!a.touches||a.touches.length>= 2||!this._scale)){a=this._map.getZoom()+Math.round(Math.log(this._scale)/Math.LN2);var b=this._centerOffset.subtract(this._delta).divideBy(this._scale);this._map.setView(this._map.unproject(this._map.getPixelOrigin().add(this._startCenter).add(b)),a,true);this._scale=null;L.DomEvent.removeListener(document,"touchmove",this._onTouchMove);L.DomEvent.removeListener(document,"touchend",this._onTouchEnd)}}});L.Handler.ScrollWheelZoom=L.Handler.extend({enable:function(){if(!this._enabled){L.DomEvent.addListener(this._map._container,"mousewheel",this._onWheelScroll,this);this._delta=0;this._enabled=true}},disable:function(){if(this._enabled){L.DomEvent.removeListener(this._map._container,"mousewheel",this._onWheelScroll);this._enabled=false}},_onWheelScroll:function(a){this._delta+=L.DomEvent.getWheelDelta(a);this._lastMousePos=this._map.mouseEventToContainerPoint(a);clearTimeout(this._timer);this._timer= -setTimeout(L.Util.bind(this._performZoom,this),50);L.DomEvent.preventDefault(a)},_performZoom:function(){var a=Math.round(this._delta);if(a){var b=this._getCenterForScrollWheelZoom(this._lastMousePos,a);a=this._map.getZoom()+a;this._map.setView(b,a);this._delta=0}},_getCenterForScrollWheelZoom:function(a,b){var c=this._map.getPixelBounds().getCenter(),d=this._map.getSize().divideBy(2);d=a.subtract(d).multiplyBy(1-Math.pow(2,-b));return this._map.unproject(c.add(d))}});L.Handler.DoubleClickZoom=L.Handler.extend({enable:function(){if(!this._enabled){this._map.on("dblclick",this._onDoubleClick,this._map);this._enabled=true}},disable:function(){if(this._enabled){this._map.off("dblclick",this._onDoubleClick,this._map);this._enabled=false}},_onDoubleClick:function(a){this.setView(a.position,this._zoom+1)}});L.Map=L.Class.extend({includes:L.Mixin.Events,options:{projection:L.Projection.Mercator,transformation:new L.Transformation(0.5/Math.PI,0.5,-0.5/Math.PI,0.5),scaling:function(a){return 256*(1<px) + UNIT_RE: /^[\d\.]+(\D*)$/ + }, + + options: { + fps: 50 + }, + + initialize: function(el, options) { + this._el = el; + L.Util.extend(this.options, options); + + var easings = L.Transition.EASINGS[this.options.easing]; + this._p1 = new L.Point(0, 0); + this._p2 = new L.Point(easings[0], easings[1]); + this._p3 = new L.Point(easings[2], easings[3]); + this._p4 = new L.Point(1, 1); + + this._step = L.Util.bind(this._step, this); + this._interval = Math.round(1000 / this.options.fps); + }, + + run: function(props) { + this._props = {}; + + var getters = L.Transition.CUSTOM_PROPS_GETTERS, + re = L.Transition.UNIT_RE; + + this.fire('start'); + + for (var prop in props) { + if (props.hasOwnProperty(prop)) { + var p = {}; + if (prop in getters) { + p.from = getters[prop](this._el); + } else { + var matches = this._el.style[prop].match(re); + p.from = parseFloat(matches[0]); + p.unit = matches[1]; + } + p.to = props[prop]; + this._props[prop] = p; + } + } + + clearInterval(this._timer); + this._timer = setInterval(this._step, this._interval); + this._startTime = L.Transition.getTime(); + }, + + _step: function() { + var time = L.Transition.getTime(), + elapsed = time - this._startTime, + duration = this.options.duration * 1000; + if (elapsed < duration) { + var percentComplete = this._cubicBezier(elapsed / duration); + this._runFrame(percentComplete); + } else { + this._runFrame(1); + this._complete(); + } + }, + + _runFrame: function(percentComplete) { + var setters = L.Transition.CUSTOM_PROPS_SETTERS, + prop, p, value; + + for (prop in this._props) { + if (this._props.hasOwnProperty(prop)) { + p = this._props[prop]; + if (prop in setters) { + value = p.to.subtract(p.from).multiplyBy(percentComplete).add(p.from); + setters[prop](this._el, value); + } else { + this._el.style[prop] = + ((p.to - p.from) * percentComplete + p.from) + p.unit; + } + } + } + this.fire('step'); + }, + + _complete: function() { + clearInterval(this._timer); + this.fire('end'); + }, + + _cubicBezier: function(t) { + var a = Math.pow(1 - t, 3), + b = 3 * Math.pow(1 - t, 2) * t, + c = 3 * (1 - t) * Math.pow(t, 2), + d = Math.pow(t, 3), + p1 = this._p1.multiplyBy(a), + p2 = this._p2.multiplyBy(b), + p3 = this._p3.multiplyBy(c), + p4 = this._p4.multiplyBy(d); + + return p1.add(p2).add(p3).add(p4).y; + } +}); \ No newline at end of file diff --git a/src/dom/transition/Transition.js b/src/dom/transition/Transition.js new file mode 100644 index 00000000..1d36f263 --- /dev/null +++ b/src/dom/transition/Transition.js @@ -0,0 +1,24 @@ +L.Transition = L.Class.extend({ + includes: L.Mixin.Events, + + statics: { + CUSTOM_PROPS_SETTERS: { + position: L.DomUtil.setPosition + //TODO transform custom attr + } + }, + + options: { + easing: 'ease', + duration: 0.5 + }, + + _setProperty: function(prop, value) { + var setters = L.Transition.CUSTOM_PROPS_SETTERS; + if (prop in setters) { + setters[prop](this._el, value); + } else { + this._el.style[prop] = value; + } + } +}); \ No newline at end of file