diff --git a/index.html b/index.html
index d8de8adbe..41656e5f5 100755
--- a/index.html
+++ b/index.html
@@ -1388,89 +1388,6 @@
var defaultModel = defaultType.model;
var defaultView = defaultType.view;
-
- const COUNTDOWN_TYPE = 'countdown';
- bm.add('link-block', {
- label: 'Countdown',
- category: 'Extra',
- content: {
- type: 'countdown',
- startfrom: 'May 5, 2018 20:00:00',
- activeOnRender: 1,
- },
- attributes: {
- class:'fa fa-clock-o'
- }
- });
-
- domc.addType(COUNTDOWN_TYPE, {
- model: defaultModel.extend({
-
- defaults: Object.assign({}, defaultModel.prototype.defaults, {
- startfrom: 'Nov 25, 2018 15:00:00',
- endText: 'EXPIRED',
- droppable: false,
- traits: [{
- label: 'Start',
- name: 'startfrom',
- changeProp: 1,
- },{
- label: 'End text',
- name: 'endText',
- changeProp: 1,
- }],
- script: function() {
- var startfrom = '{[ startfrom ]}';
- var endTxt = '{[ endText ]}';
- var countDownDate = new Date(startfrom).getTime();
- var el = this.querySelector('#countdown-c');
- var oldInterval = el.gjs_countdown_interval;
- oldInterval && clearInterval(oldInterval);
-
- var moveTimer = function() {
- var now = new Date().getTime();
- var distance = countDownDate - now;
- // Time calculations for days, hours, minutes and seconds
- var days = Math.floor(distance / (1000 * 60 * 60 * 24));
- var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
- var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
- var seconds = Math.floor((distance % (1000 * 60)) / 1000);
-
- el.innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";
- // If the count down is finished, write some text
- if (distance < 0) {
- clearInterval(interval);
- el.innerHTML = endTxt;
- }
- };
-
- var interval = setInterval(moveTimer, 1000);
- el.gjs_countdown_interval = interval;
- moveTimer();
- }
- }),
-
- init() {
- this.listenTo(this, 'change:startfrom', this.updateScript);
- this.get('components').add('');
- },
-
- updateScript() {
- this.view.updateScript();
- },
- }, {
- isComponent(el) {
- if(el.getAttribute &&
- el.getAttribute('data-gjs-type') == COUNTDOWN_TYPE) {
- return {
- type: COUNTDOWN_TYPE
- };
- }
- },
- }),
- view: defaultView,
- });
-
/*
domc.addType('default', {
model: defaultModel.extend({
diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js
index 43635aa2f..82445672e 100644
--- a/src/dom_components/model/Component.js
+++ b/src/dom_components/model/Component.js
@@ -255,8 +255,7 @@ module.exports = Backbone.Model.extend({
* */
getName() {
if(!this.name){
- var id = this.cid.replace(/\D/g,''),
- type = this.get('type');
+ var type = this.get('type');
var tag = this.get('tagName');
tag = tag == 'div' ? 'box' : tag;
tag = type ? type : tag;
@@ -297,9 +296,8 @@ module.exports = Backbone.Model.extend({
strCls = strCls !== '' ? ' class="' + strCls.trim() + '"' : '';
// If style is not empty I need an ID attached to the component
- // TODO: need to refactor in case of 'ID Trait'
if(!_.isEmpty(m.get('style')))
- attrId = ' id="' + m.cid + '" ';
+ attrId = ' id="' + m.getId() + '" ';
code += '<' + tag + strCls + attrId + strAttr + (sTag ? '/' : '') + '>' + m.get('content');
@@ -360,6 +358,10 @@ module.exports = Backbone.Model.extend({
getScriptString(script) {
var scr = script || this.get('script');
+ if (!scr) {
+ return scr;
+ }
+
// Need to convert script functions to strings
if (typeof scr == 'function') {
var scrStr = scr.toString().trim();
@@ -369,9 +371,10 @@ module.exports = Backbone.Model.extend({
scr = lines.join('\n');
}
- var varTagStart = escapeRegExp('{[ ');
- var varTagEnd = escapeRegExp(' ]}');
- var reg = new RegExp(`${varTagStart}(\\w+)${varTagEnd}`, 'g');
+ var config = this.sm.config || {};
+ var tagVarStart = escapeRegExp(config.tagVarStart || '{[ ');
+ var tagVarEnd = escapeRegExp(config.tagVarEnd || ' ]}');
+ var reg = new RegExp(`${tagVarStart}(\\w+)${tagVarEnd}`, 'g');
scr = scr.replace(reg, (match, v) => {
// If at least one match is found I have to track this change for a
// better optimization inside JS generator
diff --git a/src/editor/config/config.js b/src/editor/config/config.js
index a284eeedd..947a4ad58 100644
--- a/src/editor/config/config.js
+++ b/src/editor/config/config.js
@@ -62,6 +62,12 @@ module.exports = {
// Comes handy for mobile-first cases
mediaCondition: 'max-width',
+ // Starting tag for variable inside scripts in Components
+ tagVarStart: '{[ ',
+
+ // Ending tag for variable inside scripts in Components
+ tagVarEnd: ' ]}',
+
// This option makes available custom component types also for loaded
// elements inside canvas
loadCompsOnRender: 1,