https://www.kilbirnieplacegc.co.uk/controls/content-tiles/viewmodel.js?v=1c09ac6248

1/// <reference path="../../shared/ts/jquery.d.ts" />
2/// <reference path="../../shared/ts/knockout.d.ts" />
3/// <reference path="../../shared/ts/ko.validation.d.ts" />
4/// <reference path="../../shared/ts/ko.mapping.2.0.d.ts" />
5var KnockoutControls;
6(function (KnockoutControls) {
7    var PageControlSetting = /** @class */ (function () {
8        function PageControlSetting() {
9            this.Name = ko.observable();
10            this.Setting = ko.observable();
11            this.PageControlSettingId = ko.observable();
12        }
13        return PageControlSetting;
14    }());
15    var ContentTile = /** @class */ (function () {
16        function ContentTile() {
17            this.TileId = ko.observable(0);
18            this.ImageUrl = ko.observable('');
19            this.Title = ko.observable('');
20            this.Description = ko.observable('');
21            this.BodyText = ko.observable('');
22            this.LinkText = ko.observable('');
23            this.LinkUrl = ko.observable('');
24            this.OpenLinkInNewTab = ko.observable(false);
25            this.ThemeId = ko.observable(0);
26            this.IsActive = ko.observable(false);
27            this.IsNew = ko.observable(false);
28            this.EditModal = ko.observable(false);
29        }
30        return ContentTile;
31    }());
32    var ContentTiles = /** @class */ (function () {
33        function ContentTiles() {
34            this.memberId = ko.observable();
35            this.memberUid = ko.observable();
36            this.memberFirstName = ko.observable();
37            this.memberFullName = ko.observable();
38            this.pageControlId = ko.observable();
39            this.pageId = ko.observable();
40            this.clubFolderPath = ko.observable();
41            this.clubWebsiteId = ko.observable();
42            this.isEditMode = ko.observable(false);
43            this.controlMode = ko.observable();
44            this.tiles = ko.observableArray([]);
45            this.activeTileId = ko.observable(null);
46            this.activeTile = null;
47            this.deleteTileId = ko.observable(null);
48            this.insertTileId = ko.observable(null);
49            this.pendingInsert = ko.observable(false);
50            this.editPageControlSettings = ko.observableArray();
51            this.showSuccess = ko.observable();
52            this.headerText = ko.observable();
53            this.cssClassName = ko.observable("");
54            this.colCssClassName = ko.observable("col-10 offset-1");
55            this.applyTopCurveOnBackground = ko.observable(false);
56            this.arrowStyleId = ko.observable(1);
57            this.defaultImageUrl = ko.observable();
58            this.showThemeOptions = ko.observable(false);
59            this.showDescription = ko.observable(true);
60            this.showLinkText = ko.observable(true);
61            this.modalShow = ko.observable(false);
62            this.modalContent = ko.observable(new ContentTile());
63            this.content = ko.observable();
64            this.previousContent = ko.observable();
65            var self = this;
66            $(document).ready(function () {
67                self.controlMode(GetParameterValues('mode'));
68                if ($('#pnlAdmin') && $('#pnlAdmin').length && self.controlMode() == 'edit') {
69                    self.isEditMode(true);
70                    self.getControlProperties();
71                }
72            });
73        }
74        ContentTiles.prototype.onAfterBound = function () {
75            this.init();
76        };
77        ContentTiles.prototype.init = function () {
78            var self = this;
79            self.getJsonContent();
80        };
81        ContentTiles.prototype.edit = function (data) {
82            var self = this;
83            self.activeTileId(data.TileId());
84            self.activeTile = ko.mapping.toJS(data);
85        };
86        ContentTiles.prototype.delete = function (data) {
87            var self = this;
88            if (data) {
89                self.save(data);
90            }
91        };
92        ContentTiles.prototype.save = function (data) {
93            var self = this;
94            if (data) {
95                if (self.activeTileId()) {
96                    data.IsNew(false);
97                    var imgElement = $(".".concat(self.pageControlId(), "-").concat(self.activeTileId(), " .js-filemanager-img"));
98                    if (imgElement && imgElement.attr('data-filemanager-updated') == 'yes') {
99                        data.ImageUrl(imgElement.attr('src'));
100                    }
101                }
102                else {
103                    self.tiles.remove(data);
104                }
105            }
106            var jsonContent = JSON.stringify(ko.mapping.toJS(self.tiles()));
107            if (!!jsonContent && JSON.parse(jsonContent)) {
108                $.ajax({
109                    type: "POST",
110                    dataType: "json",
111                    contentType: "application/json",
112                    data: JSON.stringify({
113                        pageControlId: self.pageControlId(),
114                        jsonContent: jsonContent
115                    }),
116                    url: '/api/PageControl/UpdateControlJsonContent'
117                }).done(function (response) {
118                    self.activeTileId(null);
119                    self.activeTile = null;
120                    self.pendingInsert(false);
121                });
122            }
123            else {
124                alert("Saving JSON content [".concat(jsonContent, "] has failed, please contact support."));
125            }
126        };
127        ContentTiles.prototype.cancelEdit = function (tile) {
128            var self = this;
129            if (tile.IsNew()) {
130                self.tiles.remove(tile);
131            }
132            else {
133                tile.Title(self.activeTile.Title);
134                tile.Description(self.activeTile.Description);
135                tile.ImageUrl(self.activeTile.ImageUrl);
136                tile.LinkText(self.activeTile.LinkText);
137                tile.LinkUrl(self.activeTile.LinkUrl);
138                tile.OpenLinkInNewTab(self.activeTile.OpenLinkInNewTab);
139                tile.IsActive(self.activeTile.IsActive);
140                tile.BodyText(self.activeTile.BodyText);
141            }
142            self.activeTile = null;
143            self.activeTileId(null);
144            self.pendingInsert(false);
145        };
146        ContentTiles.prototype.addNew = function (data, indexIncrease) {
147            var self = this;
148            var newId = self.tiles().length > 0 ? self.tiles().reduce(function (max, item) { return (item.TileId() > max ? item.TileId() : max); }, self.tiles()[0].TileId()) + 1 : 1;
149            var newTile = new ContentTile();
150            newTile.TileId(newId);
151            newTile.OpenLinkInNewTab(false);
152            newTile.IsActive(true);
153            newTile.IsNew(true);
154            self.activeTileId(newId);
155            if (data) {
156                var index = self.tiles.indexOf(data);
157                self.tiles.splice(index + indexIncrease, 0, newTile);
158            }
159            else {
160                self.tiles.push(newTile);
161            }
162            self.insertTileId(null);
163            self.pendingInsert(true);
164        };
165        ContentTiles.prototype.openFileManager = function (containerName) {
166            var w = 1000;
167            var h = 700;
168            var left = (screen.width / 2) - (w / 2);
169            var top = (screen.height / 2) - (h / 2);
170            var windowFeatures = "menubar=no,location=no,resizable=yes,scrollbars=yes,status=no,width=" 

170+ w + ",height=" + h + ",top=" + top + ",left=" + left;
171            window.open("/FileManager.aspx?imageContainer=".concat(containerName), "File Manager", windowFeatures);
172        };
173        ContentTiles.prototype.getJsonContent = function () {
174            var self = this;
175            $.ajax({
176                type: "GET",
177                dataType: "json",
178                contentType: "application/json",
179                url: "/api/pagecontrol/GetControlJsonContent",
180                data: {
181                    pageControlId: self.pageControlId(),
182                }
183            }).done(function (data) {
184                if (data) {
185                    ko.utils.arrayForEach(data, function (item, index) {
186                        item.TileId = index + 1;
187                        item.IsNew = false;
188                        if (item.OpenLinkInNewTab == undefined) {
189                            item.OpenLinkInNewTab = false;
190                        }
191                        if (item.EditModal == undefined) {
192                            item.EditModal = false;
193                        }
194                        if (item.BodyText == undefined) {
195                            item.BodyText = '';
196                        }
197                        if (item.ThemeId == undefined) {
198                            item.ThemeId = 0;
199                        }
200                    });
201                    ko.mapping.fromJS(data, null, self.tiles);
202                    if (typeof revealText === 'function')
203                        revealText();
204                }
205            });
206        };
207        ContentTiles.prototype.getControlProperties = function () {
208            var self = this;
209            $.ajax({
210                type: "GET",
211                dataType: "json",
212                contentType: "application/json",
213                url: "/api/pagecontrol/GetControlSettings",
214                data: {
215                    pageControlId: self.pageControlId(),
216                }
217            }).done(function (responseControlSettings) {
218                if (responseControlSettings) {
219                    ko.mapping.fromJS(responseControlSettings, {}, self.editPageControlSettings);

220                    self.editPageControlSettings().forEach(function (item) {
221                        if (item.Name() == 'HeaderText') {
222                            self.headerText(item.Setting());
223                        }
224                    });
225                }
226            }).fail(function (e) {
227                console.log(e);
228            });
229        };
230        ContentTiles.prototype.updateHeader = function () {
231            var self = this;
232            self.editPageControlSettings().forEach(function (item) {
233                if (item.Name() == 'HeaderText') {
234                    self.updatePageControlSettings(item.PageControlSettingId(), self.headerText());
235                }
236            });
237        };
238        ContentTiles.prototype.updatePageControlSettings = function (pageControlSettingId, setting) {
239            var self = this;
240            $.ajax({
241                type: "POST",
242                dataType: "json",
243                contentType: "application/json",
244                url: "/api/PageControl/UpdatePageControlSetting?pageControlSettingId=".concat(pageControlSettingId, "&setting=").concat(setting)
245            }).done(function (response) {
246                self.showSuccess(true);
247            }).fail(function (e) {
248                console.log(e);
249            });
250        };
251        ContentTiles.prototype.openModal = function (tile, editModal) {
252            var self = this;
253            self.content(tile.BodyText());
254            self.modalContent(tile);
255            self.modalContent().EditModal(editModal);
256            self.previousContent(tile.BodyText());
257            $('body').addClass('modal-open');
258            self.modalShow(true);
259        };
260        ContentTiles.prototype.closeModal = function (r, e) {
261            var self = this;
262            if (e.target == $('div.cw-modal.show')[0] || e.target == $('span.close')[0]) {
263                self.modalShow(false);
264                self.modalContent(new ContentTile());
265                $('body').removeClass('modal-open');
266            }
267            else if ($(e.target).closest("a").length) {
268                return true;
269            }
270        };
271        ContentTiles.prototype.saveModalContent = function () {
272            var self = this;
273            var tile = ko.utils.arrayFirst(self.tiles(), function (item) { return item.TileId() == self.activeTileId(); });
274            tile.BodyText(self.content());
275            self.modalShow(false);
276            self.modalContent(new ContentTile());
277            $('body').removeClass('modal-open');
278        };
279        ContentTiles.prototype.redirectToLink = function (linkUrl, openNewTab) {
280            if (openNewTab) {
281                window.open(linkUrl, '_blank');
282            }
283            else {
284                window.location.href = linkUrl;
285            }
286        };
287        ContentTiles.prototype.selectTheme = function (themeId) {
288            var self = this;
289            var tile = ko.utils.arrayFirst(self.tiles(), function (item) { return item.TileId() == self.activeTileId(); });
290            tile.ThemeId(themeId);
291        };
292        return ContentTiles;
293    }());
294    KnockoutControls.ContentTiles = ContentTiles;
295})(KnockoutControls || (KnockoutControls = {}));
296var dg_clientside_controls = dg_clientside_controls || {};
297dg_clientside_controls["content-tiles"] = KnockoutControls.ContentTiles;