Author: jmorliaguet
Date: Sat Dec 24 15:03:52 2005
New Revision: 2074
Added:
cpsskins/branches/jmo-perspectives/ui/framework/pdlib2.js (contents, props
changed)
Log:
- added new version of PDLib based on prototype.js (i.e. slimmed-down and
object-oriented)
so far we have the contextual menus with support for submenus.
Added: cpsskins/branches/jmo-perspectives/ui/framework/pdlib2.js
==============================================================================
--- (empty file)
+++ cpsskins/branches/jmo-perspectives/ui/framework/pdlib2.js Sat Dec 24
15:03:52 2005
@@ -0,0 +1,158 @@
+// Copyright (c) 2002 Zope Corporation and Contributors.
+// All Rights Reserved.
+//
+// This software is subject to the provisions of the Zope Public License,
+// Version 2.0 (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.
+
+// Page design Javascript library
+
+// A library for manipulating objects on a page with object selection,
+// context menus, and drag and drop. Mostly DOM 2 oriented, with bits
+// for IE compatibility.
+
+// - 2005-12-23: Jean-Marc Orliaguet <[EMAIL PROTECTED]>
+// Slimmed-down version of PDLib based on prototype.js
+
+var PDLib = {
+ Version: '2.0'
+}
+
+// Contextual menu
+PDLib.ContextualMenu = Class.create();
+PDLib.ContextualMenu.prototype = {
+
+ setOptions: function(options) {
+ this.options = Object.extend({
+ width: 120,
+ maxwidth: 250
+ }, options || {});
+ },
+
+ initialize: function(menu, actions, options) {
+ this.menunode = $(menu);
+ this.actions = actions;
+ this.setOptions(options || {});
+
+ this.selected = null;
+ this.submenunode = null;
+
+ this.browseEvent = this.browse.bindAsEventListener(this);
+ this.clickEvent = this.click.bindAsEventListener(this);
+
+ Event.observe(document, 'click', this.clickEvent);
+ },
+
+ click: function(e) {
+ var node = Event.element(e);
+ if (this.active) {
+ this.call(node);
+ this.hide();
+ } else {
+ this.selected = Util.getTargetElement(node);
+ Event.observe(this.menunode, 'mouseover', this.browseEvent);
+ this.show(e);
+ }
+ },
+
+ browse: function(e) {
+ node = Event.element(e);
+ if (Element.hasClassName(node, 'submenu')) {
+ this.submenunode = document.getElementsByClassName('items', node)[0];
+ var xpos = this.options.width -5;
+ if (!document.all)
+ xpos += parseInt(this.menunode.style.left);
+ Element.setStyle(this.submenunode, 'left', xpos + 'px');
+ Element.show(this.submenunode);
+ }
+ },
+
+ call: function(item) {
+ if (!item) { return; }
+ var confirm = item.getAttribute("confirm");
+ if (confirm) {
+ if (!window.confirm(confirm)) { return; }
+ }
+ var action = item.getAttribute('action');
+ var choice = item.getAttribute('choice');
+ var handler = this.actions[action];
+ if (handler) { handler(this.selected, choice); }
+ this.hide();
+ },
+
+ hide: function() {
+ Element.hide(this.menunode);
+ Event.stopObserving(this.menunode, 'mouseover', this.browseEvent);
+ this.active = false;
+ },
+
+ show: function(e) {
+ var menunode = this.menunode;
+ var dimensions = Element.getDimensions(menunode);
+ var menuWidth = dimensions['width'];
+ var menuHeight = dimensions['height'];
+ var page_w = window.innerWidth || document.body.clientWidth;
+ var page_h = window.innerHeight || document.body.clientHeight;
+ var x = Event.pointerX(e);
+ var y = Event.pointerY(e);
+
+ var menuX = (x + menuWidth > page_w) ? x - menuWidth -1 : x + 1;
+ var menuY = (y + menuHeight > page_h) ? y - menuHeight -1 : y + 1;
+ Element.setStyle(menunode, 'left', menuX + 'px');
+ Element.setStyle(menunode, 'top', menuY + 'px');
+
+ var width = this.options.width;
+ if (menuWidth >= this.options.maxwidth) {
+ width = this.options.maxwidth;
+ }
+ Element.setStyle(menunode, 'width', width + 'px');
+
+ this.active = true;
+ this.filterMenuItems();
+ Element.show(this.menunode);
+ },
+
+ filterMenuItems: function(node) {
+ var node = node || this.menunode;
+ var selected = this.selected;
+ if (!selected) { return; }
+ if (!node.getAttribute) { return; }
+
+ var enabled = true;
+ var visibility = node.getAttribute("visibility");
+ if (visibility) {
+ enabled = (selected.getAttribute(visibility) == 1);
+ }
+
+ if (enabled) {
+ var choices = node.getAttribute("choices");
+ if (choices) {
+ var items = selected.getAttribute(choices);
+ if (items) {
+ var html = '';
+ var action = node.getAttribute("action");
+ var items = items.split(',');
+ for (var i=0; i<items.length; i++) {
+ var s = items[i].split(':');
+ html += '<a href="#" '
+ + 'action="' + action + '" choice="'
+ + s[0] + '">'
+ + (s[1] ? s[1] : s[0]) + '</a>';
+ }
+ node.innerHTML = html;
+ }
+ }
+ Element.show(node);
+ } else {
+ Element.hide(node);
+ }
+
+ var childnodes = node.childNodes;
+ for (var i = 0; i < childnodes.length; i++)
+ this.filterMenuItems(childnodes[i]);
+ }
+}
+
--
http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins
