From 2ca8a09acd9df6fd9160d2501431a8009c457a71 Mon Sep 17 00:00:00 2001
From: Juan Ferrer Toribio <juan.ferrer.toribio@gmail.com>
Date: Tue, 16 Jan 2018 09:10:44 +0100
Subject: [PATCH] CSS class inherithed in components, bugs solved

---
 forms/ecomerce/catalog/ui.xml          | 10 +++------
 forms/ecomerce/ticket/ticket.js        |  7 +++---
 forms/ecomerce/ticket/ui.xml           | 18 ++++++---------
 js/vn/component.js                     | 15 +++++++++----
 js/vn/mutators.js                      | 31 +++++++++++++++++++++-----
 js/vn/object.js                        |  3 ++-
 reports/delivery-note/delivery-note.js |  2 +-
 reports/delivery-note/ui.xml           |  6 ++---
 8 files changed, 54 insertions(+), 38 deletions(-)

diff --git a/forms/ecomerce/catalog/ui.xml b/forms/ecomerce/catalog/ui.xml
index 9079b24c..e87ca6cb 100644
--- a/forms/ecomerce/catalog/ui.xml
+++ b/forms/ecomerce/catalog/ui.xml
@@ -93,13 +93,12 @@
 			<htk-image
 				directory="catalog"
 				subdir="200x200"
-				lot="item"
-				name="image"
+				value="{{image}}"
 				full-dir="900x900"/>
 			<div class="item-info">
 				<htk-button
 					lot="item"
-					value="{{item.id}}"
+					value="{{id}}"
 					tip="_AddToBasket"
 					icon="add"
 					on-click="onAddItemClick"
@@ -108,9 +107,6 @@
 				<p class="producer">
 					{{producer}}
 				</p>
-				<p>
-					@{{id}}
-				</p>
 				<p>
 					{{tag1}} {{val1}}, {{tag2}} {{val2}}
 				</p>
@@ -237,7 +233,7 @@
 					{{card.name}}
 				</h2>
 				<p>
-					{{card.id}}
+					@{{card.id}}
 				</p>
 				<p class="producer">
 					{{card.producer}}
diff --git a/forms/ecomerce/ticket/ticket.js b/forms/ecomerce/ticket/ticket.js
index dfb6936f..ca10d271 100644
--- a/forms/ecomerce/ticket/ticket.js
+++ b/forms/ecomerce/ticket/ticket.js
@@ -8,9 +8,8 @@ Hedera.Ticket = new Class
 		if (!ticket.value)
 			return;
 
-		var batch = new Sql.Batch ();
-		batch.addValue ('ticket', ticket.value);
-		this.conn.execQuery ('CALL myTicketLogAccess (#ticket)', null, batch);
+		var params = {ticket: ticket.value};
+		this.conn.execQuery ('CALL myTicketLogAccess (#ticket)', params);
 	}
 
 	,onPrintClick: function ()
@@ -37,7 +36,7 @@ Hedera.Ticket = new Class
 
 	,onPackagesChanged: function (model)
 	{
-		this.$('packages').node.style.display =
+		this.$.packages.node.style.display =
 			model.numRows > 0 ? 'block' : 'none';
 	}
 });
diff --git a/forms/ecomerce/ticket/ui.xml b/forms/ecomerce/ticket/ui.xml
index f2cadfec..2b1f23f4 100644
--- a/forms/ecomerce/ticket/ui.xml
+++ b/forms/ecomerce/ticket/ui.xml
@@ -66,8 +66,7 @@
 						{{concept}} {{size}} {{category}}
 					</p>
 					<p class="amount">
-						{{quantity}} x 
-						<htk-text lot="iter" name="price" format="%.2d€"/>
+						{{quantity}} x <htk-text lot="iter" name="price" format="%.2d€"/>
 						<span class="subtotal">
 							<htk-text id="subtotal" format="%.2d€"/>
 						</span>
@@ -80,28 +79,25 @@
 			<db-model
 				property="model"
 				on-status-changed="onPackagesChanged"
