relaxngui.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428
  1. /*
  2. This file is part of RelaxNGui.
  3. RelaxNGui is free software: you can redistribute it and/or modify it under
  4. the terms of the GNU General Public License as published by the Free Software
  5. Foundation, either version 3 of the License, or (at your option) any later
  6. version.
  7. RelaxNGui is distributed in the hope that it will be useful, but WITHOUT ANY
  8. WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
  9. A PARTICULAR PURPOSE. See the GNU General Public License for more details.
  10. You should have received a copy of the GNU General Public License along with
  11. RelaxNGui (file COPYING in the main directory). If not, see
  12. <http://www.gnu.org/licenses/>.
  13. */
  14. var RelaxNGui = function(rng,target,ceval,ignore=false) {
  15. if (!(rng instanceof XMLDocument)) { // rng has to be XMLDocument //{{{
  16. rng = $XR($(rng).serializeXML());
  17. } //}}}
  18. var lenextract = function(tag, lencount) { //{{{
  19. $.each(tag.attributes,function(k,v){
  20. if ((v.localName == 'label') && (v.namespaceURI == 'http://rngui.org')) { lencount = v.nodeValue.length > lencount ? v.nodeValue.length : lencount; }
  21. });
  22. return lencount;
  23. }; //}}}
  24. var labextract = function(type,tag) { //{{{
  25. var ret = { 'type': type, 'wrap': false, 'readonly': false, 'label': '', default: '' };
  26. $.each(tag.attributes,function(k,v){
  27. if ((v.localName == 'label') && (v.namespaceURI == 'http://rngui.org')) { ret['label'] = v.nodeValue; }
  28. if ((v.localName == 'readonly') && (v.namespaceURI == 'http://rngui.org')) { ret['readonly'] = v.nodeValue == 'true' ? true : false; }
  29. if ((v.localName == 'wrap') && (v.namespaceURI == 'http://rngui.org')) { ret['wrap'] = v.nodeValue == 'true' ? true : false; }
  30. });
  31. $.each(tag.children,function(k,v){
  32. if ((v.localName == 'param') && (v.namespaceURI == 'http://relaxng.org/ns/structure/1.0')) {
  33. $.each(v.attributes,function(l,w){
  34. if ((w.localName == 'name') && (w.nodeValue == 'minInclusive')) {
  35. ret['min'] = v.lastChild.nodeValue;
  36. }
  37. if ((w.localName == 'name') && (w.nodeValue == 'maxInclusive')) {
  38. ret['max'] = v.lastChild.nodeValue;
  39. }
  40. });
  41. }
  42. });
  43. return ret;
  44. }; //}}}
  45. var addelements = function(target) { //{{{
  46. var template = target.parent().find('> .relaxngui_template').clone(true,true);
  47. template.removeClass('relaxngui_template');
  48. template.find('[data-relaxngui-template]').each(function(j,t){
  49. $(t).attr('data-relaxngui-template',false);
  50. });
  51. template.find('.relaxngui_template [data-relaxngui-template]').each(function(j,t){
  52. $(t).attr('data-relaxngui-template',true);
  53. });
  54. template.addClass('relaxngui_dyn');
  55. template.on('click', '> *:first-child', function(ev){ delelements($(ev.target)); });
  56. if (target.parent().find('> .relaxngui_dyn').length % 2 == 1) {
  57. var evens = template.find('.even');
  58. var odds = template.find('.odd');
  59. evens.each(function(k,v){
  60. $(v).removeClass('even');
  61. $(v).addClass('odd');
  62. });
  63. odds.each(function(k,v){
  64. $(v).removeClass('odd');
  65. $(v).addClass('even');
  66. });
  67. }
  68. target.parent().find('> .relaxngui_control').before(template);
  69. }; //}}}
  70. var delelements = function(target) { //{{{
  71. var it = target.parent();
  72. var par = target.parent().parent();
  73. it.remove();
  74. par.trigger('relaxngui_remove');
  75. }; //}}}
  76. var recshow_header = function(tag,ret){ //{{{
  77. var header;
  78. $.each(tag.attributes,function(k,v){
  79. if ((v.localName == 'header') && (v.namespaceURI == 'http://rngui.org')) { header = v.nodeValue; }
  80. });
  81. if (header) {
  82. ret.append($("<div class='relaxngui_header'>" + header + "</div>"));
  83. }
  84. } //}}}
  85. var recshow_single = function(tag,ret,template,path,lencount,optional){ //{{{
  86. var node = $('<div class="relaxngui_row"/>');
  87. var name;
  88. var label;
  89. var second = {};
  90. var datalist = [];
  91. var defaul = '';
  92. var hint = '';
  93. var retcount = 0;
  94. $.each(tag.attributes,function(k,v){
  95. if ((v.localName == 'label') && (v.namespaceURI == 'http://rngui.org')) { label = v.nodeValue; }
  96. if ((v.localName == 'date') && (v.namespaceURI == 'http://rngui.org')) { label = v.nodeValue; }
  97. if ((v.localName == 'default') && (v.namespaceURI == 'http://rngui.org')) { defaul = v.nodeValue; }
  98. if ((v.localName == 'hint') && (v.namespaceURI == 'http://rngui.org')) { hint = v.nodeValue; }
  99. if (v.localName == 'name') { name = v.nodeValue; }
  100. });
  101. $.each($(tag).children('data[type=string]'), function(k,v) { second = labextract('string',v); });
  102. $.each($(tag).children('data[type=integer]'), function(k,v) { second = labextract('integer',v); });
  103. $.each($(tag).children('data[type=nonNegativeInteger]'), function(k,v) { second = labextract('nonNegativeInteger',v); });
  104. $.each($(tag).children('data[type=positiveInteger]'), function(k,v) { second = labextract('positiveInteger',v); });
  105. $.each($(tag).children('data[type=float]'), function(k,v) { second = labextract('float',v); });
  106. $.each($(tag).children('data[type=date]'), function(k,v) { second = labextract('date',v); });
  107. $.each($(tag).children('text'), function(k,v) { second = labextract('text',v); });
  108. $.each($(tag).find('choice > value'), function(k,v) {
  109. second = labextract('datalist',$(v).parent()[0]);
  110. datalist.push(v.textContent);
  111. });
  112. if (name && label) {
  113. node.append($("<label class='relaxngui_cell" + (optional && defaul == '' ? " optional": "") + "' style='min-width: " + (lencount+1) + "ex' for=''>" + label + "</label><span class='relaxngui_cell'>⇒</span>"));
  114. } else if (name) {
  115. // a tag without information is ignored
  116. } else if (label) {
  117. node.append($("<input data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + path + " > *[data-name]' class='relaxngui_cell' type='text' pattern='^[a-z][a-zA-Z0-9_]*$' id='' placeholder='" + label + "'></input><span class='relaxngui_cell'>⇒</span>"));
  118. }
  119. var tpath = ((typeof name === 'undefined') ? path + ' > *' : (tag.localName == 'element' ? path + ' > ' + $(tag).attr('name') : path + '[' + $(tag).attr('name') + ']'));
  120. if (label) {
  121. if (defaul && typeof defaul == 'string' && defaul.match(/^javascript:/)) {
  122. defaul = defaul.replace(/^javascript:/,'');
  123. defaul = ceval ? ceval(defaul) : eval(defaul);
  124. }
  125. var os = (optional ? " onkeyup='var sl = $(this).siblings(\"label\"); if ($(this).get_val() == \"\") { if (!sl.hasClass(\"optional\")) { sl.addClass(\"optional\") } } else { sl.removeClass(\"optional\") }' data-optional='true'" : " data-optional='false'");
  126. if (second.readonly)
  127. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='text' id='' readonly='readonly'" + os + "></input>"));
  128. else {
  129. if (second.type == 'string') {
  130. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='text' id='' placeholder='" + second.label + "'" + os + "></input>"));
  131. } else if (second.type == 'integer') {
  132. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='number' id='' placeholder='" + second.label + "'" + (second.min != undefined ? (" min='" + second.min + "'") : '') + (second.max != undefined ? (" max='" + second.max + "'") : '') + os + "></input>"));
  133. } else if (second.type == 'positiveInteger') {
  134. if (second.min == undefined) second.min = 1;
  135. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='number' id='' placeholder='" + second.label + "'" + (second.min != undefined ? (" min='" + second.min + "'") : '') + (second.max != undefined ? (" max='" + second.max + "'") : '') + os + "></input>"));
  136. } else if (second.type == 'nonNegativeInteger') {
  137. if (second.min == undefined) second.min = 0;
  138. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='number' id='' placeholder='" + second.label + "'" + (second.min != undefined ? (" min='" + second.min + "'") : '') + (second.max != undefined ? (" max='" + second.max + "'") : '') + os + "></input>"));
  139. } else if (second.type == 'date') {
  140. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='date' id='' placeholder='" + second.label + "'" + os + "></input>"));
  141. } else if (second.type == 'float') {
  142. node.append($("<input " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' type='number' step='any' id='' placeholder='" + second.label + "'" + (second.min != undefined ? (" min='" + second.min + "'") : '') + (second.max != undefined ? (" max='" + second.max + "'") : '') + os + "></input>"));
  143. } else if (second.type == 'text') {
  144. node.append($("<div contenteditable='true' data-relaxngui-wrap='" + second.wrap + "' " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' id='' placeholder='" + second.label + "'" + os + "></div>"));
  145. } else if (second.type == 'datalist') {
  146. var tnode = $("<select " + (defaul && typeof defaul == 'string' ? 'value="' + defaul + '"' : '') + " data-relaxngui-template='" + template + "' data-relaxngui-parent='" + path + "' data-relaxngui-path='" + tpath + "' class='relaxngui_cell' id='' size='1'" + os + "></select>");
  147. $.each(datalist,function(didx,dname){
  148. if (dname == defaul)
  149. tnode.append('<option value="' + dname + '" selected="selected">' + dname + '</value>');
  150. else
  151. tnode.append('<option value="' + dname + '">' + dname + '</value>');
  152. });
  153. node.append(tnode);
  154. }
  155. }
  156. ret.append(node);
  157. retcount += 1;
  158. } else {
  159. if (tag.localName != 'element') { // its an attribute, simulate its empty-ness
  160. node.attr('data-relaxngui-template',template);
  161. node.attr('data-relaxngui-parent',path);
  162. node.attr('data-relaxngui-path',tpath);
  163. ret.append(node);
  164. retcount += 1;
  165. }
  166. }
  167. if (hint) {
  168. var n = $('<div class="relaxngui_hint"/>');
  169. var s1 = $('<em>Hint: </em>');
  170. var s2 = $('<span/>');
  171. s2.text(hint);
  172. n.append(s1);
  173. n.append(s2);
  174. ret.append(n);
  175. retcount += 1;
  176. }
  177. return retcount;
  178. } //}}}
  179. var recshow = function(elements,template,path,attr) { //{{{
  180. // delete all elements with relaxngui:ignore
  181. if (attr.ignore) {
  182. var tele = $.grep(elements,function(tagv){
  183. var include = true;
  184. $.each(tagv.attributes,function(k,v){
  185. if ((v.localName == 'ignore') && (v.namespaceURI == 'http://rngui.org')) {
  186. include = false;
  187. }
  188. });
  189. return include;
  190. });
  191. elements = $(tele);
  192. }
  193. var ret = $('<div/>');
  194. var lencount = 0;
  195. $.each(elements,function(k,v){
  196. var tag = $(v)[0];
  197. if ((tag.localName == 'element') && (tag.namespaceURI == 'http://relaxng.org/ns/structure/1.0')) {
  198. $(tag).children('attribute').each(function(l,w){
  199. lencount = lenextract($(w)[0],lencount);
  200. });
  201. lencount = lenextract(tag,lencount);
  202. }
  203. });
  204. $.each(elements,function(k,v){
  205. if (attr.mode == 'even') { attr.mode = 'odd' }
  206. else { attr.mode = 'even'; }
  207. var tag = $(v)[0];
  208. if ((tag.localName == 'element') && (tag.namespaceURI == 'http://relaxng.org/ns/structure/1.0')) {
  209. var xxx;
  210. if (template) {
  211. var yyy = $('<div class="relaxngui_table ' + attr.mode + '" data-relaxngui-template="true" data-relaxngui-parent="' + path + '" data-relaxngui-path="' + (path == '' ? ' > ' + (typeof elements.attr('name') === 'undefined' ? '*' : elements.attr('name')) : path + ' > ' + (typeof $(tag).attr('name') === 'undefined' ? '*' : $(tag).attr('name'))) + '[data-main]">');
  212. xxx = $('<div class="relaxngui_template"><span>✖</span></div>');
  213. xxx.append(yyy);
  214. ret.append(xxx);
  215. xxx = yyy;
  216. } else {
  217. xxx = $('<div class="relaxngui_table ' + attr.mode + '" data-relaxngui-template="false" data-relaxngui-parent="' + path + '" data-relaxngui-path="' + (path == '' ? ' > ' + elements.attr('name') : path + ' > ' + $(tag).attr('name')) + '[data-main]">');
  218. ret.append(xxx);
  219. }
  220. recshow_header(tag,xxx);
  221. var rcount = 0;
  222. $(tag).children('attribute').each(function(l,w){
  223. var ttag = $(w)[0];
  224. rcount += recshow_single(ttag,xxx,template,path + ' > ' + $(tag).attr('name'),lencount,attr.optional ? true : false);
  225. });
  226. rcount += recshow_single(tag,xxx,template,path,lencount,attr.optional ? true : false);
  227. var sub;
  228. if (sub = recshow($(tag).children('element, zeroOrMore, optional'),false,path + ' > ' + $(tag).attr('name'),{ ignore: attr.ignore, mode: (attr.mode == 'even' && rcount % 2 == 0 ? 'odd' : 'even' ) })) {
  229. var inode = xxx.append(sub);
  230. if (template) {
  231. inode.find('[data-relaxngui-template]').each(function(j,t){
  232. $(t).attr('data-relaxngui-template',true);
  233. });
  234. }
  235. }
  236. } else if ((tag.localName == 'zeroOrMore') && (tag.namespaceURI == 'http://relaxng.org/ns/structure/1.0')) {
  237. var label;
  238. $.each(tag.attributes,function(k,v){
  239. if ((v.localName == 'label') && (v.namespaceURI == 'http://rngui.org')) { label = v.nodeValue; }
  240. });
  241. var but = $('<button class="relaxngui_control">' + label + '</button>');
  242. but.on('click',function(ev){ addelements($(ev.target)); });
  243. ret.append(recshow($(tag).children(),true,path,{ ignore: attr.ignore, mode: attr.mode }));
  244. ret.append(but);
  245. } else if ((tag.localName == 'optional') && (tag.namespaceURI == 'http://relaxng.org/ns/structure/1.0')) {
  246. ret.append(recshow($(tag).children('element, zeroOrMore'),false,path,{ ignore: attr.ignore, mode: (attr.mode == 'even' ? 'odd' : 'even'), optional: true }));
  247. }
  248. });
  249. return ret.children().length > 0 ? ret.children() : undefined;
  250. }; //}}}
  251. var serializeXML = function (xml) { //{{{
  252. var out = '';
  253. if (typeof XMLSerializer == 'function') {
  254. var xs = new XMLSerializer();
  255. $(xml).each(function() {
  256. out += xs.serializeToString(this);
  257. });
  258. } else if (xml && xml.xml != 'undefined') {
  259. $(xml).each(function() {
  260. out += this.xml;
  261. });
  262. }
  263. return out;
  264. }; //}}}
  265. this.save = function() { //{{{
  266. var xml;
  267. var curr;
  268. var tar = target.find('[data-relaxngui-path]:not([data-relaxngui-template=true])');
  269. for (var i = 0; i<tar.length;) {
  270. var path = $(tar[i]).attr('data-relaxngui-path');
  271. var parent_path = $(tar[i]).attr('data-relaxngui-parent');
  272. if (i == 0) {
  273. var par = path.replace(/\[data-main\]/,'').replace(/ > /,'');
  274. xml = $XR('<' + par + '/>');
  275. } else {
  276. var ma = path.match(/([^\s]+)$/)[1];
  277. var att;
  278. if (ma.match(/\*\[data-main\]/)) {
  279. // do nothing. seriously. explicitly.
  280. } else if (ma.match(/\[data-main\]/)) {
  281. var par = ma.replace(/\[data-main\]/,'');
  282. var curr = $($XR('<' + par + '/>').documentElement);
  283. $(parent_path,xml).last().append(curr);
  284. } else if (ma.match(/\[data-name\]/)) {
  285. if ($(tar[i]).get_val()) {
  286. var nn = $($XR('<' + $(tar[i]).get_val() + '/>').documentElement).text($(tar[i+1]).get_val());
  287. $(parent_path,xml).append(nn);
  288. }
  289. i+=1;
  290. } else if (att = ma.match(/\[([^\]]+)\]$/)) {
  291. $(parent_path + ':last-child',xml).last().attr(att[1],$(tar[i]).get_val());
  292. } else {
  293. if ($(tar[i]).attr('data-optional') == 'true' && $(tar[i]).get_val() == '') {
  294. $(path + ':last-child',xml).last().remove();
  295. } else {
  296. $(path + ':last-child',xml).last().text($(tar[i]).get_val())
  297. }
  298. }
  299. }
  300. i+=1;
  301. }
  302. return xml;
  303. }; //}}}
  304. this.save_text = function() { //{{{
  305. return serializeXML(self.save());
  306. } //}}}
  307. this.content = function(data) { //{{{
  308. if (!(data instanceof XMLDocument)) { // data has to be XMLDocument //{{{
  309. data = $XR($(data).serializeXML());
  310. } //}}}
  311. if (data) {
  312. var x = $(data).serializePrettyXML();
  313. x = x.replace(/\s+xmlns(:[a-zA-Z0-9]+)?=\"[^\"]+\"/g, "");
  314. x = x.replace(/<\?[^>]+>/g, "");
  315. x = x.trim();
  316. y = $(self.save()).serializePrettyXML();
  317. if (x != y) {
  318. target.find('.relaxngui_dyn').remove();
  319. target.find('[data-relaxngui-path]').each(function(k,pa){
  320. var path = $(pa).attr('data-relaxngui-path');
  321. if (!path.match(/data-\w+\]$/)) {
  322. if ($(pa).attr('data-relaxngui-template') == 'true' && path.match(/\*$/)) {
  323. $(data).find(path).each(function(index,ele){
  324. $(target.find('[data-relaxngui-path="' + path + '[data-name]"][data-relaxngui-template="false"]').get(index)).set_val(ele.localName);
  325. $(target.find('[data-relaxngui-path="' + path + '"][data-relaxngui-template="false"]').get(index)).set_val($(ele).text());
  326. });
  327. } else if ($(pa).attr('data-relaxngui-template') == 'true' && !path.match(/\*$/)) {
  328. $(data).find(path).each(function(index,ele){
  329. var att;
  330. var val;
  331. if (att = path.match(/(.*)\[([^\]]+)\]$/)) {
  332. val = $(ele).attr(att[2]);
  333. } else {
  334. val = $(ele).text();
  335. }
  336. if (val && val != '') {
  337. $(target.find('[data-relaxngui-path="' + path + '"][data-relaxngui-template="false"]').get(index)).set_val(val);
  338. }
  339. });
  340. } else {
  341. var att;
  342. var val;
  343. if (att = path.match(/(.*)\[([^\]]+)\]$/)) {
  344. val = $(data).find(att[1]).attr(att[2]);
  345. } else {
  346. val = $(data).find(path).text();
  347. }
  348. if (val && val != '') {
  349. var t = target.find('[data-relaxngui-path="' + path + '"]');
  350. t.set_val(val);
  351. if (t.attr('data-optional') == 'true') {
  352. t.siblings('label').removeClass('optional');
  353. }
  354. }
  355. }
  356. } else {
  357. if ($(pa).attr('data-relaxngui-template') == 'true') {
  358. var but = target.find('.relaxngui_table[data-relaxngui-template="false"] > .relaxngui_template > [data-relaxngui-path="' + path + '"][data-relaxngui-template="true"]').parent().parent().find('> button');
  359. if (but.length > 0) {
  360. var dpath = path.replace(/\[data-main\]$/,'');
  361. var par = undefined;
  362. var ind = -1;
  363. $(data).find(dpath).each(function(ke,ele){
  364. if (par != $(ele).parent()[0]) {
  365. ind += 1;
  366. par = $(ele).parent()[0];
  367. }
  368. if ($(but.get(ind)).attr('disabled')) {
  369. $(but.get(ind)).removeAttr('disabled');
  370. but.get(ind).click();
  371. $(but.get(ind)).attr('disabled','disabled');
  372. } else {
  373. but.get(ind).click();
  374. }
  375. });
  376. }
  377. }
  378. }
  379. });
  380. self.set_checkpoint();
  381. }
  382. }
  383. }; //}}}
  384. // stuff to determine if user changed something
  385. var orig = '';
  386. this.set_checkpoint = function() { //{{{
  387. orig = self.save_text();
  388. } //}}}
  389. this.has_changed = function() { //{{{
  390. if (orig != self.save_text()) {
  391. return true;
  392. } else {
  393. return false;
  394. }
  395. } //}}}
  396. target.append(recshow($(rng.documentElement),false,'',{ ignore: ignore, mode: 'even'}));
  397. var self = this;
  398. };