@progress/telerik-jquery-report-viewer 21.24.305 → 22.24.709
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +1 -1
- package/dist/cjs/accessibility.js +208 -0
- package/dist/cjs/base-component.js +26 -0
- package/dist/cjs/binder.js +79 -0
- package/dist/cjs/command.js +32 -0
- package/dist/cjs/commandSet.js +167 -0
- package/dist/cjs/controller.js +1204 -0
- package/dist/cjs/documentMapArea.js +159 -0
- package/dist/cjs/domUtils.js +50 -0
- package/dist/cjs/enums.js +52 -0
- package/dist/cjs/event-emitter.js +131 -0
- package/dist/cjs/events.js +23 -0
- package/dist/cjs/globalSettings.js +9 -0
- package/dist/cjs/history.js +131 -0
- package/dist/cjs/index.js +58 -0
- package/dist/cjs/jqueryThrottleDebounce.js +48 -0
- package/dist/cjs/kendo-jquery.js +4 -0
- package/dist/cjs/mainMenu.js +323 -0
- package/dist/cjs/mem-storage.js +44 -0
- package/dist/cjs/pagesArea.js +622 -0
- package/dist/cjs/parameterValidators.js +164 -0
- package/dist/cjs/parameters.js +921 -0
- package/dist/cjs/parametersArea.js +486 -0
- package/dist/cjs/perspectives.js +138 -0
- package/dist/cjs/print.js +165 -0
- package/dist/cjs/report-viewer/report-viewer-settings.js +138 -0
- package/dist/cjs/reportViewer.js +665 -0
- package/dist/cjs/scroll.js +535 -0
- package/dist/cjs/search.js +584 -0
- package/dist/cjs/sendEmail.js +392 -0
- package/dist/cjs/service-client-sentinel.js +52 -0
- package/dist/cjs/serviceClient.js +311 -0
- package/dist/cjs/sideMenu.js +216 -0
- package/dist/cjs/sr.js +164 -0
- package/dist/cjs/stringResources.js +11 -0
- package/dist/cjs/telerikReportViewer.kendo.js +60196 -0
- package/dist/cjs/telerikReportViewer.kendo.min.js +19776 -0
- package/dist/cjs/template-cache.js +39 -0
- package/dist/cjs/toolbar/link-button.js +42 -0
- package/dist/cjs/toolbar/page-count-label.js +18 -0
- package/dist/cjs/toolbar/page-number-input.js +64 -0
- package/dist/cjs/touch.js +86 -0
- package/dist/cjs/uiController.js +142 -0
- package/dist/cjs/uiFreezeCoordinator.js +282 -0
- package/dist/cjs/utils.js +489 -0
- package/dist/es/accessibility.js +204 -0
- package/dist/es/base-component.js +22 -0
- package/dist/es/binder.js +75 -0
- package/dist/es/command.js +28 -0
- package/dist/es/commandSet.js +163 -0
- package/dist/es/controller.js +1200 -0
- package/dist/es/documentMapArea.js +155 -0
- package/dist/es/domUtils.js +43 -0
- package/dist/es/enums.js +41 -0
- package/dist/es/event-emitter.js +127 -0
- package/dist/es/events.js +19 -0
- package/dist/es/globalSettings.js +5 -0
- package/dist/es/history.js +127 -0
- package/dist/es/index.js +24 -0
- package/dist/es/jqueryThrottleDebounce.js +46 -0
- package/dist/es/kendo-jquery.js +1 -0
- package/dist/es/mainMenu.js +319 -0
- package/dist/es/mem-storage.js +40 -0
- package/dist/es/pagesArea.js +618 -0
- package/dist/es/parameterValidators.js +160 -0
- package/dist/es/parameters.js +916 -0
- package/dist/es/parametersArea.js +482 -0
- package/dist/es/perspectives.js +134 -0
- package/dist/es/print.js +161 -0
- package/dist/es/report-viewer/report-viewer-settings.js +134 -0
- package/dist/es/reportViewer.js +661 -0
- package/dist/es/scroll.js +531 -0
- package/dist/es/search.js +580 -0
- package/dist/es/sendEmail.js +388 -0
- package/dist/es/service-client-sentinel.js +48 -0
- package/dist/es/serviceClient.js +307 -0
- package/dist/es/sideMenu.js +212 -0
- package/dist/es/sr.js +162 -0
- package/dist/es/stringResources.js +7 -0
- package/dist/es/telerikReportViewer.kendo.js +60194 -0
- package/dist/es/telerikReportViewer.kendo.min.js +19774 -0
- package/dist/es/template-cache.js +35 -0
- package/dist/es/toolbar/link-button.js +38 -0
- package/dist/es/toolbar/page-count-label.js +14 -0
- package/dist/es/toolbar/page-number-input.js +60 -0
- package/dist/es/touch.js +82 -0
- package/dist/es/uiController.js +138 -0
- package/dist/es/uiFreezeCoordinator.js +278 -0
- package/dist/es/utils.js +444 -0
- package/dist/font/font-icons.css +4 -4
- package/dist/font/font-icons.min.css +3 -3
- package/dist/js/telerikReportViewer.js +8346 -8507
- package/dist/js/telerikReportViewer.min.js +1 -17
- package/dist/js/telerikReportViewer.stringResources.js +166 -173
- package/dist/styles/telerikReportViewer.css +3 -3
- package/dist/styles/telerikReportViewer.min.css +3 -3
- package/dist/templates/telerikReportViewerTemplate-FA.html +4 -4
- package/dist/templates/telerikReportViewerTemplate.html +6 -6
- package/package.json +14 -7
- /package/dist/font/{ReportingIcons-18.0.24.305.ttf → ReportingIcons-18.1.24.709.ttf} +0 -0
@@ -0,0 +1,35 @@
|
|
1
|
+
import { rTrim, replaceAll, trim, filterUniqueLastOccurrence } from './utils.js';
|
2
|
+
|
3
|
+
const TemplateCache = function() {
|
4
|
+
var cache = {};
|
5
|
+
return {
|
6
|
+
load: function(url, serviceUrl, client) {
|
7
|
+
var p = cache[url];
|
8
|
+
if (!p) {
|
9
|
+
cache[url] = p = client.get(url).then(function(html) {
|
10
|
+
var templates = {};
|
11
|
+
var styleSheets = [];
|
12
|
+
var baseUri = rTrim(serviceUrl, "\\/") + "/";
|
13
|
+
html = replaceAll(html, "{service}/", baseUri);
|
14
|
+
html = replaceAll(html, "{service}", baseUri);
|
15
|
+
var viewerTemplate = $("<div></div>").html(html);
|
16
|
+
Array.from(viewerTemplate.find("template")).forEach((element) => {
|
17
|
+
var $element = $(element);
|
18
|
+
templates[$element.attr("id")] = trim($element.html(), "\n ");
|
19
|
+
});
|
20
|
+
Array.from(viewerTemplate.find("link")).forEach((element) => {
|
21
|
+
styleSheets.push(trim(element.outerHTML, "\n "));
|
22
|
+
});
|
23
|
+
styleSheets = filterUniqueLastOccurrence(styleSheets);
|
24
|
+
return {
|
25
|
+
templates,
|
26
|
+
styleSheets
|
27
|
+
};
|
28
|
+
});
|
29
|
+
}
|
30
|
+
return p;
|
31
|
+
}
|
32
|
+
};
|
33
|
+
}();
|
34
|
+
|
35
|
+
export { TemplateCache };
|
@@ -0,0 +1,38 @@
|
|
1
|
+
import { BaseComponent } from '../base-component.js';
|
2
|
+
|
3
|
+
var __defProp = Object.defineProperty;
|
4
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
5
|
+
var __publicField = (obj, key, value) => {
|
6
|
+
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
7
|
+
return value;
|
8
|
+
};
|
9
|
+
class LinkButton extends BaseComponent {
|
10
|
+
// #endregion
|
11
|
+
// #region constructor
|
12
|
+
constructor(element, options) {
|
13
|
+
super(element, options);
|
14
|
+
// #region fields
|
15
|
+
__publicField(this, "cmd");
|
16
|
+
var dataCommand = this.$element.attr("data-command");
|
17
|
+
if (dataCommand) {
|
18
|
+
this.cmd = this.options.commands[dataCommand];
|
19
|
+
}
|
20
|
+
if (this.cmd) {
|
21
|
+
this.$element.on("click", (event) => {
|
22
|
+
if (this.cmd.enabled()) {
|
23
|
+
this.cmd.exec($(this).attr("data-command-parameter"));
|
24
|
+
} else {
|
25
|
+
event.preventDefault();
|
26
|
+
}
|
27
|
+
});
|
28
|
+
$(this.cmd).on("enabledChanged", (event) => {
|
29
|
+
(this.cmd.enabled() ? $.fn.removeClass : $.fn.addClass).call(this.$element, "disabled");
|
30
|
+
}).on("checkedChanged", (event) => {
|
31
|
+
(this.cmd.checked() ? $.fn.addClass : $.fn.removeClass).call(this.$element, "checked");
|
32
|
+
});
|
33
|
+
}
|
34
|
+
}
|
35
|
+
// #endregion
|
36
|
+
}
|
37
|
+
|
38
|
+
export { LinkButton };
|
@@ -0,0 +1,14 @@
|
|
1
|
+
import { BaseComponent } from '../base-component.js';
|
2
|
+
|
3
|
+
class PageCountLabel extends BaseComponent {
|
4
|
+
// #region constructor
|
5
|
+
constructor(element, options) {
|
6
|
+
super(element, options);
|
7
|
+
this.options.controller.pageCountChange((event, value) => {
|
8
|
+
this.$element.text(value);
|
9
|
+
});
|
10
|
+
}
|
11
|
+
// #endregion
|
12
|
+
}
|
13
|
+
|
14
|
+
export { PageCountLabel };
|
@@ -0,0 +1,60 @@
|
|
1
|
+
import { BaseComponent } from '../base-component.js';
|
2
|
+
import { tryParseInt } from '../utils.js';
|
3
|
+
|
4
|
+
var __defProp = Object.defineProperty;
|
5
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
6
|
+
var __publicField = (obj, key, value) => {
|
7
|
+
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
8
|
+
return value;
|
9
|
+
};
|
10
|
+
class PageNumberInput extends BaseComponent {
|
11
|
+
// #endregion
|
12
|
+
// #region constructor
|
13
|
+
constructor(element, options) {
|
14
|
+
super(element, options);
|
15
|
+
// #region fields
|
16
|
+
__publicField(this, "cmd");
|
17
|
+
__publicField(this, "_numeric");
|
18
|
+
this.cmd = this.options.commands["goToPage"];
|
19
|
+
this._numeric = new kendo.ui.NumericTextBox(this.element, {
|
20
|
+
format: "0",
|
21
|
+
decimals: 0,
|
22
|
+
min: 0,
|
23
|
+
spinners: false,
|
24
|
+
change: this._onChange.bind(this),
|
25
|
+
spin: this._onChange.bind(this)
|
26
|
+
});
|
27
|
+
this._numeric._text[0].dataset.role = "telerik_ReportViewer_PageNumberInput";
|
28
|
+
this._numeric.element[0].dataset.role = "";
|
29
|
+
this.options.controller.on("reportLoadComplete", (event, reportInfo) => {
|
30
|
+
this._numeric.max(reportInfo.pageCount);
|
31
|
+
this._numeric.min(Math.min(1, reportInfo.pageCount));
|
32
|
+
this._numeric.value(Math.min(1, reportInfo.pageCount));
|
33
|
+
}).on("loadedReportChange", (event) => {
|
34
|
+
this._numeric.min(0);
|
35
|
+
this._numeric.max(0);
|
36
|
+
this._numeric.value(0);
|
37
|
+
}).on("renderingStopped", (event) => {
|
38
|
+
this._numeric.min(0);
|
39
|
+
this._numeric.max(0);
|
40
|
+
this._numeric.value(0);
|
41
|
+
}).pageNumberChange((event, value) => {
|
42
|
+
this._numeric.value(value);
|
43
|
+
});
|
44
|
+
}
|
45
|
+
// #endregion
|
46
|
+
// #region event handlers
|
47
|
+
_onChange(event, data) {
|
48
|
+
var val = this._numeric.value();
|
49
|
+
var num = tryParseInt(val);
|
50
|
+
if (!isNaN(num)) {
|
51
|
+
this.cmd.exec(num);
|
52
|
+
}
|
53
|
+
}
|
54
|
+
_onSpin(event, data) {
|
55
|
+
return this._onChange(event, data);
|
56
|
+
}
|
57
|
+
// #endregion
|
58
|
+
}
|
59
|
+
|
60
|
+
export { PageNumberInput };
|
package/dist/es/touch.js
ADDED
@@ -0,0 +1,82 @@
|
|
1
|
+
function TouchBehavior(dom, options) {
|
2
|
+
var startDistance;
|
3
|
+
var ignoreTouch;
|
4
|
+
init(dom);
|
5
|
+
function init(element) {
|
6
|
+
if (typeof $.fn.kendoTouch === "function") {
|
7
|
+
try {
|
8
|
+
$(element).mousedown(function() {
|
9
|
+
ignoreTouch = true;
|
10
|
+
}).mouseup(function() {
|
11
|
+
ignoreTouch = false;
|
12
|
+
}).kendoTouch({
|
13
|
+
multiTouch: true,
|
14
|
+
enableSwipe: true,
|
15
|
+
swipe: function(e) {
|
16
|
+
if (!ignoreTouch) {
|
17
|
+
onSwipe(e);
|
18
|
+
}
|
19
|
+
},
|
20
|
+
gesturestart: function(e) {
|
21
|
+
if (!ignoreTouch) {
|
22
|
+
onGestureStart(e);
|
23
|
+
}
|
24
|
+
},
|
25
|
+
gestureend: function(e) {
|
26
|
+
if (!ignoreTouch) {
|
27
|
+
onGestureEnd(e);
|
28
|
+
}
|
29
|
+
},
|
30
|
+
gesturechange: function(e) {
|
31
|
+
if (!ignoreTouch) {
|
32
|
+
onGestureChange(e);
|
33
|
+
}
|
34
|
+
},
|
35
|
+
doubletap: function(e) {
|
36
|
+
if (!ignoreTouch) {
|
37
|
+
onDoubleTap(e);
|
38
|
+
}
|
39
|
+
},
|
40
|
+
touchstart: function(e) {
|
41
|
+
if (!ignoreTouch) {
|
42
|
+
fire("touchstart");
|
43
|
+
}
|
44
|
+
}
|
45
|
+
});
|
46
|
+
} catch (e) {
|
47
|
+
console.error("Instantiation of Kendo Touch threw an exception", e);
|
48
|
+
throw e;
|
49
|
+
}
|
50
|
+
}
|
51
|
+
}
|
52
|
+
function onDoubleTap(e) {
|
53
|
+
fire("doubletap", e);
|
54
|
+
}
|
55
|
+
function onGestureStart(e) {
|
56
|
+
startDistance = kendo.touchDelta(e.touches[0], e.touches[1]).distance;
|
57
|
+
}
|
58
|
+
function onGestureEnd(e) {
|
59
|
+
}
|
60
|
+
function onGestureChange(e) {
|
61
|
+
var current = kendo.touchDelta(e.touches[0], e.touches[1]).distance;
|
62
|
+
onPinch({
|
63
|
+
distance: current,
|
64
|
+
lastDistance: startDistance
|
65
|
+
});
|
66
|
+
startDistance = current;
|
67
|
+
}
|
68
|
+
function onSwipe(e) {
|
69
|
+
fire("swipe", e);
|
70
|
+
}
|
71
|
+
function onPinch(e) {
|
72
|
+
fire("pinch", e);
|
73
|
+
}
|
74
|
+
function fire(func, args) {
|
75
|
+
var handler = options[func];
|
76
|
+
if (typeof handler === "function") {
|
77
|
+
handler(args);
|
78
|
+
}
|
79
|
+
}
|
80
|
+
}
|
81
|
+
|
82
|
+
export { TouchBehavior };
|
@@ -0,0 +1,138 @@
|
|
1
|
+
import { ViewModes, PageModes, ScaleModes } from './enums.js';
|
2
|
+
|
3
|
+
function UIController(options) {
|
4
|
+
var stateFlags = {
|
5
|
+
ExportInProgress: 1 << 0,
|
6
|
+
PrintInProgress: 1 << 1,
|
7
|
+
RenderInProgress: 1 << 2
|
8
|
+
};
|
9
|
+
function getState(flags) {
|
10
|
+
return (state & flags) != 0;
|
11
|
+
}
|
12
|
+
function setState(flags, value) {
|
13
|
+
if (value) {
|
14
|
+
state |= flags;
|
15
|
+
} else {
|
16
|
+
state &= ~flags;
|
17
|
+
}
|
18
|
+
}
|
19
|
+
var controller = options.controller;
|
20
|
+
var historyManager = options.history;
|
21
|
+
var state = 0;
|
22
|
+
var refreshUI;
|
23
|
+
var commands = options.commands;
|
24
|
+
if (!controller) {
|
25
|
+
throw "No controller (telerikReporting.ReportViewerController) has been specified.";
|
26
|
+
}
|
27
|
+
function getDocumentMapState() {
|
28
|
+
var args = {};
|
29
|
+
controller.getDocumentMapState(args);
|
30
|
+
return args;
|
31
|
+
}
|
32
|
+
function getParametersAreaState() {
|
33
|
+
var args = {};
|
34
|
+
controller.getParametersAreaState(args);
|
35
|
+
return args;
|
36
|
+
}
|
37
|
+
function getSearchDialogState() {
|
38
|
+
var args = {};
|
39
|
+
controller.getSearchDialogState(args);
|
40
|
+
return args;
|
41
|
+
}
|
42
|
+
function getSendEmailDialogState() {
|
43
|
+
var args = {};
|
44
|
+
controller.getSendEmailDialogState(args);
|
45
|
+
return args;
|
46
|
+
}
|
47
|
+
function updateUI() {
|
48
|
+
if (!refreshUI) {
|
49
|
+
refreshUI = true;
|
50
|
+
window.setTimeout(function() {
|
51
|
+
try {
|
52
|
+
updateUICore();
|
53
|
+
} finally {
|
54
|
+
refreshUI = false;
|
55
|
+
}
|
56
|
+
}, 10);
|
57
|
+
}
|
58
|
+
}
|
59
|
+
function updateUICore() {
|
60
|
+
var rs = controller.getReportSource();
|
61
|
+
var pageCount = controller.getPageCount();
|
62
|
+
var currentPageNumber = controller.getCurrentPageNumber();
|
63
|
+
var hasReport = rs && rs.report;
|
64
|
+
var hasPages = hasReport && pageCount > 0;
|
65
|
+
var nextPage = hasPages && currentPageNumber < pageCount;
|
66
|
+
var prevPage = hasPages && currentPageNumber > 1;
|
67
|
+
var hasPage = hasPages && currentPageNumber;
|
68
|
+
var documentMapState = getDocumentMapState();
|
69
|
+
var parametersAreaState = getParametersAreaState();
|
70
|
+
var searchDialogState = getSearchDialogState();
|
71
|
+
var sendEmailDialogState = getSendEmailDialogState();
|
72
|
+
var renderInProgress = getState(stateFlags.RenderInProgress);
|
73
|
+
var printInProgress = getState(stateFlags.PrintInProgress);
|
74
|
+
var exportInProgress = getState(stateFlags.ExportInProgress);
|
75
|
+
commands.goToFirstPage.enabled(prevPage);
|
76
|
+
commands.goToPrevPage.enabled(prevPage);
|
77
|
+
commands.stopRendering.enabled(hasReport && renderInProgress);
|
78
|
+
commands.goToLastPage.enabled(nextPage);
|
79
|
+
commands.goToNextPage.enabled(nextPage);
|
80
|
+
commands.goToPage.enabled(hasPages);
|
81
|
+
commands.print.enabled(hasPages && !renderInProgress && !printInProgress);
|
82
|
+
commands.export.enabled(hasPages && !renderInProgress && !exportInProgress);
|
83
|
+
commands.refresh.enabled(hasReport);
|
84
|
+
commands.historyBack.enabled(historyManager && historyManager.canMoveBack());
|
85
|
+
commands.historyForward.enabled(historyManager && historyManager.canMoveForward());
|
86
|
+
commands.toggleDocumentMap.enabled(hasReport && documentMapState.enabled).checked(documentMapState.enabled && documentMapState.visible);
|
87
|
+
commands.toggleParametersArea.enabled(hasReport && parametersAreaState.enabled).checked(parametersAreaState.enabled && parametersAreaState.visible);
|
88
|
+
commands.togglePrintPreview.enabled(hasPages).checked(controller.getViewMode() == ViewModes.PRINT_PREVIEW);
|
89
|
+
commands.pageMode.enabled(hasPages).checked(controller.getPageMode() == PageModes.CONTINUOUS_SCROLL);
|
90
|
+
commands.zoom.enabled(hasPage);
|
91
|
+
commands.zoomIn.enabled(hasPage);
|
92
|
+
commands.zoomOut.enabled(hasPage);
|
93
|
+
commands.toggleZoomMode.enabled(hasPage).checked(controller.getScaleMode() == ScaleModes.FIT_PAGE || controller.getScaleMode() == ScaleModes.FIT_PAGE_WIDTH);
|
94
|
+
commands.toggleSearchDialog.enabled(hasPages).checked(searchDialogState.visible);
|
95
|
+
commands.toggleSendEmailDialog.enabled(hasPages).checked(sendEmailDialogState.visible);
|
96
|
+
controller.updateUI(null);
|
97
|
+
controller.pageNumberChange(currentPageNumber);
|
98
|
+
controller.pageCountChange(pageCount);
|
99
|
+
}
|
100
|
+
controller.setParametersAreaVisible(updateUI);
|
101
|
+
controller.setDocumentMapVisible(updateUI);
|
102
|
+
controller.updateUIInternal(updateUI);
|
103
|
+
controller.setSearchDialogVisible(updateUI);
|
104
|
+
controller.setSendEmailDialogVisible(updateUI);
|
105
|
+
controller.scaleModeChanged(updateUI);
|
106
|
+
controller.currentPageChanged(updateUI);
|
107
|
+
controller.beforeLoadReport(function() {
|
108
|
+
setState(stateFlags.RenderInProgress, true);
|
109
|
+
updateUI();
|
110
|
+
});
|
111
|
+
controller.reportLoadProgress(updateUI);
|
112
|
+
controller.reportLoadComplete(function() {
|
113
|
+
setState(stateFlags.RenderInProgress, false);
|
114
|
+
updateUI();
|
115
|
+
});
|
116
|
+
controller.reportSourceChanged(updateUI);
|
117
|
+
controller.viewModeChanged(updateUI);
|
118
|
+
controller.pageModeChanged(function() {
|
119
|
+
updateUI();
|
120
|
+
});
|
121
|
+
controller.setUIState(function(event, args) {
|
122
|
+
setState(stateFlags[args.operationName], args.inProgress);
|
123
|
+
updateUI();
|
124
|
+
});
|
125
|
+
controller.error(function() {
|
126
|
+
setState(stateFlags.ExportInProgress, false);
|
127
|
+
setState(stateFlags.PrintInProgress, false);
|
128
|
+
setState(stateFlags.RenderInProgress, false);
|
129
|
+
updateUI();
|
130
|
+
});
|
131
|
+
controller.renderingStopped(function() {
|
132
|
+
setState(stateFlags.RenderInProgress, false);
|
133
|
+
updateUI();
|
134
|
+
});
|
135
|
+
updateUI();
|
136
|
+
}
|
137
|
+
|
138
|
+
export { UIController };
|
@@ -0,0 +1,278 @@
|
|
1
|
+
import { rectangle, getColorAlphaValue } from './utils.js';
|
2
|
+
|
3
|
+
var UIFreezeCoordinator = {
|
4
|
+
$placeholder: null,
|
5
|
+
$scrollableContainer: null,
|
6
|
+
// Holds all items initial position per container
|
7
|
+
itemsInitialState: {},
|
8
|
+
// Holds the bounds of the frozen areas by X per container
|
9
|
+
xFrozenAreasBounds: {},
|
10
|
+
// Holds the bounds of the frozen areas by Y per container
|
11
|
+
yFrozenAreasBounds: {},
|
12
|
+
freezeMaxZIndex: {},
|
13
|
+
zIndex: 1,
|
14
|
+
// Holds default background-color value per container
|
15
|
+
freezeBGColor: {},
|
16
|
+
// Holds whether freezing has been applied per container.
|
17
|
+
currentlyFrozenContainer: {
|
18
|
+
vertical: {},
|
19
|
+
horizontal: {}
|
20
|
+
},
|
21
|
+
isInitialize: false,
|
22
|
+
scaleFactor: null,
|
23
|
+
/**
|
24
|
+
* Initialize the uiFreezeCoordinator object
|
25
|
+
* Takes one parameter
|
26
|
+
* - $placeholder - PageArea jQuery DOM element
|
27
|
+
*/
|
28
|
+
init: function($placeholder) {
|
29
|
+
this.$placeholder = $placeholder;
|
30
|
+
this.$scrollableContainer = $placeholder.find(".trv-page-container");
|
31
|
+
if (this.isInitialize) {
|
32
|
+
this.reset($placeholder);
|
33
|
+
}
|
34
|
+
this._attachToScrollEvent();
|
35
|
+
this.isInitialize = true;
|
36
|
+
},
|
37
|
+
reset: function($placeholder) {
|
38
|
+
this.$placeholder = $placeholder;
|
39
|
+
this.$scrollableContainer = $placeholder.find(".trv-page-container");
|
40
|
+
this.itemsInitialState = {};
|
41
|
+
this.xFrozenAreasBounds = {};
|
42
|
+
this.yFrozenAreasBounds = {};
|
43
|
+
this.currentlyfreezedContainer = {
|
44
|
+
vertical: {},
|
45
|
+
horizontal: {}
|
46
|
+
};
|
47
|
+
},
|
48
|
+
setScaleFactor: function(scale) {
|
49
|
+
this.scaleFactor = scale;
|
50
|
+
},
|
51
|
+
/**
|
52
|
+
* Initializing scroll listener
|
53
|
+
*/
|
54
|
+
_attachToScrollEvent: function() {
|
55
|
+
var thisInstance = this;
|
56
|
+
this.$scrollableContainer.scroll(function updateFreezeUIOnScroll() {
|
57
|
+
var $freezeItems = thisInstance.$scrollableContainer.find("div[data-sticky-id]");
|
58
|
+
if ($freezeItems.length) {
|
59
|
+
var tableIDs = $freezeItems.map(function(index2, $element) {
|
60
|
+
return $($element).attr("data-sticky-id");
|
61
|
+
}).get();
|
62
|
+
var uniqueIDs = tableIDs.filter(function(item, index2) {
|
63
|
+
return index2 === tableIDs.indexOf(item);
|
64
|
+
});
|
65
|
+
var scrollableContainerScrollTop = thisInstance.$scrollableContainer.scrollTop();
|
66
|
+
var scrollableContainerScrollLeft = thisInstance.$scrollableContainer.scrollLeft();
|
67
|
+
for (var index = 0; index < uniqueIDs.length; index++) {
|
68
|
+
var freezeItemsContainerID = uniqueIDs[index];
|
69
|
+
if (!thisInstance.itemsInitialState[freezeItemsContainerID]) {
|
70
|
+
thisInstance._saveFreezeItemsInitialState(freezeItemsContainerID);
|
71
|
+
}
|
72
|
+
thisInstance._updateFreezeItemsOnScroll(
|
73
|
+
freezeItemsContainerID,
|
74
|
+
scrollableContainerScrollTop,
|
75
|
+
scrollableContainerScrollLeft
|
76
|
+
);
|
77
|
+
}
|
78
|
+
}
|
79
|
+
});
|
80
|
+
},
|
81
|
+
_saveFreezeItemsInitialState: function(freezeItemsContainerID) {
|
82
|
+
var $allFreezeItems = $("[data-sticky-direction][data-sticky-id='" + freezeItemsContainerID + "']");
|
83
|
+
var $freezeActions = $("[data-reporting-action][data-sticky-id='" + freezeItemsContainerID + "']");
|
84
|
+
var yAreaBounds;
|
85
|
+
var xAreaBounds;
|
86
|
+
this.itemsInitialState[freezeItemsContainerID] = {};
|
87
|
+
this.freezeBGColor[freezeItemsContainerID] = $("[data-id='" + freezeItemsContainerID + "']").attr("data-sticky-bg-color");
|
88
|
+
for (var index = 0; index < $allFreezeItems.length; index++) {
|
89
|
+
var $item = $($allFreezeItems[index]);
|
90
|
+
var scrollDirection = $item.attr("data-sticky-direction");
|
91
|
+
var itemID = $item.attr("data-id");
|
92
|
+
var itemPosition = $item.position();
|
93
|
+
var scaledItemPosition = { top: itemPosition.top / this.scaleFactor, left: itemPosition.left / this.scaleFactor };
|
94
|
+
var itemBounds = rectangle(scaledItemPosition.left, scaledItemPosition.top, $item.outerWidth(true) * this.scaleFactor, $item.outerHeight(true) * this.scaleFactor);
|
95
|
+
switch (scrollDirection) {
|
96
|
+
case "Vertical":
|
97
|
+
yAreaBounds = yAreaBounds ? yAreaBounds.union(itemBounds) : itemBounds;
|
98
|
+
break;
|
99
|
+
case "Horizontal":
|
100
|
+
xAreaBounds = xAreaBounds ? xAreaBounds.union(itemBounds) : itemBounds;
|
101
|
+
break;
|
102
|
+
}
|
103
|
+
this._saveFreezeItemInitialState(freezeItemsContainerID, $item, itemID, scaledItemPosition);
|
104
|
+
}
|
105
|
+
this.freezeMaxZIndex[freezeItemsContainerID] = $freezeActions.length ? $freezeActions.css("zIndex") : this.zIndex;
|
106
|
+
this.yFrozenAreasBounds[freezeItemsContainerID] = yAreaBounds;
|
107
|
+
this.xFrozenAreasBounds[freezeItemsContainerID] = xAreaBounds;
|
108
|
+
},
|
109
|
+
/**
|
110
|
+
* Save the freeze UI item initial position based on the wrapper element and current page
|
111
|
+
* - freezeItemsContainerID - string. A parent/wrapper element identifier
|
112
|
+
* - $item - JQuery DOM element of the freezed item
|
113
|
+
* - itemID - string. A ID of the freeze UI item
|
114
|
+
* - position - object. Contains the top and left values
|
115
|
+
*/
|
116
|
+
_saveFreezeItemInitialState: function(freezeItemsContainerID, $item, itemID, position) {
|
117
|
+
var itemBgColor = $item.css("background-color");
|
118
|
+
var hasInitialBgColor = this._hasSetBgColor(itemBgColor);
|
119
|
+
var itemState = {
|
120
|
+
top: position.top,
|
121
|
+
left: position.left,
|
122
|
+
zIndex: $item.css("zIndex"),
|
123
|
+
hasBgColor: hasInitialBgColor
|
124
|
+
};
|
125
|
+
this.itemsInitialState[freezeItemsContainerID][itemID] = itemState;
|
126
|
+
},
|
127
|
+
_updateFreezeItemsOnScroll: function(freezeItemsContainerID, scrollableContainerScrollTop, scrollableContainerScrollLeft) {
|
128
|
+
var $elementWrapper = $("div[data-id='" + freezeItemsContainerID + "']");
|
129
|
+
if (this._isInScrollVisibleArea($elementWrapper)) {
|
130
|
+
var $pageContainer = $elementWrapper.closest(".trv-report-page");
|
131
|
+
var pageContainerPosition = $pageContainer.position();
|
132
|
+
var pageContainerMargin = parseFloat($pageContainer.css("margin-top"));
|
133
|
+
var pageContainerTopOffset = parseFloat($pageContainer.css("padding-top"));
|
134
|
+
var pageContainerLeftOffset = parseFloat($pageContainer.css("padding-left"));
|
135
|
+
var pageContainerBorderTopWidth = parseFloat($pageContainer.css("border-top-width"));
|
136
|
+
var pageContainerBorderLeftWidth = parseFloat($pageContainer.css("border-left-width"));
|
137
|
+
var $rowHeaders = $("[data-sticky-direction*='Horizontal'][data-sticky-id='" + freezeItemsContainerID + "']");
|
138
|
+
var $colHeaders = $("[data-sticky-direction*='Vertical'][data-sticky-id='" + freezeItemsContainerID + "']");
|
139
|
+
var hasFixRow = $rowHeaders.length > 0;
|
140
|
+
var hasFixColumn = $colHeaders.length > 0;
|
141
|
+
var elementWrapperPosition = $elementWrapper.position();
|
142
|
+
var elementWrapperTopPosition = elementWrapperPosition.top + pageContainerPosition.top + pageContainerMargin + pageContainerTopOffset + pageContainerBorderTopWidth;
|
143
|
+
var elementWrapperLeftPosition = elementWrapperPosition.left + pageContainerLeftOffset + pageContainerBorderLeftWidth;
|
144
|
+
var verticalMoveOffset = scrollableContainerScrollTop - elementWrapperTopPosition;
|
145
|
+
var horizontalMoveOffset = scrollableContainerScrollLeft - elementWrapperLeftPosition;
|
146
|
+
if (hasFixColumn && verticalMoveOffset > 0) {
|
147
|
+
if (scrollableContainerScrollTop <= $elementWrapper.outerHeight() * this.scaleFactor + elementWrapperTopPosition - this.yFrozenAreasBounds[freezeItemsContainerID].height) {
|
148
|
+
this.currentlyFrozenContainer.vertical[freezeItemsContainerID] = true;
|
149
|
+
this._updateUIElementsPosition($colHeaders, "top", verticalMoveOffset / this.scaleFactor, freezeItemsContainerID);
|
150
|
+
}
|
151
|
+
} else {
|
152
|
+
if (this.currentlyFrozenContainer.vertical[freezeItemsContainerID]) {
|
153
|
+
delete this.currentlyFrozenContainer.vertical[freezeItemsContainerID];
|
154
|
+
this._updateUIElementsPosition($colHeaders, "top", -1, freezeItemsContainerID);
|
155
|
+
}
|
156
|
+
}
|
157
|
+
if (hasFixRow && horizontalMoveOffset > 0) {
|
158
|
+
if (scrollableContainerScrollLeft <= $elementWrapper.outerWidth() * this.scaleFactor + elementWrapperLeftPosition - this.xFrozenAreasBounds[freezeItemsContainerID].width) {
|
159
|
+
this.currentlyFrozenContainer.horizontal[freezeItemsContainerID] = true;
|
160
|
+
this._updateUIElementsPosition($rowHeaders, "left", horizontalMoveOffset / this.scaleFactor, freezeItemsContainerID);
|
161
|
+
}
|
162
|
+
} else {
|
163
|
+
if (this.currentlyFrozenContainer.horizontal[freezeItemsContainerID]) {
|
164
|
+
delete this.currentlyFrozenContainer.horizontal[freezeItemsContainerID];
|
165
|
+
this._updateUIElementsPosition($rowHeaders, "left", -1, freezeItemsContainerID);
|
166
|
+
}
|
167
|
+
}
|
168
|
+
} else {
|
169
|
+
if (this.currentlyFrozenContainer.horizontal[freezeItemsContainerID] || this.currentlyFrozenContainer.vertical[freezeItemsContainerID]) {
|
170
|
+
this._resetToDefaultPosition(freezeItemsContainerID);
|
171
|
+
}
|
172
|
+
}
|
173
|
+
},
|
174
|
+
/**
|
175
|
+
* Move all freeze items to their initial position
|
176
|
+
* Takes one parameters
|
177
|
+
* - freezeItemsContainerID - string. A parent/wrapper element identifier
|
178
|
+
*/
|
179
|
+
_resetToDefaultPosition: function(freezeItemsContainerID) {
|
180
|
+
var $rowHeaders = $("[data-sticky-direction*='Horizontal'][data-sticky-id='" + freezeItemsContainerID + "']");
|
181
|
+
var $colHeaders = $("[data-sticky-direction*='Vertical'][data-sticky-id='" + freezeItemsContainerID + "']");
|
182
|
+
this._updateUIElementsPosition($colHeaders, "top", -1, freezeItemsContainerID);
|
183
|
+
this._updateUIElementsPosition($rowHeaders, "left", -1, freezeItemsContainerID);
|
184
|
+
delete this.currentlyFrozenContainer.horizontal[freezeItemsContainerID];
|
185
|
+
delete this.currentlyFrozenContainer.vertical[freezeItemsContainerID];
|
186
|
+
},
|
187
|
+
/**
|
188
|
+
* Update the freeze elements position
|
189
|
+
* Takes four parameters
|
190
|
+
* - targetElements -Array. Collection of DOM element, that has a freeze attribute
|
191
|
+
* - position - string. Indicates which position property to be updated - top or left
|
192
|
+
* - offset - integer. The value of the increase that should be applied.
|
193
|
+
* If it is negative number, should not move the items and it should set their initial position
|
194
|
+
* - freezeItemsContainerID - string. A parent/wrapper element identifier
|
195
|
+
*/
|
196
|
+
_updateUIElementsPosition: function(targetElements, position, offset, freezeItemsContainerID) {
|
197
|
+
for (var index = 0; index < targetElements.length; index++) {
|
198
|
+
var $item = $(targetElements[index]);
|
199
|
+
var itemFreezeDirection = $item.attr("data-sticky-direction");
|
200
|
+
var isFrozenBothDirection = itemFreezeDirection.indexOf(",") > 0;
|
201
|
+
var itemID = $item.attr("data-id");
|
202
|
+
var itemInitialState = this.itemsInitialState[freezeItemsContainerID][itemID];
|
203
|
+
var itemNewPostion = itemInitialState[position];
|
204
|
+
var initialZIndex = itemInitialState["zIndex"];
|
205
|
+
var hasInitialBgColor = itemInitialState["hasBgColor"];
|
206
|
+
var zIndexValue = 1;
|
207
|
+
var maxZIndex = this.freezeMaxZIndex[freezeItemsContainerID] ? this.freezeMaxZIndex[freezeItemsContainerID] : zIndexValue;
|
208
|
+
if (isFrozenBothDirection) {
|
209
|
+
zIndexValue = initialZIndex !== "auto" ? initialZIndex : maxZIndex + 2;
|
210
|
+
} else {
|
211
|
+
zIndexValue = initialZIndex !== "auto" ? initialZIndex + 1 : maxZIndex;
|
212
|
+
}
|
213
|
+
var newStyleRules = {
|
214
|
+
"z-index": zIndexValue
|
215
|
+
};
|
216
|
+
if (offset >= 0) {
|
217
|
+
itemNewPostion = itemNewPostion + offset;
|
218
|
+
} else {
|
219
|
+
newStyleRules["z-index"] = initialZIndex;
|
220
|
+
}
|
221
|
+
if (!hasInitialBgColor) {
|
222
|
+
this._applyBgColorOnScroll($item, isFrozenBothDirection, hasInitialBgColor, offset >= 0, freezeItemsContainerID);
|
223
|
+
}
|
224
|
+
newStyleRules[position] = itemNewPostion + "px";
|
225
|
+
$item.css(newStyleRules);
|
226
|
+
}
|
227
|
+
},
|
228
|
+
// eslint-disable-next-line max-params
|
229
|
+
_applyBgColorOnScroll: function($item, isItemFrozenBothDirection, hasInitialBgColor, shouldApplyBGColor, freezeItemsContainerID) {
|
230
|
+
if ($item.is("img")) {
|
231
|
+
return true;
|
232
|
+
}
|
233
|
+
if (isItemFrozenBothDirection && this._isFrozen(freezeItemsContainerID) && !hasInitialBgColor) {
|
234
|
+
$item.css("background-color", this.freezeBGColor[freezeItemsContainerID]);
|
235
|
+
return true;
|
236
|
+
}
|
237
|
+
if (shouldApplyBGColor) {
|
238
|
+
$item.css("background-color", this.freezeBGColor[freezeItemsContainerID]);
|
239
|
+
} else {
|
240
|
+
$item.css("background-color", "initial");
|
241
|
+
}
|
242
|
+
},
|
243
|
+
_hasSetBgColor: function(bgColorValue) {
|
244
|
+
return getColorAlphaValue(bgColorValue) > 0;
|
245
|
+
},
|
246
|
+
_isFrozen: function(freezeItemsContainerID) {
|
247
|
+
return this.currentlyFrozenContainer.horizontal[freezeItemsContainerID] || this.currentlyFrozenContainer.vertical[freezeItemsContainerID];
|
248
|
+
},
|
249
|
+
/**
|
250
|
+
* Checks if an UI element is in the visible part of the scrollable container
|
251
|
+
* Takes one parameters
|
252
|
+
* - $element - JQuery DOM element
|
253
|
+
*/
|
254
|
+
_isInScrollVisibleArea: function($element) {
|
255
|
+
var $page = $element.closest(".trv-report-page");
|
256
|
+
var elementPosition = $element.position();
|
257
|
+
return this._isVisibleVertically($element, $page, elementPosition) && this._isVisibleHorizontally($element, $page, elementPosition);
|
258
|
+
},
|
259
|
+
_isVisibleHorizontally: function($element, $page, elementPosition) {
|
260
|
+
var pageLeftOffset = parseFloat($page.css("padding-left"));
|
261
|
+
var scrollableContainerLeftScrollPosition = this.$scrollableContainer.scrollLeft();
|
262
|
+
var scrollableContainerWidth = this.$scrollableContainer.width();
|
263
|
+
var elementWidth = $element.outerWidth(true) * this.scaleFactor;
|
264
|
+
var elementLeftOffset = elementPosition.left + pageLeftOffset;
|
265
|
+
return elementLeftOffset > scrollableContainerLeftScrollPosition - elementWidth && elementLeftOffset < scrollableContainerLeftScrollPosition + elementWidth + scrollableContainerWidth;
|
266
|
+
},
|
267
|
+
_isVisibleVertically: function($element, $page, elementPosition) {
|
268
|
+
var pageTopOffset = parseFloat($page.css("padding-top"));
|
269
|
+
var pagePosition = $page.position();
|
270
|
+
var scrollableContainerTopScrollPosition = this.$scrollableContainer.scrollTop();
|
271
|
+
var scrollableContainerHeight = this.$scrollableContainer.height();
|
272
|
+
var elementHeight = $element.outerHeight(true) * this.scaleFactor;
|
273
|
+
var elementTopOffset = elementPosition.top + pageTopOffset + pagePosition.top;
|
274
|
+
return elementTopOffset > scrollableContainerTopScrollPosition - elementHeight && elementTopOffset < scrollableContainerTopScrollPosition + elementHeight + scrollableContainerHeight;
|
275
|
+
}
|
276
|
+
};
|
277
|
+
|
278
|
+
export { UIFreezeCoordinator };
|