Pārlūkot izejas kodu

[search] Several improvements

Support for truncate functions
Moved functions to an external JS file
Changed to a fixed layout (like Google does)
Enrico Berti 12 gadi atpakaļ
vecāks
revīzija
b354dfa

+ 10 - 58
apps/search/src/search/templates/admin_core_template.mako

@@ -183,6 +183,9 @@ ${ commonheader(_('Search'), "search", user) | n,unicode }
                   <option title="${ _('Downloads and embed the file in the browser') }" value="{{#embeddeddownload}} {{/embeddeddownload}}">{{#embeddeddownload}}</option>
                   <option title="${ _('Downloads the linked file') }" value="{{#download}} {{/download}}">{{#download}}</option>
                   <option title="${ _('Preview file in File Browser') }" value="{{#preview}} {{/preview}}">{{#preview}}</option>
+                  <option title="${ _('Truncate a value after 100 characters') }" value="{{#truncate100}} {{/truncate100}}">{{#truncate100}}</option>
+                  <option title="${ _('Truncate a value after 250 characters') }" value="{{#truncate250}} {{/truncate250}}">{{#truncate250}}</option>
+                  <option title="${ _('Truncate a value after 500 characters') }" value="{{#truncate500}} {{/truncate500}}">{{#truncate500}}</option>
                 </select>
                 <a title="${ _('Click on this button to add the field') }" class="btn btn-small" data-bind="click: $root.addFunctionToVisual">
                   <i class="icon-plus"></i>
@@ -234,6 +237,9 @@ ${ commonheader(_('Search'), "search", user) | n,unicode }
                   <option title="${ _('Downloads and embed the file in the browser') }" value="{{#embeddeddownload}} {{/embeddeddownload}}">{{#embeddeddownload}}</option>
                   <option title="${ _('Downloads the linked file') }" value="{{#download}} {{/download}}">{{#download}}</option>
                   <option title="${ _('Preview file in File Browser') }" value="{{#preview}} {{/preview}}">{{#preview}}</option>
+                  <option title="${ _('Truncate a value after 100 characters') }" value="{{#truncate100}} {{/truncate100}}">{{#truncate100}}</option>
+                  <option title="${ _('Truncate a value after 250 characters') }" value="{{#truncate250}} {{/truncate250}}">{{#truncate250}}</option>
+                  <option title="${ _('Truncate a value after 500 characters') }" value="{{#truncate500}} {{/truncate500}}">{{#truncate500}}</option>
                 </select>
                 <a title="${ _('Click on this button to add the field') }" class="btn btn-small" data-bind="click: $root.addFunctionToSource">
                   <i class="icon-plus"></i>
@@ -402,6 +408,7 @@ ${ commonheader(_('Search'), "search", user) | n,unicode }
 <script src="/static/ext/js/moment.min.js" type="text/javascript" charset="utf-8"></script>
 <script src="/static/ext/js/codemirror-xml.js"></script>
 <script src="/static/ext/js/mustache.js"></script>
+<script src="/search/static/js/search.utils.js"></script>
 
 <script type="text/javascript">
 
@@ -559,65 +566,10 @@ ${ commonheader(_('Search'), "search", user) | n,unicode }
       }
       if ($(e.target).attr("href") == "#preview") {
         $("#preview-container").empty();
+        var _mustacheTmpl = fixTemplateDots($("#content-editor").html());
         $(samples).each(function (cnt, item) {
-          item.preview = function () {
-            return function (val) {
-              return '<a href="/filebrowser/view/' + $.trim(Mustache.render(val, item)) + '">' + $.trim(Mustache.render(val, item)) + '</a>';
-            }
-          };
-          item.embeddeddownload = function () {
-            return function (val) {
-              return '<a href="/filebrowser/download/' + $.trim(Mustache.render(val, item)) + '?disposition=inline">' + $.trim(Mustache.render(val, item)) + '</a>';
-            }
-          };
-          item.download = function () {
-            return function (val) {
-              return '<a href="/filebrowser/download/' + $.trim(Mustache.render(val, item)) + '>' + $.trim(Mustache.render(val, item)) + '</a>';
-            }
-          };
-          item.date = function () {
-            return function (val) {
-              return genericFormatDate(val, item, "DD-MM-YYYY");
-            }
-          };
-          item.time = function () {
-            return function (val) {
-              return genericFormatDate(val, item, "HH:mm:ss");
-            }
-          };
-          item.datetime = function () {
-            return function (val) {
-              return genericFormatDate(val, item, "DD-MM-YYYY HH:mm:ss");
-            }
-          };
-          item.fulldate = function () {
-            return function (val) {
-              return genericFormatDate(val, item, null);
-            }
-          };
-          item.timestamp = function () {
-            return function (val) {
-              var d = moment(Mustache.render(val, item));
-              if (d.isValid()) {
-                return d.valueOf();
-              }
-              else {
-                return Mustache.render(val, item);
-              }
-            }
-          };
-          item.fromnow = function () {
-            return function (val) {
-              var d = moment(Mustache.render(val, item));
-              if (d.isValid()) {
-                return d.fromNow();
-              }
-              else {
-                return Mustache.render(val, item);
-              }
-            }
-          };
-          $("<div>").addClass("preview-row").html(Mustache.render($("#content-editor").html(), item)).appendTo($("#preview-container"));
+          addTemplateFunctions(item);
+          $("<div>").addClass("preview-row").html(Mustache.render(_mustacheTmpl, item)).appendTo($("#preview-container"));
         });
       }
     });

+ 17 - 76
apps/search/src/search/templates/search.mako

@@ -26,6 +26,7 @@ ${ commonheader(_('Search'), "search", user, "40px") | n,unicode }
 
 <link rel="stylesheet" href="/search/static/css/search.css">
 <script src="/static/ext/js/moment.min.js" type="text/javascript" charset="utf-8"></script>
+<script src="/search/static/js/search.utils.js" type="text/javascript" charset="utf-8"></script>
 
 <div class="search-bar">
   % if user.is_superuser:
@@ -51,16 +52,16 @@ ${ commonheader(_('Search'), "search", user, "40px") | n,unicode }
     <div class="input-append">
       ${ search_form | n,unicode }
       <div class="icon-search" style="position: absolute;top: 7px;left: 11px;background-image: url('http://twitter.github.com/bootstrap/assets/img/glyphicons-halflings.png');"></div>
-      <button type="submit" class="btn">${ _('Go') }</button>
+      <button type="submit" class="btn"><i class="icon-search"></i></button>
     </div>
   </form>
 </div>
 
-<div class="container-fluid">
-  <div id="loader" class="row-fluid">
+<div class="container">
+  <div id="loader" class="row" style="text-align: center">
     <img src="/static/art/spinner.gif" />
   </div>
-  <div id="mainContent" class="row-fluid hide">
+  <div id="mainContent" class="row hide">
     % if error:
     <div class="span12">
       <div class="alert">
@@ -161,79 +162,9 @@ ${ commonheader(_('Search'), "search", user, "40px") | n,unicode }
           }
         }
 
+        var _mustacheTmpl = fixTemplateDots($("#mustacheTmpl").text());
         $.each(${ json.dumps([result for result in docs]) | n,unicode }, function (index, item) {
-          item.preview = function () {
-            return function (val) {
-              return '<a href="/filebrowser/view/' + $.trim(Mustache.render(val, item)) + '">' + $.trim(Mustache.render(val, item)) + '</a>';
-            }
-          };
-          item.embeddeddownload = function () {
-            return function (val) {
-              return '<a href="/filebrowser/download/' + $.trim(Mustache.render(val, item)) + '?disposition=inline">' + $.trim(Mustache.render(val, item)) + '</a>';
-            }
-          };
-          item.download = function () {
-            return function (val) {
-              return '<a href="/filebrowser/download/' + $.trim(Mustache.render(val, item)) + '>' + $.trim(Mustache.render(val, item)) + '</a>';
-            }
-          };
-          item.date = function () {
-            return function (val) {
-              return genericFormatDate(val, item, "DD-MM-YYYY");
-            }
-          };
-          item.time = function () {
-            return function (val) {
-              return genericFormatDate(val, item, "HH:mm:ss");
-            }
-          };
-          item.datetime = function () {
-            return function (val) {
-              return genericFormatDate(val, item, "DD-MM-YYYY HH:mm:ss");
-            }
-          };
-          item.fulldate = function () {
-            return function (val) {
-              return genericFormatDate(val, item, null);
-            }
-          };
-          item.timestamp = function () {
-            return function (val) {
-              var d = moment(Mustache.render(val, item));
-              if (d.isValid()) {
-                return d.valueOf();
-              }
-              else {
-                return Mustache.render(val, item);
-              }
-            }
-          };
-          item.fromnow = function () {
-            return function (val) {
-              var d = moment(Mustache.render(val, item));
-              if (d.isValid()) {
-                return d.fromNow();
-              }
-              else {
-                return Mustache.render(val, item);
-              }
-            }
-          };
-
-          // fix the fields that contain dots in the name
-          for (var prop in item) {
-            if (item.hasOwnProperty(prop) && prop.indexOf(".") > -1) {
-              item[prop.replace(/\./gi, "_")] = item[prop];
-            }
-          }
-          var _mustacheTmpl = $("#mustacheTmpl").text();
-          var _mustacheTags = _mustacheTmpl.match(/{{(.*?)}}/g);
-          $.each(_mustacheTags, function (cnt, tag) {
-            if (tag.indexOf(".") > -1) {
-              _mustacheTmpl = _mustacheTmpl.replace(tag, tag.replace(/\./gi, "_"))
-            }
-          });
-
+          addTemplateFunctions(item);
           $("<div>").addClass("result-row").html(
             Mustache.render(_mustacheTmpl, item)
           ).appendTo($("#result-container"));
@@ -279,6 +210,7 @@ ${ hue_core.result.get_extracode() | n,unicode }
 
 <script>
   $(document).ready(function () {
+
     $("#loader").hide();
     $("#mainContent").removeClass("hide");
     window.onbeforeunload = function (e) {
@@ -358,6 +290,15 @@ ${ hue_core.result.get_extracode() | n,unicode }
       location.href = "?query=${solr_query["q"]}&fq=${solr_query["fq"]}&rows=${solr_query["rows"]}&start=${solr_query["start"]}" + (_sort != "" ? "&sort=" + _sort : "");
     });
 
+    $("#id_query").focus();
+
+    $(document).on("keydown", function () {
+      if (!$("#id_query").is(":focus")) {
+        $("#id_query").focus();
+        $("#id_query").val($("#id_query").val());
+      }
+    });
+
     $("#id_query").on("click", function (e) {
       if (e.pageX - $(this).position().left >= $(this).width()) {
         $(this).val("");

+ 4 - 0
apps/search/static/css/search.css

@@ -1,3 +1,7 @@
+.container {
+  margin-left: 20px!important;
+}
+
 .dropdown-menu li {
   font-size: 14px;
 }

+ 125 - 0
apps/search/static/js/search.utils.js

@@ -0,0 +1,125 @@
+// Licensed to Cloudera, Inc. under one
+// or more contributor license agreements.  See the NOTICE file
+// distributed with this work for additional information
+// regarding copyright ownership.  Cloudera, Inc. licenses this file
+// to you under the Apache License, Version 2.0 (the
+// "License"); you may not use this file except in compliance
+// with the License.  You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+function addTemplateFunctions(item) {
+  if (Mustache == "undefined") {
+    return;
+  }
+
+  item.preview = function () {
+    return function (val) {
+      return '<a href="/filebrowser/view/' + $.trim(Mustache.render(val, item)) + '">' + $.trim(Mustache.render(val, item)) + '</a>';
+    }
+  };
+  item.embeddeddownload = function () {
+    return function (val) {
+      return '<a href="/filebrowser/download/' + $.trim(Mustache.render(val, item)) + '?disposition=inline">' + $.trim(Mustache.render(val, item)) + '</a>';
+    }
+  };
+  item.download = function () {
+    return function (val) {
+      return '<a href="/filebrowser/download/' + $.trim(Mustache.render(val, item)) + '>' + $.trim(Mustache.render(val, item)) + '</a>';
+    }
+  };
+  item.date = function () {
+    return function (val) {
+      return genericFormatDate(val, item, "DD-MM-YYYY");
+    }
+  };
+  item.time = function () {
+    return function (val) {
+      return genericFormatDate(val, item, "HH:mm:ss");
+    }
+  };
+  item.datetime = function () {
+    return function (val) {
+      return genericFormatDate(val, item, "DD-MM-YYYY HH:mm:ss");
+    }
+  };
+  item.fulldate = function () {
+    return function (val) {
+      return genericFormatDate(val, item, null);
+    }
+  };
+  item.timestamp = function () {
+    return function (val) {
+      var d = moment(Mustache.render(val, item));
+      if (d.isValid()) {
+        return d.valueOf();
+      }
+      else {
+        return Mustache.render(val, item);
+      }
+    }
+  };
+  item.fromnow = function () {
+    return function (val) {
+      var d = moment(Mustache.render(val, item));
+      if (d.isValid()) {
+        return d.fromNow();
+      }
+      else {
+        return Mustache.render(val, item);
+      }
+    }
+  };
+  item.truncate50 = function () {
+    return _truncate(50);
+  };
+  item.truncate100 = function () {
+    return _truncate(100);
+  };
+  item.truncate200 = function () {
+    return _truncate(200);
+  };
+  item.truncate250 = function () {
+    return _truncate(250);
+  };
+  item.truncate500 = function () {
+    return _truncate(500);
+  };
+  item.truncate1000 = function () {
+    return _truncate(1000);
+  };
+
+  function _truncate(length) {
+    return function (val) {
+      var _val = $.trim(Mustache.render(val, item));
+      if (_val.length > length) {
+        return _val.substr(0, length) + "&hellip;";
+      }
+      return _val;
+    }
+  }
+
+  // fix the fields that contain dots in the name
+  for (var prop in item) {
+    if (item.hasOwnProperty(prop) && prop.indexOf(".") > -1) {
+      item[prop.replace(/\./gi, "_")] = item[prop];
+    }
+  }
+}
+
+function fixTemplateDots(template) {
+  var _mustacheTmpl = template;
+  var _mustacheTags = _mustacheTmpl.match(/{{(.*?)}}/g);
+  $.each(_mustacheTags, function (cnt, tag) {
+    if (tag.indexOf(".") > -1) {
+      _mustacheTmpl = _mustacheTmpl.replace(tag, tag.replace(/\./gi, "_"))
+    }
+  });
+  return _mustacheTmpl;
+}