-				batch="batch">
-				<custom>
-					CALL myTicketGetPackages (#ticket)
-				</custom>
+				lot="params">
+				CALL myTicketGetPackages (#ticket)
 			</db-model>
 			<custom>
 				<div class="line">
 					<htk-image
-						form="iter"
-						column="image"
+						value="{{image}}"
 						class="photo"
 						directory="catalog"
 						subdir="200x200"
 						full-dir="900x900"/>
 					<p class="subtotal">
-						<htk-text form="iter" column="quantity"/>
+						{{quantity}}
 					</p>
 					<p class="concept">
-						<htk-text form="iter" column="name"/>
+						{{name}}
 					</p>
 					<p class="amount">
-						@<htk-text form="iter" column="id"/>
+						{{id}}
 					</p>
 					<div class="clear"/>
 				</div>
diff --git a/js/vn/component.js b/js/vn/component.js
index 75e97692..5dc8d773 100644
--- a/js/vn/component.js
+++ b/js/vn/component.js
@@ -7,8 +7,15 @@ var nativeEvents = {
 	,focusout  : 1
 };
 
-var Klass = new Class ();
-module.exports = Klass.implement
+var Klass =  new Class ();
+module.exports = Klass;
+
+Klass.extend
+({
+	Classes: ''
+});
+
+Klass.implement
 ({
 	Extends: NodeBuilder
 	,Properties:
@@ -112,8 +119,8 @@ module.exports = Klass.implement
 	{
 		if (this.htmlId)
 			node.id = this.htmlId;
-		if (this.$constructor.Tag)
-			node.className = this.$constructor.Tag;
+		if (this.$constructor.Classes)
+			node.className = this.$constructor.Classes;
 
 		this._node = node;
 	}
diff --git a/js/vn/mutators.js b/js/vn/mutators.js
index c9ae785b..d167689a 100644
--- a/js/vn/mutators.js
+++ b/js/vn/mutators.js
@@ -1,22 +1,39 @@
 
+require ('mootools');
+
 vnCustomTags = {};
 
 var Mutators = Class.Mutators;
 
+var _Extends = Mutators.Extends;
+
+Mutators.Extends = function () {
+	_Extends.apply (this, arguments);
+
+	if (this.Properties === undefined)
+		this.implement ({Properties: {}});
+};
+
 Mutators.Tag = function (tagName)
 {
 	vnCustomTags[tagName] = this;
-	
-	if (this.parent)
-		this.implement ({Properties: {}});
-
 	this.extend ({Tag: tagName});
+
+	var parent = this.parent;
+
+	if (parent && parent.Classes !== undefined)
+	{
+		var Classes = tagName
+		
+		if (parent.Classes !== '')
+			Classes += ' '+ parent.Classes;
+
+		this.extend ({Classes: Classes});
+	}
 };
 
 Mutators.Properties = function (props)
 {
-	var parentProps;
-	
 	for (var propName in props)
 	{
 		var prop = props[propName];
@@ -26,6 +43,8 @@ Mutators.Properties = function (props)
 			prop.writable = true;
 	}
 
+	var parentProps;
+
 	if (this.parent && (parentProps = this.parent.Properties))
 	for (var propName in parentProps)
 	if (!props[propName])
diff --git a/js/vn/object.js b/js/vn/object.js
index 8e07a3e4..b7d17f13 100644
--- a/js/vn/object.js
+++ b/js/vn/object.js
@@ -6,7 +6,8 @@
 module.exports = new Class
 ({
 	/**
-	 * Tag to be used when the class instance is defined via XML.
+	 * Tag to be used when the class instance is defined via XML. All classes 
+	 * must define this attribute, even if it is not used.
 	 */
 	Tag: 'vn-object'
 
diff --git a/reports/delivery-note/delivery-note.js b/reports/delivery-note/delivery-note.js
index 1319c655..17d086c8 100644
--- a/reports/delivery-note/delivery-note.js
+++ b/reports/delivery-note/delivery-note.js
@@ -17,7 +17,7 @@ Hedera.DeliveryNote = new Class
 	
 	,onPackagesChanged: function (model)
 	{
-		this.$('packages').node.style.display =
+		this.$.packages.node.style.display =
 			model.numRows > 0 ? 'block' : 'none';
 	}
 });
diff --git a/reports/delivery-note/ui.xml b/reports/delivery-note/ui.xml
index eee4d92e..e0eb38d1 100644
--- a/reports/delivery-note/ui.xml
+++ b/reports/delivery-note/ui.xml
@@ -44,12 +44,10 @@
 	</htk-grid>
 	<div class="footer">
 		<p>
-			_Total 
-			<htk-text lot="ticket" name="taxBase" format="%.2d€"/>
+			_Total <htk-text lot="ticket" name="taxBase" format="%.2d€"/>
 		</p>
 		<p>
-			_Total + tax
-			<htk-text lot="ticket" name="total" format="%.2d€"/>
+			_Total + tax <htk-text lot="ticket" name="total" format="%.2d€"/>
 		</p>
 	</div>
 	<htk-grid id="packages" class="packages">