|
|
@@ -19,6 +19,8 @@ from desktop.views import commonheader, commonfooter
|
|
|
from django.utils.translation import ugettext as _
|
|
|
%>
|
|
|
|
|
|
+<%namespace name="dashboard" file="common_dashboard.mako" />
|
|
|
+
|
|
|
${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
@@ -78,30 +80,9 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
-<div class="card card-toolbar" data-bind="slideVisible: isEditing">
|
|
|
- <div style="float: left">
|
|
|
- <div class="toolbar-label">${_('LAYOUT')}</div>
|
|
|
- <a href="javascript: oneThirdLeftLayout()" onmouseover="viewModel.previewColumns('oneThirdLeft')" onmouseout="viewModel.previewColumns('')">
|
|
|
- <div class="layout-container">
|
|
|
- <div class="layout-box" style="width: 24px"></div>
|
|
|
- <div class="layout-box" style="width: 72px; margin-left: 4px"></div>
|
|
|
- </div>
|
|
|
- </a>
|
|
|
- <a href="javascript: fullLayout()" onmouseover="viewModel.previewColumns('full')" onmouseout="viewModel.previewColumns('')">
|
|
|
- <div class="layout-container">
|
|
|
- <div class="layout-box" style="width: 100px;"></div>
|
|
|
- </div>
|
|
|
- </a>
|
|
|
- <a data-bind="visible: columns().length == 0" href="javascript: magicLayout(viewModel)" onmouseover="viewModel.previewColumns('magic')" onmouseout="viewModel.previewColumns('')">
|
|
|
- <div class="layout-container">
|
|
|
- <div class="layout-box" style="width: 100px;"><i class="fa fa-magic"></i></div>
|
|
|
- </div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div style="float: left; margin-left: 20px" data-bind="visible: columns().length > 0">
|
|
|
- <div class="toolbar-label">${_('WIDGETS')}</div>
|
|
|
- <div data-bind="css: { 'draggable-widget': true, 'disabled': !availableDraggableResultset() },
|
|
|
+<%dashboard:layout_toolbar>
|
|
|
+ <%def name="widgets()">
|
|
|
+ <div data-bind="css: { 'draggable-widget': true, 'disabled': !availableDraggableResultset() },
|
|
|
draggable: {data: draggableResultset(), isEnabled: availableDraggableResultset,
|
|
|
options: {'start': function(event, ui){lastWindowScrollPosition = $(window).scrollTop();$('.card-body').slideUp('fast');},
|
|
|
'stop': function(event, ui){$('.card-body').slideDown('fast'); $root.collection.template.isGridLayout(true); checkResultHighlightingAvailability(); }}}"
|
|
|
@@ -189,112 +170,11 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
|
|
|
<i class="hcha hcha-map-chart"></i>
|
|
|
</a>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="clearfix"></div>
|
|
|
-</div>
|
|
|
-
|
|
|
-<div id="emptyDashboard" data-bind="fadeVisible: !isEditing() && columns().length == 0">
|
|
|
- <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>
|
|
|
- <img src="/search/static/art/hint_arrow.png" />
|
|
|
-</div>
|
|
|
-
|
|
|
-<div id="emptyDashboardEditing" data-bind="fadeVisible: isEditing() && columns().length == 0 && previewColumns() == ''">
|
|
|
- <div style="float:right; padding-top: 90px; margin-left: 20px; text-align: center; width: 260px">${ _('Pick an index and Click on a layout to start your dashboard!') }</div>
|
|
|
- <img src="/search/static/art/hint_arrow_horiz_flipped.png" />
|
|
|
-</div>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-<div data-bind="visible: isEditing() && previewColumns() != '' && columns().length == 0, css:{'with-top-margin': isEditing()}">
|
|
|
- <div class="container-fluid">
|
|
|
- <div class="row-fluid" data-bind="visible: previewColumns() == 'oneThirdLeft'">
|
|
|
- <div class="span3 preview-row"></div>
|
|
|
- <div class="span9 preview-row"></div>
|
|
|
- </div>
|
|
|
- <div class="row-fluid" data-bind="visible: previewColumns() == 'full'">
|
|
|
- <div class="span12 preview-row">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="row-fluid" data-bind="visible: previewColumns() == 'magic'">
|
|
|
- <div class="span12 preview-row">
|
|
|
- <div style="text-align: center; color:#EEE; font-size: 180px; margin-top: 80px">
|
|
|
- <i class="fa fa-magic"></i>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</div>
|
|
|
-
|
|
|
-<div data-bind="css: {'dashboard': true, 'with-top-margin': isEditing()}">
|
|
|
- <div class="container-fluid">
|
|
|
- <div class="row-fluid" data-bind="template: { name: 'column-template', foreach: columns}">
|
|
|
- </div>
|
|
|
- <div class="clearfix"></div>
|
|
|
- </div>
|
|
|
-</div>
|
|
|
+ </%def>
|
|
|
+</%dashboard:layout_toolbar>
|
|
|
|
|
|
-<script type="text/html" id="column-template">
|
|
|
- <div data-bind="css: klass">
|
|
|
- <div class="container-fluid" data-bind="visible: $root.isEditing">
|
|
|
- <div data-bind="click: function(){$data.addEmptyRow(true)}, css: {'add-row': true, 'is-editing': $root.isEditing}, sortable: { data: drops, isEnabled: $root.isEditing, 'afterMove': function(event){var widget=event.item; var _r = $data.addEmptyRow(true); _r.addWidget(widget);$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)}); if ($root.collection.getFacetById(widget.id()) == null) { showAddFacetDemiModal(widget); } viewModel.search()}, options: {'placeholder': 'add-row-highlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"></div>
|
|
|
- </div>
|
|
|
- <div data-bind="template: { name: 'row-template', foreach: rows}">
|
|
|
- </div>
|
|
|
- <div class="container-fluid" data-bind="visible: $root.isEditing">
|
|
|
- <div data-bind="click: function(){$data.addEmptyRow()}, css: {'add-row': true, 'is-editing': $root.isEditing}, sortable: { data: drops, isEnabled: $root.isEditing, 'afterMove': function(event){var widget=event.item; var _r = $data.addEmptyRow(); _r.addWidget(widget);$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)}); if ($root.collection.getFacetById(widget.id()) == null) { showAddFacetDemiModal(widget); } viewModel.search()}, options: {'placeholder': 'add-row-highlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</script>
|
|
|
-
|
|
|
-<script type="text/html" id="row-template">
|
|
|
- <div class="emptyRow" data-bind="visible: widgets().length == 0 && $index() == 0 && $root.isEditing() && $parent.size() > 4 && $parent.rows().length == 1">
|
|
|
- <img src="/search/static/art/hint_arrow_flipped.png" style="float:left; margin-right: 10px"/>
|
|
|
- <div style="float:left; text-align: center; width: 260px">${_('Drag any of the widgets inside your empty row')}</div>
|
|
|
- <div class="clearfix"></div>
|
|
|
- </div>
|
|
|
- <div class="container-fluid">
|
|
|
- <div class="row-header" data-bind="visible: $root.isEditing">
|
|
|
- <span class="muted">${_('Row')}</span>
|
|
|
- <div style="display: inline; margin-left: 60px">
|
|
|
- <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>
|
|
|
- <a href="javascript:void(0)" data-bind="visible: $index()>0, click: function(){moveUp($parent, this)}"><i class="fa fa-chevron-up"></i></a>
|
|
|
- <a href="javascript:void(0)" data-bind="visible: $parent.rows().length > 1, click: function(){remove($parent, this)}"><i class="fa fa-times"></i></a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <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': '.move-widget', 'opacity': 0.7, 'placeholder': 'row-highlight', 'greedy': true,
|
|
|
- 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});},
|
|
|
- 'helper': function(event){lastWindowScrollPosition = $(window).scrollTop(); $('.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', function(){$(window).scrollTop(lastWindowScrollPosition)});showAddFacetDemiModal(widget);viewModel.search()}}">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</script>
|
|
|
+${ dashboard.layout_skeleton() }
|
|
|
|
|
|
-<script type="text/html" id="widget-template">
|
|
|
- <div data-bind="attr: {'id': 'wdg_'+ id(),}, css: klass">
|
|
|
- <h2 class="card-heading simple">
|
|
|
- <span data-bind="visible: $root.isEditing">
|
|
|
- <a href="javascript:void(0)" class="move-widget"><i class="fa fa-arrows"></i></a>
|
|
|
- <a href="javascript:void(0)" data-bind="click: compress, visible: size() > 1"><i class="fa fa-step-backward"></i></a>
|
|
|
- <a href="javascript:void(0)" data-bind="click: expand, visible: size() < 12"><i class="fa fa-step-forward"></i></a>
|
|
|
-
|
|
|
- </span>
|
|
|
- <span data-bind="with: $root.collection.getFacetById(id())">
|
|
|
- <span data-bind="editable: label, editableOptions: {enabled: $root.isEditing(), placement: 'right'}"></span>
|
|
|
- </span>
|
|
|
- <!-- ko ifnot: $root.collection.getFacetById(id()) -->
|
|
|
- <span data-bind="editable: name, editableOptions: {enabled: $root.isEditing(), placement: 'right'}"></span>
|
|
|
- <!-- /ko -->
|
|
|
- <div class="inline pull-right" data-bind="visible: $root.isEditing">
|
|
|
- <a href="javascript:void(0)" data-bind="click: function(){remove($parent, this)}"><i class="fa fa-times"></i></a>
|
|
|
- </div>
|
|
|
- </h2>
|
|
|
- <div class="card-body" style="padding: 5px;">
|
|
|
- <div data-bind="template: { name: function() { return widgetType(); }}" class="widget-main-section"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</script>
|
|
|
|
|
|
<script type="text/html" id="empty-widget">
|
|
|
${ _('This is an empty widget.')}
|
|
|
@@ -986,22 +866,18 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
|
|
|
|
|
|
<script src="/static/ext/js/moment-with-langs.min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
|
|
|
+${ dashboard.import_layout() }
|
|
|
+
|
|
|
<script src="/search/static/js/search.utils.js" type="text/javascript" charset="utf-8"></script>
|
|
|
<script src="/search/static/js/lzstring.min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
-<script src="/static/ext/js/knockout-min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
-<script src="/static/ext/js/knockout.mapping-2.3.2.js" type="text/javascript" charset="utf-8"></script>
|
|
|
-<script src="/static/ext/js/knockout-sortable.min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
<script src="/static/ext/js/bootstrap-editable.min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
<script src="/static/js/ko.editable.js" type="text/javascript" charset="utf-8"></script>
|
|
|
<script src="/static/ext/js/shortcut.js" type="text/javascript" charset="utf-8"></script>
|
|
|
<script src="/static/ext/js/mustache.js" type="text/javascript" charset="utf-8"></script>
|
|
|
-<script src="/static/ext/js/jquery/plugins/jquery-ui-1.10.4.draggable-droppable-sortable.min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
<script src="/static/ext/chosen/chosen.jquery.min.js" type="text/javascript" charset="utf-8"></script>
|
|
|
|
|
|
<script src="/search/static/js/search.ko.js" type="text/javascript" charset="utf-8"></script>
|
|
|
|
|
|
-<%namespace name="dashboard" file="common_dashboard.mako" />
|
|
|
-
|
|
|
${ dashboard.import_bindings() }
|
|
|
${ dashboard.import_charts() }
|
|
|
|
|
|
@@ -1312,6 +1188,18 @@ $(document).ready(function () {
|
|
|
viewModel.collection.template.fieldsSelected(_fields);
|
|
|
}
|
|
|
|
|
|
+ function columnDropAdditionalHandler(widget) {
|
|
|
+ if (viewModel.collection.getFacetById(widget.id()) == null) {
|
|
|
+ showAddFacetDemiModal(widget);
|
|
|
+ }
|
|
|
+ viewModel.search();
|
|
|
+ }
|
|
|
+
|
|
|
+ function widgetDraggedAdditionalHandler(widget) {
|
|
|
+ showAddFacetDemiModal(widget);
|
|
|
+ viewModel.search();
|
|
|
+ }
|
|
|
+
|
|
|
var selectedWidget = null;
|
|
|
function showAddFacetDemiModal(widget) {
|
|
|
if (["resultset-widget", "html-resultset-widget", "filter-widget"].indexOf(widget.widgetType()) == -1) {
|