diff --git a/CHANGELOG.md b/CHANGELOG.md index e68b08a3..2de34c34 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,11 @@ + +## [1.0.4](https://github.com/hiloteam/hilo/compare/v1.0.3...v1.0.4) (2017-04-28) + + +### Bug Fixes + +* Tween Ease.Back bug ([1ecd93c](https://github.com/hiloteam/hilo/commit/1ecd93c)) + ## [1.0.3](https://github.com/hiloteam/hilo/compare/v1.0.2...v1.0.3) (2017-04-26) @@ -15,6 +23,7 @@ ### Features +* loadQueue add support for webp (#76)([6b00c62](https://github.com/hiloteam/hilo/commit/6b00c62)) * add typescript definitions ([#83](https://github.com/hiloteam/hilo/issues/83)) ([cd3f4d6](https://github.com/hiloteam/hilo/commit/cd3f4d6)) * graphics.drawSVGPath supports all attributes except Arcs, close [#85](https://github.com/hiloteam/hilo/issues/85) ([2002f04](https://github.com/hiloteam/hilo/commit/2002f04)), closes [#85](https://github.com/hiloteam/hilo/issues/85) diff --git a/build/amd/hilo-amd.js b/build/amd/hilo-amd.js index 2916ba25..51b44ef7 100644 --- a/build/amd/hilo-amd.js +++ b/build/amd/hilo-amd.js @@ -1,5 +1,5 @@ /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -24,7 +24,7 @@ return { * Hilo version * @type String */ - version:'1.0.2', + version:'1.0.4', /** * @language=en * Gets a globally unique id. Such as Stage1, Bitmap2 etc. @@ -376,7 +376,7 @@ return Hilo; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -559,7 +559,7 @@ return Class; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -739,7 +739,7 @@ return Matrix; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -892,7 +892,7 @@ return EventMixin; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -970,7 +970,7 @@ return Drawable; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -1063,7 +1063,7 @@ return Renderer; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -1302,7 +1302,7 @@ return CanvasRenderer; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -1484,7 +1484,7 @@ return DOMRenderer; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -2052,7 +2052,7 @@ return WebGLRenderer; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -2477,7 +2477,7 @@ return View; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -2503,7 +2503,7 @@ var CacheMixin = /** @lends CacheMixin# */ { * @param {Boolean} forceUpdate is force update cache. */ cache: function(forceUpdate){ - if(forceUpdate || this._cacheDirty || !this._cacheImage){ + if(forceUpdate || this._cacheDirty || !this.drawable){ this.updateCache(); } }, @@ -2522,10 +2522,10 @@ var CacheMixin = /** @lends CacheMixin# */ { _cacheCanvas.width = this.width; _cacheCanvas.height = this.height; this._draw(_cacheContext); - this._cacheImage = new Image(); - this._cacheImage.src = _cacheCanvas.toDataURL(); this.drawable = this.drawable||new Drawable(); - this.drawable.init(this._cacheImage); + this.drawable.init({ + image:_cacheCanvas.toDataURL() + }); this._cacheDirty = false; } }, @@ -2543,7 +2543,7 @@ return CacheMixin; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -2917,7 +2917,7 @@ return Container; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -3182,7 +3182,7 @@ return Stage; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -3260,7 +3260,7 @@ return Bitmap; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -3531,7 +3531,7 @@ return Sprite; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -3632,7 +3632,7 @@ return DOMElement; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -3965,7 +3965,7 @@ return Class.create(/** @lends Graphics.prototype */{ /** * @language=en - * Draw a path from the SVG data given by parameters. + * Draw a path from the SVG data given by parameters. Not support Arcs. * Demo: *
var path = 'M250 150 L150 350 L350 350 Z';
*var shape = new Hilo.Graphics({width:500, height:500});
@@ -3975,30 +3975,137 @@ return Class.create(/** @lends Graphics.prototype */{ */ drawSVGPath: function(pathData){ var me = this, addAction = me._addAction, - path = pathData.split(/,| (?=[a-zA-Z])/); - + path = pathData.replace(/,/g, ' ').replace(/-/g, ' -').split(/(?=[a-zA-Z])/); addAction.call(me, ['beginPath']); + var currentPoint = {x:0, y:0}; + var lastControlPoint = {x:0, y:0}; + var lastCmd; for(var i = 0, len = path.length; i < len; i++){ - var str = path[i], cmd = str[0].toUpperCase(), p = str.substring(1).split(/,| /); - if(p[0].length == 0) p.shift(); + var str = path[i]; + if(!str.length){ + continue; + } + var realCmd = str[0]; + var cmd = realCmd.toUpperCase(); + var p = this._getSVGParams(str); + var useRelative = cmd !== realCmd; switch(cmd){ case 'M': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['moveTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; case 'L': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['lineTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; - case 'C': - addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + case 'H': + if(useRelative){ + p[0] += currentPoint.x; + } + addAction.call(me, ['lineTo', p[0], currentPoint.y]); + currentPoint.x = p[0]; + break; + case 'V': + if(useRelative){ + p[0] += currentPoint.y; + } + addAction.call(me, ['lineTo', currentPoint.x, p[0]]); + currentPoint.y = p[0]; break; case 'Z': addAction.call(me, ['closePath']); break; + case 'C': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + lastControlPoint.x = p[2]; + lastControlPoint.y = p[3]; + this._setCurrentPoint(currentPoint, p[4], p[5]); + break; + case 'S': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + if(lastCmd === 'C' || lastCmd === 'S'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['bezierCurveTo', controlPoint.x, controlPoint.y, p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'Q': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['quadraticCurveTo', p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'T': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + var controlPoint; + if(lastCmd === 'Q' || lastCmd === 'T'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['quadraticCurveTo', controlPoint.x, controlPoint.y, p[0], p[1]]); + lastControlPoint = controlPoint; + this._setCurrentPoint(currentPoint, p[0], p[1]); + break; } + lastCmd = cmd; + } return me; }, + _getSVGParams:function(str){ + var p = str.substring(1).replace(/[\s]+$|^[\s]+/g, '').split(/[\s]+/); + if(p[0].length == 0) { + p.shift(); + } + for(var i = 0, l = p.length;i < l;i ++){ + p[i] = parseFloat(p[i]); + } + return p; + }, + _convertToAbsolute:function(currentPoint, data){ + for(var i = 0, l = data.length;i < l;i ++){ + if(i%2 === 0){ + data[i] += currentPoint.x; + } + else{ + data[i] += currentPoint.y; + } + } + }, + _setCurrentPoint:function(currentPoint, x, y){ + currentPoint.x = x; + currentPoint.y = y; + }, + _getReflectionPoint:function(centerPoint, point){ + return { + x:centerPoint.x * 2 - point.x, + y:centerPoint.y * 2 - point.y + }; + }, /** * @language=en @@ -4078,7 +4185,7 @@ return Graphics; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4331,7 +4438,7 @@ return Text; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4515,7 +4622,7 @@ return BitmapText; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4693,7 +4800,7 @@ return Button; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4930,7 +5037,7 @@ return TextureAtlas; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4977,13 +5084,11 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ window[Hilo.browser.jsVendor + 'RequestAnimationFrame']; var runLoop; - if(useRAF && raf){ - var tick = function(){ - self._tick(); - }; + if(useRAF && raf && interval < 17){ + this._useRAF = true; runLoop = function(){ - self._intervalId = setTimeout(runLoop, interval); - raf(tick); + self._intervalId = raf(runLoop); + self._tick(); }; }else{ runLoop = function(){ @@ -4992,6 +5097,7 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ }; } + this._paused = false; runLoop(); }, @@ -5000,9 +5106,17 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ * Stop the ticker. */ stop: function(){ - clearTimeout(this._intervalId); + if(this._useRAF){ + var cancelRAF = window.cancelAnimationFrame || + window[Hilo.browser.jsVendor + 'CancelAnimationFrame']; + cancelRAF(this._intervalId); + } + else{ + clearTimeout(this._intervalId); + } this._intervalId = null; this._lastTime = 0; + this._paused = true; }, /** @@ -5148,7 +5262,7 @@ return Ticker; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5196,7 +5310,7 @@ if (!fnProto.bind) { }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5307,7 +5421,7 @@ return drag; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5394,7 +5508,7 @@ return Class.create(/** @lends Tween.prototype */{ }, target: null, - duration: 0, + duration: 1000, delay: 0, paused: false, loop: false, @@ -5546,11 +5660,15 @@ return Class.create(/** @lends Tween.prototype */{ //elapsed ratio var ratio = elapsed / me.duration, complete = false, callback; - ratio = ratio <= 0 ? 0 : ratio >= 1 ? 1 : me.ease ? me.ease(ratio) : ratio; + ratio = ratio <= 0 ? 0 : ratio >= 1 ? 1 : ratio; + var easeRatio = me.ease ? me.ease(ratio) : ratio; if(me.reverse){ //backward - if(me._reverseFlag < 0) ratio = 1 - ratio; + if(me._reverseFlag < 0) { + ratio = 1 - ratio; + easeRatio = 1 - easeRatio; + } //forward if(ratio < 1e-7){ //repeat complete or not loop @@ -5569,7 +5687,7 @@ return Class.create(/** @lends Tween.prototype */{ me.time = elapsed; //render & update callback - me._render(ratio); + me._render(easeRatio); (callback = me.onUpdate) && callback.call(me, ratio, me); //check if complete @@ -5696,6 +5814,7 @@ return Class.create(/** @lends Tween.prototype */{ * @returns {Tween|Array} An tween instance or an array of tween instance. */ fromTo: function(target, fromProps, toProps, params){ + params = params || {}; var isArray = target instanceof Array; target = isArray ? target : [target]; @@ -5744,7 +5863,7 @@ return Tween; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6016,7 +6135,7 @@ return Ease; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6064,7 +6183,7 @@ return ImageLoader; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6131,7 +6250,7 @@ return ScriptLoader; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6380,7 +6499,7 @@ return LoadQueue; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6583,7 +6702,7 @@ return HTMLAudio; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6900,7 +7019,7 @@ return WebAudio; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6998,7 +7117,7 @@ return WebSound; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7091,7 +7210,7 @@ return Camera; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7278,7 +7397,7 @@ return Camera3d; }); /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ diff --git a/build/amd/hilo-amd.min.js b/build/amd/hilo-amd.min.js index 8f30b36e..472a7eea 100644 --- a/build/amd/hilo-amd.min.js +++ b/build/amd/hilo-amd.min.js @@ -1,8 +1,8 @@ /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ -define("hilo/core/Hilo",function(){var t=function(){var e=window,i=document,r=i.documentElement,n=0;return{version:"1.0.2",getUid:function(t){var e=++n;if(t){var i=t.charCodeAt(t.length-1);return i>=48&&i<=57&&(t+="_"),t+e}return e},viewToString:function(t){for(var e,i=t;i;)e=e?i.id+"."+e:i.id,i=i.parent;return e},copy:function(t,e,i){for(var r in e)i&&!t.hasOwnProperty(r)&&void 0===t[r]||(t[r]=e[r]);return t},browser:function(){var t=navigator.userAgent,n={iphone:/iphone/i.test(t),ipad:/ipad/i.test(t),ipod:/ipod/i.test(t),ios:/iphone|ipad|ipod/i.test(t),android:/android/i.test(t),webkit:/webkit/i.test(t),chrome:/chrome/i.test(t),safari:/safari/i.test(t),firefox:/firefox/i.test(t),ie:/msie/i.test(t),opera:/opera/i.test(t),supportTouch:"ontouchstart"in e,supportCanvas:null!=i.createElement("canvas").getContext,supportStorage:!1,supportOrientation:"orientation"in e,supportDeviceMotion:"ondevicemotion"in e};try{var a="hilo";localStorage.setItem(a,a),localStorage.removeItem(a),n.supportStorage=!0}catch(o){}var s=n.jsVendor=n.webkit?"webkit":n.firefox?"webkit":n.opera?"o":n.ie?"ms":"",h=n.cssVendor="-"+s+"-",l=i.createElement("div"),c=l.style,u=void 0!=c[s+"Transform"],d=void 0!=c[s+"Perspective"];return d&&(l.id="test3d",c=i.createElement("style"),c.textContent="@media ("+h+"transform-3d){#test3d{height:3px}}",i.head.appendChild(c),r.appendChild(l),d=3==l.offsetHeight,i.head.removeChild(c),r.removeChild(l)),n.supportTransform=u,n.supportTransform3D=d,n}(),event:function(){var t="ontouchstart"in e;return{POINTER_START:t?"touchstart":"mousedown",POINTER_MOVE:t?"touchmove":"mousemove",POINTER_END:t?"touchend":"mouseup"}}(),align:{TOP_LEFT:"TL",TOP:"T",TOP_RIGHT:"TR",LEFT:"L",CENTER:"C",RIGHT:"R",BOTTOM_LEFT:"BL",BOTTOM:"B",BOTTOM_RIGHT:"BR"},getElementRect:function(t){var i;try{i=t.getBoundingClientRect()}catch(n){i={top:t.offsetTop,left:t.offsetLeft,right:t.offsetLeft+t.offsetWidth,bottom:t.offsetTop+t.offsetHeight}}var a=(e.pageXOffset||r.scrollLeft)-(r.clientLeft||0)||0,o=(e.pageYOffset||r.scrollTop)-(r.clientTop||0)||0,s=e.getComputedStyle?getComputedStyle(t):t.currentStyle,h=parseInt,l=h(s.paddingLeft)+h(s.borderLeftWidth)||0,c=h(s.paddingTop)+h(s.borderTopWidth)||0,u=h(s.paddingRight)+h(s.borderRightWidth)||0,d=h(s.paddingBottom)+h(s.borderBottomWidth)||0,f=i.top||0,p=i.left||0,v=i.right||0,m=i.bottom||0;return{left:p+a+l,top:f+o+c,width:v-u-p-l,height:m-d-f-c}},createElement:function(t,e){var r,n,a,o=i.createElement(t);for(r in e)if(n=e[r],"style"===r)for(a in n)o.style[a]=n[a];else o[r]=n;return o},getElement:function(t){return i.getElementById(t)},setElementStyleByView:function(e){var i=e.drawable,r=i.domElement.style,n=e._stateCache||(e._stateCache={}),a=t.browser.jsVendor,o="px",s=!1;if(this.cacheStateIfChanged(e,["visible"],n)&&(r.display=e.visible?"":"none"),this.cacheStateIfChanged(e,["alpha"],n)&&(r.opacity=e.alpha),e.visible&&!(e.alpha<=0)){this.cacheStateIfChanged(e,["width"],n)&&(r.width=e.width+o),this.cacheStateIfChanged(e,["height"],n)&&(r.height=e.height+o),this.cacheStateIfChanged(e,["depth"],n)&&(r.zIndex=e.depth+1),(s=this.cacheStateIfChanged(e,["pivotX","pivotY"],n))&&(r[a+"TransformOrigin"]=e.pivotX+o+" "+e.pivotY+o),(this.cacheStateIfChanged(e,["x","y","rotation","scaleX","scaleY"],n)||s)&&(r[a+"Transform"]=this.getTransformCSS(e)),this.cacheStateIfChanged(e,["background"],n)&&(r.backgroundColor=e.background),r.pointerEvents||(r.pointerEvents="none");var h=i.image;if(h){var l=h.src;l!==n.image&&(n.image=l,r.backgroundImage="url("+l+")");var c=i.rect;if(c){var u=c[0],d=c[1];u!==n.sx&&(n.sx=u,r.backgroundPositionX=-u+o),d!==n.sy&&(n.sy=d,r.backgroundPositionY=-d+o)}}var f=e.mask;if(f){var p=f.drawable.domElement.style.backgroundImage;p!==n.maskImage&&(n.maskImage=p,r[a+"MaskImage"]=p,r[a+"MaskRepeat"]="no-repeat");var v=f.x,m=f.y;v===n.maskX&&m===n.maskY||(n.maskX=v,n.maskY=m,r[a+"MaskPosition"]=v+o+" "+m+o)}}},cacheStateIfChanged:function(t,e,i){var r,n,a,o,s=!1;for(r=0,n=e.length;rvar shape = new Hilo.Graphics({width:500, height:500});
@@ -342,30 +342,137 @@ return Class.create(/** @lends Graphics.prototype */{ */ drawSVGPath: function(pathData){ var me = this, addAction = me._addAction, - path = pathData.split(/,| (?=[a-zA-Z])/); - + path = pathData.replace(/,/g, ' ').replace(/-/g, ' -').split(/(?=[a-zA-Z])/); addAction.call(me, ['beginPath']); + var currentPoint = {x:0, y:0}; + var lastControlPoint = {x:0, y:0}; + var lastCmd; for(var i = 0, len = path.length; i < len; i++){ - var str = path[i], cmd = str[0].toUpperCase(), p = str.substring(1).split(/,| /); - if(p[0].length == 0) p.shift(); + var str = path[i]; + if(!str.length){ + continue; + } + var realCmd = str[0]; + var cmd = realCmd.toUpperCase(); + var p = this._getSVGParams(str); + var useRelative = cmd !== realCmd; switch(cmd){ case 'M': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['moveTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; case 'L': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['lineTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; - case 'C': - addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + case 'H': + if(useRelative){ + p[0] += currentPoint.x; + } + addAction.call(me, ['lineTo', p[0], currentPoint.y]); + currentPoint.x = p[0]; + break; + case 'V': + if(useRelative){ + p[0] += currentPoint.y; + } + addAction.call(me, ['lineTo', currentPoint.x, p[0]]); + currentPoint.y = p[0]; break; case 'Z': addAction.call(me, ['closePath']); break; + case 'C': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + lastControlPoint.x = p[2]; + lastControlPoint.y = p[3]; + this._setCurrentPoint(currentPoint, p[4], p[5]); + break; + case 'S': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + if(lastCmd === 'C' || lastCmd === 'S'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['bezierCurveTo', controlPoint.x, controlPoint.y, p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'Q': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['quadraticCurveTo', p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'T': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + var controlPoint; + if(lastCmd === 'Q' || lastCmd === 'T'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['quadraticCurveTo', controlPoint.x, controlPoint.y, p[0], p[1]]); + lastControlPoint = controlPoint; + this._setCurrentPoint(currentPoint, p[0], p[1]); + break; } + lastCmd = cmd; + } return me; }, + _getSVGParams:function(str){ + var p = str.substring(1).replace(/[\s]+$|^[\s]+/g, '').split(/[\s]+/); + if(p[0].length == 0) { + p.shift(); + } + for(var i = 0, l = p.length;i < l;i ++){ + p[i] = parseFloat(p[i]); + } + return p; + }, + _convertToAbsolute:function(currentPoint, data){ + for(var i = 0, l = data.length;i < l;i ++){ + if(i%2 === 0){ + data[i] += currentPoint.x; + } + else{ + data[i] += currentPoint.y; + } + } + }, + _setCurrentPoint:function(currentPoint, x, y){ + currentPoint.x = x; + currentPoint.y = y; + }, + _getReflectionPoint:function(centerPoint, point){ + return { + x:centerPoint.x * 2 - point.x, + y:centerPoint.y * 2 - point.y + }; + }, /** * @language=en diff --git a/build/amd/hilo/view/Graphics.min.js b/build/amd/hilo/view/Graphics.min.js index abf19442..5b1e23ba 100644 --- a/build/amd/hilo/view/Graphics.min.js +++ b/build/amd/hilo/view/Graphics.min.js @@ -1,6 +1,6 @@ /** - * Hilo 1.0.2 for amd + * Hilo 1.0.4 for amd * Copyright 2016 alibaba.com * Licensed under the MIT License */ -define("hilo/view/Graphics",["hilo/core/Hilo","hilo/core/Class","hilo/view/View","hilo/view/CacheMixin"],function(i,l,t,e){var a=function(){var n=document.createElement("canvas"),r=n.getContext&&n.getContext("2d");return l.create({Extends:t,Mixes:e,constructor:function(l){l=l||{},this.id=this.id||l.id||i.getUid("Graphics"),a.superclass.constructor.call(this,l),this._actions=[]},lineWidth:1,lineAlpha:1,lineCap:null,lineJoin:null,miterLimit:10,hasStroke:!1,strokeStyle:"0",hasFill:!1,fillStyle:"0",fillAlpha:0,lineStyle:function(i,l,t,e,a,n){var r=this,o=r._addAction;return o.call(r,["lineWidth",r.lineWidth=i||1]),o.call(r,["strokeStyle",r.strokeStyle=l||"0"]),o.call(r,["lineAlpha",r.lineAlpha=t||1]),void 0!=e&&o.call(r,["lineCap",r.lineCap=e]),void 0!=a&&o.call(r,["lineJoin",r.lineJoin=a]),void 0!=n&&o.call(r,["miterLimit",r.miterLimit=n]),r.hasStroke=!0,r},beginFill:function(i,l){var t=this,e=t._addAction;return e.call(t,["fillStyle",t.fillStyle=i]),e.call(t,["fillAlpha",t.fillAlpha=l||1]),t.hasFill=!0,t},endFill:function(){var i=this,l=i._addAction;return i.hasStroke&&l.call(i,["stroke"]),i.hasFill&&l.call(i,["fill"]),i.setCacheDirty(!0),i},beginLinearGradientFill:function(i,l,t,e,a,n){for(var o=this,c=r.createLinearGradient(i,l,t,e),h=0,d=a.length;hvar path = 'M250 150 L150 350 L350 350 Z';
*var shape = new Hilo.Graphics({width:500, height:500});
@@ -4037,30 +4037,137 @@ return Class.create(/** @lends Graphics.prototype */{ */ drawSVGPath: function(pathData){ var me = this, addAction = me._addAction, - path = pathData.split(/,| (?=[a-zA-Z])/); - + path = pathData.replace(/,/g, ' ').replace(/-/g, ' -').split(/(?=[a-zA-Z])/); addAction.call(me, ['beginPath']); + var currentPoint = {x:0, y:0}; + var lastControlPoint = {x:0, y:0}; + var lastCmd; for(var i = 0, len = path.length; i < len; i++){ - var str = path[i], cmd = str[0].toUpperCase(), p = str.substring(1).split(/,| /); - if(p[0].length == 0) p.shift(); + var str = path[i]; + if(!str.length){ + continue; + } + var realCmd = str[0]; + var cmd = realCmd.toUpperCase(); + var p = this._getSVGParams(str); + var useRelative = cmd !== realCmd; switch(cmd){ case 'M': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['moveTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; case 'L': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['lineTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; - case 'C': - addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + case 'H': + if(useRelative){ + p[0] += currentPoint.x; + } + addAction.call(me, ['lineTo', p[0], currentPoint.y]); + currentPoint.x = p[0]; + break; + case 'V': + if(useRelative){ + p[0] += currentPoint.y; + } + addAction.call(me, ['lineTo', currentPoint.x, p[0]]); + currentPoint.y = p[0]; break; case 'Z': addAction.call(me, ['closePath']); break; + case 'C': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + lastControlPoint.x = p[2]; + lastControlPoint.y = p[3]; + this._setCurrentPoint(currentPoint, p[4], p[5]); + break; + case 'S': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + if(lastCmd === 'C' || lastCmd === 'S'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['bezierCurveTo', controlPoint.x, controlPoint.y, p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'Q': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['quadraticCurveTo', p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'T': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + var controlPoint; + if(lastCmd === 'Q' || lastCmd === 'T'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['quadraticCurveTo', controlPoint.x, controlPoint.y, p[0], p[1]]); + lastControlPoint = controlPoint; + this._setCurrentPoint(currentPoint, p[0], p[1]); + break; } + lastCmd = cmd; + } return me; }, + _getSVGParams:function(str){ + var p = str.substring(1).replace(/[\s]+$|^[\s]+/g, '').split(/[\s]+/); + if(p[0].length == 0) { + p.shift(); + } + for(var i = 0, l = p.length;i < l;i ++){ + p[i] = parseFloat(p[i]); + } + return p; + }, + _convertToAbsolute:function(currentPoint, data){ + for(var i = 0, l = data.length;i < l;i ++){ + if(i%2 === 0){ + data[i] += currentPoint.x; + } + else{ + data[i] += currentPoint.y; + } + } + }, + _setCurrentPoint:function(currentPoint, x, y){ + currentPoint.x = x; + currentPoint.y = y; + }, + _getReflectionPoint:function(centerPoint, point){ + return { + x:centerPoint.x * 2 - point.x, + y:centerPoint.y * 2 - point.y + }; + }, /** * @language=en @@ -4140,7 +4247,7 @@ return Graphics; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4398,7 +4505,7 @@ return Text; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4587,7 +4694,7 @@ return BitmapText; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4770,7 +4877,7 @@ return Button; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5009,7 +5116,7 @@ return TextureAtlas; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5059,13 +5166,11 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ window[Hilo.browser.jsVendor + 'RequestAnimationFrame']; var runLoop; - if(useRAF && raf){ - var tick = function(){ - self._tick(); - }; + if(useRAF && raf && interval < 17){ + this._useRAF = true; runLoop = function(){ - self._intervalId = setTimeout(runLoop, interval); - raf(tick); + self._intervalId = raf(runLoop); + self._tick(); }; }else{ runLoop = function(){ @@ -5074,6 +5179,7 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ }; } + this._paused = false; runLoop(); }, @@ -5082,9 +5188,17 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ * Stop the ticker. */ stop: function(){ - clearTimeout(this._intervalId); + if(this._useRAF){ + var cancelRAF = window.cancelAnimationFrame || + window[Hilo.browser.jsVendor + 'CancelAnimationFrame']; + cancelRAF(this._intervalId); + } + else{ + clearTimeout(this._intervalId); + } this._intervalId = null; this._lastTime = 0; + this._paused = true; }, /** @@ -5230,7 +5344,7 @@ return Ticker; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5278,7 +5392,7 @@ if (!fnProto.bind) { }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5391,7 +5505,7 @@ return drag; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5480,7 +5594,7 @@ return Class.create(/** @lends Tween.prototype */{ }, target: null, - duration: 0, + duration: 1000, delay: 0, paused: false, loop: false, @@ -5632,11 +5746,15 @@ return Class.create(/** @lends Tween.prototype */{ //elapsed ratio var ratio = elapsed / me.duration, complete = false, callback; - ratio = ratio <= 0 ? 0 : ratio >= 1 ? 1 : me.ease ? me.ease(ratio) : ratio; + ratio = ratio <= 0 ? 0 : ratio >= 1 ? 1 : ratio; + var easeRatio = me.ease ? me.ease(ratio) : ratio; if(me.reverse){ //backward - if(me._reverseFlag < 0) ratio = 1 - ratio; + if(me._reverseFlag < 0) { + ratio = 1 - ratio; + easeRatio = 1 - easeRatio; + } //forward if(ratio < 1e-7){ //repeat complete or not loop @@ -5655,7 +5773,7 @@ return Class.create(/** @lends Tween.prototype */{ me.time = elapsed; //render & update callback - me._render(ratio); + me._render(easeRatio); (callback = me.onUpdate) && callback.call(me, ratio, me); //check if complete @@ -5782,6 +5900,7 @@ return Class.create(/** @lends Tween.prototype */{ * @returns {Tween|Array} An tween instance or an array of tween instance. */ fromTo: function(target, fromProps, toProps, params){ + params = params || {}; var isArray = target instanceof Array; target = isArray ? target : [target]; @@ -5830,7 +5949,7 @@ return Tween; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6102,7 +6221,7 @@ return Ease; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6152,7 +6271,7 @@ return ImageLoader; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6221,7 +6340,7 @@ return ScriptLoader; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6475,7 +6594,7 @@ return LoadQueue; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6682,7 +6801,7 @@ return HTMLAudio; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7003,7 +7122,7 @@ return WebAudio; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7105,7 +7224,7 @@ return WebSound; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7201,7 +7320,7 @@ return Camera; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7391,7 +7510,7 @@ return Camera3d; }); /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ diff --git a/build/cmd/hilo-cmd.min.js b/build/cmd/hilo-cmd.min.js index 2b527a8d..c12c0fa8 100644 --- a/build/cmd/hilo-cmd.min.js +++ b/build/cmd/hilo-cmd.min.js @@ -1,8 +1,8 @@ /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ -define(function(t,e,i){var r=function(){var t=window,e=document,i=e.documentElement,n=0;return{version:"1.0.2",getUid:function(t){var e=++n;if(t){var i=t.charCodeAt(t.length-1);return i>=48&&i<=57&&(t+="_"),t+e}return e},viewToString:function(t){for(var e,i=t;i;)e=e?i.id+"."+e:i.id,i=i.parent;return e},copy:function(t,e,i){for(var r in e)i&&!t.hasOwnProperty(r)&&void 0===t[r]||(t[r]=e[r]);return t},browser:function(){var r=navigator.userAgent,n={iphone:/iphone/i.test(r),ipad:/ipad/i.test(r),ipod:/ipod/i.test(r),ios:/iphone|ipad|ipod/i.test(r),android:/android/i.test(r),webkit:/webkit/i.test(r),chrome:/chrome/i.test(r),safari:/safari/i.test(r),firefox:/firefox/i.test(r),ie:/msie/i.test(r),opera:/opera/i.test(r),supportTouch:"ontouchstart"in t,supportCanvas:null!=e.createElement("canvas").getContext,supportStorage:!1,supportOrientation:"orientation"in t,supportDeviceMotion:"ondevicemotion"in t};try{var a="hilo";localStorage.setItem(a,a),localStorage.removeItem(a),n.supportStorage=!0}catch(o){}var s=n.jsVendor=n.webkit?"webkit":n.firefox?"webkit":n.opera?"o":n.ie?"ms":"",h=n.cssVendor="-"+s+"-",l=e.createElement("div"),c=l.style,u=void 0!=c[s+"Transform"],d=void 0!=c[s+"Perspective"];return d&&(l.id="test3d",c=e.createElement("style"),c.textContent="@media ("+h+"transform-3d){#test3d{height:3px}}",e.head.appendChild(c),i.appendChild(l),d=3==l.offsetHeight,e.head.removeChild(c),i.removeChild(l)),n.supportTransform=u,n.supportTransform3D=d,n}(),event:function(){var e="ontouchstart"in t;return{POINTER_START:e?"touchstart":"mousedown",POINTER_MOVE:e?"touchmove":"mousemove",POINTER_END:e?"touchend":"mouseup"}}(),align:{TOP_LEFT:"TL",TOP:"T",TOP_RIGHT:"TR",LEFT:"L",CENTER:"C",RIGHT:"R",BOTTOM_LEFT:"BL",BOTTOM:"B",BOTTOM_RIGHT:"BR"},getElementRect:function(e){var r;try{r=e.getBoundingClientRect()}catch(n){r={top:e.offsetTop,left:e.offsetLeft,right:e.offsetLeft+e.offsetWidth,bottom:e.offsetTop+e.offsetHeight}}var a=(t.pageXOffset||i.scrollLeft)-(i.clientLeft||0)||0,o=(t.pageYOffset||i.scrollTop)-(i.clientTop||0)||0,s=t.getComputedStyle?getComputedStyle(e):e.currentStyle,h=parseInt,l=h(s.paddingLeft)+h(s.borderLeftWidth)||0,c=h(s.paddingTop)+h(s.borderTopWidth)||0,u=h(s.paddingRight)+h(s.borderRightWidth)||0,d=h(s.paddingBottom)+h(s.borderBottomWidth)||0,f=r.top||0,p=r.left||0,v=r.right||0,m=r.bottom||0;return{left:p+a+l,top:f+o+c,width:v-u-p-l,height:m-d-f-c}},createElement:function(t,i){var r,n,a,o=e.createElement(t);for(r in i)if(n=i[r],"style"===r)for(a in n)o.style[a]=n[a];else o[r]=n;return o},getElement:function(t){return e.getElementById(t)},setElementStyleByView:function(t){var e=t.drawable,i=e.domElement.style,n=t._stateCache||(t._stateCache={}),a=r.browser.jsVendor,o="px",s=!1;if(this.cacheStateIfChanged(t,["visible"],n)&&(i.display=t.visible?"":"none"),this.cacheStateIfChanged(t,["alpha"],n)&&(i.opacity=t.alpha),t.visible&&!(t.alpha<=0)){this.cacheStateIfChanged(t,["width"],n)&&(i.width=t.width+o),this.cacheStateIfChanged(t,["height"],n)&&(i.height=t.height+o),this.cacheStateIfChanged(t,["depth"],n)&&(i.zIndex=t.depth+1),(s=this.cacheStateIfChanged(t,["pivotX","pivotY"],n))&&(i[a+"TransformOrigin"]=t.pivotX+o+" "+t.pivotY+o),(this.cacheStateIfChanged(t,["x","y","rotation","scaleX","scaleY"],n)||s)&&(i[a+"Transform"]=this.getTransformCSS(t)),this.cacheStateIfChanged(t,["background"],n)&&(i.backgroundColor=t.background),i.pointerEvents||(i.pointerEvents="none");var h=e.image;if(h){var l=h.src;l!==n.image&&(n.image=l,i.backgroundImage="url("+l+")");var c=e.rect;if(c){var u=c[0],d=c[1];u!==n.sx&&(n.sx=u,i.backgroundPositionX=-u+o),d!==n.sy&&(n.sy=d,i.backgroundPositionY=-d+o)}}var f=t.mask;if(f){var p=f.drawable.domElement.style.backgroundImage;p!==n.maskImage&&(n.maskImage=p,i[a+"MaskImage"]=p,i[a+"MaskRepeat"]="no-repeat");var v=f.x,m=f.y;v===n.maskX&&m===n.maskY||(n.maskX=v,n.maskY=m,i[a+"MaskPosition"]=v+o+" "+m+o)}}},cacheStateIfChanged:function(t,e,i){var r,n,a,o,s=!1;for(r=0,n=e.length;rvar shape = new Hilo.Graphics({width:500, height:500});
@@ -347,30 +347,137 @@ return Class.create(/** @lends Graphics.prototype */{ */ drawSVGPath: function(pathData){ var me = this, addAction = me._addAction, - path = pathData.split(/,| (?=[a-zA-Z])/); - + path = pathData.replace(/,/g, ' ').replace(/-/g, ' -').split(/(?=[a-zA-Z])/); addAction.call(me, ['beginPath']); + var currentPoint = {x:0, y:0}; + var lastControlPoint = {x:0, y:0}; + var lastCmd; for(var i = 0, len = path.length; i < len; i++){ - var str = path[i], cmd = str[0].toUpperCase(), p = str.substring(1).split(/,| /); - if(p[0].length == 0) p.shift(); + var str = path[i]; + if(!str.length){ + continue; + } + var realCmd = str[0]; + var cmd = realCmd.toUpperCase(); + var p = this._getSVGParams(str); + var useRelative = cmd !== realCmd; switch(cmd){ case 'M': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['moveTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; case 'L': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['lineTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; - case 'C': - addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + case 'H': + if(useRelative){ + p[0] += currentPoint.x; + } + addAction.call(me, ['lineTo', p[0], currentPoint.y]); + currentPoint.x = p[0]; + break; + case 'V': + if(useRelative){ + p[0] += currentPoint.y; + } + addAction.call(me, ['lineTo', currentPoint.x, p[0]]); + currentPoint.y = p[0]; break; case 'Z': addAction.call(me, ['closePath']); break; + case 'C': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + lastControlPoint.x = p[2]; + lastControlPoint.y = p[3]; + this._setCurrentPoint(currentPoint, p[4], p[5]); + break; + case 'S': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + if(lastCmd === 'C' || lastCmd === 'S'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['bezierCurveTo', controlPoint.x, controlPoint.y, p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'Q': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['quadraticCurveTo', p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'T': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + var controlPoint; + if(lastCmd === 'Q' || lastCmd === 'T'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['quadraticCurveTo', controlPoint.x, controlPoint.y, p[0], p[1]]); + lastControlPoint = controlPoint; + this._setCurrentPoint(currentPoint, p[0], p[1]); + break; } + lastCmd = cmd; + } return me; }, + _getSVGParams:function(str){ + var p = str.substring(1).replace(/[\s]+$|^[\s]+/g, '').split(/[\s]+/); + if(p[0].length == 0) { + p.shift(); + } + for(var i = 0, l = p.length;i < l;i ++){ + p[i] = parseFloat(p[i]); + } + return p; + }, + _convertToAbsolute:function(currentPoint, data){ + for(var i = 0, l = data.length;i < l;i ++){ + if(i%2 === 0){ + data[i] += currentPoint.x; + } + else{ + data[i] += currentPoint.y; + } + } + }, + _setCurrentPoint:function(currentPoint, x, y){ + currentPoint.x = x; + currentPoint.y = y; + }, + _getReflectionPoint:function(centerPoint, point){ + return { + x:centerPoint.x * 2 - point.x, + y:centerPoint.y * 2 - point.y + }; + }, /** * @language=en diff --git a/build/cmd/hilo/view/Graphics.min.js b/build/cmd/hilo/view/Graphics.min.js index 5dd6c932..c84ae5ef 100644 --- a/build/cmd/hilo/view/Graphics.min.js +++ b/build/cmd/hilo/view/Graphics.min.js @@ -1,6 +1,6 @@ /** - * Hilo 1.0.2 for cmd + * Hilo 1.0.4 for cmd * Copyright 2016 alibaba.com * Licensed under the MIT License */ -define(function(l,i,t){var e=l("hilo/core/Hilo"),n=l("hilo/core/Class"),a=l("hilo/view/View"),r=l("hilo/view/CacheMixin"),o=function(){var l=document.createElement("canvas"),i=l.getContext&&l.getContext("2d");return n.create({Extends:a,Mixes:r,constructor:function(l){l=l||{},this.id=this.id||l.id||e.getUid("Graphics"),o.superclass.constructor.call(this,l),this._actions=[]},lineWidth:1,lineAlpha:1,lineCap:null,lineJoin:null,miterLimit:10,hasStroke:!1,strokeStyle:"0",hasFill:!1,fillStyle:"0",fillAlpha:0,lineStyle:function(l,i,t,e,n,a){var r=this,o=r._addAction;return o.call(r,["lineWidth",r.lineWidth=l||1]),o.call(r,["strokeStyle",r.strokeStyle=i||"0"]),o.call(r,["lineAlpha",r.lineAlpha=t||1]),void 0!=e&&o.call(r,["lineCap",r.lineCap=e]),void 0!=n&&o.call(r,["lineJoin",r.lineJoin=n]),void 0!=a&&o.call(r,["miterLimit",r.miterLimit=a]),r.hasStroke=!0,r},beginFill:function(l,i){var t=this,e=t._addAction;return e.call(t,["fillStyle",t.fillStyle=l]),e.call(t,["fillAlpha",t.fillAlpha=i||1]),t.hasFill=!0,t},endFill:function(){var l=this,i=l._addAction;return l.hasStroke&&i.call(l,["stroke"]),l.hasFill&&i.call(l,["fill"]),l.setCacheDirty(!0),l},beginLinearGradientFill:function(l,t,e,n,a,r){for(var o=this,c=i.createLinearGradient(l,t,e,n),h=0,d=a.length;hvar shape = new Hilo.Graphics({width:500, height:500});
@@ -345,30 +345,137 @@ return Class.create(/** @lends Graphics.prototype */{ */ drawSVGPath: function(pathData){ var me = this, addAction = me._addAction, - path = pathData.split(/,| (?=[a-zA-Z])/); - + path = pathData.replace(/,/g, ' ').replace(/-/g, ' -').split(/(?=[a-zA-Z])/); addAction.call(me, ['beginPath']); + var currentPoint = {x:0, y:0}; + var lastControlPoint = {x:0, y:0}; + var lastCmd; for(var i = 0, len = path.length; i < len; i++){ - var str = path[i], cmd = str[0].toUpperCase(), p = str.substring(1).split(/,| /); - if(p[0].length == 0) p.shift(); + var str = path[i]; + if(!str.length){ + continue; + } + var realCmd = str[0]; + var cmd = realCmd.toUpperCase(); + var p = this._getSVGParams(str); + var useRelative = cmd !== realCmd; switch(cmd){ case 'M': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['moveTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; case 'L': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['lineTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; - case 'C': - addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + case 'H': + if(useRelative){ + p[0] += currentPoint.x; + } + addAction.call(me, ['lineTo', p[0], currentPoint.y]); + currentPoint.x = p[0]; + break; + case 'V': + if(useRelative){ + p[0] += currentPoint.y; + } + addAction.call(me, ['lineTo', currentPoint.x, p[0]]); + currentPoint.y = p[0]; break; case 'Z': addAction.call(me, ['closePath']); break; + case 'C': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + lastControlPoint.x = p[2]; + lastControlPoint.y = p[3]; + this._setCurrentPoint(currentPoint, p[4], p[5]); + break; + case 'S': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + if(lastCmd === 'C' || lastCmd === 'S'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['bezierCurveTo', controlPoint.x, controlPoint.y, p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'Q': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['quadraticCurveTo', p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'T': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + var controlPoint; + if(lastCmd === 'Q' || lastCmd === 'T'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['quadraticCurveTo', controlPoint.x, controlPoint.y, p[0], p[1]]); + lastControlPoint = controlPoint; + this._setCurrentPoint(currentPoint, p[0], p[1]); + break; } + lastCmd = cmd; + } return me; }, + _getSVGParams:function(str){ + var p = str.substring(1).replace(/[\s]+$|^[\s]+/g, '').split(/[\s]+/); + if(p[0].length == 0) { + p.shift(); + } + for(var i = 0, l = p.length;i < l;i ++){ + p[i] = parseFloat(p[i]); + } + return p; + }, + _convertToAbsolute:function(currentPoint, data){ + for(var i = 0, l = data.length;i < l;i ++){ + if(i%2 === 0){ + data[i] += currentPoint.x; + } + else{ + data[i] += currentPoint.y; + } + } + }, + _setCurrentPoint:function(currentPoint, x, y){ + currentPoint.x = x; + currentPoint.y = y; + }, + _getReflectionPoint:function(centerPoint, point){ + return { + x:centerPoint.x * 2 - point.x, + y:centerPoint.y * 2 - point.y + }; + }, /** * @language=en diff --git a/build/commonjs/view/Graphics.min.js b/build/commonjs/view/Graphics.min.js index edcdcb67..afbd874b 100644 --- a/build/commonjs/view/Graphics.min.js +++ b/build/commonjs/view/Graphics.min.js @@ -1,6 +1,6 @@ /** - * Hilo 1.0.2 for commonjs + * Hilo 1.0.4 for commonjs * Copyright 2016 alibaba.com * Licensed under the MIT License */ -var Hilo=require("../core/Hilo"),Class=require("../core/Class"),View=require("./View"),CacheMixin=require("./CacheMixin"),Graphics=function(){var i=document.createElement("canvas"),l=i.getContext&&i.getContext("2d");return Class.create({Extends:View,Mixes:CacheMixin,constructor:function(i){i=i||{},this.id=this.id||i.id||Hilo.getUid("Graphics"),Graphics.superclass.constructor.call(this,i),this._actions=[]},lineWidth:1,lineAlpha:1,lineCap:null,lineJoin:null,miterLimit:10,hasStroke:!1,strokeStyle:"0",hasFill:!1,fillStyle:"0",fillAlpha:0,lineStyle:function(i,l,t,e,a,n){var r=this,c=r._addAction;return c.call(r,["lineWidth",r.lineWidth=i||1]),c.call(r,["strokeStyle",r.strokeStyle=l||"0"]),c.call(r,["lineAlpha",r.lineAlpha=t||1]),void 0!=e&&c.call(r,["lineCap",r.lineCap=e]),void 0!=a&&c.call(r,["lineJoin",r.lineJoin=a]),void 0!=n&&c.call(r,["miterLimit",r.miterLimit=n]),r.hasStroke=!0,r},beginFill:function(i,l){var t=this,e=t._addAction;return e.call(t,["fillStyle",t.fillStyle=i]),e.call(t,["fillAlpha",t.fillAlpha=l||1]),t.hasFill=!0,t},endFill:function(){var i=this,l=i._addAction;return i.hasStroke&&l.call(i,["stroke"]),i.hasFill&&l.call(i,["fill"]),i.setCacheDirty(!0),i},beginLinearGradientFill:function(i,t,e,a,n,r){for(var c=this,o=l.createLinearGradient(i,t,e,a),s=0,h=n.length;svar path = 'M250 150 L150 350 L350 350 Z';
*var shape = new Hilo.Graphics({width:500, height:500});
@@ -4003,30 +4003,137 @@ return Class.create(/** @lends Graphics.prototype */{ */ drawSVGPath: function(pathData){ var me = this, addAction = me._addAction, - path = pathData.split(/,| (?=[a-zA-Z])/); - + path = pathData.replace(/,/g, ' ').replace(/-/g, ' -').split(/(?=[a-zA-Z])/); addAction.call(me, ['beginPath']); + var currentPoint = {x:0, y:0}; + var lastControlPoint = {x:0, y:0}; + var lastCmd; for(var i = 0, len = path.length; i < len; i++){ - var str = path[i], cmd = str[0].toUpperCase(), p = str.substring(1).split(/,| /); - if(p[0].length == 0) p.shift(); + var str = path[i]; + if(!str.length){ + continue; + } + var realCmd = str[0]; + var cmd = realCmd.toUpperCase(); + var p = this._getSVGParams(str); + var useRelative = cmd !== realCmd; switch(cmd){ case 'M': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['moveTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; case 'L': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } addAction.call(me, ['lineTo', p[0], p[1]]); + this._setCurrentPoint(currentPoint, p[0], p[1]); break; - case 'C': - addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + case 'H': + if(useRelative){ + p[0] += currentPoint.x; + } + addAction.call(me, ['lineTo', p[0], currentPoint.y]); + currentPoint.x = p[0]; + break; + case 'V': + if(useRelative){ + p[0] += currentPoint.y; + } + addAction.call(me, ['lineTo', currentPoint.x, p[0]]); + currentPoint.y = p[0]; break; case 'Z': addAction.call(me, ['closePath']); break; + case 'C': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['bezierCurveTo', p[0], p[1], p[2], p[3], p[4], p[5]]); + lastControlPoint.x = p[2]; + lastControlPoint.y = p[3]; + this._setCurrentPoint(currentPoint, p[4], p[5]); + break; + case 'S': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + if(lastCmd === 'C' || lastCmd === 'S'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['bezierCurveTo', controlPoint.x, controlPoint.y, p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'Q': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + addAction.call(me, ['quadraticCurveTo', p[0], p[1], p[2], p[3]]); + lastControlPoint.x = p[0]; + lastControlPoint.y = p[1]; + this._setCurrentPoint(currentPoint, p[2], p[3]); + break; + case 'T': + if(useRelative){ + this._convertToAbsolute(currentPoint, p); + } + var controlPoint; + if(lastCmd === 'Q' || lastCmd === 'T'){ + controlPoint = this._getReflectionPoint(currentPoint, lastControlPoint); + } + else{ + controlPoint = currentPoint; + } + addAction.call(me, ['quadraticCurveTo', controlPoint.x, controlPoint.y, p[0], p[1]]); + lastControlPoint = controlPoint; + this._setCurrentPoint(currentPoint, p[0], p[1]); + break; } + lastCmd = cmd; + } return me; }, + _getSVGParams:function(str){ + var p = str.substring(1).replace(/[\s]+$|^[\s]+/g, '').split(/[\s]+/); + if(p[0].length == 0) { + p.shift(); + } + for(var i = 0, l = p.length;i < l;i ++){ + p[i] = parseFloat(p[i]); + } + return p; + }, + _convertToAbsolute:function(currentPoint, data){ + for(var i = 0, l = data.length;i < l;i ++){ + if(i%2 === 0){ + data[i] += currentPoint.x; + } + else{ + data[i] += currentPoint.y; + } + } + }, + _setCurrentPoint:function(currentPoint, x, y){ + currentPoint.x = x; + currentPoint.y = y; + }, + _getReflectionPoint:function(centerPoint, point){ + return { + x:centerPoint.x * 2 - point.x, + y:centerPoint.y * 2 - point.y + }; + }, /** * @language=en @@ -4108,7 +4215,7 @@ return Graphics; requires: ['hilo/core/Hilo', 'hilo/core/Class', 'hilo/view/View', 'hilo/view/CacheMixin'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4363,7 +4470,7 @@ return Text; requires: ['hilo/core/Class', 'hilo/core/Hilo', 'hilo/view/View', 'hilo/view/CacheMixin'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4549,7 +4656,7 @@ return BitmapText; requires: ['hilo/core/Class', 'hilo/core/Hilo', 'hilo/view/Container', 'hilo/view/Bitmap'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4729,7 +4836,7 @@ return Button; requires: ['hilo/core/Hilo', 'hilo/core/Class', 'hilo/view/View', 'hilo/view/Drawable'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -4968,7 +5075,7 @@ return TextureAtlas; requires: ['hilo/core/Class'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5015,13 +5122,11 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ window[Hilo.browser.jsVendor + 'RequestAnimationFrame']; var runLoop; - if(useRAF && raf){ - var tick = function(){ - self._tick(); - }; + if(useRAF && raf && interval < 17){ + this._useRAF = true; runLoop = function(){ - self._intervalId = setTimeout(runLoop, interval); - raf(tick); + self._intervalId = raf(runLoop); + self._tick(); }; }else{ runLoop = function(){ @@ -5030,6 +5135,7 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ }; } + this._paused = false; runLoop(); }, @@ -5038,9 +5144,17 @@ var Ticker = Class.create(/** @lends Ticker.prototype */{ * Stop the ticker. */ stop: function(){ - clearTimeout(this._intervalId); + if(this._useRAF){ + var cancelRAF = window.cancelAnimationFrame || + window[Hilo.browser.jsVendor + 'CancelAnimationFrame']; + cancelRAF(this._intervalId); + } + else{ + clearTimeout(this._intervalId); + } this._intervalId = null; this._lastTime = 0; + this._paused = true; }, /** @@ -5188,7 +5302,7 @@ return Ticker; requires: ['hilo/core/Class', 'hilo/core/Hilo'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5236,7 +5350,7 @@ if (!fnProto.bind) { }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5349,7 +5463,7 @@ return drag; requires: ['hilo/core/Hilo'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -5436,7 +5550,7 @@ return Class.create(/** @lends Tween.prototype */{ }, target: null, - duration: 0, + duration: 1000, delay: 0, paused: false, loop: false, @@ -5588,11 +5702,15 @@ return Class.create(/** @lends Tween.prototype */{ //elapsed ratio var ratio = elapsed / me.duration, complete = false, callback; - ratio = ratio <= 0 ? 0 : ratio >= 1 ? 1 : me.ease ? me.ease(ratio) : ratio; + ratio = ratio <= 0 ? 0 : ratio >= 1 ? 1 : ratio; + var easeRatio = me.ease ? me.ease(ratio) : ratio; if(me.reverse){ //backward - if(me._reverseFlag < 0) ratio = 1 - ratio; + if(me._reverseFlag < 0) { + ratio = 1 - ratio; + easeRatio = 1 - easeRatio; + } //forward if(ratio < 1e-7){ //repeat complete or not loop @@ -5611,7 +5729,7 @@ return Class.create(/** @lends Tween.prototype */{ me.time = elapsed; //render & update callback - me._render(ratio); + me._render(easeRatio); (callback = me.onUpdate) && callback.call(me, ratio, me); //check if complete @@ -5738,6 +5856,7 @@ return Class.create(/** @lends Tween.prototype */{ * @returns {Tween|Array} An tween instance or an array of tween instance. */ fromTo: function(target, fromProps, toProps, params){ + params = params || {}; var isArray = target instanceof Array; target = isArray ? target : [target]; @@ -5788,7 +5907,7 @@ return Tween; requires: ['hilo/core/Class'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6060,7 +6179,7 @@ return Ease; }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6110,7 +6229,7 @@ return ImageLoader; requires: ['hilo/core/Class'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6179,7 +6298,7 @@ return ScriptLoader; requires: ['hilo/core/Class'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6430,7 +6549,7 @@ return LoadQueue; requires: ['hilo/core/Class', 'hilo/event/EventMixin', 'hilo/loader/ImageLoader', 'hilo/loader/ScriptLoader'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6635,7 +6754,7 @@ return HTMLAudio; requires: ['hilo/core/Hilo', 'hilo/core/Class', 'hilo/event/EventMixin'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -6954,7 +7073,7 @@ return WebAudio; requires: ['hilo/core/Hilo', 'hilo/core/Class', 'hilo/event/EventMixin'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7054,7 +7173,7 @@ return WebSound; requires: ['hilo/core/Hilo', 'hilo/media/HTMLAudio', 'hilo/media/WebAudio'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7149,7 +7268,7 @@ return Camera; requires: ['hilo/core/Hilo', 'hilo/core/Class'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ @@ -7338,7 +7457,7 @@ return Camera3d; requires: ['hilo/core/Hilo', 'hilo/core/Class'] }); /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ diff --git a/build/kissy/hilo-kissy.min.js b/build/kissy/hilo-kissy.min.js index bd019737..4d93af76 100644 --- a/build/kissy/hilo-kissy.min.js +++ b/build/kissy/hilo-kissy.min.js @@ -1,8 +1,8 @@ /** - * Hilo 1.0.2 for kissy + * Hilo 1.0.4 for kissy * Copyright 2016 alibaba.com * Licensed under the MIT License */ -KISSY.add("hilo/core/Hilo",function(t){var e=function(){var t=window,i=document,r=i.documentElement,n=0;return{version:"1.0.2",getUid:function(t){var e=++n;if(t){var i=t.charCodeAt(t.length-1);return i>=48&&i<=57&&(t+="_"),t+e}return e},viewToString:function(t){for(var e,i=t;i;)e=e?i.id+"."+e:i.id,i=i.parent;return e},copy:function(t,e,i){for(var r in e)i&&!t.hasOwnProperty(r)&&void 0===t[r]||(t[r]=e[r]);return t},browser:function(){var e=navigator.userAgent,n={iphone:/iphone/i.test(e),ipad:/ipad/i.test(e),ipod:/ipod/i.test(e),ios:/iphone|ipad|ipod/i.test(e),android:/android/i.test(e),webkit:/webkit/i.test(e),chrome:/chrome/i.test(e),safari:/safari/i.test(e),firefox:/firefox/i.test(e),ie:/msie/i.test(e),opera:/opera/i.test(e),supportTouch:"ontouchstart"in t,supportCanvas:null!=i.createElement("canvas").getContext,supportStorage:!1,supportOrientation:"orientation"in t,supportDeviceMotion:"ondevicemotion"in t};try{var a="hilo";localStorage.setItem(a,a),localStorage.removeItem(a),n.supportStorage=!0}catch(o){}var s=n.jsVendor=n.webkit?"webkit":n.firefox?"webkit":n.opera?"o":n.ie?"ms":"",h=n.cssVendor="-"+s+"-",l=i.createElement("div"),c=l.style,u=void 0!=c[s+"Transform"],d=void 0!=c[s+"Perspective"];return d&&(l.id="test3d",c=i.createElement("style"),c.textContent="@media ("+h+"transform-3d){#test3d{height:3px}}",i.head.appendChild(c),r.appendChild(l),d=3==l.offsetHeight,i.head.removeChild(c),r.removeChild(l)),n.supportTransform=u,n.supportTransform3D=d,n}(),event:function(){var e="ontouchstart"in t;return{POINTER_START:e?"touchstart":"mousedown",POINTER_MOVE:e?"touchmove":"mousemove",POINTER_END:e?"touchend":"mouseup"}}(),align:{TOP_LEFT:"TL",TOP:"T",TOP_RIGHT:"TR",LEFT:"L",CENTER:"C",RIGHT:"R",BOTTOM_LEFT:"BL",BOTTOM:"B",BOTTOM_RIGHT:"BR"},getElementRect:function(e){var i;try{i=e.getBoundingClientRect()}catch(n){i={top:e.offsetTop,left:e.offsetLeft,right:e.offsetLeft+e.offsetWidth,bottom:e.offsetTop+e.offsetHeight}}var a=(t.pageXOffset||r.scrollLeft)-(r.clientLeft||0)||0,o=(t.pageYOffset||r.scrollTop)-(r.clientTop||0)||0,s=t.getComputedStyle?getComputedStyle(e):e.currentStyle,h=parseInt,l=h(s.paddingLeft)+h(s.borderLeftWidth)||0,c=h(s.paddingTop)+h(s.borderTopWidth)||0,u=h(s.paddingRight)+h(s.borderRightWidth)||0,d=h(s.paddingBottom)+h(s.borderBottomWidth)||0,f=i.top||0,p=i.left||0,v=i.right||0,m=i.bottom||0;return{left:p+a+l,top:f+o+c,width:v-u-p-l,height:m-d-f-c}},createElement:function(t,e){var r,n,a,o=i.createElement(t);for(r in e)if(n=e[r],"style"===r)for(a in n)o.style[a]=n[a];else o[r]=n;return o},getElement:function(t){return i.getElementById(t)},setElementStyleByView:function(t){var i=t.drawable,r=i.domElement.style,n=t._stateCache||(t._stateCache={}),a=e.browser.jsVendor,o="px",s=!1;if(this.cacheStateIfChanged(t,["visible"],n)&&(r.display=t.visible?"":"none"),this.cacheStateIfChanged(t,["alpha"],n)&&(r.opacity=t.alpha),t.visible&&!(t.alpha<=0)){this.cacheStateIfChanged(t,["width"],n)&&(r.width=t.width+o),this.cacheStateIfChanged(t,["height"],n)&&(r.height=t.height+o),this.cacheStateIfChanged(t,["depth"],n)&&(r.zIndex=t.depth+1),(s=this.cacheStateIfChanged(t,["pivotX","pivotY"],n))&&(r[a+"TransformOrigin"]=t.pivotX+o+" "+t.pivotY+o),(this.cacheStateIfChanged(t,["x","y","rotation","scaleX","scaleY"],n)||s)&&(r[a+"Transform"]=this.getTransformCSS(t)),this.cacheStateIfChanged(t,["background"],n)&&(r.backgroundColor=t.background),r.pointerEvents||(r.pointerEvents="none");var h=i.image;if(h){var l=h.src;l!==n.image&&(n.image=l,r.backgroundImage="url("+l+")");var c=i.rect;if(c){var u=c[0],d=c[1];u!==n.sx&&(n.sx=u,r.backgroundPositionX=-u+o),d!==n.sy&&(n.sy=d,r.backgroundPositionY=-d+o)}}var f=t.mask;if(f){var p=f.drawable.domElement.style.backgroundImage;p!==n.maskImage&&(n.maskImage=p,r[a+"MaskImage"]=p,r[a+"MaskRepeat"]="no-repeat");var v=f.x,m=f.y;v===n.maskX&&m===n.maskY||(n.maskX=v,n.maskY=m,r[a+"MaskPosition"]=v+o+" "+m+o)}}},cacheStateIfChanged:function(t,e,i){var r,n,a,o,s=!1;for(r=0,n=e.length;r