-
-
Save ncase/4526499 to your computer and use it in GitHub Desktop.
This will allow you to call Graphics.encodePath() to get the compressed base64 data string. This way, you don't have to call the same drawing instructions on an EncodePath object first.
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
/** | |
* Graphics.encodePath, as the mirror to .decodePath | |
* Goes through only the path Commands, and returns a compressed base64 data string | |
* | |
* @author Nicklaus Liow, nutcasenightmare.com | |
**/ | |
// namespace: | |
this.createjs = this.createjs||{}; | |
(function(){ | |
/** | |
* The reverse of decodePath(); | |
* Goes through only the path Commands, and returns a compressed base64 data string | |
* This way, you don't have to call the same drawing instructions on an EncodePath. | |
**/ | |
createjs.Graphics.prototype.encodePath = function(){ | |
var instrNames = ["moveTo","lineTo","quadraticCurveTo","bezierCurveTo"]; | |
var ep = new EncodePath(); | |
this._updateInstructions(); | |
var instr, instrs = this._instructions; | |
for (var i=0, l=instrs.length; i<l; i++) { | |
// the first command is always a beginPath command. | |
var instr = instrs[i]; | |
if (instr.path || i==0) { | |
for(var j=0, length=instrNames.length; j<length; j++){ | |
var instrName = instrNames[j]; | |
if(instr.f==this._ctx[instrName]){ | |
ep[instrName].apply(ep,instr.params); | |
} | |
} | |
} | |
} | |
return ep.code; | |
}; | |
/** | |
* The reverse of the EaselJS Graphics.decode method for | |
* compactly encoding paths. | |
* | |
* @author Brett Johnson, periscopic.com | |
* | |
* @example | |
* var ep = new EncodePath(); | |
* ep.moveTo(-150, 0).lineTo(150, 0); | |
* var shp = new Shape(); | |
* shp.graphics.decode(ep.code); //draws line from -150,0 to 150,0 | |
**/ | |
var EncodePath = (function(){ | |
var MAX_CHAR2 = 204.7; | |
var BASE_64 = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','0','1','2','3','4','5','6','7','8','9','+','/']; | |
function encodeMethod(methodInt, numChars) { | |
return BASE_64[(methodInt<<3) | ((numChars===3?1:0)<<2)]; | |
} | |
function encodeNum2(num) { | |
var val = Math.round(Math.abs(num)*10) | ((num>=0?0:1)<<11); | |
return BASE_64[val>>6] + BASE_64[val & 63]; | |
} | |
function encodeNum3(num) { | |
var val = Math.round(Math.abs(num)*10) | ((num>=0?0:1)<<17); | |
return BASE_64[(val>>12)&63] + BASE_64[(val>>6)&63] + BASE_64[val & 63]; | |
} | |
function EncodePath() {} | |
var p = EncodePath.prototype; | |
p._x = 0; | |
p._y = 0; | |
p.code = ''; | |
p.moveTo = function( x, y) { | |
if(Math.abs(x)<=MAX_CHAR2 && Math.abs(y)<=MAX_CHAR2){ | |
this.code += encodeMethod(0, 2) + encodeNum2(x) + encodeNum2(y); | |
}else { | |
this.code += encodeMethod(0, 3) + encodeNum3(x) + encodeNum3(y); | |
} | |
this._x = x; | |
this._y = y; | |
return this; | |
} | |
p.lineTo = function( x, y) { | |
var numChars, encodeNum; | |
if(Math.abs(x-this._x)<=MAX_CHAR2 && Math.abs(y-this._y)<=MAX_CHAR2) | |
{ | |
numChars = 2; | |
encodeNum= encodeNum2; | |
}else { | |
numChars = 3; | |
encodeNum = encodeNum3; | |
} | |
this.code += encodeMethod(1, numChars) + encodeNum(x-this._x) + encodeNum(y-this._y); | |
this._x = x; | |
this._y = y; | |
return this; | |
}; | |
p.quadraticCurveTo = function( x1, y1, x2, y2) { | |
var numChars, encodeNum; | |
if(Math.abs(x1-this._x)<=MAX_CHAR2 && Math.abs(y1-this._y)<=MAX_CHAR2 && | |
Math.abs(x2-x1)<=MAX_CHAR2 && Math.abs(y2-y1)<=MAX_CHAR2) | |
{ | |
numChars = 2; | |
encodeNum = encodeNum2; | |
}else { | |
numChars = 3; | |
encodeNum = encodeNum3; | |
} | |
this.code += encodeMethod(2, numChars) + encodeNum(x1-this._x) + encodeNum(y1-this._y) + | |
encodeNum(x2-x1) + encodeNum(y2-y1); | |
this._x = x2; | |
this._y = y2; | |
return this; | |
} | |
//-- cubic | |
p.bezierCurveTo = function( x1, y1, x2, y2, x3, y3) { | |
var numChars, encodeNum; | |
if(Math.abs(x1-this._x)<=MAX_CHAR2 && Math.abs(y1-this._y)<=MAX_CHAR2 && | |
Math.abs(x2-x1)<=MAX_CHAR2 && Math.abs(y2-y1)<=MAX_CHAR2 && | |
Math.abs(x3-x2)<=MAX_CHAR2 && Math.abs(y3-y2)<=MAX_CHAR2) | |
{ | |
numChars = 2; | |
encodeNum = encodeNum2; | |
}else { | |
numChars = 3; | |
encodeNum = encodeNum3; | |
} | |
this.code += encodeMethod(3, numChars) + encodeNum(x1-this._x) + encodeNum(y1-this._y) + | |
encodeNum(x2-x1) + encodeNum(y2-y1) + | |
encodeNum(x3-x2) + encodeNum(y3-y2); | |
this._x = x3; | |
this._y = y3; | |
return this; | |
} | |
p.clear = function() { | |
this.code = ''; | |
this._x = this._y = 0; | |
return this; | |
} | |
return EncodePath; | |
})(); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment