/***
MochiKit.Visual 1.1
See <http://mochikit.com/> for documentation, downloads, license, etc.
(c) 2005 Bob Ippolito and others. All rights Reserved.
***/
if (typeof(dojo) != 'undefined') {
dojo.provide('MochiKit.Visual');
dojo.require('MochiKit.Base');
dojo.require('MochiKit.DOM');
dojo.require('MochiKit.Color');
}
if (typeof(JSAN) != 'undefined') {
JSAN.use("MochiKit.Base", []);
JSAN.use("MochiKit.DOM", []);
JSAN.use("MochiKit.Color", []);
}
try {
if (typeof(MochiKit.Base) == 'undefined' ||
typeof(MochiKit.DOM) == 'undefined' ||
typeof(MochiKit.Color) == 'undefined') {
throw "";
}
} catch (e) {
throw "MochiKit.Visual depends on MochiKit.Base, MochiKit.DOM and MochiKit.Color!";
}
if (typeof(MochiKit.Visual) == "undefined") {
MochiKit.Visual = {};
}
MochiKit.Visual.NAME = "MochiKit.Visual";
MochiKit.Visual.VERSION = "1.1";
MochiKit.Visual.__repr__ = function () {
return "[" + this.NAME + " " + this.VERSION + "]";
};
MochiKit.Visual.toString = function () {
return this.__repr__();
};
MochiKit.Visual._RoundCorners = function (e, options) {
e = MochiKit.DOM.getElement(e);
this._setOptions(options);
if (this.options.__unstable__wrapElement) {
e = this._doWrap(e);
}
var color = this.options.color;
var C = MochiKit.Color.Color;
if (this.options.color == "fromElement") {
color = C.fromBackground(e);
} else if (!(color instanceof C)) {
color = C.fromString(color);
}
this.isTransparent = (color.asRGB().a <= 0);
var bgColor = this.options.bgColor;
if (this.options.bgColor == "fromParent") {
bgColor = C.fromBackground(e.offsetParent);
} else if (!(bgColor instanceof C)) {
bgColor = C.fromString(bgColor);
}
this._roundCornersImpl(e, color, bgColor);
};
MochiKit.Visual._RoundCorners.prototype = {
_doWrap: function (e) {
var parent = e.parentNode;
var doc = MochiKit.DOM.currentDocument();
if (typeof(doc.defaultView) == "undefined"
|| doc.defaultView == null) {
return e;
}
var style = doc.defaultView.getComputedStyle(e, null);
if (typeof(style) == "undefined" || style == null) {
return e;
}
var wrapper = MochiKit.DOM.DIV({"style": {
display: "block",
// convert padding to margin
marginTop: style.getPropertyValue("padding-top"),
marginRight: style.getPropertyValue("padding-right"),
marginBottom: style.getPropertyValue("padding-bottom"),
marginLeft: style.getPropertyValue("padding-left"),
// remove padding so the rounding looks right
padding: "0px"
/*
paddingRight: "0px",
paddingLeft: "0px"
*/
}});
wrapper.innerHTML = e.innerHTML;
e.innerHTML = "";
e.appendChild(wrapper);
return e;
},
_roundCornersImpl: function (e, color, bgColor) {
if (this.options.border) {
this._renderBorder(e, bgColor);
}
if (this._isTopRounded()) {
this._roundTopCorners(e, color, bgColor);
}
if (this._isBottomRounded()) {
this._roundBottomCorners(e, color, bgColor);
}
},
_renderBorder: function (el, bgColor) {
var borderValue = "1px solid " + this._borderColor(bgColor);
var borderL = "border-left: " + borderValue;
var borderR = "border-right: " + borderValue;
var style = "style='" + borderL + ";" + borderR + "'";
el.innerHTML = "<div " + style + ">" + el.innerHTML + "</div>";
},
_roundTopCorners: function (el, color, bgColor) {
var corner = this._createCorner(bgColor);
for (var i = 0; i < this.options.numSlices; i++) {
corner.appendChild(
this._createCornerSlice(color, bgColor, i, "top")
);
}
el.style.paddingTop = 0;
el.insertBefore(corner, el.firstChild);
},
_roundBottomCorners: function (el, color, bgColor) {
var corner = this._createCorner(bgColor);
for (var i = (this.options.numSlices - 1); i >= 0; i--) {
corner.appendChild(
this._createCornerSlice(color, bgColor, i, "bottom")
);
}
el.style.paddingBottom = 0;
el.appendChild(corner);
},
_createCorner: function (bgColor) {
var dom = MochiKit.DOM;
return dom.DIV({style: {backgroundColor: bgColor.toString()}});
},
_createCornerSlice: function (color, bgColor, n, position) {
var slice = MochiKit.DOM.SPAN();
var inStyle = slice.style;
inStyle.backgroundColor = color.toString();
inStyle.display = "block";
inStyle.height = "1px";
inStyle.overflow = "hidden";
inStyle.fontSize = "1px";
var borderColor = this._borderColor(color, bgColor);
if (this.options.border && n == 0) {
inStyle.borderTopStyle = "solid";
inStyle.borderTopWidth = "1px";
inStyle.borderLeftWidth = "0px";
inStyle.borderRightWidth = "0px";
inStyle.borderBottomWidth = "0px";
// assumes css compliant box model
inStyle.height = "0px";
inStyle.borderColor = borderColor.toString();
} else if (borderColor) {
inStyle.borderColor = borderColor.toString();
inStyle.borderStyle = "solid";
inStyle.borderWidth = "0px 1px";
}
if (!this.options.compact && (n == (this.options.numSlices - 1))) {
inStyle.height = "2px";
}
this._setMargin(slice, n, position);
this._setBorder(slice, n, position);
return slice;
},
_setOptions: function (options) {
this.options = {
corners: "all",
color: "fromElement",
bgColor: "fromParent",
blend: true,
border: false,
compact: false,
__unstable__wrapElement: false
};
MochiKit.Base.update(this.options, options);
this.options.numSlices = (this.options.compact ? 2 : 4);
},
_whichSideTop: function () {
var corners = this.options.corners;
if (this._hasString(corners, "all", "top")) {
return "";
}
var has_tl = (corners.indexOf("tl") != -1);
var has_tr = (corners.indexOf("tr") != -1);
if (has_tl && has_tr) {
return "";
}
if (has_tl) {
return "left";
}
if (has_tr) {
return "right";
}
return "";
},
_whichSideBottom: function () {
var corners = this.options.corners;
if (this._hasString(corners, "all", "bottom")) {
return "";
}
var has_bl = (corners.indexOf('bl') != -1);
var has_br = (corners.indexOf('br') != -1);
if (has_bl && has_br) {
return "";
}
if (has_bl) {
return "left";
}
if (has_br) {
return "right";
}
return "";
},
_borderColor: function (color, bgColor) {
if (color == "transparent") {
return bgColor;
} else if (this.options.border) {
return this.options.border;
} else if (this.options.blend) {
return bgColor.blendedColor(color);
}
return "";
},
_setMargin: function (el, n, corners) {
var marginSize = this._marginSize(n) + "px";
var whichSide = (
corners == "top" ? this._whichSideTop() : this._whichSideBottom()
);
var style = el.style;
if (whichSide == "left") {
style.marginLeft = marginSize;
style.marginRight = "0px";
} else if (whichSide == "right") {
style.marginRight = marginSize;
style.marginLeft = "0px";
} else {
style.marginLeft = marginSize;
style.marginRight = marginSize;
}
},
_setBorder: function (el, n, corners) {
var borderSize = this._borderSize(n) + "px";
var whichSide = (
corners == "top" ? this._whichSideTop() : this._whichSideBottom()
);
var style = el.style;
if (whichSide == "left") {
style.borderLeftWidth = borderSize;
style.borderRightWidth = "0px";
} else if (whichSide == "right") {
style.borderRightWidth = borderSize;
style.borderLeftWidth = "0px";
} else {
style.borderLeftWidth = borderSize;
style.borderRightWidth = borderSize;
}
},
_marginSize: function (n) {
if (this.isTransparent) {
return 0;
}
var o = this.options;
if (o.compact && o.blend) {
var smBlendedMarginSizes = [1, 0];
return smBlendedMarginSizes[n];
} else if (o.compact) {
var compactMarginSizes = [2, 1];
return compactMarginSizes[n];
} else if (o.blend) {
var blendedMarginSizes = [3, 2, 1, 0];
return blendedMarginSizes[n];
} else {
var marginSizes = [5, 3, 2, 1];
return marginSizes[n];
}
},
_borderSize: function (n) {
var o = this.options;
var borderSizes;
if (o.compact && (o.blend || this.isTransparent)) {
return 1;
} else if (o.compact) {
borderSizes = [1, 0];
} else if (o.blend) {
borderSizes = [2, 1, 1, 1];
} else if (o.border) {
borderSizes = [0, 2, 0, 0];
} else if (this.isTransparent) {
borderSizes = [5, 3, 2, 1];
} else {
return 0;
}
return borderSizes[n];
},
_hasString: function (str) {
for (var i = 1; i< arguments.length; i++) {
if (str.indexOf(arguments[i]) != -1) {
return true;
}
}
return false;
},
_isTopRounded: function () {
return this._hasString(this.options.corners,
"all", "top", "tl", "tr"
);
},
_isBottomRounded: function () {
return this._hasString(this.options.corners,
"all", "bottom", "bl", "br"
);
},
_hasSingleTextChild: function (el) {
return (el.childNodes.length == 1 && el.childNodes[0].nodeType == 3);
}
};
MochiKit.Visual.roundElement = function (e, options) {
new MochiKit.Visual._RoundCorners(e, options);
};
MochiKit.Visual.roundClass = function (tagName, className, options) {
var elements = MochiKit.DOM.getElementsByTagAndClassName(
tagName, className
);
for (var i = 0; i < elements.length; i++) {
MochiKit.Visual.roundElement(elements[i], options);
}
};
// Compatibility with MochiKit 1.0
MochiKit.Visual.Color = MochiKit.Color.Color;
MochiKit.Visual.getElementsComputedStyle = MochiKit.DOM.computedStyle;
/* end of Rico adaptation */
MochiKit.Visual.__new__ = function () {
var m = MochiKit.Base;
m.nameFunctions(this);
this.EXPORT_TAGS = {
":common": this.EXPORT,
":all": m.concat(this.EXPORT, this.EXPORT_OK)
};
};
MochiKit.Visual.EXPORT = [
"roundElement",
"roundClass"
];
MochiKit.Visual.EXPORT_OK = [];
MochiKit.Visual.__new__();
MochiKit.Base._exportSymbols(this, MochiKit.Visual);