Radio.js 14 KB

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