Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Implementation for refreshing section attributes #354

Closed
wants to merge 1 commit into from

2 participants

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Jan 29, 2013
  1. @simonarbuckle
This page is out of date. Refresh to see the latest.
View
15 src/aria/templates/CfgBeans.js
@@ -21,7 +21,8 @@ Aria.beanDefinitions({
$description : "Definition of JSON beans used in aria templates",
$namespaces : {
"json" : "aria.core.JsonTypes",
- "coreBeans" : "aria.core.CfgBeans"
+ "coreBeans" : "aria.core.CfgBeans",
+ "common" : "aria.widgetLibs.CommonBeans"
},
$beans : {
"BaseTemplateCfg" : {
@@ -786,8 +787,16 @@ Aria.beanDefinitions({
$description : "List of registered browser events and their callbacks. Values should match bean aria.widgetLibs.CommonBeans.Callback",
$default : {},
$restricted : false
+ },
+ "bind" : {
+ $type : "json:Object",
+ $description : "List of properties that we want to bind for the section - the property name being used as Map item key",
+ $properties : {
+ "attributes" : {
+ $type : "common:BindingRef"
+ }
+ }
}
-
}
},
"RepeaterCfg" : {
@@ -1108,4 +1117,4 @@ Aria.beanDefinitions({
}
}
}
-});
+});
View
79 src/aria/templates/Section.js
@@ -28,8 +28,8 @@
$classpath : "aria.templates.Section",
$dependencies : ["aria.utils.Array", "aria.utils.Json", "aria.utils.Delegate",
"aria.templates.NavigationManager", "aria.templates.CfgBeans", "aria.utils.Dom", "aria.utils.String",
- "aria.templates.DomElementWrapper", "aria.utils.Html", "aria.templates.DomEventWrapper", "aria.utils.IdManager",
- "aria.templates.SectionWrapper"],
+ "aria.utils.Json", "aria.templates.DomElementWrapper", "aria.utils.Html",
+ "aria.templates.DomEventWrapper", "aria.utils.IdManager", "aria.templates.SectionWrapper"],
$onload : function () {
idMgr = new aria.utils.IdManager("s");
},
@@ -37,7 +37,7 @@
idMgr.$dispose();
idMgr = null;
},
- /**
+ /**
* Constructor
* @param {aria.templates.TemplateCtxt} tplCtxt
* @param {aria.templates.CfgBeans.SectionCfg} configuration of this section (id, type, ...).
@@ -203,13 +203,12 @@
*/
this._domId = domId || (id ? this.tplCtxt.$getId(id) : this._createDynamicId());
- /**
+ /**
* Id of the section
* @type String
*/
this.id = id || "_gen_" + this._domId;
-
/**
* CSS class for the section
* @type String
@@ -255,7 +254,7 @@
// register binding on this section
for (var i = 0; binding = bindings[i]; i++) {
- this.registerBinding(binding);
+ this.registerBinding(binding, this._notifyDataChange);
}
// register binding to the processing indicator
@@ -273,6 +272,13 @@
* @type aria.templates.CfgBeans.HtmlAttribute
*/
this.attributes = cfg.attributes;
+
+ // register binding for attributes
+ var attributeBind = (cfg.bind && cfg.bind.attributes) ? cfg.bind.attributes : null;
+ if (attributeBind) {
+ this.attributes = attributeBind.inside[attributeBind.to];
+ this.registerBinding(attributeBind, this._notifyAttributeChange);
+ }
},
$destructor : function () {
@@ -556,6 +562,7 @@
* RegisterBinding is used to add bindings to Templates and sections.
* @public
* @param {Object} bind
+ * @param {Object} callback
*
* <pre>
* {
@@ -564,12 +571,12 @@
* }
* </pre>
*/
- registerBinding : function (bind) {
+ registerBinding : function (bind, callback) {
// register as listener for the bindings defined for this control:
if (bind) {
var jsonChangeCallback = {
- fn : this._notifyDataChange,
+ fn : callback || this._notifyDataChange,
scope : this,
args : {
tplCtxt : this.tplCtxt
@@ -644,17 +651,11 @@
return;
}
- var processingCallback = {
- fn : this._notifyProcessingChange,
- scope : this
- };
-
- this.__json.addListener(bind.inside, bind.to, processingCallback);
+ this.registerBinding(bind, this._notifyProcessingChange);
// save for later use and disposal
this._processing = {
inside : bind.inside,
- callback : processingCallback,
to : bind.to
};
},
@@ -728,6 +729,44 @@
},
/**
+ * JSON listener callback: called anytime a bindable attribute property has changed on a holder object
+ * defined in one of the bindings
+ * @protected
+ * @param {Object} res Object containing information about the attribute that changed
+ * @see initWidget()
+ */
+ _notifyAttributeChange : function (res) {
+ var attribute, domElt = this.getDom(), deleteAttribute;
+ // determine if multiple attributes have changed
+ if (this._cfg.bind && res.dataName === this._cfg.bind.attributes.to) {
+ // remove old members
+ for (attribute in res.oldValue) {
+ if (res.oldValue.hasOwnProperty(attribute) && !res.newValue[attribute]) {
+ domElt.removeAttribute(attribute);
+ }
+ }
+ // add new members
+ for (attribute in res.newValue) {
+ if (res.newValue.hasOwnProperty(attribute) && !aria.utils.Json.isMetadata(attribute)
+ && aria.templates.DomElementWrapper.attributesWhiteList.test(attribute)
+ && res.newValue[attribute] !== res.oldValue[attribute]
+ && res.newValue[attribute] != null) {
+ domElt.setAttribute(attribute, res.newValue[attribute]);
+ }
+ }
+ // check if an individual attribute has changed
+ } else if (aria.templates.DomElementWrapper.attributesWhiteList.test(res.dataName)
+ && res.newValue !== res.oldValue) {
+ deleteAttribute = (!res.newValue) ? true : false;
+ if (deleteAttribute) {
+ domElt.removeAttribute(res.dataName, res.newValue);
+ } else {
+ domElt.setAttribute(res.dataName, res.newValue);
+ }
+ }
+ },
+
+ /**
* JSON listener callback: called anytime the processing property value has changed on a holder object
* defined in the binding
* @protected
@@ -1032,11 +1071,6 @@
this.__json.removeListener(bind.inside, bind.to, bind.callback, bind.recursive);
}
}
-
- var processing = this._processing;
- if (processing) {
- this.__json.removeListener(processing.inside, processing.to, processing.callback);
- }
},
/**
@@ -1051,11 +1085,6 @@
this.__json.addListener(bind.inside, bind.to, bind.callback, true, bind.recursive);
}
}
-
- var processing = this._processing;
- if (processing) {
- this.__json.addListener(processing.inside, processing.to, processing.callback);
- }
},
/**
View
10 src/aria/utils/Html.js
@@ -19,7 +19,7 @@
Aria.classDefinition({
$classpath : "aria.utils.Html",
$extends : "aria.core.JsObject",
- $dependencies : ["aria.templates.DomElementWrapper", "aria.utils.String"],
+ $dependencies : ["aria.templates.DomElementWrapper", "aria.utils.String", "aria.utils.Json"],
$singleton : true,
$statics : {
INVALID_CONFIGURATION : "Invalid attribute %1."
@@ -32,6 +32,7 @@ Aria.classDefinition({
*/
buildAttributeList : function (attributes) {
var result = [], whiteList = aria.templates.DomElementWrapper.attributesWhiteList;
+ var jsonUtils = aria.utils.Json;
/*
* This assumes that white list is performed by config validation, but this is only available in debug mode :
@@ -39,7 +40,7 @@ Aria.classDefinition({
*/
var stringUtil = aria.utils.String;
for (var key in attributes) {
- if (attributes.hasOwnProperty(key)) {
+ if (attributes.hasOwnProperty(key) && !jsonUtils.isMetadata(key)) {
var attribute = attributes[key];
if (key === "classList") {
result.push(" class=\"");
@@ -47,7 +48,8 @@ Aria.classDefinition({
result.push("\"");
} else if (key === "dataset") {
for (var dataKey in attribute) {
- if (attribute.hasOwnProperty(dataKey) && dataKey.substr(0, 5) != "data-") {
+ if (attribute.hasOwnProperty(dataKey) && dataKey.substr(0, 5) != "data-"
+ && !jsonUtils.isMetadata(dataKey)) {
result.push(" data-", dataKey, "=\"");
result.push(stringUtil.encodeForQuotedHTMLAttribute(attribute[dataKey]));
result.push("\"");
@@ -66,4 +68,4 @@ Aria.classDefinition({
return result.join('');
}
}
-});
+});
View
2  test/aria/templates/TemplatesTestSuite.js
@@ -21,7 +21,7 @@ Aria.classDefinition({
$extends : "aria.jsunit.TestSuite",
$constructor : function () {
this.$TestSuite.constructor.call(this);
-
+ this.addTests("test.aria.templates.sectionTest.RefreshSection");
this.addTests("test.aria.templates.ClassGeneratorTest");
this.addTests("test.aria.templates.CSSCtxtManagerTest");
this.addTests("test.aria.templates.CSSCtxtTest");
View
79 test/aria/templates/sectionTest/RefreshSection.js
@@ -0,0 +1,79 @@
+/*
+ * Copyright 2012 Amadeus s.a.s.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Aria.classDefinition({
+ $classpath : "test.aria.templates.sectionTest.RefreshSection",
+ $extends : "aria.jsunit.TemplateTestCase",
+ $constructor : function () {
+ this.$TemplateTestCase.constructor.call(this);
+ this.setTestEnv({
+ template : "test.aria.templates.sectionTest.SectionXTpl"
+ });
+ this.attributes = [{
+ name : 'name',
+ value : 'change section name'
+ }, {
+ name : 'title',
+ value : 'change section title'
+ }];
+ },
+
+ $prototype : {
+ runTemplateTest : function () {
+ this._checkSectionAttributes();
+ this.refreshSectionAttributes();
+ },
+ /**
+ * This method tests the refreshing of section attributes.
+ */
+ refreshSectionAttributes : function () {
+ this.attributes = [{
+ name : 'name',
+ value : 'change section name'
+ }, {
+ name : 'dir',
+ value : 'new dir'
+ }];
+ this.templateCtxt._tpl.changeAllSectionAttributes();
+ this._checkSectionAttributes();
+ this.attributes = [{
+ name : 'name',
+ value : 'change section name'
+ }, {
+ name : 'title',
+ value : 'my new title'
+ }, {
+ name : 'dir',
+ value : 'new dir'
+ }];
+ this.templateCtxt._tpl.changeIndividualSectionAttribute();
+ this._checkSectionAttributes();
+ this._end();
+ },
+ _checkSectionAttributes : function () {
+ // check attributes
+ var domElt = this.getElementById('sectionx');
+ for (var h = 0; h < this.attributes.length; h++) {
+ this._checkAttribute(this.attributes[h].name, this.attributes[h].value, domElt);
+ }
+ },
+ _checkAttribute : function (name, value, domElt) {
+ var attributeValue = domElt.getAttribute(name);
+ this.assertEquals(value, attributeValue);
+ },
+ _end : function () {
+ this.notifyTemplateTestEnd();
+ }
+ }
+});
View
65 test/aria/templates/sectionTest/SectionXTpl.tpl
@@ -0,0 +1,65 @@
+/*
+ * Copyright 2012 Amadeus s.a.s.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+{Template {
+ $classpath:'test.aria.templates.sectionTest.SectionXTpl',
+ $hasScript: true
+}}
+
+ {macro main()}
+ <div class="myContainer">
+ {section {
+ id : "sectionx",
+ macro : "sectionxMacro",
+ attributes : data.mySectionAttributes,
+ type : "SPAN",
+ bind : {
+ attributes : {
+ inside : data,
+ to : "mySectionAttributes"
+ }
+ }
+ } /}
+ <br/>
+ {@aria:TextField {
+ helptext : "Change title attribute",
+ block : true,
+ bind : {
+ "value" : {
+ inside : data.mySectionAttributes,
+ to : "title"
+ }
+ }
+ } /}
+ <br/><br/>
+ {@aria:Button {
+ id : "1",
+ label : "Change All Section attributes",
+ onclick : "changeAllSectionAttributes"
+ } /}
+ <br/><br/>
+ {@aria:Button {
+ id : "2",
+ label : "Change Individual section attribute",
+ onclick : "changeIndividualSectionAttribute"
+ } /}
+ </div>
+ {/macro}
+
+ {macro sectionxMacro()}
+ This section contains a title attribute, the title attribute can be changed by entering a new value in the text field and then clicking the refresh button. To see the changes to the title attribute mouse over this section.
+ <br/>
+ {/macro}
+
+{/Template}
View
39 test/aria/templates/sectionTest/SectionXTplScript.js
@@ -0,0 +1,39 @@
+/*
+ * Copyright 2012 Amadeus s.a.s.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+Aria.tplScriptDefinition({
+ $classpath : 'test.aria.templates.sectionTest.SectionXTplScript',
+ $prototype : {
+
+ $dataReady : function () {
+ this.data.mySectionAttributes = {
+ "title" : "change section title",
+ "name" : "change section name"
+ };
+ },
+
+ changeAllSectionAttributes : function () {
+ var myAttributes = {
+ name : 'change section name',
+ dir : 'new dir',
+ simon : true
+ }
+ this.$json.setValue(this.data, "mySectionAttributes", myAttributes);
+ },
+
+ changeIndividualSectionAttribute : function () {
+ this.$json.setValue(this.data.mySectionAttributes, 'title', 'my new title');
+ }
+ }
+});
Something went wrong with that request. Please try again.