vml.js
来自「Hippo CMS是一个以信息为中心的开源内容管理系统。Hippo CMS目标是」· JavaScript 代码 · 共 1,011 行 · 第 1/3 页
JS
1,011 行
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.vml");
dojo.require("dojo.dom");
dojo.require("dojo.math");
dojo.require("dojo.lang.declare");
dojo.require("dojo.lang.extras");
dojo.require("dojo.string.*");
dojo.require("dojo.html.metrics");
dojo.require("dojo.gfx.color");
dojo.require("dojo.gfx.common");
dojo.require("dojo.gfx.shape");
dojo.require("dojo.gfx.path");
dojo.require("dojo.experimental");
dojo.experimental("dojo.gfx.vml");
dojo.gfx.vml.xmlns = "urn:schemas-microsoft-com:vml";
dojo.gfx.vml._parseFloat = function (str) {
return str.match(/^\d+f$/i) ? parseInt(str) / 65536 : parseFloat(str);
};
dojo.gfx.vml.cm_in_pt = 72 / 2.54;
dojo.gfx.vml.mm_in_pt = 7.2 / 2.54;
dojo.gfx.vml.px_in_pt = function () {
return dojo.html.getCachedFontMeasurements()["12pt"] / 12;
};
dojo.gfx.vml.pt2px = function (len) {
return len * this.px_in_pt();
};
dojo.gfx.vml.px2pt = function (len) {
return len / this.px_in_pt();
};
dojo.gfx.vml.normalizedLength = function (len) {
if (len.length == 0) {
return 0;
}
if (len.length > 2) {
var px_in_pt = this.px_in_pt();
var val = parseFloat(len);
switch (len.slice(-2)) {
case "px":
return val;
case "pt":
return val * px_in_pt;
case "in":
return val * 72 * px_in_pt;
case "pc":
return val * 12 * px_in_pt;
case "mm":
return val / this.mm_in_pt * px_in_pt;
case "cm":
return val / this.cm_in_pt * px_in_pt;
}
}
return parseFloat(len);
};
dojo.lang.extend(dojo.gfx.Shape, {setFill:function (fill) {
if (!fill) {
this.fillStyle = null;
this.rawNode.filled = false;
return this;
}
if (typeof (fill) == "object" && "type" in fill) {
switch (fill.type) {
case "linear":
var f = dojo.gfx.makeParameters(dojo.gfx.defaultLinearGradient, fill);
this.fillStyle = f;
var s = "";
for (var i = 0; i < f.colors.length; ++i) {
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
s += f.colors[i].offset.toFixed(8) + " " + f.colors[i].color.toHex() + ";";
}
var fo = this.rawNode.fill;
fo.colors.value = s;
fo.method = "sigma";
fo.type = "gradient";
fo.angle = (dojo.math.radToDeg(Math.atan2(f.x2 - f.x1, f.y2 - f.y1)) + 180) % 360;
fo.on = true;
break;
case "radial":
var f = dojo.gfx.makeParameters(dojo.gfx.defaultRadialGradient, fill);
this.fillStyle = f;
var w = parseFloat(this.rawNode.style.width);
var h = parseFloat(this.rawNode.style.height);
var c = isNaN(w) ? 1 : 2 * f.r / w;
var i = f.colors.length - 1;
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
var s = "0 " + f.colors[i].color.toHex();
for (; i >= 0; --i) {
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
s += (1 - c * f.colors[i].offset).toFixed(8) + " " + f.colors[i].color.toHex() + ";";
}
var fo = this.rawNode.fill;
fo.colors.value = s;
fo.method = "sigma";
fo.type = "gradientradial";
if (isNaN(w) || isNaN(h)) {
fo.focusposition = "0.5 0.5";
} else {
fo.focusposition = (f.cx / w).toFixed(8) + " " + (f.cy / h).toFixed(8);
}
fo.focussize = "0 0";
fo.on = true;
break;
case "pattern":
var f = dojo.gfx.makeParameters(dojo.gfx.defaultPattern, fill);
this.fillStyle = f;
var fo = this.rawNode.fill;
fo.type = "tile";
fo.src = f.src;
if (f.width && f.height) {
fo.size.x = dojo.gfx.vml.px2pt(f.width);
fo.size.y = dojo.gfx.vml.px2pt(f.height);
}
fo.alignShape = false;
fo.position.x = 0;
fo.position.y = 0;
fo.origin.x = f.width ? f.x / f.width : 0;
fo.origin.y = f.height ? f.y / f.height : 0;
fo.on = true;
break;
}
this.rawNode.fill.opacity = 1;
return this;
}
this.fillStyle = dojo.gfx.normalizeColor(fill);
this.rawNode.fillcolor = this.fillStyle.toHex();
this.rawNode.fill.opacity = this.fillStyle.a;
this.rawNode.filled = true;
return this;
}, setStroke:function (stroke) {
if (!stroke) {
this.strokeStyle = null;
this.rawNode.stroked = false;
return this;
}
this.strokeStyle = dojo.gfx.makeParameters(dojo.gfx.defaultStroke, stroke);
this.strokeStyle.color = dojo.gfx.normalizeColor(this.strokeStyle.color);
var s = this.strokeStyle;
this.rawNode.stroked = true;
this.rawNode.strokecolor = s.color.toCss();
this.rawNode.strokeweight = s.width + "px";
if (this.rawNode.stroke) {
this.rawNode.stroke.opacity = s.color.a;
this.rawNode.stroke.endcap = this._translate(this._capMap, s.cap);
if (typeof (s.join) == "number") {
this.rawNode.stroke.joinstyle = "miter";
this.rawNode.stroke.miterlimit = s.join;
} else {
this.rawNode.stroke.joinstyle = s.join;
}
}
return this;
}, _capMap:{butt:"flat"}, _capMapReversed:{flat:"butt"}, _translate:function (dict, value) {
return (value in dict) ? dict[value] : value;
}, _applyTransform:function () {
var matrix = this._getRealMatrix();
if (!matrix) {
return this;
}
var skew = this.rawNode.skew;
if (typeof (skew) == "undefined") {
for (var i = 0; i < this.rawNode.childNodes.length; ++i) {
if (this.rawNode.childNodes[i].tagName == "skew") {
skew = this.rawNode.childNodes[i];
break;
}
}
}
if (skew) {
skew.on = false;
var mt = matrix.xx.toFixed(8) + " " + matrix.xy.toFixed(8) + " " + matrix.yx.toFixed(8) + " " + matrix.yy.toFixed(8) + " 0 0";
var offset = Math.floor(matrix.dx).toFixed() + "px " + Math.floor(matrix.dy).toFixed() + "px";
var l = parseFloat(this.rawNode.style.left);
var t = parseFloat(this.rawNode.style.top);
var w = parseFloat(this.rawNode.style.width);
var h = parseFloat(this.rawNode.style.height);
if (isNaN(l)) {
l = 0;
}
if (isNaN(t)) {
t = 0;
}
if (isNaN(w)) {
w = 1;
}
if (isNaN(h)) {
h = 1;
}
var origin = (-l / w - 0.5).toFixed(8) + " " + (-t / h - 0.5).toFixed(8);
skew.matrix = mt;
skew.origin = origin;
skew.offset = offset;
skew.on = true;
}
return this;
}, setRawNode:function (rawNode) {
rawNode.stroked = false;
rawNode.filled = false;
this.rawNode = rawNode;
}, attachFill:function (rawNode) {
var fillStyle = null;
var fo = rawNode.fill;
if (rawNode) {
if (fo.on && fo.type == "gradient") {
var fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultLinearGradient, true);
var rad = dojo.math.degToRad(fo.angle);
fillStyle.x2 = Math.cos(rad);
fillStyle.y2 = Math.sin(rad);
fillStyle.colors = [];
var stops = fo.colors.value.split(";");
for (var i = 0; i < stops.length; ++i) {
var t = stops[i].match(/\S+/g);
if (!t || t.length != 2) {
continue;
}
fillStyle.colors.push({offset:dojo.gfx.vml._parseFloat(t[0]), color:new dojo.gfx.color.Color(t[1])});
}
} else {
if (fo.on && fo.type == "gradientradial") {
var fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultRadialGradient, true);
var w = parseFloat(rawNode.style.width);
var h = parseFloat(rawNode.style.height);
fillStyle.cx = isNaN(w) ? 0 : fo.focusposition.x * w;
fillStyle.cy = isNaN(h) ? 0 : fo.focusposition.y * h;
fillStyle.r = isNaN(w) ? 1 : w / 2;
fillStyle.colors = [];
var stops = fo.colors.value.split(";");
for (var i = stops.length - 1; i >= 0; --i) {
var t = stops[i].match(/\S+/g);
if (!t || t.length != 2) {
continue;
}
fillStyle.colors.push({offset:dojo.gfx.vml._parseFloat(t[0]), color:new dojo.gfx.color.Color(t[1])});
}
} else {
if (fo.on && fo.type == "tile") {
var fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultPattern, true);
fillStyle.width = dojo.gfx.vml.pt2px(fo.size.x);
fillStyle.height = dojo.gfx.vml.pt2px(fo.size.y);
fillStyle.x = fo.origin.x * fillStyle.width;
fillStyle.y = fo.origin.y * fillStyle.height;
fillStyle.src = fo.src;
} else {
if (fo.on && rawNode.fillcolor) {
fillStyle = new dojo.gfx.color.Color(rawNode.fillcolor + "");
fillStyle.a = fo.opacity;
}
}
}
}
}
return fillStyle;
}, attachStroke:function (rawNode) {
var strokeStyle = dojo.lang.shallowCopy(dojo.gfx.defaultStroke, true);
if (rawNode && rawNode.stroked) {
strokeStyle.color = new dojo.gfx.color.Color(rawNode.strokecolor.value);
dojo.debug("We are expecting an .75pt here, instead of strokeweight = " + rawNode.strokeweight);
strokeStyle.width = dojo.gfx.vml.normalizedLength(rawNode.strokeweight + "");
strokeStyle.color.a = rawNode.stroke.opacity;
strokeStyle.cap = this._translate(this._capMapReversed, rawNode.stroke.endcap);
strokeStyle.join = rawNode.stroke.joinstyle == "miter" ? rawNode.stroke.miterlimit : rawNode.stroke.joinstyle;
} else {
return null;
}
return strokeStyle;
}, attachTransform:function (rawNode) {
var matrix = {};
if (rawNode) {
var s = rawNode.skew;
matrix.xx = s.matrix.xtox;
matrix.xy = s.matrix.ytox;
matrix.yx = s.matrix.xtoy;
matrix.yy = s.matrix.ytoy;
matrix.dx = dojo.gfx.vml.pt2px(s.offset.x);
matrix.dy = dojo.gfx.vml.pt2px(s.offset.y);
}
return dojo.gfx.matrix.normalize(matrix);
}, attach:function (rawNode) {
if (rawNode) {
this.rawNode = rawNode;
this.shape = this.attachShape(rawNode);
this.fillStyle = this.attachFill(rawNode);
this.strokeStyle = this.attachStroke(rawNode);
this.matrix = this.attachTransform(rawNode);
}
}});
dojo.declare("dojo.gfx.Group", dojo.gfx.shape.VirtualGroup, {add:function (shape) {
if (this != shape.getParent()) {
this.rawNode.appendChild(shape.rawNode);
dojo.gfx.Group.superclass.add.apply(this, arguments);
}
return this;
}, remove:function (shape, silently) {
if (this == shape.getParent()) {
if (this.rawNode == shape.rawNode.parentNode) {
this.rawNode.removeChild(shape.rawNode);
}
dojo.gfx.Group.superclass.remove.apply(this, arguments);
}
return this;
}, attach:function (rawNode) {
if (rawNode) {
this.rawNode = rawNode;
this.shape = null;
this.fillStyle = null;
this.strokeStyle = null;
this.matrix = null;
}
}});
dojo.gfx.Group.nodeType = "group";
var zIndex = {moveToFront:function () {
this.rawNode.parentNode.appendChild(this.rawNode);
return this;
}, moveToBack:function () {
this.rawNode.parentNode.insertBefore(this.rawNode, this.rawNode.parentNode.firstChild);
return this;
}};
dojo.lang.extend(dojo.gfx.Shape, zIndex);
dojo.lang.extend(dojo.gfx.Group, zIndex);
delete zIndex;
dojo.declare("dojo.gfx.Rect", dojo.gfx.shape.Rect, {attachShape:function (rawNode) {
var arcsize = rawNode.outerHTML.match(/arcsize = \"(\d*\.?\d+[%f]?)\"/)[1];
arcsize = (arcsize.indexOf("%") >= 0) ? parseFloat(arcsize) / 100 : dojo.gfx.vml._parseFloat(arcsize);
var style = rawNode.style;
var width = parseFloat(style.width);
var height = parseFloat(style.height);
var o = dojo.gfx.makeParameters(dojo.gfx.defaultRect, {x:parseInt(style.left), y:parseInt(style.top), width:width, height:height, r:Math.min(width, height) * arcsize});
return o;
⌨️ 快捷键说明
复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?