Radio.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387
  1. MWF.xDesktop.requireApp("process.Xform", "$Input", null, false);
  2. MWF.require("MWF.widget.UUID", null, false);
  3. MWF.xApplication.process.Xform.Radio = MWF.APPRadio = new Class({
  4. Implements: [Events],
  5. Extends: MWF.APP$Input,
  6. loadDescription: function(){},
  7. _loadNode: function(){
  8. if (this.readonly || this.json.isReadonly ){
  9. this._loadNodeRead();
  10. }else{
  11. this._loadNodeEdit();
  12. }
  13. },
  14. _loadNodeRead: function(){
  15. this.node.empty();
  16. var radioValues = this.getOptions();
  17. var value = this.getValue();
  18. if (value){
  19. var texts = "";
  20. for (var i=0; i<radioValues.length; i++){
  21. var item = radioValues[i];
  22. var tmps = item.split("|");
  23. var t = tmps[0];
  24. var v = tmps[1] || t;
  25. // if (value.indexOf(v)!=-1){
  26. // texts = t;
  27. // break;
  28. // }
  29. if (value == v){
  30. texts = t;
  31. break;
  32. }
  33. }
  34. this.node.set("text", texts);
  35. }
  36. },
  37. _resetNodeEdit: function(){
  38. var div = new Element("div");
  39. div.set(this.json.properties);
  40. div.inject(this.node, "after");
  41. this.node.destroy();
  42. this.node = div;
  43. },
  44. _loadNodeEdit: function(){
  45. //this.container = new Element("select");
  46. if (!this.json.preprocessing) this._resetNodeEdit();
  47. this.node.set({
  48. "id": this.json.id,
  49. "MWFType": this.json.type,
  50. "styles": {
  51. "display": "inline"
  52. }
  53. });
  54. this.setOptions();
  55. },
  56. _loadDomEvents: function(){
  57. },
  58. _loadEvents: function(){
  59. Object.each(this.json.events, function(e, key){
  60. if (e.code){
  61. if (this.options.moduleEvents.indexOf(key)!=-1){
  62. this.addEvent(key, function(event){
  63. return this.form.Macro.fire(e.code, this, event);
  64. }.bind(this));
  65. }else{
  66. //this.node.addEvent(key, function(event){
  67. // return this.form.Macro.fire(e.code, this, event);
  68. //}.bind(this));
  69. }
  70. }
  71. }.bind(this));
  72. },
  73. addModuleEvent: function(key, fun){
  74. if (this.options.moduleEvents.indexOf(key)!==-1){
  75. this.addEvent(key, function(event){
  76. return (fun) ? fun(this, event) : null;
  77. }.bind(this));
  78. }else{
  79. var inputs = this.node.getElements("input");
  80. inputs.each(function(input){
  81. input.addEvent(key, function(event){
  82. return (fun) ? fun(this, event) : null;
  83. }.bind(this));
  84. }.bind(this));
  85. }
  86. },
  87. resetOption: function(){
  88. this.node.empty();
  89. this.setOptions();
  90. },
  91. getOptions: function(){
  92. if (this.json.itemType == "values"){
  93. return this.json.itemValues;
  94. }else{
  95. return this.form.Macro.exec(this.json.itemScript.code, this);
  96. }
  97. return [];
  98. },
  99. setOptions: function(){
  100. var optionItems = this.getOptions();
  101. this._setOptions(optionItems);
  102. },
  103. _setOptions: function(optionItems){
  104. var p = o2.promiseAll(optionItems).then(function(radioValues){
  105. this.moduleSelectAG = null;
  106. if (!radioValues) radioValues = [];
  107. if (o2.typeOf(radioValues)==="array"){
  108. var flag = (new MWF.widget.UUID).toString();
  109. radioValues.each(function(item){
  110. var tmps = item.split("|");
  111. var text = tmps[0];
  112. var value = tmps[1] || text;
  113. var radio = new Element("input", {
  114. "type": "radio",
  115. "name": (this.json.properties && this.json.properties.name) ? this.json.properties.name : flag+this.json.id,
  116. "value": value,
  117. "showText": text,
  118. "styles": this.json.buttonStyles
  119. }).inject(this.node);
  120. //radio.appendText(text, "after");
  121. var textNode = new Element( "span", {
  122. "text" : text,
  123. "styles" : { "cursor" : "default" }
  124. }).inject(this.node);
  125. textNode.addEvent("click", function( ev ){
  126. if( this.radio.get("disabled") === true || this.radio.get("disabled") === "true" )return;
  127. this.radio.checked = true;
  128. this.radio.fireEvent("change");
  129. this.radio.fireEvent("click");
  130. }.bind( {radio : radio} ) );
  131. radio.addEvent("click", function(){
  132. this.validationMode();
  133. if (this.validation()) this._setBusinessData(this.getInputData("change"));
  134. }.bind(this));
  135. Object.each(this.json.events, function(e, key){
  136. if (e.code){
  137. if (this.options.moduleEvents.indexOf(key)!=-1){
  138. }else{
  139. radio.addEvent(key, function(event){
  140. return this.form.Macro.fire(e.code, this, event);
  141. }.bind(this));
  142. }
  143. }
  144. }.bind(this));
  145. }.bind(this));
  146. }
  147. }.bind(this));
  148. this.moduleSelectAG = p;
  149. if (p) p.then(function(){
  150. this.moduleSelectAG = null;
  151. }.bind(this));
  152. // this.moduleSelectAG = o2.AG.all(optionItems).then(function(radioValues){
  153. // this.moduleSelectAG = null;
  154. //
  155. // if (!radioValues) radioValues = [];
  156. // if (o2.typeOf(radioValues)==="array"){
  157. // var flag = (new MWF.widget.UUID).toString();
  158. // radioValues.each(function(item){
  159. // var tmps = item.split("|");
  160. // var text = tmps[0];
  161. // var value = tmps[1] || text;
  162. //
  163. // var radio = new Element("input", {
  164. // "type": "radio",
  165. // "name": (this.json.properties && this.json.properties.name) ? this.json.properties.name : flag+this.json.id,
  166. // "value": value,
  167. // "showText": text,
  168. // "styles": this.json.buttonStyles
  169. // }).inject(this.node);
  170. // //radio.appendText(text, "after");
  171. //
  172. // var textNode = new Element( "span", {
  173. // "text" : text,
  174. // "styles" : { "cursor" : "default" }
  175. // }).inject(this.node);
  176. // textNode.addEvent("click", function( ev ){
  177. // if( this.radio.get("disabled") === true || this.radio.get("disabled") === "true" )return;
  178. // this.radio.checked = true;
  179. // this.radio.fireEvent("change");
  180. // this.radio.fireEvent("click");
  181. // }.bind( {radio : radio} ) );
  182. //
  183. // radio.addEvent("click", function(){
  184. // this.validationMode();
  185. // if (this.validation()) this._setBusinessData(this.getInputData("change"));
  186. // }.bind(this));
  187. //
  188. // Object.each(this.json.events, function(e, key){
  189. // if (e.code){
  190. // if (this.options.moduleEvents.indexOf(key)!=-1){
  191. // }else{
  192. // radio.addEvent(key, function(event){
  193. // return this.form.Macro.fire(e.code, this, event);
  194. // }.bind(this));
  195. // }
  196. // }
  197. // }.bind(this));
  198. // }.bind(this));
  199. // }
  200. // }.bind(this))
  201. // if (this.moduleSelectAG) this.moduleSelectAG.then(function(){
  202. // this.moduleSelectAG = null;
  203. // }.bind(this));
  204. },
  205. _setValue: function(value){
  206. if (!!value){
  207. var p = o2.promiseAll(value).then(function(v){
  208. if (o2.typeOf(v)=="array") v = v[0];
  209. if (this.moduleSelectAG){
  210. this.moduleValueAG = this.moduleSelectAG;
  211. this.moduleSelectAG.then(function(){
  212. this.__setValue(v);
  213. return v;
  214. }.bind(this));
  215. }else{
  216. this.__setValue(v)
  217. }
  218. return v;
  219. }.bind(this));
  220. this.moduleValueAG = p;
  221. if (this.moduleValueAG) this.moduleValueAG.then(function(){
  222. this.moduleValueAG = null;
  223. }.bind(this));
  224. }else{
  225. this.__setValue(value);
  226. }
  227. // this.moduleValueAG = o2.AG.all(value).then(function(v){
  228. // if (o2.typeOf(v)=="array") v = v[0];
  229. // if (this.moduleSelectAG){
  230. // this.moduleValueAG = this.moduleSelectAG;
  231. // this.moduleSelectAG.then(function(){
  232. // this.__setValue(v);
  233. // }.bind(this));
  234. // }else{
  235. // this.__setValue(v)
  236. // }
  237. // return v;
  238. // }.bind(this));
  239. //
  240. // if (this.moduleValueAG) this.moduleValueAG.then(function(){
  241. // this.moduleValueAG = null;
  242. // }.bind(this));
  243. },
  244. __setValue: function(value){
  245. this._setBusinessData(value);
  246. var radios = this.node.getElements("input");
  247. for (var i=0; i<radios.length; i++){
  248. var radio = radios[i];
  249. if (radio.value==value){
  250. radio.checked = true;
  251. break;
  252. }
  253. }
  254. },
  255. getTextData: function(){
  256. var inputs = this.node.getElements("input");
  257. var value = "";
  258. var text = "";
  259. if (inputs.length){
  260. for (var i=0; i<inputs.length; i++){
  261. var input = inputs[i];
  262. if (input.checked){
  263. value = input.get("value");
  264. text = input.get("showText");
  265. break;
  266. }
  267. }
  268. }
  269. return {"value": [value] || "", "text": [text || value || ""]};
  270. },
  271. getInputData: function(){
  272. if (this.readonly || this.json.isReadonly ){
  273. return this._getBusinessData();
  274. }else{
  275. var inputs = this.node.getElements("input");
  276. var value = "";
  277. if (inputs.length){
  278. for (var i=0; i<inputs.length; i++){
  279. var input = inputs[i];
  280. if (input.checked){
  281. value = input.get("value");
  282. break;
  283. }
  284. }
  285. }
  286. return value;
  287. }
  288. },
  289. resetData: function(){
  290. this.setData(this.getValue());
  291. },
  292. getSelectedInput: function(){
  293. var inputs = this.node.getElements("input");
  294. if (inputs.length){
  295. for (var i=0; i<inputs.length; i++){
  296. if (inputs[i].checked) return inputs[i];
  297. }
  298. }
  299. return null;
  300. },
  301. setData: function(data){
  302. return this._setValue(data);
  303. // if (data && data.isAG){
  304. // this.moduleValueAG = o2.AG.all(data).then(function(v){
  305. // if (o2.typeOf(v)=="array") v = v[0];
  306. // this.__setData(v);
  307. // }.bind(this));
  308. // }else{
  309. // this.__setData(data);
  310. // }
  311. // if (data && data.isAG){
  312. // this.moduleValueAG = data;
  313. // data.addResolve(function(v){
  314. // this.setData(v);
  315. // }.bind(this));
  316. // }else{
  317. // this.__setData(data);
  318. // this.moduleValueAG = null;
  319. // }
  320. },
  321. __setData: function(data){
  322. this._setBusinessData(data);
  323. var inputs = this.node.getElements("input");
  324. if (inputs.length){
  325. for (var i=0; i<inputs.length; i++){
  326. if (data==inputs[i].get("value")){
  327. inputs[i].set("checked", true);
  328. }else{
  329. inputs[i].set("checked", false);
  330. }
  331. }
  332. }
  333. this.fireEvent("setData");
  334. },
  335. notValidationMode: function(text){
  336. if (!this.isNotValidationMode){
  337. this.isNotValidationMode = true;
  338. this.node.store("background", this.node.getStyles("background"));
  339. this.node.setStyle("background", "#ffdcdc");
  340. this.errNode = this.createErrorNode(text);
  341. if (this.iconNode){
  342. this.errNode.inject(this.iconNode, "after");
  343. }else{
  344. this.errNode.inject(this.node, "after");
  345. }
  346. this.showNotValidationMode(this.node);
  347. if (!this.node.isIntoView()) this.node.scrollIntoView();
  348. }
  349. },
  350. validationMode: function(routeName, opinion){
  351. if (!this.validationConfig(routeName, opinion)) return false;
  352. if (this.isNotValidationMode){
  353. this.isNotValidationMode = false;
  354. this.node.setStyles(this.node.retrieve("background"));
  355. if (this.errNode){
  356. this.errNode.destroy();
  357. this.errNode = null;
  358. }
  359. }
  360. }
  361. });