search2.mako 44 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096
  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. ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
  21. <link rel="stylesheet" href="/search/static/css/search.css">
  22. <link href="/static/ext/css/hue-filetypes.css" rel="stylesheet">
  23. <script src="/static/ext/js/moment.min.js" type="text/javascript" charset="utf-8"></script>
  24. <script src="/search/static/js/search.utils.js" type="text/javascript" charset="utf-8"></script>
  25. <div class="search-bar">
  26. % if user.is_superuser:
  27. <div class="pull-right" style="padding-right:50px">
  28. <button type="button" title="${ _('Edit') }" rel="tooltip" data-placement="bottom" data-bind="click: toggleEditing, css: {'btn': true, 'btn-inverse': isEditing}"><i class="fa fa-pencil"></i></button>
  29. <button type="button" title="${ _('Save') }" rel="tooltip" data-placement="bottom" data-loading-text="${ _("Saving...") }" data-bind="click: save, css: {'btn': true}"><i class="fa fa-save"></i></button>
  30. <button type="button" title="${ _('Share') }" rel="tooltip" data-placement="bottom" data-bind="css: {'btn': true}"><i class="fa fa-link"></i></button>
  31. &nbsp;&nbsp;&nbsp;
  32. <a class="btn" href="${ url('search:new_search') }" title="${ _('New') }" rel="tooltip" data-placement="bottom" data-bind="css: {'btn': true}"><i class="fa fa-file-o"></i></a>
  33. <a class="btn" href="${ url('search:admin_collections') }" title="${ _('Collections') }" rel="tooltip" data-placement="bottom" data-bind="css: {'btn': true}"><i class="fa fa-tags"></i></a>
  34. </div>
  35. % endif
  36. <form data-bind="visible: columns().length == 0">
  37. ${ _('Search') }
  38. <!-- ko if: $root.initial.collections -->
  39. <select data-bind="options: $root.initial.collections, value: $root.collection.name">
  40. </select>
  41. <!-- /ko -->
  42. </form>
  43. <form class="form-search" style="margin: 0" data-bind="submit: search, visible: columns().length != 0"">
  44. <strong>${_("Search")}</strong>
  45. <div class="input-append">
  46. <div class="selectMask">
  47. <span class="current-collection" data-bind="text: collection.label"></span>
  48. ## click: show also collection list + edit label box
  49. </div>
  50. <span data-bind="foreach: query.qs">
  51. <input data-bind="value: q" maxlength="256" type="text" class="search-query input-large" style="cursor: auto;">
  52. <!-- ko if: $index() >= 1 -->
  53. <a class="btn" href="javascript:void(0)" data-bind="click: $root.query.removeQ"><i class="fa fa-minus"></i></a>
  54. <!-- /ko -->
  55. </span>
  56. <a class="btn" href="javascript:void(0)" data-bind="click: $root.query.addQ"><i class="fa fa-plus"></i></a>
  57. <button type="submit" id="search-btn" class="btn btn-inverse"><i class="fa fa-search"></i></button>
  58. </div>
  59. </form>
  60. </div>
  61. <div class="card card-toolbar" data-bind="slideVisible: isEditing">
  62. <div style="float: left">
  63. <div class="toolbar-label">${_('LAYOUT')}</div>
  64. <a href="javascript: oneThirdLeftLayout()" onmouseover="viewModel.previewColumns('oneThirdLeft')" onmouseout="viewModel.previewColumns('')">
  65. <div class="layout-container">
  66. <div class="layout-box" style="width: 24px"></div>
  67. <div class="layout-box" style="width: 72px; margin-left: 4px"></div>
  68. </div>
  69. </a>
  70. <!-- <a href="javascript: oneThirdRightLayout()" onmouseover="viewModel.previewColumns('oneThirdRight')" onmouseout="viewModel.previewColumns('')">
  71. <div class="layout-container">
  72. <div class="layout-box" style="width: 72px"></div>
  73. <div class="layout-box" style="width: 24px; margin-left: 4px"></div>
  74. </div>
  75. </a> -->
  76. <a href="javascript: fullLayout()" onmouseover="viewModel.previewColumns('full')" onmouseout="viewModel.previewColumns('')">
  77. <div class="layout-container">
  78. <div class="layout-box" style="width: 100px;"></div>
  79. </div>
  80. </a>
  81. <a data-bind="visible: columns().length == 0" href="javascript: magicLayout(viewModel)" onmouseover="viewModel.previewColumns('magic')" onmouseout="viewModel.previewColumns('')">
  82. <div class="layout-container">
  83. <div class="layout-box" style="width: 100px;"><i class="fa fa-magic"></i></div>
  84. </div>
  85. </a>
  86. </div>
  87. <div style="float: left; margin-left: 20px" data-bind="visible: columns().length > 0">
  88. <div class="toolbar-label">${_('WIDGETS')}</div>
  89. <div class="draggable-widget" data-bind="draggable: {data: draggableResultset, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Grid Results')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-table"></i></a></div>
  90. <div class="draggable-widget" data-bind="draggable: {data: draggableResultset, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('HTML Results')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-code"></i></a></div>
  91. <div class="draggable-widget" data-bind="draggable: {data: draggableFacet, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Text Facet')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-sort-amount-asc"></i></a></div>
  92. <div class="draggable-widget" data-bind="draggable: {data: draggablePie, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Pie Chart')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-pie-chart"></i></a></div>
  93. <!-- <div class="draggable-widget" data-bind="draggable: {data: draggableHit, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Hit Count')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-tachometer"></i></a></div> -->
  94. <div class="draggable-widget" data-bind="draggable: {data: draggableBar, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Bar Chart')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-bar-chart"></i></a></div>
  95. <div class="draggable-widget" data-bind="draggable: {data: draggableLine, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Line')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-line-chart"></i></a></div>
  96. <div class="draggable-widget" data-bind="draggable: {data: draggableHistogram, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Histogram')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-long-arrow-right"></i></a></div>
  97. <div class="draggable-widget" data-bind="draggable: {data: draggableFilter, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Filter Bar')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-filter"></i></a></div>
  98. <div class="draggable-widget" data-bind="draggable: {data: draggableMap, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Map')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-map-chart"></i></a></div>
  99. </div>
  100. <div class="clearfix"></div>
  101. </div>
  102. <div id="emptyDashboard" data-bind="visible: !isEditing() && columns().length == 0">
  103. <div style="float:left; padding-top: 90px; margin-right: 20px; text-align: center; width: 260px">${_('Click on the pencil to get started with your dashboard!')}</div>
  104. <img src="/search/static/art/hint_arrow.png" />
  105. </div>
  106. <div data-bind="visible: isEditing() && previewColumns() != '' && columns().length == 0, css:{'with-top-margin': isEditing()}">
  107. <div class="container-fluid">
  108. <div class="row-fluid" data-bind="visible: previewColumns() == 'oneThirdLeft'">
  109. <div class="span3 preview-row"></div>
  110. <div class="span9 preview-row"></div>
  111. </div>
  112. <div class="row-fluid" data-bind="visible: previewColumns() == 'oneThirdRight'">
  113. <div class="span9 preview-row"></div>
  114. <div class="span3 preview-row"></div>
  115. </div>
  116. <div class="row-fluid" data-bind="visible: previewColumns() == 'full'">
  117. <div class="span12 preview-row">
  118. </div>
  119. </div>
  120. <div class="row-fluid" data-bind="visible: previewColumns() == 'magic'">
  121. <div class="span12 preview-row">
  122. ${ _('Template predefined with some widgets.') }
  123. </div>
  124. </div>
  125. </div>
  126. </div>
  127. <div data-bind="css: {'dashboard': true, 'with-top-margin': isEditing()}">
  128. <div class="container-fluid">
  129. <div class="row-fluid" data-bind="template: { name: 'column-template', foreach: columns}">
  130. </div>
  131. <div class="clearfix"></div>
  132. </div>
  133. </div>
  134. <script type="text/html" id="column-template">
  135. <div data-bind="css: klass">
  136. <div data-bind="template: { name: 'row-template', foreach: rows}">
  137. </div>
  138. <div style="height: 50px; padding-left: 6px" data-bind="visible: $root.isEditing">
  139. <a href="javascript:void(0)" class="btn" style="margin: 4px; margin-right: 10px" data-bind="click: addEmptyRow"><i class="fa fa-plus"></i> ${_('Row')}</a>
  140. </div>
  141. </div>
  142. </script>
  143. <script type="text/html" id="row-template">
  144. <div class="emptyRow" data-bind="visible: widgets().length == 0 && $index() == 0 && $root.isEditing() && $parent.size() > 4 && $parent.rows().length == 1">
  145. <img src="/search/static/art/hint_arrow_flipped.png" style="float:left; margin-right: 10px"/>
  146. <div style="float:left; text-align: center; width: 260px">${_('Drag any of the widgets inside your empty row')}</div>
  147. <div class="clearfix"></div>
  148. </div>
  149. <div class="container-fluid">
  150. <div class="row-header" data-bind="visible: $root.isEditing">
  151. <span class="muted"><i class="fa fa-minus"></i> ${_('Row')}</span>
  152. <div style="display: inline; margin-left: 60px">
  153. <a href="javascript:void(0)" data-bind="visible:$index()<$parent.rows().length-1, click: function(){moveDown($parent, this)}"><i class="fa fa-chevron-down"></i></a>
  154. <a href="javascript:void(0)" data-bind="visible:$index()>0, click: function(){moveUp($parent, this)}"><i class="fa fa-chevron-up"></i></a>
  155. <a href="javascript:void(0)" data-bind="visible:$parent.rows().length > 1, click: function(){remove($parent, this)}"><i class="fa fa-times"></i></a>
  156. </div>
  157. </div>
  158. <div data-bind="css: {'row-fluid': true, 'row-container':true, 'is-editing': $root.isEditing}, sortable: { template: 'widget-template', data: widgets, isEnabled: $root.isEditing, options: {'handle': 'h2', 'opacity': 0.7, 'placeholder': 'row-highlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast');}, 'helper': function(event){$('.card-body').slideUp('fast');var _par = $('<div>');_par.addClass('card card-widget');var _title = $('<h2>');_title.addClass('card-heading simple');_title.text($(event.toElement).text());_title.appendTo(_par);_par.height(80);_par.width(180);return _par;}}, dragged: function(widget){$('.card-body').slideDown('fast');showAddFacetDemiModal(widget);viewModel.search()}}">
  159. </div>
  160. </div>
  161. </script>
  162. <script type="text/html" id="widget-template">
  163. <div data-bind="css: klass">
  164. <h2 class="card-heading simple">
  165. <span data-bind="visible: $root.isEditing">
  166. <a href="javascript:void(0)" data-bind="click: compress, visible: size() > 1"><i class="fa fa-step-backward"></i></a>
  167. <a href="javascript:void(0)" data-bind="click: expand, visible: size() < 12"><i class="fa fa-step-forward"></i></a>
  168. &nbsp;
  169. </span>
  170. <span data-bind="text: name"></span>
  171. <div class="inline pull-right" data-bind="visible: $root.isEditing">
  172. <a href="javascript:void(0)" data-bind="click: function(){remove($parent, this)}"><i class="fa fa-times"></i></a>
  173. </div>
  174. </h2>
  175. <div class="card-body" style="padding: 5px;">
  176. <ul class="nav nav-pills" data-bind="visible: $root.isEditing()">
  177. <li class="active">
  178. <a href="javascript: void(0)" class="widget-main-pill">${_('Preview')}</a>
  179. </li>
  180. <li><a href="javascript: void(0)" class="widget-settings-pill">${_('Settings')}</a></li>
  181. </ul>
  182. <div data-bind="template: { name: function() { return widgetType(); } }" class="widget-main-section"></div>
  183. <div data-bind="visible: $root.isEditing()" class="widget-settings-section">
  184. <ul class="unstyled" style="margin: 10px">
  185. <li>${ _('Name')}: <input type="text" data-bind="value: name" class="input-mini" /></li>
  186. </ul>
  187. </div>
  188. </div>
  189. </div>
  190. </script>
  191. <script type="text/html" id="empty-widget">
  192. ${ _('This is an empty widget.')}
  193. </script>
  194. <script type="text/html" id="hit-widget">
  195. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  196. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  197. <!-- /ko -->
  198. <!-- ko if: $root.getFacetFromQuery(id()) -->
  199. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  200. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  201. ${ _('Label') }: <input type="text" data-bind="value: label" />
  202. </div>
  203. <span data-bind="text: query" />: <span data-bind="text: count" />
  204. </div>
  205. <!-- /ko -->
  206. </script>
  207. <script type="text/html" id="facet-toggle">
  208. ${ _('Label') }: <input type="text" data-bind="value: label" />
  209. <!-- ko if: type() == 'range' -->
  210. <br/>
  211. ${ _('Start') }: <input type="text" data-bind="value: properties.start" />
  212. ${ _('End') }: <input type="text" data-bind="value: properties.end" />
  213. ${ _('Gap') }: <input type="text" data-bind="value: properties.gap" />
  214. <!-- /ko -->
  215. <!-- ko if: type() == 'field' -->
  216. ${ _('Limit') }: <input type="text" data-bind="value: properties.limit" />
  217. <!-- /ko -->
  218. <span data-bind="text: label" style="font-weight: bold"></span>
  219. <a href="javascript: void(0)" class="btn btn-loading" data-bind="visible: properties.canRange, click: $root.collection.toggleRangeFacet" data-loading-text="...">
  220. <i class="fa" data-bind="css: { 'fa-arrows-h': type() == 'range', 'fa-circle': type() == 'field' }"></i>
  221. </a>
  222. <a href="javascript: void(0)" class="btn btn-loading" data-bind="click: $root.collection.toggleSortFacet" data-loading-text="...">
  223. <i class="fa" data-bind="css: { 'fa-caret-down': properties.sort() == 'desc', 'fa-caret-up': properties.sort() == 'asc' }"></i>
  224. </a>
  225. </script>
  226. <script type="text/html" id="facet-widget">
  227. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  228. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  229. <!-- /ko -->
  230. <div class="widget-spinner" data-bind="visible: isLoading()">
  231. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  232. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  233. </div>
  234. <!-- ko if: $root.getFacetFromQuery(id()) -->
  235. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  236. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  237. <span data-bind="template: { name: 'facet-toggle', afterRender: function(){ $root.getWidgetById($parent.id).isLoading(false); } }">
  238. </span>
  239. </div>
  240. <div data-bind="with: $root.collection.getFacetById($parent.id())">
  241. <!-- ko if: type() != 'range' -->
  242. <div data-bind="foreach: $parent.counts">
  243. <div>
  244. <a href="script:void(0)">
  245. <!-- ko if: ! $data.selected -->
  246. <span data-bind="text: $data.value + ' (' + $data.count + ')', click: function(){ $root.query.toggleFacet({facet: $data, widget_id: $parent.id()}) }"></span>
  247. <!-- /ko -->
  248. <!-- ko if: $data.selected -->
  249. <span data-bind="click: function(){ $root.query.toggleFacet({facet: $data, widget_id: $parent.id()}) }">
  250. <span data-bind="text: $data.value"></span>
  251. <i class="fa fa-times"></i>
  252. </span>
  253. <!-- /ko -->
  254. </a>
  255. </div>
  256. </div>
  257. <!-- /ko -->
  258. <!-- ko if: type() == 'range' -->
  259. <div data-bind="foreach: $parent.counts">
  260. <div>
  261. <a href="">
  262. <!-- ko if: ! selected -->
  263. <span data-bind="text: $data.from + ' - ' + $data.to + ' (' + $data.value + ')',
  264. click: function(){ $root.query.selectRangeFacet({count: $data.value, widget_id: $parent.id(), from: $data.from, to: $data.to, cat: $data.field}) }"></span>
  265. <!-- /ko -->
  266. <!-- ko if: selected -->
  267. <span data-bind="click: function(){ $root.query.selectRangeFacet({count: $data.value, widget_id: $parent.id(), from: $data.from, to: $data.to, cat: $data.field}) }">
  268. <span data-bind="text: $data.from + ' - ' + $data.to"></span>
  269. <i class="fa fa-times"></i>
  270. </span>
  271. <!-- /ko -->
  272. </a>
  273. </div>
  274. </div>
  275. <!-- /ko -->
  276. </div>
  277. </div>
  278. <!-- /ko -->
  279. </script>
  280. <script type="text/html" id="resultset-widget">
  281. <div data-bind="visible: $root.isEditing" style="margin-bottom: 20px">
  282. ${_('Results type')}
  283. &nbsp;<a href="javascript: void(0)" data-bind="css:{'btn': true, 'btn-inverse': $root.collection.template.isGridLayout()}, click: function(){$root.collection.template.isGridLayout(true)}"><i class="fa fa-th"></i></a>
  284. &nbsp;<a href="javascript: void(0)" data-bind="css:{'btn': true, 'btn-inverse': !$root.collection.template.isGridLayout()}, click: function(){$root.collection.template.isGridLayout(false)}"><i class="fa fa-code"></i></a>
  285. </div>
  286. <!-- ko if: $root.collection.template.isGridLayout() -->
  287. <div style="float:left; margin-right: 10px" >
  288. <span data-bind="visible: ! $root.collection.template.showFieldList()">
  289. <a href="javascript: void(0)" class="btn"
  290. data-bind="click: function(){ $root.collection.template.showFieldList(true) }">
  291. <i class="fa fa-chevron-right"></i>
  292. </a>
  293. </span>
  294. </div>
  295. <div data-bind="visible: $root.isEditing() || $root.collection.template.showFieldList()" style="float:left; margin-right: 10px" >
  296. <span data-bind="visible: $root.collection.template.showFieldList()">
  297. <a href="javascript: void(0)" class="btn"
  298. data-bind="click: function(){ $root.collection.template.showFieldList(false) }">
  299. <i class="fa fa-chevron-left"></i>
  300. </a>
  301. <strong>${ _('Fields') }</strong>
  302. &nbsp;
  303. <a href="javascript: void(0)" class="btn"
  304. data-bind="click: toggleGridFieldsSelection, css: { 'btn-inverse': $root.collection.template.fields().length > 0 }">
  305. <i class="fa fa-square-o"></i>
  306. </a>
  307. <div data-bind="foreach: $root.collection.template.fieldsAttributes">
  308. <input type="checkbox" data-bind="checkedValue: name, checked: $root.collection.template.fieldsSelected" />
  309. <span data-bind="text: '&nbsp;' + name()"></span>
  310. <br/>
  311. </div>
  312. </span>
  313. </div>
  314. <!-- /ko -->
  315. <!-- ko if: !$root.collection.template.isGridLayout() && $root.isEditing() -->
  316. <textarea data-bind="value: $root.collection.template.template, valueUpdate: 'afterkeydown'" class="span12" style="height: 100px"></textarea>
  317. <br/>
  318. <!-- /ko -->
  319. <div style="overflow-x: auto">
  320. <div data-bind="visible: $root.results().length == 0">
  321. ${ _('Your search did not match any documents.') }
  322. </div>
  323. <!-- ko if: $root.response().response -->
  324. <div data-bind="template: {name: 'resultset-pagination', data: $root.response() }"></div>
  325. <!-- /ko -->
  326. <!-- ko if: $root.collection.template.isGridLayout() -->
  327. <table id="result-container" data-bind="visible: !$root.isRetrievingResults()" style="margin-top: 0">
  328. <thead>
  329. <tr data-bind="visible: $root.results().length > 0, foreach: $root.collection.template.fieldsSelected">
  330. <th data-bind="with: $root.collection.getTemplateField($data)">
  331. <a href="javascript: void(0)" data-bind="visible: $index() > 0, click: function(){ $root.collection.translateSelectedField($index(), 'left'); }"><i class="fa fa-chevron-left"></i></a>
  332. <a href="javascript: void(0)" title="${ _('Sort') }">
  333. <span data-bind="text: name, click: $root.collection.toggleSortColumnGridLayout"></span>
  334. <i class="fa" data-bind="visible: sort.direction() != null, css: { 'fa-chevron-down': sort.direction() == 'desc', 'fa-chevron-up': sort.direction() == 'asc' }"></i>
  335. </a>
  336. <a href="javascript: void(0)" data-bind="visible: $index() < $root.collection.template.fields().length - 1, click: function(){ $root.collection.translateSelectedField($index(), 'right'); }"><i class="fa fa-chevron-right"></i></a>
  337. </th>
  338. </tr>
  339. <tr data-bind="visible: $root.collection.template.fieldsSelected().length == 0">
  340. <th>${ ('Document') }</th>
  341. </tr>
  342. </thead>
  343. <tbody data-bind="foreach: { data: $root.results, as: 'documents' }">
  344. <tr class="result-row" data-bind="foreach: row, click: $root.getDocument">
  345. <td data-bind="html: $data"></td>
  346. </tr>
  347. </tbody>
  348. </table>
  349. <div class="widget-spinner" data-bind="visible: $root.isRetrievingResults()">
  350. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  351. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  352. </div>
  353. <!-- /ko -->
  354. <!-- ko if: ! $root.collection.template.isGridLayout() -->
  355. <div id="result-container" data-bind="foreach: $root.results">
  356. <div class="result-row" data-bind="html: $data"></div>
  357. </div>
  358. <!-- /ko -->
  359. </div>
  360. </script>
  361. <script type="text/html" id="resultset-pagination">
  362. <span data-bind="text: $data.response.numFound"></span> ${ _(' results') } <i class="fa fa-arrow-right"></i>
  363. <span class="pull-right">
  364. <i class="hfo hfo-file-csv"></i>
  365. <i class="hfo hfo-file-xls"></i>
  366. <i class="fa fa-save"></i>
  367. </span>
  368. </script>
  369. <script type="text/html" id="histogram-widget">
  370. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  371. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  372. <!-- /ko -->
  373. <div class="widget-spinner" data-bind="visible: isLoading()">
  374. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  375. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  376. </div>
  377. <!-- ko if: $root.getFacetFromQuery(id()) -->
  378. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  379. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  380. <span data-bind="template: { name: 'facet-toggle' }">
  381. </span>
  382. </div>
  383. ##<a href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  384. <a href="javascript:void(0)" data-bind="click: $root.collection.timeLineZoom"><i class="fa fa-minus"></i></a>
  385. <span>
  386. ${ _('Group By') }
  387. <select data-bind="options: $root.query.multiqs, optionsValue: 'id',optionsText: 'label', value: $root.query.selectedMultiq">
  388. </select>
  389. </span>
  390. <div data-bind="timelineChart: {datum: {counts: counts, extraSeries: extraSeries, widget_id: $parent.id(), label: label}, stacked: $root.collection.getFacetById($parent.id()).properties.stacked(), field: field, label: label, transformer: timelineChartDataTransformer,
  391. onSelectRange: function(from, to){ viewModel.collection.selectTimelineFacet({from: from, to: to, cat: field, widget_id: $parent.id()}) },
  392. onStateChange: function(state){ $root.collection.getFacetById($parent.id()).properties.stacked(state.stacked); },
  393. onComplete: function(){ viewModel.getWidgetById(id).isLoading(false) }}" />
  394. </div>
  395. <!-- /ko -->
  396. </script>
  397. <script type="text/html" id="bar-widget">
  398. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  399. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  400. <!-- /ko -->
  401. <div class="widget-spinner" data-bind="visible: isLoading()">
  402. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  403. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  404. </div>
  405. <!-- ko if: $root.getFacetFromQuery(id()) -->
  406. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  407. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  408. <span data-bind="template: { name: 'facet-toggle' }">
  409. </span>
  410. </div>
  411. <div data-bind="barChart: {datum: {counts: counts, widget_id: $parent.id(), label: label}, stacked: false, field: field, label: label,
  412. transformer: barChartDataTransformer,
  413. onStateChange: function(state){ console.log(state); },
  414. onClick: function(d){ viewModel.query.selectRangeFacet({count: d.obj.value, widget_id: d.obj.widget_id, from: d.obj.from, to: d.obj.to, cat: d.obj.field}) },
  415. onComplete: function(){ viewModel.getWidgetById(id).isLoading(false) } }"
  416. />
  417. </div>
  418. <!-- /ko -->
  419. </script>
  420. <script type="text/html" id="line-widget">
  421. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  422. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  423. <!-- /ko -->
  424. <div class="widget-spinner" data-bind="visible: isLoading()">
  425. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  426. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  427. </div>
  428. <!-- ko if: $root.getFacetFromQuery(id()) -->
  429. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  430. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  431. <span data-bind="template: { name: 'facet-toggle' }">
  432. </span>
  433. </div>
  434. <div data-bind="lineChart: {datum: {counts: counts, widget_id: $parent.id(), label: label}, field: field, label: label,
  435. transformer: lineChartDataTransformer,
  436. onClick: function(d){ viewModel.query.selectRangeFacet({count: d.obj.value, widget_id: d.obj.widget_id, from: d.obj.from, to: d.obj.to, cat: d.obj.field}) },
  437. onComplete: function(){ viewModel.getWidgetById(id).isLoading(false) } }"
  438. />
  439. </div>
  440. <!-- /ko -->
  441. </script>
  442. <script type="text/html" id="pie-widget">
  443. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  444. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  445. <!-- /ko -->
  446. <!-- ko if: $root.getFacetFromQuery(id()) -->
  447. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  448. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  449. <span data-bind="template: { name: 'facet-toggle' }">
  450. </span>
  451. </div>
  452. <div data-bind="with: $root.collection.getFacetById($parent.id())">
  453. <!-- ko if: type() == 'range' -->
  454. <div data-bind="pieChart: {data: {counts: $parent.counts, widget_id: $parent.id}, field: field, fqs: $root.query.fqs,
  455. transformer: rangePieChartDataTransformer,
  456. onClick: function(d){ viewModel.query.selectRangeFacet({count: d.data.obj.value, widget_id: d.data.obj.widget_id, from: d.data.obj.from, to: d.data.obj.to, cat: d.data.obj.field}) },
  457. onComplete: function(){ viewModel.getWidgetById($parent.id).isLoading(false)} }" />
  458. <!-- /ko -->
  459. <!-- ko if: type() != 'range' -->
  460. <div data-bind="pieChart: {data: {counts: $parent.counts, widget_id: $parent.id}, field: field, fqs: $root.query.fqs,
  461. transformer: pieChartDataTransformer,
  462. onClick: function(d){viewModel.query.toggleFacet({facet: d.data.obj, widget_id: d.data.obj.widget_id})},
  463. onComplete: function(){viewModel.getWidgetById($parent.id).isLoading(false)}}" />
  464. <!-- /ko -->
  465. </div>
  466. </div>
  467. <!-- /ko -->
  468. <div class="widget-spinner" data-bind="visible: isLoading()">
  469. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  470. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  471. </div>
  472. </script>
  473. <script type="text/html" id="area-widget">
  474. This is the area widget
  475. <div class="widget-spinner" data-bind="visible: isLoading()">
  476. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  477. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  478. </div>
  479. </script>
  480. <script type="text/html" id="filter-widget">
  481. <div data-bind="foreach: $root.query.fqs">
  482. <span data-bind="text: ko.mapping.toJSON($data), click: function(){ viewModel.query.removeFilter($data); viewModel.search() }"></span>
  483. </div>
  484. <div class="widget-spinner" data-bind="visible: isLoading()">
  485. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  486. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  487. </div>
  488. </script>
  489. <script type="text/html" id="map-widget">
  490. <!-- ko ifnot: $root.getFacetFromQuery(id()) -->
  491. <a data-bind="click: showAddFacetDemiModal" class="btn" href="javascript:void(0)"><i class="fa fa-plus"></i></a>
  492. <!-- /ko -->
  493. <!-- ko if: $root.getFacetFromQuery(id()) -->
  494. <div class="row-fluid" data-bind="with: $root.getFacetFromQuery(id())">
  495. <div data-bind="visible: $root.isEditing, with: $root.collection.getFacetById($parent.id())" style="margin-bottom: 20px">
  496. ${ _('Label') }: <input type="text" data-bind="value: label" />
  497. </div>
  498. <div data-bind="with: $root.collection.getFacetById($parent.id())">
  499. <div data-bind="mapChart: {data: {counts: $parent.counts, widget_id: $parent.id}, field: field, fqs: $root.query.fqs,
  500. transformer: mapChartDataTransformer,
  501. onClick: function(d){ viewModel.query.selectRangeFacet({count: d.data.obj.value, widget_id: d.data.obj.widget_id, from: d.data.obj.from, to: d.data.obj.to, cat: d.data.obj.field}) },
  502. onComplete: function(){ viewModel.getWidgetById($parent.id).isLoading(false)} }" />
  503. </div>
  504. </div>
  505. <!-- /ko -->
  506. <div class="widget-spinner" data-bind="visible: isLoading()">
  507. <!--[if !IE]> --><i class="fa fa-spinner fa-spin"></i><!-- <![endif]-->
  508. <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
  509. </div>
  510. </script>
  511. <div id="addFacetDemiModal" class="demi-modal hide" data-backdrop="false">
  512. <div class="modal-header">
  513. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
  514. <h3>${_('Choose field')}</h3>
  515. </div>
  516. <div class="modal-body">
  517. <p>
  518. <input type="text" data-bind="value: $root.collection.template.fieldsModalFilter, valueUpdate:'afterkeydown'" placeholder="${_('Filter fields')}" class="input-xlarge" />
  519. <ul data-bind="foreach: $root.collection.template.filteredFieldsAttributes().sort(function (l, r) { return l.name() > r.name() ? 1 : -1 })" class="unstyled inline fields-chooser">
  520. <li data-bind="click: addFacetDemiModalFieldClick"><span class="badge badge-info"><i class="fa fa-file-text-o"></i> <span data-bind="text: name()"></span> </span></li>
  521. </ul>
  522. <div class="alert alert-info" data-bind="visible: $root.collection.template.filteredFieldsAttributes().length == 0">${_('There are no fields matching your search term.')}</div>
  523. </p>
  524. </div>
  525. </div>
  526. <script src="/static/ext/js/knockout-min.js" type="text/javascript" charset="utf-8"></script>
  527. <script src="/static/ext/js/knockout.mapping-2.3.2.js" type="text/javascript" charset="utf-8"></script>
  528. <script src="/static/ext/js/mustache.js"></script>
  529. <script src="/static/ext/js/jquery/plugins/jquery-ui-draggable-droppable-sortable-1.8.23.min.js" type="text/javascript" charset="utf-8"></script>
  530. <script src="/search/static/js/knockout-sortable.min.js" type="text/javascript" charset="utf-8"></script>
  531. <link href="/static/ext/css/leaflet.css" rel="stylesheet">
  532. <link href="/static/ext/css/hue-charts.css" rel="stylesheet">
  533. <script src="/static/ext/js/jquery/plugins/jquery.flot.min.js" type="text/javascript" charset="utf-8"></script>
  534. <script src="/static/ext/js/jquery/plugins/jquery.flot.categories.min.js" type="text/javascript" charset="utf-8"></script>
  535. <script src="/static/ext/js/leaflet/leaflet.js" type="text/javascript" charset="utf-8"></script>
  536. <script src="/static/js/jquery.blueprint.js"></script>
  537. <script src="/search/static/js/search.ko.js" type="text/javascript" charset="utf-8"></script>
  538. <script src="/static/js/hue.geo.js"></script>
  539. <script src="/static/js/hue.colors.js"></script>
  540. <script src="/static/ext/js/d3.v3.js" type="text/javascript" charset="utf-8"></script>
  541. <script src="/static/ext/js/nv.d3.min.js" type="text/javascript" charset="utf-8"></script>
  542. <link href="/static/ext/css/nv.d3.min.css" rel="stylesheet">
  543. <script src="/static/ext/js/topojson.v1.min.js" type="text/javascript" charset="utf-8"></script>
  544. <script src="/static/ext/js/datamaps.all.min.js" type="text/javascript" charset="utf-8"></script>
  545. <script src="/search/static/js/nv.d3.legend.js" type="text/javascript" charset="utf-8"></script>
  546. <script src="/search/static/js/nv.d3.multiBarWithBrushChart.js" type="text/javascript" charset="utf-8"></script>
  547. <script src="/search/static/js/nv.d3.lineWithBrushChart.js" type="text/javascript" charset="utf-8"></script>
  548. <script src="/search/static/js/nv.d3.growingDiscreteBar.js" type="text/javascript" charset="utf-8"></script>
  549. <script src="/search/static/js/nv.d3.growingDiscreteBarChart.js" type="text/javascript" charset="utf-8"></script>
  550. <script src="/search/static/js/nv.d3.growingMultiBar.js" type="text/javascript" charset="utf-8"></script>
  551. <script src="/search/static/js/nv.d3.growingMultiBarChart.js" type="text/javascript" charset="utf-8"></script>
  552. <script src="/search/static/js/nv.d3.growingPie.js" type="text/javascript" charset="utf-8"></script>
  553. <script src="/search/static/js/nv.d3.growingPieChart.js" type="text/javascript" charset="utf-8"></script>
  554. <script src="/search/static/js/charts.ko.js" type="text/javascript" charset="utf-8"></script>
  555. <style type="text/css">
  556. .dashboard .container-fluid {
  557. padding: 6px;
  558. }
  559. .row-container {
  560. width: 100%;
  561. min-height: 70px;
  562. }
  563. .row-container.is-editing {
  564. border: 1px solid #F6F6F6;
  565. }
  566. .ui-sortable {
  567. background-color: #F3F3F3;
  568. min-height: 100px;
  569. }
  570. .ui-sortable h2 {
  571. padding-left: 10px!important;
  572. }
  573. .ui-sortable h2 ul {
  574. float: left;
  575. margin-right: 10px;
  576. font-size: 14px;
  577. }
  578. .ui-sortable:not(.ui-sortable-disabled) h2 {
  579. cursor: move;
  580. }
  581. .ui-sortable-disabled {
  582. background-color: #FFF;
  583. }
  584. .card-column {
  585. border: none;
  586. min-height: 400px!important;
  587. }
  588. .card-widget {
  589. padding-top: 0;
  590. border: 0;
  591. }
  592. .card-widget .card-heading {
  593. font-size: 12px!important;
  594. font-weight: bold!important;
  595. line-height: 24px!important;
  596. }
  597. .card-widget .card-body {
  598. margin-top: 0;
  599. }
  600. .card-toolbar {
  601. margin: 0;
  602. padding: 4px;
  603. padding-top: 0;
  604. top: 70px;
  605. position: fixed;
  606. width: 100%;
  607. z-index: 1000;
  608. }
  609. .row-header {
  610. background-color: #F6F6F6;
  611. display: inline;
  612. padding: 3px;
  613. }
  614. .row-highlight {
  615. background-color: #DDD;
  616. min-height: 100px;
  617. }
  618. #emptyDashboard {
  619. position: absolute;
  620. right: 164px;
  621. top: 80px;
  622. color: #666;
  623. font-size: 20px;
  624. }
  625. .emptyRow {
  626. margin-top: 10px;
  627. margin-left: 140px;
  628. color: #666;
  629. font-size: 18px;
  630. }
  631. .preview-row {
  632. background-color: #DDD;
  633. min-height: 400px!important;
  634. margin-top: 30px;
  635. }
  636. .toolbar-label {
  637. float: left;
  638. font-weight: bold;
  639. color: #999;
  640. padding-left: 8px;
  641. padding-top: 40px;
  642. }
  643. .draggable-widget {
  644. width: 100px;
  645. text-align: center;
  646. float: left;
  647. border: 1px solid #CCC;
  648. margin-top: 10px;
  649. margin-left: 10px;
  650. cursor: move;
  651. }
  652. .draggable-widget a {
  653. font-size: 58px;
  654. line-height: 76px;
  655. cursor: move;
  656. }
  657. .layout-container {
  658. width: 100px;
  659. float: left;
  660. margin-top: 10px;
  661. margin-left: 10px;
  662. }
  663. .layout-box {
  664. float: left;
  665. height: 78px;
  666. background-color: #DDD;
  667. text-align: center;
  668. }
  669. .layout-box i {
  670. color: #333;
  671. font-size: 40px;
  672. line-height: 78px;
  673. }
  674. .layout-container:hover .layout-box {
  675. background-color: #CCC;
  676. }
  677. .with-top-margin {
  678. margin-top: 100px;
  679. }
  680. @media (max-width: 1366px) {
  681. .toolbar-label {
  682. padding-top: 24px;
  683. }
  684. .draggable-widget {
  685. width: 60px;
  686. }
  687. .draggable-widget a {
  688. font-size: 28px;
  689. line-height: 46px;
  690. }
  691. .layout-box {
  692. height: 48px;
  693. }
  694. .layout-box i {
  695. font-size: 28px;
  696. line-height: 48px;
  697. }
  698. .with-top-margin {
  699. margin-top: 60px;
  700. }
  701. }
  702. .ui-sortable .card-heading {
  703. -webkit-touch-callout: none;
  704. -webkit-user-select: none;
  705. -khtml-user-select: none;
  706. -moz-user-select: none;
  707. -ms-user-select: none;
  708. user-select: none;
  709. }
  710. .search-bar {
  711. padding-top: 6px;
  712. padding-bottom: 6px;
  713. }
  714. .widget-settings-section {
  715. display: none;
  716. }
  717. em {
  718. font-weight: bold;
  719. background-color: yellow;
  720. }
  721. .nvd3 .nv-brush .extent {
  722. fill-opacity: .225!important;
  723. }
  724. .nvd3 .nv-legend .disabled rect {
  725. fill-opacity: 0;
  726. }
  727. .fields-chooser li {
  728. cursor: pointer;
  729. margin-bottom: 10px;
  730. }
  731. .fields-chooser li .badge {
  732. font-weight: normal;
  733. font-size: 12px;
  734. }
  735. .widget-spinner {
  736. padding: 10px;
  737. font-size: 80px;
  738. color: #CCC;
  739. text-align: center;
  740. }
  741. .card {
  742. margin: 0;
  743. }
  744. </style>
  745. <script type="text/javascript" charset="utf-8">
  746. var viewModel;
  747. function pieChartDataTransformer(data) {
  748. var _data = [];
  749. $(data.counts).each(function (cnt, item) {
  750. item.widget_id = data.widget_id;
  751. _data.push({
  752. label: item.value,
  753. value: item.count,
  754. obj: item
  755. });
  756. });
  757. return _data;
  758. }
  759. function rangePieChartDataTransformer(data) {
  760. var _data = [];
  761. $(data.counts).each(function (cnt, item) {
  762. item.widget_id = data.widget_id;
  763. _data.push({
  764. label: item.from + ' - ' + item.to,
  765. from: item.from,
  766. to: item.to,
  767. value: item.value,
  768. obj: item
  769. });
  770. });
  771. return _data;
  772. }
  773. function barChartDataTransformer(rawDatum) {
  774. var _datum = [];
  775. var _data = [];
  776. $(rawDatum.counts).each(function (cnt, item) {
  777. item.widget_id = rawDatum.widget_id;
  778. if (typeof item.from != "undefined"){
  779. _data.push({
  780. series: 0,
  781. x: item.from,
  782. x_end: item.to,
  783. y: item.value,
  784. obj: item
  785. });
  786. }
  787. else {
  788. _data.push({
  789. series: 0,
  790. x: item.value,
  791. y: item.count,
  792. obj: item
  793. });
  794. }
  795. });
  796. _datum.push({
  797. key: rawDatum.label,
  798. values: _data
  799. });
  800. return _datum;
  801. }
  802. function lineChartDataTransformer(rawDatum) {
  803. var _datum = [];
  804. var _data = [];
  805. $(rawDatum.counts).each(function (cnt, item) {
  806. item.widget_id = rawDatum.widget_id;
  807. if (typeof item.from != "undefined"){
  808. _data.push({
  809. series: 0,
  810. x: item.from,
  811. x_end: item.to,
  812. y: item.value,
  813. obj: item
  814. });
  815. }
  816. else {
  817. _data.push({
  818. series: 0,
  819. x: item.value,
  820. y: item.count,
  821. obj: item
  822. });
  823. }
  824. });
  825. _datum.push({
  826. key: rawDatum.label,
  827. values: _data
  828. });
  829. return _datum;
  830. }
  831. function timelineChartDataTransformer(rawDatum) {
  832. var _datum = [];
  833. var _data = [];
  834. $(rawDatum.counts).each(function (cnt, item) {
  835. _data.push({
  836. series: 0,
  837. x: new Date(moment(item.from).valueOf()),
  838. y: item.value,
  839. obj: item
  840. });
  841. });
  842. _datum.push({
  843. key: rawDatum.label,
  844. values: _data
  845. });
  846. // If multi query
  847. $(rawDatum.extraSeries).each(function (cnt, item) {
  848. if (cnt == 0) {
  849. _datum = [];
  850. }
  851. var _data = [];
  852. $(item.counts).each(function (cnt, item) {
  853. _data.push({
  854. series: cnt + 1,
  855. x: new Date(moment(item.from).valueOf()),
  856. y: item.value,
  857. obj: item
  858. });
  859. });
  860. _datum.push({
  861. key: item.label,
  862. values: _data
  863. });
  864. });
  865. return _datum;
  866. }
  867. function mapChartDataTransformer(data) {
  868. var _data = [];
  869. $(data.counts).each(function (cnt, item) {
  870. item.widget_id = data.widget_id;
  871. _data.push({
  872. label: item.value,
  873. value: item.count,
  874. obj: item
  875. });
  876. });
  877. return _data;
  878. }
  879. $(document).ready(function () {
  880. $(document).on("click", ".widget-settings-pill", function(){
  881. $(this).parents(".card-body").find(".widget-main-section").hide();
  882. $(this).parents(".card-body").find(".widget-settings-section").show();
  883. $(this).parent().siblings().removeClass("active");
  884. $(this).parent().addClass("active");
  885. });
  886. $(document).on("click", ".widget-main-pill", function(){
  887. $(this).parents(".card-body").find(".widget-settings-section").hide();
  888. $(this).parents(".card-body").find(".widget-main-section").show();
  889. $(this).parent().siblings().removeClass("active");
  890. $(this).parent().addClass("active");
  891. });
  892. ko.bindingHandlers.slideVisible = {
  893. init: function (element, valueAccessor) {
  894. var value = valueAccessor();
  895. $(element).toggle(ko.unwrap(value));
  896. },
  897. update: function (element, valueAccessor) {
  898. var value = valueAccessor();
  899. ko.unwrap(value) ? $(element).slideDown(100) : $(element).slideUp(100);
  900. }
  901. };
  902. ko.extenders.numeric = function (target, precision) {
  903. var result = ko.computed({
  904. read: target,
  905. write: function (newValue) {
  906. var current = target(),
  907. roundingMultiplier = Math.pow(10, precision),
  908. newValueAsNum = isNaN(newValue) ? 0 : parseFloat(+newValue),
  909. valueToWrite = Math.round(newValueAsNum * roundingMultiplier) / roundingMultiplier;
  910. if (valueToWrite !== current) {
  911. target(valueToWrite);
  912. } else {
  913. if (newValue !== current) {
  914. target.notifySubscribers(valueToWrite);
  915. }
  916. }
  917. }
  918. }).extend({ notify: 'always' });
  919. result(target());
  920. return result;
  921. };
  922. viewModel = new SearchViewModel(${ collection.get_c(user) | n,unicode }, ${ query | n,unicode }, ${ initial | n,unicode });
  923. ko.applyBindings(viewModel);
  924. viewModel.init();
  925. });
  926. function toggleGridFieldsSelection() {
  927. if (viewModel.collection.template.fields().length > 0) {
  928. viewModel.collection.template.fieldsSelected([])
  929. }
  930. else {
  931. var _fields = [];
  932. $.each(viewModel.collection.fields(), function (index, field) {
  933. _fields.push(field.name());
  934. });
  935. viewModel.collection.template.fieldsSelected(_fields);
  936. }
  937. }
  938. var selectedWidget = null;
  939. function showAddFacetDemiModal(widget) {
  940. if (widget.widgetType() != "resultset-widget"){
  941. viewModel.collection.template.fieldsModalFilter("");
  942. selectedWidget = widget;
  943. $("#addFacetDemiModal").modal("show");
  944. $("#addFacetDemiModal input[type='text']").focus();
  945. }
  946. }
  947. function addFacetDemiModalFieldClick(field) {
  948. var _existingFacet = viewModel.collection.getFacetById(selectedWidget.id());
  949. if (selectedWidget != null) {
  950. selectedWidget.isLoading(true);
  951. viewModel.collection.addFacet({'name': field.name(), 'widget_id': selectedWidget.id(), 'widgetType': selectedWidget.widgetType()});
  952. if (_existingFacet != null) {
  953. _existingFacet.label(field.name());
  954. _existingFacet.field(field.name());
  955. }
  956. viewModel.search();
  957. }
  958. }
  959. </script>
  960. ${ commonfooter(messages) | n,unicode }