Add an icon to turn On / Off right side popup listbox document search result preview.

Add buttons styles.
Clean up some old CSS.

git-svn-id: https://svn.erp5.org/repos/public/erp5/trunk@44279 20353a03-c40f-0410-a6d1-a30d3c3de9de

bt5/erp5_km/SkinTemplateItem/portal_skins/erp5_km_theme/WebSite_viewSearchResultList/listbox.xml

@@ -20,6 +20,7 @@
                 <string>select</string>
                 <string>style_columns</string>
                 <string>title</string>
+                <string>url_columns</string>
               </list>
             </value>
         </item>
@@ -61,6 +62,28 @@
             <key> <string>tales</string> </key>
             <value>
               <dictionary>
+                <item>
+                    <key> <string>count_method</string> </key>
+                    <value> <string></string> </value>
+                </item>
+                <item>
+                    <key> <string>css_class</string> </key>
+                    <value>
+                      <persistent> <string encoding="base64">AAAAAAAAAAI=</string> </persistent>
+                    </value>
+                </item>
+                <item>
+                    <key> <string>default_display_style</string> </key>
+                    <value> <string></string> </value>
+                </item>
+                <item>
+                    <key> <string>display_style_list</string> </key>
+                    <value> <string></string> </value>
+                </item>
+                <item>
+                    <key> <string>editable_columns</string> </key>
+                    <value> <string></string> </value>
+                </item>
                 <item>
                     <key> <string>field_id</string> </key>
                     <value> <string></string> </value>
@@ -69,10 +92,30 @@
                     <key> <string>form_id</string> </key>
                     <value> <string></string> </value>
                 </item>
+                <item>
+                    <key> <string>global_search_column</string> </key>
+                    <value> <string></string> </value>
+                </item>
+                <item>
+                    <key> <string>list_method</string> </key>
+                    <value> <string></string> </value>
+                </item>
+                <item>
+                    <key> <string>select</string> </key>
+                    <value> <string></string> </value>
+                </item>
+                <item>
+                    <key> <string>style_columns</string> </key>
+                    <value> <string></string> </value>
+                </item>
                 <item>
                     <key> <string>target</string> </key>
                     <value> <string></string> </value>
                 </item>
+                <item>
+                    <key> <string>title</string> </key>
+                    <value> <string></string> </value>
+                </item>
               </dictionary>
             </value>
         </item>
@@ -83,7 +126,7 @@
                 <item>
                     <key> <string>count_method</string> </key>
                     <value>
-                      <persistent> <string encoding="base64">AAAAAAAAAAI=</string> </persistent>
+                      <persistent> <string encoding="base64">AAAAAAAAAAM=</string> </persistent>
                     </value>
                 </item>
                 <item>
@@ -151,7 +194,7 @@
                 <item>
                     <key> <string>list_method</string> </key>
                     <value>
-                      <persistent> <string encoding="base64">AAAAAAAAAAM=</string> </persistent>
+                      <persistent> <string encoding="base64">AAAAAAAAAAQ=</string> </persistent>
                     </value>
                 </item>
                 <item>
@@ -181,6 +224,17 @@
                     <key> <string>title</string> </key>
                     <value> <string>Search Results</string> </value>
                 </item>
+                <item>
+                    <key> <string>url_columns</string> </key>
+                    <value>
+                      <list>
+                        <tuple>
+                          <string>getSummaryAsHTML</string>
+                          <string></string>
+                        </tuple>
+                      </list>
+                    </value>
+                </item>
               </dictionary>
             </value>
         </item>
@@ -188,6 +242,19 @@
     </pickle>
   </record>
   <record id="2" aka="AAAAAAAAAAI=">
+    <pickle>
+      <global name="TALESMethod" module="Products.Formulator.TALESField"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_text</string> </key>
+            <value> <string>python: \'hiddenLabel listbox-%s-mode\' %here.portal_selections.getSelectionParamsFor(request.get(\'selection_name\', None), {}).get(\'list_style\', request.get(\'list_style\', \'table\'))</string> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+  <record id="3" aka="AAAAAAAAAAM=">
     <pickle>
       <global name="Method" module="Products.Formulator.MethodField"/>
     </pickle>
@@ -200,7 +267,7 @@
       </dictionary>
     </pickle>
   </record>
-  <record id="3" aka="AAAAAAAAAAM=">
+  <record id="4" aka="AAAAAAAAAAQ=">
     <pickle>
       <global name="Method" module="Products.Formulator.MethodField"/>
     </pickle>

bt5/erp5_km/SkinTemplateItem/portal_skins/erp5_km_theme/km_css/km.css.xml

@@ -831,7 +831,7 @@ div.actions button {\n
 }\n
 \n
 /* Search Popup window */\n
