guide initials

src/components/cards.js

@@ -418,6 +418,7 @@ var STWkit;
             var self = _this;
             self.domain = domain;
             self.forcingmodel = forcingmodel;
+            var initials = (options && options.hasOwnProperty('initials')) ? options.initials : '';
             var showforwardbackward = (options && options.hasOwnProperty('forwardbackward')) ? options.forwardbackward : true;
             var form = L.DomUtil.create('form', 'uk-form uk-form-stacked', periodDiv);
             form.setAttribute('novalidate', '');
@@ -452,7 +453,7 @@ var STWkit;
             var durationRowDiv = L.DomUtil.create('div', 'uk-form-row', fieldset);
             _super.prototype.addLabelDiv.call(_this, durationRowDiv, "Duration", "See more information <a style='color:#faa732;' href='help/classic/#object-fo-duration' target='_blank'>here</a>");
             var durationDiv = L.DomUtil.create('div', 'uk-form-controls uk-form-icon uk-width-1-1', durationRowDiv);
-            durationDiv.id = 'guideos4';
+            durationDiv.id = 'guide' + initials + '4';
             var durationIcon = L.DomUtil.create('span', 'uk-icon-clock-o', durationDiv);
             self.durationHours = L.DomUtil.create('input', 'uk-width-2-6', durationDiv);
             self.durationHours.type = 'number';
@@ -469,7 +470,7 @@ var STWkit;
             directionDiv.setAttribute('data-uk-button-radio', '');
             var directionButtonGrid = L.DomUtil.create('div', 'uk-grid uk-grid-small', directionDiv);
             var directionbuttonsDiv = L.DomUtil.create('div', 'uk-width-1-2', directionButtonGrid);
-            directionButtonGrid.id = 'guidefo5';
+            directionButtonGrid.id = 'guide' + initials + '5';
             var directionButtonGroup = L.DomUtil.create('div', 'uk-button-group', directionbuttonsDiv);
             self.forwardButton = L.DomUtil.create('button', 'uk-button uk-button-small', directionButtonGroup);
             self.forwardButton.textContent = 'Forward';
@@ -509,7 +510,7 @@ var STWkit;
             };
             self.nextButton = L.DomUtil.create('button', 'uk-button uk-margin-top uk-align-right', clearDiv);
             self.nextButton.textContent = 'Next';
-            self.nextButton.id = 'guideos5';
+            self.nextButton.id = 'guide' + initials + '5';
             self.nextButton.guideFn = function () {
                 self.nextButton.click();
             };

src/components/cards.ts

@@ -472,6 +472,7 @@ module STWkit {
             self.domain = domain;
             self.forcingmodel = forcingmodel;
 
+            var initials = (options && options.hasOwnProperty('initials'))?options.initials:'';
             var showforwardbackward = (options && options.hasOwnProperty('forwardbackward'))?options.forwardbackward:true;
             var form = <HTMLFormElement>L.DomUtil.create('form', 'uk-form uk-form-stacked', periodDiv);
             form.setAttribute('novalidate', '');
@@ -505,7 +506,7 @@ module STWkit {
             var durationRowDiv = <HTMLDivElement>L.DomUtil.create('div', 'uk-form-row', fieldset);
             super.addLabelDiv(durationRowDiv, "Duration", "See more information <a style='color:#faa732;' href='help/classic/#object-fo-duration' target='_blank'>here</a>");
             var durationDiv = <HTMLDivElement>L.DomUtil.create('div', 'uk-form-controls uk-form-icon uk-width-1-1', durationRowDiv);
-            durationDiv.id = 'guideos4';
+            durationDiv.id = 'guide'+initials+'4';
             var durationIcon = <HTMLSpanElement>L.DomUtil.create('span', 'uk-icon-clock-o', durationDiv);
             self.durationHours = <HTMLInputElement>L.DomUtil.create('input', 'uk-width-2-6', durationDiv);
             self.durationHours.type = 'number';
@@ -521,7 +522,7 @@ module STWkit {
             directionDiv.setAttribute('data-uk-button-radio', '');
             var directionButtonGrid = <HTMLDivElement>L.DomUtil.create('div', 'uk-grid uk-grid-small', directionDiv);
             var directionbuttonsDiv = <HTMLDivElement>L.DomUtil.create('div', 'uk-width-1-2', directionButtonGrid);
-            directionButtonGrid.id = 'guidefo5';
+            directionButtonGrid.id = 'guide'+initials+'5';
             var directionButtonGroup = <HTMLDivElement>L.DomUtil.create('div', 'uk-button-group', directionbuttonsDiv);
             self.forwardButton = <HTMLButtonElement>L.DomUtil.create('button', 'uk-button uk-button-small', directionButtonGroup);
             self.forwardButton.textContent = 'Forward';
@@ -565,7 +566,7 @@ module STWkit {
             };
             self.nextButton = <HTMLButtonElement>L.DomUtil.create('button', 'uk-button uk-margin-top uk-align-right', clearDiv);
             self.nextButton.textContent = 'Next';
-            self.nextButton.id = 'guideos5';
+            self.nextButton.id = 'guide'+initials+'5';
             self.nextButton.guideFn = function () {
                 self.nextButton.click();
             }