[Z3lab-checkins] r3193 - in cpsskins/branches/paris-sprint-2006: standard/filters/style ui/screens/elementeditor

[jmorliaguet]

Author: jmorliaguet
Date: Mon May 22 20:35:35 2006
New Revision: 3193

Modified:
   cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.js
   cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.pt
   
cpsskins/branches/paris-sprint-2006/ui/screens/elementeditor/element-editor.css

Log:

- nicer mouseover hint in the style editor



Modified: 
cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.js
==============================================================================
--- cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.js  
(original)
+++ cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.js  
Mon May 22 20:35:35 2006
@@ -11,8 +11,21 @@
   },
 
   'updateLabel': function(info) {
+    var x = Event.pointerX(info);
+    var y = Event.pointerY(info);
+    var box = $('labelInfo');
     var label = info.target.getAttribute("label");
-    $('labelInfo').innerHTML = label || ' ';
+    if (label) {
+      box.innerHTML = label;
+      box.setStyle({left: x + 15 + 'px', top: y + 15 +'px'});
+      box.show();
+    } else {
+      box.hide();
+    }
+  },
+
+  'hideLabel': function(info) {
+    $('labelInfo').hide();
   }
 
 });

Modified: 
cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.pt
==============================================================================
--- cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.pt  
(original)
+++ cpsskins/branches/paris-sprint-2006/standard/filters/style/style_editor.pt  
Mon May 22 20:35:35 2006
@@ -10,7 +10,8 @@
    "rules": {
      "#previewArea": {
        "click": "selectTag",
-       "mouseover": "updateLabel"
+       "mousemove": "updateLabel",
+       "mouseout": "hideLabel"
      }
   }}
   </ins>
@@ -25,10 +26,11 @@
   <table width="100%">
     <tr>
       <td width="50%" valign="top">
-        <div id="labelInfo">&nbsp;</div>
         <div id="previewArea" style="cursor: pointer">
           <ins class="view" tal:content="view/getPreviewDef" />
         </div>
+        <div class="floatingHint" style="display: none"
+             id="labelInfo">&nbsp;</div>
       </td>
       <td width="5%"></td>
       <td width="45%" valign="top">

Modified: 
cpsskins/branches/paris-sprint-2006/ui/screens/elementeditor/element-editor.css
==============================================================================
--- 
cpsskins/branches/paris-sprint-2006/ui/screens/elementeditor/element-editor.css 
    (original)
+++ 
cpsskins/branches/paris-sprint-2006/ui/screens/elementeditor/element-editor.css 
    Mon May 22 20:35:35 2006
@@ -58,3 +58,12 @@
   padding: 0 0.4em
 }
 
+div.floatingHint {
+  padding: 0.5em;
+  border: 1px solid #000;
+  background-color: #ffc;
+  position: absolute;
+  width: 100px;
+  font-size: 0.8em;
+  font-weight: bold;
+}
-- 
http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins