admin_collections.mako 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. ## Licensed to Cloudera, Inc. under one
  2. ## or more contributor license agreements. See the NOTICE file
  3. ## distributed with this work for additional information
  4. ## regarding copyright ownership. Cloudera, Inc. licenses this file
  5. ## to you under the Apache License, Version 2.0 (the
  6. ## "License"); you may not use this file except in compliance
  7. ## with the License. You may obtain a copy of the License at
  8. ##
  9. ## http://www.apache.org/licenses/LICENSE-2.0
  10. ##
  11. ## Unless required by applicable law or agreed to in writing, software
  12. ## distributed under the License is distributed on an "AS IS" BASIS,
  13. ## WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14. ## See the License for the specific language governing permissions and
  15. ## limitations under the License.
  16. <%!
  17. from desktop.views import commonheader, commonfooter
  18. from django.utils.translation import ugettext as _
  19. %>
  20. <%namespace name="macros" file="macros.mako" />
  21. <%namespace name="actionbar" file="actionbar.mako" />
  22. ${ commonheader(_('Search'), "search", user) | n,unicode }
  23. <link rel="stylesheet" href="/search/static/css/admin.css">
  24. <div class="container-fluid">
  25. <h1>${_('Indexes')}</h1>
  26. <%actionbar:render>
  27. <%def name="search()">
  28. <input type="text" placeholder="${_('Filter collections by name...')}" class="input-xxlarge search-query" id="filterInput">
  29. </%def>
  30. </%actionbar:render>
  31. <div class="row-fluid">
  32. <div class="span12">
  33. <ul id="collections">
  34. % for collection in hue_collections:
  35. <li style="cursor: move" data-collection="${ collection.name }">
  36. <a href="${ collection.get_absolute_url() }" class="pull-right" style="margin-top: 10px;margin-right: 10px"><i class="icon-edit"></i> ${_('Edit')}</a>
  37. <h4><i class="icon-list"></i> ${ collection.name } - ${ collection.is_core_only }</h4>
  38. </li>
  39. % endfor
  40. </ul>
  41. </div>
  42. </div>
  43. </div>
  44. <style type="text/css">
  45. #collections {
  46. list-style-type: none;
  47. margin: 0;
  48. padding: 0;
  49. width: 100%;
  50. }
  51. #collections li {
  52. margin-bottom: 10px;
  53. padding: 10px;
  54. border: 1px solid #E3E3E3;
  55. height: 40px;
  56. }
  57. .placeholder {
  58. height: 40px;
  59. background-color: #F5F5F5;
  60. border: 1px solid #E3E3E3;
  61. }
  62. </style>
  63. <script src="/static/ext/js/jquery/plugins/jquery-ui-draggable-droppable-sortable-1.8.23.min.js"></script>
  64. <script type="text/javascript">
  65. $(document).ready(function () {
  66. var orderedCores;
  67. serializeList();
  68. $("#collections").sortable({
  69. placeholder: "placeholder",
  70. update: function (event, ui) {
  71. serializeList();
  72. ##TODO: serialize via ajax the order of collections
  73. ## the array is: orderedCores
  74. ## console.log(orderedCores)
  75. }
  76. });
  77. $("#collections").disableSelection();
  78. function serializeList() {
  79. orderedCores = [];
  80. $("#collections li").each(function () {
  81. orderedCores.push($(this).data("collection"));
  82. });
  83. }
  84. var filter = -1;
  85. $("#filterInput").on("keyup", function () {
  86. clearTimeout(filter);
  87. filter = window.setTimeout(function () {
  88. $("#collections li").removeClass("hide");
  89. $("#collections li").each(function () {
  90. if ($(this).data("collection").toLowerCase().indexOf($("#filterInput").val().toLowerCase()) == -1) {
  91. $(this).addClass("hide");
  92. }
  93. });
  94. }, 300);
  95. });
  96. });
  97. </script>
  98. ${ commonfooter(messages) | n,unicode }