1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
|
import $ from 'jquery';
window.Portal = function (options) {
this.initialize(options);
};
window.Portal.prototype = {
initialize: function (options) {
this.options = options;
if (!this.options.editorEnabled) {
return;
}
this.createAllSortables();
this.lastSaveString = '';
this.saveDashboardsState();
},
createAllSortables: function () {
var that = this,
blocks = $('.' + this.options.block),
columnHandle = $('.' + this.options.columnHandle),
draggable,
onDragLeave = function (e) {
$(e.currentTarget).removeClass(that.options.hoverClass);
},
onDrop = function (e) {
e.preventDefault();
draggable.detach().insertBefore($(e.currentTarget));
onDragLeave(e);
that.saveDashboardsState();
};
blocks
.prop('draggable', true)
.on('selectstart', function () {
this.dragDrop();
return false;
})
.on('dragstart', function (e) {
e.originalEvent.dataTransfer.setData('Text', 'drag');
draggable = $(this);
columnHandle.show();
})
.on('dragover', function (e) {
if (draggable.prop('id') !== $(this).prop('id')) {
e.preventDefault();
$(e.currentTarget).addClass(that.options.hoverClass);
}
})
.on('drop', onDrop)
.on('dragleave', onDragLeave);
columnHandle
.on('dragover', function (e) {
e.preventDefault();
$(e.currentTarget).addClass(that.options.hoverClass);
})
.on('drop', onDrop)
.on('dragleave', onDragLeave);
},
highlightWidget: function (widgetId) {
var block = $('#block_' + widgetId),
options = this.options;
block.css('background-color', options.highlightStartColor);
setTimeout(function () {
block.css('background-color', options.highlightEndColor);
}, this.options.highlightDuration);
},
saveDashboardsState: function () {
var options = this.options,
result = $('.' + this.options.column).map(function () {
var blocks = $(this).find('.' + options.block);
$(this).find('.' + options.columnHandle).toggle(blocks.length === 0);
return blocks.map(function () {
return $(this).prop('id').substring(options.block.length + 1);
}).get().join(',');
}).get().join(';');
if (result === this.lastSaveString) {
return;
}
var firstTime = this.lastSaveString === '';
this.lastSaveString = result;
if (firstTime) {
return;
}
if (this.options.saveUrl) {
var postBody = this.options.dashboardState + '=' + encodeURIComponent(result);
$.ajax({
url: this.options.saveUrl,
type: 'POST',
data: postBody
});
}
},
editWidget: function (widgetId) {
$('#widget_title_' + widgetId).hide();
$('#widget_' + widgetId).hide();
$('#widget_props_' + widgetId).show();
$($('#block_' + widgetId + ' a.link-action')[0]).hide();
},
cancelEditWidget: function (widgetId) {
$('widget_title_' + widgetId).show();
$('#widget_' + widgetId).show();
$('#widget_props_' + widgetId).hide();
$($('#block_' + widgetId + ' a.link-action')[0]).show();
},
deleteWidget: function (element) {
$(element).closest('.' + this.options.block).remove();
this.saveDashboardsState();
}
};
window.autoResize = function (everyMs, callback) {
var debounce = _.debounce(callback, everyMs);
$(window).on('resize', debounce);
};
$(function () {
var $sidebar = jQuery('#sidebar');
if ($sidebar.length > 0) {
var $window = jQuery(window),
topOffset = $sidebar.offset().top;
$window.on('scroll', function () {
var scrollTop = $window.scrollTop(),
scrollLeft = $window.scrollLeft();
$sidebar.toggleClass('sticky', scrollTop > topOffset);
$sidebar.css('left', -scrollLeft + 10);
});
}
});
|
