/*** MochiKit.Visual 1.3.1 See 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.3.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 = "
" + el.innerHTML + "
"; }, _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);