[Zope3-checkins] SVN: Zope3/branches/pagelet-rework/src/zope/app/
Implemented nested menus
Roger Ineichen
roger at projekt01.ch
Fri Sep 16 16:36:25 EDT 2005
Log message for revision 38497:
Implemented nested menus
Added nested menus to the Boston skin.
Adde more skintools
Note: there is no nested menu registred yet.
All menus are toplevel menus right now. We have
to think about a good registration concept if we
like to use nested menus and normal menus in the
configuration files at the same time.
Changed:
U Zope3/branches/pagelet-rework/src/zope/app/boston/browser/skin.css
U Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/configure.zcml
U Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/toolbar.zcml
A Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/zmiactions.zcml
A Zope3/branches/pagelet-rework/src/zope/app/file/ftests/
U Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/__init__.py
U Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/configure.zcml.sample
A Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/divmenu.js
A Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.css
U Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.pt
A Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarArrow.gif
A Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarArrowOver.gif
A Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarGrip.gif
U Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar_layout.pt
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/__init__.py
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/__init__.py
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/configure.zcml.sample
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions.pt
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions_layout.pt
A Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/configure.zcml
-=-
Modified: Zope3/branches/pagelet-rework/src/zope/app/boston/browser/skin.css
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/boston/browser/skin.css 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/boston/browser/skin.css 2005-09-16 20:36:25 UTC (rev 38497)
@@ -99,12 +99,6 @@
font-size: 80%;
}
-ul {
- line-height: 1.5em;
- /* list-style-image: url("bullet.gif"); */
- margin-left: 2em;
- padding:0;
-}
ol {
line-height: 1.5em;
@@ -112,7 +106,7 @@
padding:0;
}
-ul a, ol a {
+ol a {
text-decoration: underline;
}
@@ -231,12 +225,6 @@
width: 100%;
}
-#layout tr.menu td {
- height: 24px;
- background-color: #EBE9DF;
- border: 1px solid #C1BBAC;
-}
-
#layout tr.head{
background-color: #0066CC;
}
Modified: Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/configure.zcml
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/configure.zcml 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/configure.zcml 2005-09-16 20:36:25 UTC (rev 38497)
@@ -14,6 +14,9 @@
<!-- IToolBar slot pagelets -->
<include file="toolbar.zcml" />
+<!--
+ <include file="zmiactions.zcml" />
+-->
<include file="helpaction.zcml" />
<!-- ILeft slot pagelets -->
Modified: Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/toolbar.zcml
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/toolbar.zcml 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/toolbar.zcml 2005-09-16 20:36:25 UTC (rev 38497)
@@ -4,10 +4,58 @@
i18n_domain="tiks">
<configure package="zope.app.skintools.toolbar.browser">
+ <resource
+ name="divmenu.js"
+ file="divmenu.js"
+ layer="zope.app.boston.boston"
+ />
+
+ <resource
+ name="toolbar.css"
+ file="toolbar.css"
+ layer="zope.app.boston.boston"
+ />
+
+ <resource
+ name="toolbarGrip.gif"
+ file="toolbarGrip.gif"
+ layer="zope.app.boston.boston"
+ />
+
+ <resource
+ name="toolbarArrow.gif"
+ file="toolbarArrow.gif"
+ layer="zope.app.boston.boston"
+ />
+
+ <resource
+ name="toolbarArrowOver.gif"
+ file="toolbarArrowOver.gif"
+ layer="zope.app.boston.boston"
+ />
+
<pagelet
for="*"
- slot="zope.app.boston.slots.IToolBar"
+ slot="zope.app.boston.slots.IJavaScript"
+ name="toolbar-js"
+ permission="zope.Public"
+ template="toolbar.pt"
+ layer="zope.app.boston.boston"
+ />
+
+ <pagelet
+ name="toolbar-css"
+ for="*"
+ slot="zope.app.boston.slots.ICSS"
+ permission="zope.Public"
+ template="toolbar.pt"
+ layer="zope.app.boston.boston"
+ />
+
+ <pagelet
name="toolbar"
+ for="*"
+ slot="zope.app.boston.slots.IToolBar"
permission="zope.View"
template="toolbar.pt"
layer="zope.app.boston.boston"
@@ -15,13 +63,22 @@
/>
<pagelet
- name="toolbar_layout"
+ name="toolbar-button"
for="*"
slot="zope.app.skintools.toolbar.IToolBarLayout"
permission="zope.View"
- template="toolbar_layout.pt"
+ template="toolbar.pt"
layer="zope.app.boston.boston"
/>
+
+ <pagelet
+ name="toolbar-item"
+ for="*"
+ slot="zope.app.skintools.toolbar.IToolBarLayout"
+ permission="zope.View"
+ template="toolbar.pt"
+ layer="zope.app.boston.boston"
+ />
</configure>
</configure>
\ No newline at end of file
Added: Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/zmiactions.zcml
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/zmiactions.zcml 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/zmiactions.zcml 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,27 @@
+<configure
+ xmlns:zope="http://namespaces.zope.org/zope"
+ xmlns="http://namespaces.zope.org/browser"
+ i18n_domain="tiks">
+
+ <configure package="zope.app.skintools.zmiactions.browser">
+ <pagelet
+ for="*"
+ slot="zope.app.boston.slots.IToolBar"
+ name="zmiactions"
+ permission="zope.View"
+ template="zmiactions.pt"
+ layer="zope.app.boston.boston"
+ weight="1"
+ />
+
+ <pagelet
+ name="zmiactions_layout"
+ for="*"
+ slot="zope.app.skintools.zmiactions.IZMIActionsLayout"
+ permission="zope.View"
+ template="zmiactions_layout.pt"
+ layer="zope.app.boston.boston"
+ />
+ </configure>
+
+</configure>
\ No newline at end of file
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/boston/pagelets/zmiactions.zcml
___________________________________________________________________
Name: svn:eol-style
+ native
Modified: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/__init__.py
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/__init__.py 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/__init__.py 2005-09-16 20:36:25 UTC (rev 38497)
@@ -21,4 +21,4 @@
class IToolBarLayout(IPageletSlot):
- """This slot contains the layout of a pagelet."""
+ """This slot contains all pagelet for the toolbar layout."""
Modified: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/configure.zcml.sample
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/configure.zcml.sample 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/configure.zcml.sample 2005-09-16 20:36:25 UTC (rev 38497)
@@ -6,10 +6,59 @@
<!-- This is only a sample configure.zcml file
See README.txt in zope.app.skintools for more
information about the skintools concept.
- -->
+ -->
+ <resource
+ name="divmenu.js"
+ file="divmenu.js"
+ layer="the layer of your skin"
+ />
- <!-- pagelet defining the box data -->
+ <resource
+ name="toolbar.css"
+ file="toolbar.css"
+ layer="the layer of your skin"
+ />
+
+ <resource
+ name="toolbarGrip.gif"
+ file="toolbarGrip.gif"
+ layer="the layer of your skin"
+ />
+
+ <resource
+ name="toolbarArrow.gif"
+ file="toolbarArrow.gif"
+ layer="the layer of your skin"
+ />
+
+ <resource
+ name="toolbarArrowOver.gif"
+ file="toolbarArrowOver.gif"
+ layer="the layer of your skin"
+ />
+
+ <!-- pagelet defining javascript -->
<pagelet
+ name="toolbar-js"
+ for="*"
+ slot="the slot used in your skin"
+ permission="zope.Public"
+ template="toolbar.pt"
+ layer="the layer of your skin"
+ />
+
+ <!-- pagelet defining css -->
+ <pagelet
+ name="toolbar-css"
+ for="*"
+ slot="the slot used in your skin"
+ permission="zope.Public"
+ template="toolbar.pt"
+ layer="the layer of your skin"
+ />
+
+ <!-- pagelet defining the toolbar -->
+ <pagelet
name="toolbar"
for="*"
slot="the slot used in your skin"
@@ -19,13 +68,23 @@
weight="2"
/>
- <!-- pagelet defining the layout -->
+ <!-- pagelet defining nested layout -->
<pagelet
- name="toolbar_layout"
+ name="toolbar-button"
for="*"
- slot="zope.app.skintools.toolbar.IToolBarLayout"
- permission="zope.ManageContent"
- template="toolbar_layout.pt"
+ slot="the slot used in your skin"
+ permission="zope.View"
+ template="toolbar.pt"
+ layer="the layer of your skin"
/>
+ <pagelet
+ name="toolbar-item"
+ for="*"
+ slot="the slot used in your skin"
+ permission="zope.View"
+ template="toolbar.pt"
+ layer="the layer of your skin"
+ />
+
</configure>
\ No newline at end of file
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/divmenu.js
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/divmenu.js 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/divmenu.js 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,427 @@
+//----------------------------------------------------------------------------
+// DivMenu renders a nested list of <div> tags to a menu bar. See README.html
+// for a static sample.
+// We move this javascript to zope.app.skintools.javascripts.divmenu later
+//----------------------------------------------------------------------------
+
+var menus = new Array(); // we put each menu in this Array
+
+function DivMenu(id) {
+ this.type = "horizontal";
+ this.menuPosTop = 0;
+ this.menuPosLeft = 0;
+ this.subPosTop = 0;
+ this.subPosLeft = 0;
+ this.arrow = null;
+ this.arrowOver = null;
+ this.id = id;
+ menus[self.id] = this;
+ this.tree = new Array();
+ this.visible = new Array();
+
+ // Browser detection
+ this.browser = {
+ "ie": Boolean(document.body.currentStyle),
+ "ie5": (navigator.appVersion.indexOf("MSIE 5.5") != -1 || navigator.appVersion.indexOf("MSIE 5.0") != -1)
+ };
+ if (!this.browser.ie) {
+ this.browser.ie5 = false;
+ }
+}
+
+/* Initialize the menu */
+DivMenu.prototype.init = function() {
+ document.onmousedown = this.click;
+ if (this.browser.ie && this.browser.ie5) {
+ this.fixWrap();
+ }
+ this.fixSections();
+ this.parse(document.getElementById(this.id).childNodes, this.tree, this.id);
+}
+
+/* Search for menugroup elements and set width for them */
+DivMenu.prototype.fixSections = function() {
+ var arr = document.getElementById(this.id).getElementsByTagName("div");
+ var menugroups = new Array();
+ var widths = new Array();
+
+ for (var i = 0; i < arr.length; i++) {
+ if (arr[i].className == "menugroup") {
+ menugroups.push(arr[i]);
+ }
+ }
+ for (var i = 0; i < menugroups.length; i++) {
+ widths.push(this.getMaxWidth(menugroups[i].childNodes));
+ }
+ for (var i = 0; i < menugroups.length; i++) {
+ menugroups[i].style.width = (widths[i]) + "px";
+ }
+ if (menus[self.id].browser.ie) {
+ for (var i = 0; i < menugroups.length; i++) {
+ this.setMaxWidth(menugroups[i].childNodes, widths[i]);
+ }
+ }
+
+}
+
+DivMenu.prototype.fixWrap = function() {
+ var elements = document.getElementById(this.id).getElementsByTagName("a");
+ for (var i = 0; i < elements.length; i++) {
+ if (/submenu/.test(elements[i].className)) {
+ elements[i].innerHTML = '<div nowrap="nowrap">'+elements[i].innerHTML+'</div>';
+ }
+ }
+}
+
+/* Search for highest width */
+DivMenu.prototype.getMaxWidth = function(nodes) {
+ var maxWidth = 0;
+ for (var i = 0; i < nodes.length; i++) {
+ if (nodes[i].nodeType != 1 || nodes[i].className == "menugroup") {
+ continue;
+ }
+ if (nodes[i].offsetWidth > maxWidth) maxWidth = nodes[i].offsetWidth;
+ }
+ return maxWidth;
+}
+
+/* Set width for submenu elements */
+DivMenu.prototype.setMaxWidth = function(nodes, maxWidth) {
+ for (var i = 0; i < nodes.length; i++) {
+ if (nodes[i].nodeType == 1 && /submenu/.test(nodes[i].className) && nodes[i].currentStyle) {
+ if (this.browser.ie5) {
+ nodes[i].style.width = (maxWidth) + "px";
+ } else {
+ nodes[i].style.width = (maxWidth - parseInt(nodes[i].currentStyle.paddingLeft) - parseInt(nodes[i].currentStyle.paddingRight)) + "px";
+ }
+ }
+ }
+}
+
+/* Parse menu structure, create events and position elements */
+DivMenu.prototype.parse = function(nodes, tree, id) {
+ for (var i = 0; i < nodes.length; i++) {
+ if (nodes[i].nodeType != 1) { continue };
+ switch (nodes[i].className) {
+ case "topmenu":
+ nodes[i].id = id + "-" + tree.length;
+ tree.push(new Array());
+ nodes[i].onmouseover = this.topmenuOverShowsChilds;
+ nodes[i].onclick = this.topmenuClick;
+ break;
+ case "submenu":
+ nodes[i].id = id + "-" + tree.length;
+ tree.push(new Array());
+ nodes[i].onmouseover = this.submenuOver;
+ nodes[i].onmouseout = this.submenuOut;
+ nodes[i].onclick = this.submenuClick;
+ break;
+ case "menugroup":
+ nodes[i].id = id + "-" + (tree.length - 1) + "-menugroup";
+ var parentDiv = document.getElementById(id + "-" + (tree.length - 1));
+ var childDiv = document.getElementById(nodes[i].id);
+ var el = new DivMenuGroup(parentDiv.id);
+ if (el.level == 1) {
+ if (this.type == "horizontal") {
+ childDiv.style.top = (parentDiv.offsetTop + parentDiv.offsetHeight + this.menuPosTop-3) + "px";
+ if (this.browser.ie5) {
+ childDiv.style.left = (2+this.menuPosLeft) + "px";
+ } else {
+ childDiv.style.left = (2+parentDiv.offsetLeft + this.menuPosLeft) + "px";
+ }
+ } else if (this.type == "vertical") {
+ childDiv.style.top = (parentDiv.offsetTop + this.menuPosTop) + "px";
+ if (this.browser.ie5) {
+ childDiv.style.left = (2+parentDiv.offsetWidth + this.menuPosLeft) + "px";
+ } else {
+ childDiv.style.left = (2+parentDiv.offsetLeft + parentDiv.offsetWidth + this.menuPosLeft) + "px";
+ }
+ }
+ } else {
+ childDiv.style.top = (parentDiv.offsetTop + this.subPosTop-3) + "px";
+ childDiv.style.left = (2+parentDiv.offsetLeft + parentDiv.offsetWidth + this.subPosLeft) + "px";
+ }
+ break;
+ case "menuarrow":
+ nodes[i].id = id + "-" + (tree.length - 1) + "-menuarrow";
+ break;
+ }
+ if (nodes[i].childNodes) {
+ if (nodes[i].className == "menugroup") {
+ this.parse(nodes[i].childNodes, tree[tree.length - 1], id + "-" + (tree.length - 1));
+ } else {
+ this.parse(nodes[i].childNodes, tree, id);
+ }
+ }
+ }
+}
+
+/* Hide all menugroups */
+DivMenu.prototype.hideAll = function() {
+ for (var i = this.visible.length - 1; i >= 0; i--) {
+ this.hide(this.visible[i]);
+ }
+}
+
+/* Hide higher or equal levels */
+DivMenu.prototype.hideHigherOrEqualLevels = function(n) {
+ for (var i = this.visible.length - 1; i >= 0; i--) {
+ var el = new DivMenuGroup(this.visible[i]);
+ if (el.level >= n) {
+ this.hide(el.id);
+ } else {
+ return;
+ }
+ }
+}
+
+/* Hide a menugroup */
+DivMenu.prototype.hide = function(id) {
+ var el = new DivMenuGroup(id);
+ document.getElementById(id).className = (el.level == 1 ? "topmenu" : "submenu");
+ if (el.level > 1 && this.arrowOver) {
+ document.getElementById(id + "-menuarrow").src = this.arrow;
+ }
+ document.getElementById(id + "-menugroup").style.visibility = "hidden";
+ document.getElementById(id + "-menugroup").style.zIndex = -1;
+ if (this.visible.contains(id)) {
+ if (this.visible[this.visible.length - 1] == id) {
+ this.visible.pop();
+ }
+ }
+}
+
+/* Show a menugroup */
+DivMenu.prototype.show = function(id) {
+ var el = new DivMenuGroup(id);
+ document.getElementById(id).className = (el.level == 1 ? "topmenu-active" : "submenu-active");
+ if (el.level > 1 && this.arrowOver) {
+ document.getElementById(id + "-menuarrow").src = this.arrowOver;
+ }
+ document.getElementById(id + "-menugroup").style.visibility = "visible";
+ document.getElementById(id + "-menugroup").style.zIndex = 1;
+ this.visible.push(id);
+}
+
+/* event, document.onmousedown */
+DivMenu.prototype.click = function(e) {
+ var el;
+ if (e) {
+ el = e.target.tagName ? e.target : e.target.parentNode;
+ } else {
+ el = window.event.srcElement;
+ if (el.parentNode && /submenu/.test(el.parentNode.className)) {
+ el = el.parentNode;
+ }
+ }
+ if (!menus[self.id].visible.length) { return };
+ if (!el.onclick) { menus[self.id].hideAll(); }
+}
+
+/* event, topmenu.onmouseover will show children*/
+DivMenu.prototype.topmenuOverShowsChilds = function() {
+ var el = new DivMenuGroup(this.id);
+ menus[self.id].hideHigherOrEqualLevels(el.level);
+ if (el.hasChilds()) {
+ menus[self.id].show(this.id);
+ }
+}
+
+/* event, topmenu.onmouseover */
+DivMenu.prototype.topmenuOver = function() {
+ if (!menus[self.id].visible.length) {
+ return;
+ }
+ if (menus[self.id].visible.contains(this.id)) { return };
+ menus[self.id].hideAll();
+ var el = new DivMenuGroup(this.id);
+ if (el.hasChilds()) {
+ menus[self.id].show(this.id);
+ }
+}
+
+/* event, topmenu.onclick */
+DivMenu.prototype.topmenuClick = function() {
+ this.blur();
+ if (menus[self.id].visible.length) {
+ menus[self.id].hideAll();
+ } else {
+ var el = new DivMenuGroup(this.id);
+ if (el.hasChilds()) {
+ menus[self.id].show(this.id);
+ }
+ }
+}
+
+/* event, submenu.onmouseover */
+DivMenu.prototype.submenuOver = function() {
+ var el = new DivMenuGroup(this.id);
+ menus[self.id].hideHigherOrEqualLevels(el.level);
+ if (el.hasChilds()) {
+ menus[self.id].show(this.id);
+ }
+}
+
+/* event, onmouseout hide all children */
+DivMenu.prototype.mouseOutHideAll = function() {
+ menus[self.id].hideAll();
+}
+
+/* event, submenu.onmouseout */
+DivMenu.prototype.submenuOut = function() {
+ var el = new DivMenuGroup(this.id);
+ if (!el.hasChilds()) {
+ document.getElementById(this.id).className = "submenu";
+ }
+}
+
+/* event, submenu.onclick */
+DivMenu.prototype.submenuClick = function() {
+ this.blur();
+ var el = new DivMenuGroup(this.id);
+ menus[self.id].hideHigherOrEqualLevels(el.level);
+ if (el.hasChilds()) {
+ menus[self.id].show(this.id);
+ }
+}
+
+/* DivMenuGroup */
+function DivMenuGroup(id) {
+ this.id = id;
+ this.level = this.getLevel();
+}
+
+/* Get Level of given id */
+DivMenuGroup.prototype.getLevel = function() {
+ menu = menus[self.id]
+ var s = this.id.substr(menu.id.length);
+ return s.split("-").length - 1;
+}
+
+
+/* Check whether an element has a sub menugroup */
+DivMenuGroup.prototype.hasChilds = function() {
+ return Boolean(document.getElementById(this.id + "-menugroup"));
+}
+
+/* add missing Array function if needed (e.g. ie5) */
+if (!Array.prototype.contains) {
+ Array.prototype.contains = function(s) {
+ for (var i = 0; i < this.length; i++) {
+ if (this[i] == s) {
+ return true;
+ }
+ }
+ return false;
+ }
+}
+
+if(!Array.prototype.copy) {
+ Array.prototype.copy=function(a){
+ var i = 0;
+ var b = [];
+ for(i;i<this.length;i++)
+ b[i] = (typeof this[i].copy != 'undefined')?
+ this[i].copy():
+ this[i];
+ return b
+ };
+}
+
+if(!Array.prototype.concat) {
+ Array.prototype.concat=function(a){
+ var i = 0;
+ var b = this.copy();
+ for(i;i<a.length;i++) {
+ b[b.length]=a[i];
+ }
+ return b
+ };
+}
+
+if(!Array.prototype.pop) {
+ Array.prototype.pop=function(){
+ var response = this[this.length - 1]
+ this.length--
+ return response
+ };
+}
+
+if(!Array.prototype.push) {
+ Array.prototype.push=function(){
+ var i = 0;
+ var b = this.length;
+ var a = arguments;
+ for(i;i<a.length;i++) {
+ this[b+i] = a[i];
+ }
+ return this.length
+ };
+}
+
+if(!Array.prototype.shift) {
+ Array.prototype.shift=function(){
+ var i = 0;
+ var b = this[0];
+ for(i;i<this.length-1;i++) {
+ this[i] = this[i+1];
+ }
+ this.length--;
+ return b
+ };
+}
+
+if(!Array.prototype.slice) {
+ Array.prototype.slice=function(a,c){
+ var i = 0;
+ var b;
+ var d = [];
+ if(!c) {
+ c=this.length;
+ }
+ if(c<0) {
+ c=this.length+c;
+ }
+ if(a<0) {
+ a=this.length-a;
+ }
+ if(c<a){
+ b = a;
+ a = c;
+ c = b
+ }
+ for(i;i<c-a;i++)
+ d[i] = this[a+i];
+ return d
+ };
+}
+
+if(!Array.prototype.splice) {
+ Array.prototype.splice=function(a,c){
+ var i = 0;
+ var e = arguments;
+ var d = this.copy();
+ var f = a;
+ if(!c) {
+ c=this.length-a;
+ }
+ for(i;i<e.length-2;i++) {
+ this[a+i]=e[i+2];
+ }
+ for(a;a<this.length-c;a++) {
+ this[a+e.length-2]=d[a-c];
+ }
+ this.length-=c-e.length+2;
+ return d.slice(f,f+c)
+ };
+}
+
+if(!Array.prototype.unshift) {
+ Array.prototype.unshift=function(a){
+ var b;
+ this.reverse();
+ b = this.push(a);
+ this.reverse();
+ return b
+ };
+}
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.css
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.css 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.css 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,87 @@
+div.ToolBarContainer {
+ border-bottom: 1px solid #D8D2BD;
+ padding-top: 1px;
+ padding-bottom: 1px;
+ padding-left: 5px;
+ cursor: default;
+}
+
+.ToolBar {
+ font-family: tahoma, verdana, arial, sans-serif;
+ font-size: 11px;
+}
+
+.ToolBar hr {
+ height: 1px;
+ color: silver;
+}
+
+.ToolBar .topmenu,
+.ToolBar .topmenu:hover,
+.ToolBar .topmenu-active,
+.ToolBar .topmenu-active:hover {
+ line-height: normal;
+ padding: 5px 6px 4px 6px;
+ margin: 1px;
+ color: #000000;
+ text-decoration: none;
+ cursor: default;
+ white-space: nowrap;
+ display: block;
+ position: relative;
+}
+.ToolBar .topmenu:hover {
+ margin: 0px;
+ border: 1px solid #8F8F85;
+ background:#EFECDE;
+}
+.ToolBar .topmenu-active,
+.ToolBar .topmenu-active:hover {
+ margin: 0px;
+ border: 1px solid #8F8F85;
+ border-bottom:none;
+ background:#C9D5E5;
+}
+
+.ToolBar .submenu,
+.ToolBar .submenu:hover,
+.ToolBar .submenu-active,
+.ToolBar .submenu-active:hover {
+ border:1px solid #FDFDF9;
+ background: #FDFDF9;
+ line-height: normal;
+ padding: 3px 30px 3px 20px;
+ color: black;
+ text-decoration: none;
+ cursor: default;
+ white-space: nowrap;
+ display: block;
+ position: relative;
+}
+.ToolBar .submenu:hover,
+.ToolBar .submenu-active,
+.ToolBar .submenu-active:hover {
+ border:1px solid #316BC6;
+ background: #C9D5E5;
+ color: black;
+}
+
+.ToolBar .menugroup {
+ background: #FCFCF8;
+ border: 1px solid;
+ border-color: #F1EFE2 #716F64 #716F64 #F1EFE2;
+ padding: 2px 1px 1px 2px;
+ position: absolute;
+ visibility: hidden;
+ z-index: -1;
+}
+.ToolBar .menuarrow {
+ position: absolute;
+ top: 7px;
+ right: 8px;
+ border: 0;
+}
+
+* html .ToolBar td {
+ position: relative;
+} /* ie 5.0 fix */
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.css
___________________________________________________________________
Name: svn:eol-style
+ native
Modified: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.pt
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.pt 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar.pt 2005-09-16 20:36:25 UTC (rev 38497)
@@ -1,30 +1,81 @@
<html>
<body>
-<metal:block define-macro="toolbar"
- tal:repeat="pagelet pagelets:zope.app.skintools.toolbar.IToolBarLayout">
+<metal:block define-macro="toolbar-css">
+ <style type="text/css" media="all"
+ tal:content="string: @import url(${context/++resource++toolbar.css});">
+ @import url(toolbar.css);
+ </style>
+</metal:block>
- <tal:block metal:use-macro="pagelet">
+<metal:block define-macro="toolbar-js">
+<script type="text/javascript" src="divmenu.js"
+ tal:attributes="src string:${context/++resource++divmenu.js}" ></script>
- <metal:block fill-slot="toolbar">
- <div tal:define="actions context/@@view_get_menu/zmi_actions">
- <span tal:condition="actions"
- tal:omit-tag="">
- <a href="#"
- tal:repeat="info actions"
- tal:attributes="href info/action"
- tal:content="info/title"
- i18n:translate="">
- Action name
- </a>
- </span>
-
- </div>
- </metal:block>
- </tal:block>
+<script type="text/javascript"
+ tal:attributes="language string:JavaScript"
+ tal:content="structure string:
+ var divMenuArrow = new Image(4, 7);
+ divMenuArrow.src = '${context/++resource++toolbarArrow.gif}';
+ var divMenuArrowOver = new Image(4, 7);
+ divMenuArrowOver.src = '${context/++resource++toolbarArrowOver.gif}';">
+</script>
+</metal:block>
+<metal:block define-macro="toolbar">
+<div class="ToolBarContainer">
+ <table cellspacing="0" cellpadding="0" id="toolbar" class="ToolBar">
+ <tr>
+ <td><img src="/++resource++toolbarGrip.gif" width="5" height="18"
+ tal:attributes="src string:${context/++resource++toolbarGrip.gif}" /></td>
+ <td tal:repeat="menuitem context/@@view_get_menu/zmi_actions">
+ <metal:block use-macro="pagelet:zope.app.skintools.toolbar.IToolBarLayout/toolbar-button" />
+ </td>
+ </tr>
+ </table>
+</div>
+<script type="text/javascript"
+ tal:attributes="language string:JavaScript"
+ tal:content="structure string:
+ var toolbar = new DivMenu('toolbar');
+ toolbar.divMenuArrow = '${context/++resource++toolbarArrow.gif}';
+ toolbar.divMenuArrowOver = '${context/++resource++toolbarArrowOver.gif}';
+ toolbar.init();">
+</script>
</metal:block>
+<!-- render first level items with class name 'button' -->
+<metal:block define-macro="toolbar-button">
+ <a href="" class="topmenu"
+ tal:attributes="href menuitem/action"
+ tal:content="menuitem/title"
+ i18n:translate="">
+ </a>
+ <div tal:condition="menuitem/submenu">
+ <tal:block tal:repeat="subitem menuitem/submenu">
+ <tal:block define="menuitem subitem">
+ <metal:block use-macro="pagelet:zope.app.skintools.toolbar.IToolBarLayout/toolbar-item" />
+ </tal:block>
+ </tal:block>
+ </div>
+</metal:block>
+
+<!-- render all except first level items with class name 'item' -->
+<metal:block define-macro="toolbar-item">
+ <a href="" class="submenu"
+ tal:attributes="href menuitem/action"
+ tal:content="menuitem/title"
+ i18n:translate="">
+ </a>
+ <div tal:condition="menuitem/submenu">
+ <tal:block tal:repeat="subitem menuitem/submenu">
+ <tal:block define="menuitem subitem">
+ <metal:block use-macro="pagelet:zope.app.skintools.toolbar.IToolBarLayout/toolbar-item" />
+ </tal:block>
+ </tal:block>
+ </div>
+</metal:block>
+
</body>
</html>
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarArrow.gif
===================================================================
(Binary files differ)
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarArrow.gif
___________________________________________________________________
Name: svn:mime-type
+ image/gif
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarArrowOver.gif
===================================================================
(Binary files differ)
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarArrowOver.gif
___________________________________________________________________
Name: svn:mime-type
+ image/gif
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarGrip.gif
===================================================================
(Binary files differ)
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbarGrip.gif
___________________________________________________________________
Name: svn:mime-type
+ image/gif
Modified: Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar_layout.pt
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar_layout.pt 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/toolbar/browser/toolbar_layout.pt 2005-09-16 20:36:25 UTC (rev 38497)
@@ -2,12 +2,35 @@
<body>
<metal:block define-macro="toolbar_layout">
- <div class="actions">
<metal:block define-slot="toolbar">
zmi actions
</metal:block>
- </div>
</metal:block>
+<metal:block define-macro="itemdisplay">
+ <img class="itemicon"
+ tal:condition="menuitem/icon"
+ tal:attributes="src menuitem/icon" />
+
+ <span tal:content="menuitem/title" />
+
+ <img class="submenuhint" src="/++resource++submenuhint.png"
+ tal:condition="menuitem/submenu"/>
+</metal:block>
+
+<metal:block define-macro="menuitem">
+ <a href=""
+ tal:attributes="href menuitem/action;">
+ <metal:block use-macro="context/@@menudemo_macros/itemdisplay" />
+ </a>
+ <ul tal:condition="menuitem/submenu">
+ <li tal:repeat="subitem menuitem/submenu">
+ <tal:block define="menuitem subitem">
+ <metal:block use-macro="context/@@menudemo_macros/menuitem" />
+ </tal:block>
+ </li>
+ </ul>
+</metal:block>
+
</body>
</html>
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/__init__.py
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/__init__.py 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/__init__.py 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,24 @@
+##############################################################################
+#
+# Copyright (c) 2005 Zope Corporation and Contributors.
+# All Rights Reserved.
+#
+# This software is subject to the provisions of the Zope Public License,
+# Version 2.1 (ZPL). A copy of the ZPL should accompany this distribution.
+# THIS SOFTWARE IS PROVIDED "AS IS" AND ANY AND ALL EXPRESS OR IMPLIED
+# WARRANTIES ARE DISCLAIMED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+# WARRANTIES OF TITLE, MERCHANTABILITY, AGAINST INFRINGEMENT, AND FITNESS
+# FOR A PARTICULAR PURPOSE.
+#
+##############################################################################
+"""Skintools zmiactions
+
+$Id$
+"""
+__docformat__ = "reStructuredText"
+
+from zope.app.pagelet.interfaces import IPageletSlot
+
+
+class IZMIActionsLayout(IPageletSlot):
+ """This slot contains the layout of a pagelet."""
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/__init__.py
___________________________________________________________________
Name: svn:keywords
+ Id
Name: svn:eol-style
+ native
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/__init__.py
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/__init__.py 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/__init__.py 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,17 @@
+##############################################################################
+#
+# Copyright (c) 2005 Zope Corporation and Contributors.
+# All Rights Reserved.
+#
+# This software is subject to the provisions of the Zope Public License,
+# Version 2.1 (ZPL). A copy of the ZPL should accompany this distribution.
+# THIS SOFTWARE IS PROVIDED "AS IS" AND ANY AND ALL EXPRESS OR IMPLIED
+# WARRANTIES ARE DISCLAIMED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+# WARRANTIES OF TITLE, MERCHANTABILITY, AGAINST INFRINGEMENT, AND FITNESS
+# FOR A PARTICULAR PURPOSE.
+#
+##############################################################################
+"""Skintools zmiactions views
+
+$Id$
+"""
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/__init__.py
___________________________________________________________________
Name: svn:keywords
+ Id
Name: svn:eol-style
+ native
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/configure.zcml.sample
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/configure.zcml.sample 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/configure.zcml.sample 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,31 @@
+<configure
+ xmlns:zope="http://namespaces.zope.org/zope"
+ xmlns="http://namespaces.zope.org/browser"
+ i18n_domain="zope">
+
+ <!-- This is only a sample configure.zcml file
+ See README.txt in zope.app.skintools for more
+ information about the skintools concept.
+ -->
+
+ <!-- pagelet defining the box data -->
+ <pagelet
+ name="toolbar"
+ for="*"
+ slot="the slot used in your skin"
+ permission="zope.ManageContent"
+ template="zmiactions.pt"
+ layer="the layer of your skin"
+ weight="2"
+ />
+
+ <!-- pagelet defining the layout -->
+ <pagelet
+ name="toolbar_layout"
+ for="*"
+ slot="zope.app.skintools.toolbar.IZMIActionsLayout"
+ permission="zope.ManageContent"
+ template="zmiactions_layout.pt"
+ />
+
+</configure>
\ No newline at end of file
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions.pt
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions.pt 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions.pt 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,30 @@
+<html>
+<body>
+
+<metal:block define-macro="zmiactions"
+ tal:repeat="pagelet pagelets:zope.app.skintools.zmiactions.IZMIActionsLayout">
+
+ <tal:block metal:use-macro="pagelet">
+
+ <metal:block fill-slot="zmiactions">
+ <div tal:define="actions context/@@view_get_menu/zmi_actions">
+ <span tal:condition="actions"
+ tal:omit-tag="">
+ <a href="#"
+ tal:repeat="info actions"
+ tal:attributes="href info/action"
+ tal:content="info/title"
+ i18n:translate="">
+ Action name
+ </a>
+ </span>
+
+ </div>
+ </metal:block>
+ </tal:block>
+
+</metal:block>
+
+</body>
+</html>
+
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions.pt
___________________________________________________________________
Name: svn:eol-style
+ native
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions_layout.pt
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions_layout.pt 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions_layout.pt 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,13 @@
+<html>
+<body>
+
+<metal:block define-macro="zmiactions_layout">
+ <div class="actions">
+ <metal:block define-slot="zmiactions">
+ zmi actions
+ </metal:block>
+ </div>
+</metal:block>
+
+</body>
+</html>
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/browser/zmiactions_layout.pt
___________________________________________________________________
Name: svn:eol-style
+ native
Added: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/configure.zcml
===================================================================
--- Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/configure.zcml 2005-09-16 20:36:06 UTC (rev 38496)
+++ Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/configure.zcml 2005-09-16 20:36:25 UTC (rev 38497)
@@ -0,0 +1,6 @@
+<configure
+ xmlns="http://namespaces.zope.org/zope">
+
+ <interface interface="zope.app.skintools.zmiactions.IZMIActionsLayout" />
+
+</configure>
\ No newline at end of file
Property changes on: Zope3/branches/pagelet-rework/src/zope/app/skintools/zmiactions/configure.zcml
___________________________________________________________________
Name: svn:eol-style
+ native
More information about the Zope3-Checkins
mailing list