-div.search_popup {\n
+/*div.search_popup {\n
   background-color: #FFFFFF;\n
   border: 1px solid black;\n
   display: none;\n
@@ -841,12 +841,7 @@ div.search_popup {\n
   top: 130px;\n
   width: 150px;\n
   z-index: 100;\n
-}\n
-\n
-/* Search listbox styling */\n
-div.searchDetails, span.found{\n
-  padding-top: 5px;\n
-}\n
+}*/\n
 \n
 /* Download Document in various format widget */\n
 div.download-document-format-list-container{\n
@@ -1108,11 +1103,14 @@ table tbody tr td {\n
   -webkit-transition-timing-function: linear;\n
 }\n
 \n
-.section {\n
+.section, \n
+.owner {\n
   border-bottom: 1px solid #e9e9e9;\n
+  margin-right:5px;\n
 }\n
 \n
 \n
+\n
 /* ## link styling ################################### start # */\n
 \n
 #header a:link, #header a:active, #header a:visited {\n
@@ -1276,22 +1274,6 @@ span.found em{\n
   font-weight: bold;\n
 }\n
 \n
-div.searchDetails a.section-link{\n
-  color: inherit;\n
-}\n
-\n
-div.searchDetails a.reference-link{\n
-  color: #228822;\n
-}\n
-\n
-div.searchDetails a.owner-link{\n
-  color: inherit;\n
-}\n
-\n
-div.searchDetails a.modification-date-link{\n
-  color: inherit;\n
-}\n
-\n
 /* workflow states  colors*/\n
  .draft-state { \n
   color:#4574cb; \n
@@ -1299,7 +1281,8 @@ div.searchDetails a.modification-date-link{\n
  .published-state, .released-state, .shared-state { \n
   color: green; \n
 }\n
-.hidden-state{\n
+.hidden-state,\n
+.deleted-state{\n
   color:red;\n
 }\n
 .archived-state{\n
@@ -1440,6 +1423,70 @@ a.history-link{\n
 li.toolboxSection > div{\n
   bottom:0px;\n
 }\n
+\n
+/* Buttons */\n
+#add_new_gadget_link {\n
+  margin-top:6px;\n
+}\n
+\n
+#stick-gadgets span, \n
+#add-gadgets span {\n
+  display:block;\n
+}\n
+\n
+#stick-gadgets,\n
+#add-gadgets{\n
+  padding:5px 10px;\n
+  height: auto;\n
+  width:auto;\n
+  margin-left: 5px;\n
+}\n
+\n
+div.listbox-action-widget span.description {\n
+  font-size:12px;\n
+}\n
+\n
+.listbox_actions_title{\n
+  display: none;\n
+}\n
+div.listbox-action-widget div.bottom_actions {\n
+  background-color:transparent;\n
+  padding:0em;\n
+}\n
+\n
+div.listbox-action-widget button, \n
+div.listbox-action-widget a.button,\n
+div.listbox-action-widget button > span, \n
+div.listbox-action-widget a > span,\n
+button.formbt, \n
+button.formbt > span,\n
+button.bt-med, \n
+button.bt-med span,\n
+#stick-gadgets,\n
+#add-gadgets {\n
+  background:transparent;\n
+  background-color:#A8A799;\n
+  color: white;\n
+  -webkit-border-radius:4px;\n
+  -moz-border-radius:4px;\n
+  border-radius:4px;\n
+  font-size: 12px;\n
+  font-weight: normal;\n
+}\n
+\n
+\n
+button.formbt {\n
+  height:auto;\n
+  margin-left:5px;\n
+  padding:0 10px 0 0;\n
+}\n
+\n
+button.formbt > span{\n
+  height:auto;\n
+  padding:0;\n
+}\n
+\n
+\n
 </tal:block>
 
 ]]></unicode> </value>

bt5/erp5_km/SkinTemplateItem/portal_skins/erp5_km_theme/km_css/km_listbox.css.xml

@@ -282,6 +282,47 @@ div.listbox-page-navigation button.listbox_next_page span.image {\n
 \n
 div.listbox-page-navigation button.listbox_last_page span.image {\n
   background-image:url(km_img/2rightarrowv.png);\n
+}\n
+\n
+/* Listbox preview */\n
+div.search-details, \n
+span.found{\n
+  padding-top: 5px;\n
+}\n
+\n
+div.search-details .reference-link,\n
+div.search-details .version,\n
+div.search-details .language{\n
+  color: #228822;\n
+}\n
+\n
+div.listbox-search-mode div.maximal-width{\n
+  width: 80%;\n
+}\n
+#listbox-preview-connector{\n
+  height:27px;\n
+  position:absolute;\n
+  left:-10px;\n
+  width:10px;\n
+  top:82px; /* in the middle of #listbox-preview */\n
+  display:inline;\n
+  background: url("left-arrow-connector.png");\n
+}\n
+\n
+#listbox-preview{\n
+  position:relative;\n
+  top:35px; /* will be adjusted by JS */\n
+  width:18%;\n
+  padding-left:5px;\n
+  padding-bottom:15px;\n
+  padding-top:10px;\n
+  background-color:white;\n
+  float:left;\n
+  border:1px solid black;\n
+  -moz-box-shadow:4px 4px 4px rgba(0, 0, 0, 0.5);\n
+  -webkit-box-shadow:4px 4px 4px rgba(0, 0, 0, 0.5);\n
+  min-height:180px;\n
+  z-index:5;\n
 }
 
 ]]></unicode> </value>

