blob: a8a79cbc72cec8b7f67585325fe8a05d3bd212e5 [file] [log] [blame]
Akron537bc522018-07-13 19:06:27 +02001/**
2 * Create a view that can be added to a panel,
3 * like a tree view or the metadata view.
4 */
5
Akron0f6552f2020-10-20 10:06:46 +02006"use strict";
7
Akron537bc522018-07-13 19:06:27 +02008define(['buttongroup', 'util'], function (buttonGroupClass) {
9
Akron56d42072018-07-24 11:17:24 +020010 const loc = KorAP.Locale;
Akron362c11a2018-08-29 20:01:30 +020011 loc.CLOSE = loc.CLOSE || 'Close';
Akronbfe912c2018-07-17 19:30:52 +020012
Akron537bc522018-07-13 19:06:27 +020013 return {
Akron4d926f12018-07-16 15:30:25 +020014 create : function (classes) {
15 return Object.create(this)._init(classes);
Akron537bc522018-07-13 19:06:27 +020016 },
17
Akron4d926f12018-07-16 15:30:25 +020018 // Override by inheriting object
19 _init : function (classes) {
Akron537bc522018-07-13 19:06:27 +020020 this.panel = undefined;
Akron4d926f12018-07-16 15:30:25 +020021 this._classes = classes;
22 this._shown = false;
Akron537bc522018-07-13 19:06:27 +020023
24 // The buttonclass is bind to the view
Akron0f6552f2020-10-20 10:06:46 +020025 const c = ['action', 'button-view'];
Akron4d926f12018-07-16 15:30:25 +020026 if (classes)
Akronbfe912c2018-07-17 19:30:52 +020027 c.push.apply(c,classes);
Akron4d926f12018-07-16 15:30:25 +020028
29 this.actions = buttonGroupClass.create(c).bind(this);
30
Akron792b1a42020-09-14 18:56:38 +020031 this.actions.add(loc.CLOSE, {'cls':['button-icon','close']}, function (e) {
Akron537bc522018-07-13 19:06:27 +020032 this.close();
33 });
34
Akron4d926f12018-07-16 15:30:25 +020035 // Warning: This is circular
36 this.actions.view = this;
37
Akron537bc522018-07-13 19:06:27 +020038 return this;
39 },
40
Akron0f6552f2020-10-20 10:06:46 +020041
Akron537bc522018-07-13 19:06:27 +020042 /**
43 * Element of the view
44 */
45 element : function () {
Akron24aa0052020-11-10 11:00:34 +010046 if (this._el) {
47 this._el.classList.add('show');
48 return this._el;
Akron3d9ce5e2020-10-01 15:18:36 +020049 };
Akron537bc522018-07-13 19:06:27 +020050
51 // Create panel element
Akron0f6552f2020-10-20 10:06:46 +020052 const e = document.createElement('div');
53 const cl = e.classList;
Akron4d926f12018-07-16 15:30:25 +020054
Akron3d9ce5e2020-10-01 15:18:36 +020055 cl.add('view', 'show');
Akron4d926f12018-07-16 15:30:25 +020056 if (this._classes)
57 cl.add.apply(cl, this._classes);
58
Akron56d42072018-07-24 11:17:24 +020059 // TODO: The show may need to be wrapped in another DIV!
Akron24f48ea2020-07-01 09:37:19 +020060 if (this.show !== undefined) {
Akron0f6552f2020-10-20 10:06:46 +020061 const s = this.show();
Akron24f48ea2020-07-01 09:37:19 +020062 if (s) {
63 e.appendChild(s);
64 } else {
65 return e
Akron0f6552f2020-10-20 10:06:46 +020066 };
Akron24f48ea2020-07-01 09:37:19 +020067 }
Akron4d926f12018-07-16 15:30:25 +020068
69 this._shown = true;
Akron537bc522018-07-13 19:06:27 +020070
71 e.appendChild(this.actions.element());
72
Akron24aa0052020-11-10 11:00:34 +010073 return this._el = e;
Akron537bc522018-07-13 19:06:27 +020074 },
75
Akron4d926f12018-07-16 15:30:25 +020076
77 /**
78 * Is the object shown?
79 */
80 shown : function () {
81 return this._shown;
82 },
Akrone6538cd2018-07-16 17:52:33 +020083
Akron3d9ce5e2020-10-01 15:18:36 +020084
85 /**
86 * Hide the widget if shown.
87 */
88 minimize : function () {
Akron24aa0052020-11-10 11:00:34 +010089 if (this._el) {
90 this._el.classList.remove("show");
Akron3d9ce5e2020-10-01 15:18:36 +020091 }
92 },
93
Akron0f6552f2020-10-20 10:06:46 +020094
Akrone6538cd2018-07-16 17:52:33 +020095 // onClose : function () {},
96
Akron0f6552f2020-10-20 10:06:46 +020097
Akron537bc522018-07-13 19:06:27 +020098 /**
99 * Close the view.
100 */
101 close : function () {
Akron22598cd2019-12-09 14:59:03 +0100102
103 // Close embedded things before
104 if (this.onClose)
105 this.onClose();
106
Akron0f6552f2020-10-20 10:06:46 +0200107 const e = this.element();
Akron4a703872018-07-26 10:59:41 +0200108 if (e.parentNode) {
109 e.parentNode.removeChild(e);
110 };
Akron537bc522018-07-13 19:06:27 +0200111 this.panel.delView(this);
Akron4d926f12018-07-16 15:30:25 +0200112 this._shown = false;
113 },
114
Akron0f6552f2020-10-20 10:06:46 +0200115
Akron4d926f12018-07-16 15:30:25 +0200116 /**
117 * Upgrade this object to another object,
118 * while private data stays intact.
119 *
120 * @param {Object] An object with properties.
121 */
122 upgradeTo : function (props) {
Akron0f6552f2020-10-20 10:06:46 +0200123 for (let prop in props) {
Akron4d926f12018-07-16 15:30:25 +0200124 this[prop] = props[prop];
125 };
126 return this;
Akron537bc522018-07-13 19:06:27 +0200127 }
128 };
129});