Author: eallen Date: 2009-06-08 14:55:08 -0400 (Mon, 08 Jun 2009) New Revision: 3436 Modified: mgmt/trunk/cumin/python/cumin/page.strings mgmt/trunk/cumin/resources/app.css mgmt/trunk/cumin/resources/app.js Log: Simplify widget zoom. Move fullpage icon closer to actual right side of widget. Modified: mgmt/trunk/cumin/python/cumin/page.strings =================================================================== --- mgmt/trunk/cumin/python/cumin/page.strings 2009-06-08 18:24:33 UTC (rev 3435) +++ mgmt/trunk/cumin/python/cumin/page.strings 2009-06-08 18:55:08 UTC (rev 3436) @@ -16,8 +16,8 @@ vertical-align: top; } -table.OverviewTab h2 img { - vertical-align: -15%; +h2 img { + vertical-align: bottom; margin: 0 0.2em 0 0; } Modified: mgmt/trunk/cumin/resources/app.css =================================================================== --- mgmt/trunk/cumin/resources/app.css 2009-06-08 18:24:33 UTC (rev 3435) +++ mgmt/trunk/cumin/resources/app.css 2009-06-08 18:55:08 UTC (rev 3436) @@ -486,34 +486,13 @@ div.fullpaged { background-color: white; border: 10px solid white; - width: 98%; - position: absolute; + width: 98% !important; + position: absolute !important; left: 0px; top: 0px; z-index: 201; } -div.fullpageTitle { - height: 22px; - width: 100%; - position: absolute; - padding-top: 2px; - display: none; - top: -2px; - left: -4px; - overflow: hidden; - z-index: 0; -} - -div.fullpageTitleBar { - position: absolute; - height: 22px; - top: -2px; - left: -4px; - width: 100%; - z-index: 3; -} - p.fullpageIcon { background-color: white; border-top: 2px solid #685B8A; @@ -529,7 +508,7 @@ z-index: 4; position: absolute; top: -2px; - right: 14px; + right: 4px; display: none; } div.fullpageable:hover div.fullpageTitle, @@ -546,14 +525,11 @@ border-right: 1px solid #cbb4ff; } -div.fullpaged div.fullpageTitle { +div.fullpaged h2 { background-color: #E7E7F7; + padding: 0.25em; } -div.widgetContainer { - position: relative; - z-index: 1; -} div.fullpageBack { background-color: white; position: absolute; Modified: mgmt/trunk/cumin/resources/app.js =================================================================== --- mgmt/trunk/cumin/resources/app.js 2009-06-08 18:24:33 UTC (rev 3435) +++ mgmt/trunk/cumin/resources/app.js 2009-06-08 18:55:08 UTC (rev 3436) @@ -208,44 +208,27 @@ } this.makeFullPageable = function (element) { - if (element.getElement(".fullpageTitle")) + if (element.getParent().getElement(".fullpageIcon")) return; // already fullpaged - element.removeClass('fullpageable'); - var outer = new Element('div', {'class': 'fullpageable'}); - var titleBack = new Element('div', {'class': 'fullpageTitle'}); - var titleBar = new Element('div', {'class': 'fullpageTitleBar', - 'events': {'dblclick': function () {fullpage(this);}}}); var icon = new Element('p', {'class': 'fullpageIcon', 'title': 'Full Page', - 'events': {'click': function () {fullpage(this);}}}); - var container = new Element('div', {'class': 'widgetContainer'}); + 'events': {'click': function () {fullpage(this)}}}); - outer.appendChild(titleBack); - outer.appendChild(titleBar); - outer.appendChild(icon); - outer.appendChild(container); + var title = element.getElement("h2"); + if (title) { + icon.inject(title, 'before'); + title.addEvent('dblclick', function () {fullpage(icon)}); + } + element.originalParent = element.getParent(); - var parent = element.parentNode; - outer.originalParent = parent; - container.appendChild(element); - - parent.appendChild(outer); - var widgets = element.getElements('.fullpage_notify'); - outer.widgetPaths = []; + element.widgetPaths = []; widgets.each(function (widget) { if (widget.get("id")) { - outer.widgetPaths.push(widget.get("id")); + element.widgetPaths.push(widget.get("id")); } }); - - if (element.onfullpage) { - outer.onfullpage = element.onfullpage; - } - if (element.onrestore) { - outer.onrestore = element.onrestore; - } } } }()) @@ -265,55 +248,44 @@ /* called when the full page icon is clicked */ function fullpage(oIcon) { - var oFullPage = oIcon; - if (!oFullPage.hasClass("fullpageable")) { - try { - oFullPage = oIcon.parentNode; - } catch (e) {} - } + var oFullPage = oIcon.getParent(); - if (!oFullPage || !oFullPage.hasClass("fullpageable")) { - oFullPage = $("fullpage"); + var oBack = $("fullpageBack"); + if (!oBack) { + oBack = new Element('div', {'class': 'fullpageBack', 'id': 'fullpageBack', 'events': {'click': fullpage}}); + document.body.appendChild(oBack); } + if (oFullPage.parentNode == document.body) { + // undo full page + oBack.style.display = "none"; + oFullPage.removeClass('fullpaged'); + oFullPage.addClass('fullpageable'); - if (oFullPage) { - var oBack = $("fullpageBack"); - if (!oBack) { - oBack = new Element('div', {'class': 'fullpageBack', 'id': 'fullpageBack', 'events': {'click': fullpage}}); - document.body.appendChild(oBack); - } - if (oFullPage.parentNode == document.body) { - // undo full page - oBack.style.display = "none"; - oFullPage.id = ""; - oFullPage.className = "fullpageable"; + document.body.style.height = "auto"; + oFullPage.originalParent.appendChild(oFullPage); + oIcon.setProperty("title", "Full Page"); + setFullpageParam(false, oFullPage); + var onrestore = oFullPage.onrestore; + if (onrestore) onrestore(); + window.scrollTo(oFullPage.origScroll.x, oFullPage.origScroll.y); + } else { + // make it full page + oBack.style.display = "block"; + oBack.style.height = Math.max($(document.body).getCoordinates().height, window.getScrollSize().y) + "px"; - document.body.style.height = "auto"; - oFullPage.originalParent.appendChild(oFullPage); - oFullPage.getElement("p.fullpageIcon").setProperty("title", "Full Page"); - setFullpageParam(false, oFullPage); - var onrestore = oFullPage.onrestore; - if (onrestore) onrestore(); - window.scrollTo(oFullPage.origScroll.x, oFullPage.origScroll.y); - } else { - // make it full page - oBack.style.display = "block"; - oBack.style.height = Math.max($(document.body).getCoordinates().height, window.getScrollSize().y) + "px"; - oFullPage.id = "fullpage"; - oFullPage.className = "fullpaged"; - - document.body.style.height = "100%"; - document.body.appendChild(oFullPage); - oFullPage.getElement("p.fullpageIcon").setProperty("title", "Restore"); - setFullpageParam(true, oFullPage); - var onfullpage = oFullPage.onfullpage; - var coords = $(oFullPage).getCoordinates(); - var height = Math.min(Math.max(window.getSize().y - 100, 200), 600); - if (onfullpage) onfullpage(coords.width, height); - var curScroll = window.getScroll(); - oFullPage.origScroll = curScroll; - window.scrollTo(0,0); - } + document.body.style.height = "100%"; + document.body.appendChild(oFullPage); + oFullPage.removeClass('fullpageable'); + oFullPage.addClass('fullpaged'); + oIcon.setProperty("title", "Restore"); + setFullpageParam(true, oFullPage); + var onfullpage = oFullPage.onfullpage; + var coords = $(oFullPage).getCoordinates(); + var height = Math.min(Math.max(window.getSize().y - 100, 200), 600); + if (onfullpage) onfullpage(coords.width, height); + var curScroll = window.getScroll(); + oFullPage.origScroll = curScroll; + window.scrollTo(0,0); } // sets/clears the fullpage parameter in the wooly background update url