bt5/erp5_km/SkinTemplateItem/portal_skins/erp5_km_theme/km_js/erp5_km.js.xml

@@ -12,7 +12,7 @@
         </item>
         <item>
             <key> <string>_EtagSupport__etag</string> </key>
-            <value> <string>ts98286735.58</string> </value>
+            <value> <string>ts99855935.94</string> </value>
         </item>
         <item>
             <key> <string>__name__</string> </key>
@@ -73,38 +73,89 @@ function requestPasswordReset(script_name){\n
   main_form.submit();\n
 };\n
 \n
+//enable or disable right side search result preview\n
+var show_preview=false;\n
 var popup_local_dict={};\n
 var popup_request_dict={};\n
-function showPopik(dom_id, action, path){\n
+\n
+function togglePreview(dom_id,path){\n
   /* \n
-  Show / Hide popup details window up in search mode.\n
+  Enable or disable right preview in search mode listbox style. \n
+  */\n
+  listbox_container = $("#"+dom_id).parents("div.listbox-container")\n
+  if(!$("#listbox-preview").length){\n
+    // init only once per listbox\n
+    listbox_container.append(\'<div id="listbox-preview"><img src="ajax-loader.gif" title="Loading" alt="Loading" /><p>Loading...</p> </div>\');\n
+    show_preview=true;\n
+    showPopik(dom_id, path);\n
+  }\n
+  else{\n
+    // we can switch it off\n
+    $("#listbox-preview").remove();\n
+    show_preview=false;}\n
+}\n
+\n
+function formatPreview(dom_id, path){\n
+  /*\n
+    Format visually the popup preview.\n
   */\n
-  var popup = $("#" + dom_id);\n
-  function delayedDocumentDetailsPopupWindowLoad(){\n
-    $.ajax({url:path+"/Document_getPopupInfo", \n
-            success: function(data){\n
-                           popup.html(data);\n
+  popup = $("#listbox-preview");\n
+  dom_object = $("#"+dom_id);\n
+  parent_row = dom_object.parents("tr").first()\n
+  row_object = dom_object.parents("tr").first();\n
+  class_name = row_object.attr("class"); \n
+  class_name = class_name.replace("listbox-data-line-","");\n
+  class_name = class_name.replace("DataA","");\n
+  class_name = class_name.replace("DataB","");\n
+  row_index = parseInt(class_name);\n
+  //calculate current row offset relative to listbox\'s table.tbody\n
+  offset = parent_row.position("tbody").top - $("tr.listbox-data-line-0").position("tbody").top;\n
+  popup.css("top", offset + "px");\n
+}\n
+\n
+function requestPopupInfo(dom_id, path){\n
+  /*\n
+    Get popup infor from server and cache it locally for page\'s lifetime.\n
+  */\n
+  var popup = $("#listbox-preview");\n
+  popup_request_dict[dom_id] = popup_request_dict;\n
+  $.ajax({url: path + "/Document_getPopupInfo", \n
+          success: function(popup_html){\n
+                           formatPreview(dom_id, path);\n
+                           popup.html(popup_html);\n
                            popup.show();\n
-                           popup_local_dict[dom_id] = data;}});\n
+                           popup_local_dict[dom_id] = popup_html;}});\n
   }\n
   \n
-  if (action){\n
-    if (path==\'\'){popup.show();}\n
-    else{\n
+\n
+function showPopik(dom_id, path){\n
+  /* \n
+    Show / Hide popup details window up in search mode. \n
+  */\n
+  if(!show_preview) return;\n
+  popup = $("#listbox-preview");\n
+  if($("#hidden_popup_listbox_"+dom_id).length){\n
+    // popup info is inline just copy it\n
+    formatPreview(dom_id, path);\n
+    popup_html = $("#hidden_popup_listbox_"+dom_id).html();\n
+    popup.html(popup_html);\n
+    popup.show();\n
+    return\n
+  }\n
   // we must request popup info with another request\n
   popup_html = popup_local_dict[dom_id];\n
-      popup_request = popup_request_dict[dom_id]\n
+  popup_request = popup_request_dict[dom_id];\n
   if (popup_html==undefined&&popup_request==undefined){\n
-        popup_request_dict[dom_id] = path;\n
-        setTimeout(delayedDocumentDetailsPopupWindowLoad, 500);\n
-      }\n
-      else{popup.show();}\n
+    // still not cached for page\'s lifetime not any pending requests to server\n
+    requestPopupInfo(dom_id, path);\n
   }\n
+  else{\n
+    // cached for page\'s lifetime\n
+    formatPreview(dom_id, path);\n
+    popup.html(popup_html);\n
+    popup.show();\n
   }\n
-  else{popup.hide();}\n
-}\n
- \n
-
+}
 
 ]]></string> </value>
         </item>
@@ -114,7 +165,7 @@ function showPopik(dom_id, action, path){\n
         </item>
         <item>
             <key> <string>size</string> </key>
-            <value> <int>2648</int> </value>
+            <value> <int>4458</int> </value>
         </item>
         <item>
             <key> <string>title</string> </key>

bt5/erp5_km/bt/revision

-1772
+1774
\ No newline at end of file