[Zope-CVS] CVS: Products/PageDesign/www - designTopFrame.pt:1.1.1.1.2.2 pagedesign.css:1.1.1.1.2.2 scripts.js:1.2.2.2
Shane Hathaway
shane@cvs.zope.org
Tue, 6 Aug 2002 21:22:21 -0400
Update of /cvs-repository/Products/PageDesign/www
In directory cvs.zope.org:/tmp/cvs-serv16692/www
Modified Files:
Tag: page-redesign-branch
designTopFrame.pt pagedesign.css scripts.js
Log Message:
The Javascript works again on Mozilla and Konqueror.
=== Products/PageDesign/www/designTopFrame.pt 1.1.1.1.2.1 => 1.1.1.1.2.2 ===
// --></script>
</head>
<body bgcolor="black" text="white" link="#ffff00" vlink="#ffff00">
- <p align="center">
+ <div align="center">
Page Design: <b tal:content="here/title">home page</b>
@@ -30,6 +30,6 @@
href="designFrames?preview=1"
target="_top">Preview</a> |
<a href="#" onClick="closeAndReload(); return false;">Close</a>
- </p>
+ </div>
</body>
</html>
=== Products/PageDesign/www/pagedesign.css 1.1.1.1.2.1 => 1.1.1.1.2.2 ===
-#design-palette-window {
- position: fixed;
- left: 0;
- top: 0;
- width: 400;
- background-color: white;
- border: medium outset;
- z-index: 1001;
-}
-
-#design-palette-titlebar {
- background-color: darkblue;
- color: #ffffff;
- font-weight: bold;
-}
-
-#design-palette-contents-box {
- border: medium inset;
-}
-
-#design-palette-contents {
- overflow: scroll;
- min-height: 64px;
-}
-
#design-move-box {
- border: 2px dashed black;
+ border: 1px dotted black;
position: absolute;
display: none;
- z-index: 1002;
+ z-index: 1000;
}
.design-element {
- border: 2px dashed transparent;
+ border: 1px solid black;
+}
+
+.design-element-titlebar {
+ background-color: darkblue;
+ color: #ffffff;
+ font-weight: bold;
}
.design-target {
- border: 1px solid black;
+ border: 2px solid black;
}
=== Products/PageDesign/www/scripts.js 1.2.2.1 => 1.2.2.2 ===
// Page design scripts
var dragging = false;
-var highlighted_element = null;
var highlighted_target = null;
var all_targets = [];
@@ -34,34 +33,9 @@
}
-function unhighlightElement() {
- if (highlighted_element) {
- highlighted_element.style.border = "2px dashed transparent";
- highlighted_element = null;
- }
-}
-
-
-function highlightElement(e, node) {
- if (dragging)
- return;
- if (!e)
- e = event;
- e.stopPropagation();
- unhighlightElement();
- node.style.border = "2px dashed black";
- highlighted_element = node;
-}
-
-
function unhighlightTarget() {
if (highlighted_target) {
- if (highlighted_target.id == "design-palette-window") {
- highlighted_target.style.border = "medium dashed black";
- }
- else {
- highlighted_target.style.border = "1px dashed black";
- }
+ highlighted_target.style.border = "2px solid black";
highlighted_target = null;
}
}
@@ -72,18 +46,7 @@
e = event;
// e.stopPropagation();
unhighlightTarget();
- node.style.border = "1px solid red";
- highlighted_target = node;
-}
-
-
-function highlightPaletteAsTarget(e) {
- if (!e)
- e = event;
- // e.stopPropagation();
- unhighlightTarget();
- var node = document.getElementById('design-palette-window');
- node.style.border = "medium solid red";
+ node.style.border = "2px dotted red";
highlighted_target = node;
}
@@ -97,7 +60,6 @@
var start_x = e.pageX ? e.pageX : e.clientX + document.body.scrollLeft;
var start_y = e.pageY ? e.pageY : e.clientY + document.body.scrollTop;
var dragnode = document.getElementById("design-move-box");
- var palnode = document.getElementById("design-palette-window");
var init_complete = false;
function setupDrag(x, y) {
@@ -106,12 +68,11 @@
var id_after=null;
init_complete = true;
- dragnode.style.left = x + 3;
- dragnode.style.top = y + 3;
- dragnode.style.width = highlighted_element.offsetWidth - 4;
- dragnode.style.height = highlighted_element.offsetHeight - 4;
+ dragnode.style.left = x + 5;
+ dragnode.style.top = y + 5;
+ dragnode.style.width = highlighted_element.offsetWidth - 2;
+ dragnode.style.height = highlighted_element.offsetHeight - 2;
dragnode.style.display = "block";
- unhighlightElement();
id_before = 'targets/' + highlighted_element.id;
parts = String(highlighted_element.id).split('/', 2);
@@ -131,15 +92,6 @@
// the inner area shows up more than once on the page.
continue;
}
- node.style.border = "1px dashed black";
- node.style.visibility = "visible";
- }
-
- if (!hasAncestor(highlighted_element, palnode)) {
- // Enable the palette as a target.
- palnode.style.border = "medium dashed black";
- palnode.onmouseover = highlightPaletteAsTarget;
- palnode.onmouseout = unhighlightTarget;
}
}
@@ -151,15 +103,15 @@
var y = e.pageY ? e.pageY : e.clientY + document.body.scrollTop;
if (!init_complete) {
- if (Math.abs(x - start_x) <= 2 && Math.abs(y - start_y) <= 2) {
+ if (Math.abs(x - start_x) <= 3 && Math.abs(y - start_y) <= 3) {
// Didn't move far enough yet.
return;
}
setupDrag(x, y);
}
- dragnode.style.left = x + 3;
- dragnode.style.top = y + 3;
+ dragnode.style.left = x + 5;
+ dragnode.style.top = y + 5;
}
function finish(e) {
@@ -170,27 +122,11 @@
document.onselectstart = null;
dragnode.style.display = "none";
- for (i = 0; i < all_targets.length; i++) {
- all_targets[i].style.visibility = "hidden";
- }
-
- palnode.style.border = "medium outset";
- palnode.onmouseover = null;
- palnode.onmouseout = null;
-
if (highlighted_target) {
- var target_id = highlighted_target.id;
- if (target_id == 'design-palette-window') {
- target_id = 'targets//';
- highlighted_target.style.border = "medium solid #00ff00";
- }
- else {
- highlighted_target.style.visibility = "visible";
- highlighted_target.style.border = "1px solid #00ff00";
- }
+ highlighted_target.style.border = "2px solid green";
document.location = ('moveElement' +
- "?source_info=" + escape(highlighted_element.id) +
- "&target_info=" + escape(target_id));
+ "?source_path=" + escape(highlighted_element.id) +
+ "&target_path=" + escape(highlighted_target.id));
}
}
@@ -205,22 +141,18 @@
function initDesignNodes(node) {
if (node.className == "design-element") {
- if (!node.onmouseover) {
- function callHighlightElement(e) {
- highlightElement(e, node);
- }
+ if (!node.onmousedown) {
function callDragElement(e) {
dragElement(e, node);
}
- node.onmouseover = callHighlightElement;
- node.onmouseout = unhighlightElement;
node.onmousedown = callDragElement;
node.onclick = ignore;
}
}
else if (node.className == "design-target") {
function callHighlightTarget(e) {
- highlightTarget(e, node);
+ if (dragging)
+ highlightTarget(e, node);
}
node.onmouseover = callHighlightTarget;
node.onmouseout = unhighlightTarget;