From 2855e9a8d679b9149ed7c65710e537a5168e0fb5 Mon Sep 17 00:00:00 2001 From: Anselm Joseph Date: Wed, 17 Jul 2019 21:01:34 +0530 Subject: [PATCH] added updating data --- Demo/main.js | 78 +++++++++++++++++++++++++++------------------- dist/tea-plates.js | 21 ++++++++++++- 2 files changed, 66 insertions(+), 33 deletions(-) diff --git a/Demo/main.js b/Demo/main.js index 7e480e5..eb80261 100644 --- a/Demo/main.js +++ b/Demo/main.js @@ -27,46 +27,60 @@ function setup() { newTemplate1.registerEventListeners('click', onclick); newTemplate1.showLoading(1); - function insertData(templateObject, completion) { - function newDS() { - templateObject.setData(jsondata); - templateObject.insertObjects(completion); - } - templateObject.hideLoading(newDS); + function newDS() { + newTemplate1.setData(jsondata); + newTemplate1.insertObjects(() => { + newTemplate1.updateDataForUid(1, (data) => { + data['notification-count'] = 10; + return data; + }); + newTemplate1.reloadObjectAtUid(1); + }); } - var newTemplate2 = new TeaPlates('poc-wrapper-2', template, loadingTemplate); - newTemplate2.showLoading(3); setTimeout(() => { - insertData(newTemplate2); - }, 9000) + newTemplate1.hideLoading(newDS); + }, 1000); - setTimeout(() => { - insertData(newTemplate1, () => { - var obj = newTemplate1.removeObjectWithUID(2); - newTemplate2.setData(obj); - newTemplate2.insertObjects(); + // var newTemplate2 = new TeaPlates('poc-wrapper-2', template, loadingTemplate); + // newTemplate2.showLoading(3); + // setTimeout(() => { + // insertData(newTemplate2); + // }, 9000) + + // setTimeout(() => { + // insertData(newTemplate1, () => { + // var obj = newTemplate1.removeObjectWithUID(2); + // newTemplate2.setData(obj); + // newTemplate2.insertObjects(); - }); - }, 5000) + // }); + // }, 5000) - var newTemplate3 = new TeaPlates('poc-wrapper-3', template, loadingTemplate); - newTemplate3.showLoading(4); - setTimeout(() => { - insertData(newTemplate3); - }, 10000) + // var newTemplate3 = new TeaPlates('poc-wrapper-3', template, loadingTemplate); + // newTemplate3.showLoading(4); + // setTimeout(() => { + // insertData(newTemplate3); + // }, 10000) - var newTemplate4 = new TeaPlates('poc-wrapper-4', template, loadingTemplate); - newTemplate4.showLoading(2); - setTimeout(() => { - insertData(newTemplate4); - }, 3000) + // var newTemplate4 = new TeaPlates('poc-wrapper-4', template, loadingTemplate); + // newTemplate4.showLoading(2); + // setTimeout(() => { + // insertData(newTemplate4); + // setTimeout(() => { + // newTemplate4.updateDataForUid(1, (data) => { + // data['notification-count'] = 10; + // return data; + // }); + // newTemplate4.reloadObjectAtUid(1); + // }, 2000); + // }, 3000) - var newTemplate5 = new TeaPlates('poc-wrapper-5', template, loadingTemplate); - newTemplate5.showLoading(5); - setTimeout(() => { - insertData(newTemplate5); - }, 12000) + // var newTemplate5 = new TeaPlates('poc-wrapper-5', template, loadingTemplate); + // newTemplate5.showLoading(5); + // setTimeout(() => { + // insertData(newTemplate5); + // }, 12000) } window.onload = setup; \ No newline at end of file diff --git a/dist/tea-plates.js b/dist/tea-plates.js index b90b5dd..2d268b7 100644 --- a/dist/tea-plates.js +++ b/dist/tea-plates.js @@ -158,6 +158,26 @@ class TeaPlates { ); } + updateDataForUid(uid, callback) { + this.jsonData[`uid-${uid}`] = callback(this.jsonData[`uid-${uid}`]); + } + + reloadObjectAtUid(uid) { + let data = this.jsonData[`uid-${uid}`]; + let newTpl = this.pTP_createTemplate(this.template(data), uid); + let newEle = this.pTP_CreateElementFromString(newTpl.templateString, uid); + + let element = undefined; + this.insertedElements.forEach((ele) => { + if (ele.getAttribute('uid') == uid) { + element = ele; + } + }); + if (element == undefined) return; + + element.parentNode.replaceChild(newEle, element); + } + removeObjectAtIndex(index, completion = () => {}) { let element = this.insertedElements[index]; let elementStyle = window.getComputedStyle(element); @@ -181,7 +201,6 @@ class TeaPlates { if (ele.getAttribute('uid') == uid) { element = ele; index = i; - break; } }); if (element == undefined) return;