Merge branch '217-buttons-on-a-tabset-should-be-moved-to-the-actual-tabbar-header' into 'master'

Resolve "buttons on a tabset should be moved to the actual tabbar header"

Closes #217

See merge request clean-and-itasks/iTasks-SDK!148

Libraries/iTasks/UI/Layout/StandardForms.icl

@@ -17,6 +17,8 @@ layoutCombinatorContainers = sequenceLayouts
 	[layoutSubUIs (SelectByType UIInteract) layoutInteract
 	,layoutSubUIs (SelectByType UIStep) layoutStep
 	,layoutSubUIs (SelectByType UIParallel) layoutParallel
+	//There can still be buttons (e.g. when a parallel has been transformed to a tabset
+	,layoutSubUIs (SelectByType UIAction) layoutAsButton
 	]
 
 layoutStep = sequenceLayouts

Libraries/iTasks/UI/WebPublic/css/itasks-components-container.scss

@@ -155,6 +155,12 @@
 	position: relative;
 	top: 3px;
 }
+.#{$prefix}tab-disabled .#{$prefix}tabicon {
+    opacity: 0.5;
+}
+.#{$prefix}tab-disabled span {
+    color: #aaa;
+}
 .#{$prefix}tabitems {
 	z-index: 2;
 	border: 1px solid $tab-border-color;

Libraries/iTasks/UI/WebPublic/css/itasks-theme-gray.css

@@ -396,6 +396,12 @@ div.itasks-exception {
   position: relative;
   top: 3px; }
 
+.itasks-tab-disabled .itasks-tabicon {
+  opacity: 0.5; }
+
+.itasks-tab-disabled span {
+  color: #aaa; }
+
 .itasks-tabitems {
   z-index: 2;
   border: 1px solid #ccc;

Libraries/iTasks/UI/WebPublic/js/itasks-components-container.js

@@ -147,44 +147,60 @@ itasks.TabSet = {
     },
 	createTabEl: function (cmp) {
 		var me = this, tab, label, icon;
-
 		tab = document.createElement('li');
-        label = document.createElement('a');
-		label.innerHTML = '<span>'+ (cmp.attributes.title || '-')+'</span>';
-		label.href = '#';
-
-		label.addEventListener('click',function(e) {
-			var tabEl = e.target.parentElement.parentElement,	
-				tabBar = tabEl.parentElement,
-				idx = Array.prototype.indexOf.call(tabBar.children,tabEl);
-
-			me.setActiveTab(idx);
-            e.preventDefault();
-		},me);
-
-        if(cmp.attributes.iconCls) {
-            icon = document.createElement('div');
-            icon.classList.add(me.cssPrefix + 'tabicon');
-            icon.classList.add(cmp.attributes.iconCls);
-            label.insertBefore(icon,label.childNodes[0]);
-        }
-        tab.appendChild(label);
-
-        if(cmp.attributes.closeTaskId) {
-            closeLink = document.createElement('a');
-            closeLink.innerHTML = 'x';
-            closeLink.href = '#';
-            closeLink.classList.add(me.cssPrefix + 'tabclose');
-            closeLink.addEventListener('click',function(e) {
-                me.doEditEvent(cmp.attributes.closeTaskId,null,'Close');
-                e.preventDefault();
-            },me);
-
-            tab.appendChild(closeLink);
-        }
-        if(cmp.selected) {
-            tab.classList.add(me.cssPrefix + 'selected');
-        }
+		label = document.createElement('a');
+		if (cmp.type == 'Button'){
+			label.innerHTML = '<span>'+ (cmp.attributes.text || '-')+'</span>';
+			label.href = '#';
+			label.addEventListener('click',function(e) {
+            	if(cmp.attributes.enabled) {
+					cmp.doEditEvent(cmp.attributes.taskId,cmp.attributes.editorId,cmp.attributes.value);
+            	}
+				e.preventDefault();
+			},me);
+			if(!cmp.attributes.enabled) {
+				tab.classList.add(me.cssPrefix + 'tab-disabled');
+			}
+			cmp.domEl.style.display = "none";
+		} else {
+			label.innerHTML = '<span>'+ (cmp.attributes.title || '-')+'</span>';
+			label.href = '#';
+	
+			label.addEventListener('click',function(e) {
+				var tabEl = e.target.parentElement.parentElement,	
+					tabBar = tabEl.parentElement,
+					idx = Array.prototype.indexOf.call(tabBar.children,tabEl);
+	
+				me.setActiveTab(idx);
+				e.preventDefault();
+			},me);
+		}
+
+		if(cmp.attributes.iconCls) {
+			icon = document.createElement('div');
+			icon.classList.add(me.cssPrefix + 'tabicon');
+			icon.classList.add(cmp.attributes.iconCls);
+			label.insertBefore(icon,label.childNodes[0]);
+		}
+		tab.appendChild(label);
+	
+		if (cmp.type !== 'Button'){
+			if(cmp.attributes.closeTaskId) {
+				closeLink = document.createElement('a');
+				closeLink.innerHTML = 'x';
+				closeLink.href = '#';
+				closeLink.classList.add(me.cssPrefix + 'tabclose');
+				closeLink.addEventListener('click',function(e) {
+					me.doEditEvent(cmp.attributes.closeTaskId,null,'Close');
+					e.preventDefault();
+				},me);
+	
+				tab.appendChild(closeLink);
+			}
+			if(cmp.selected) {
+				tab.classList.add(me.cssPrefix + 'selected');
+			}
+		}
 		return tab;
 	},
 	setActiveTab: function(idx) {

Libraries/iTasks/UI/WebPublic/js/itasks-components-form.js

@@ -356,17 +356,18 @@ itasks.Button = {
 			el.appendChild(me.label);
 		}
 
-        el.addEventListener('click',function(e) {
+		el.addEventListener('click',function(e) {
 			if(typeof(me.attributes.value) == 'boolean') { //Toggle edit buttons
 				me.attributes.value = !me.attributes.value;
 			}
-            if(me.attributes.enabled) {
+			if(me.attributes.enabled) {
 				me.doEditEvent(me.attributes.taskId,me.attributes.editorId,me.attributes.value);
-            }
+			}
 			e.preventDefault();
 			return false;
 		});
-    },
+	},
+
 	initContainerEl: function() { //Make sure no padding is set on buttons
 	},
 	onAttributeChange: function(name,value) {