design.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720
  1. //delete = delets from DB
  2. //remove = removes from HTML
  3. //save = save to DB
  4. //add = changes HTML
  5. //get = get from DB
  6. //new = changes HTML
  7. var pictureWidth = 1280;
  8. var pictureHeight = 720;
  9. function overlayOn(value, special="") {
  10. if(special == "image"){
  11. url = urlUniversalStorage + "ui/?iframe&path=Stationsbilder/Gesamtbilder/Station3"
  12. }
  13. else if(special == "assigment"){
  14. url = urlUniversalStorage + "ui/?iframe&path=Stationsbilder/Einzelbilder/Station3"
  15. }
  16. else{
  17. url = urlUniversalStorage + "ui/?iframe"
  18. }
  19. document.getElementById("overlay").style.display = "block";
  20. var iframe = $('#overlaycontentsize').append("<iframe id='overlaycontent' src='" + url + "' width='1800' height='800'></iframe>");
  21. iframe.find("#overlaycontent").bind('load',{"ka": value}, function(event){
  22. var ref = this.contentWindow.ref;
  23. //You can think that ref = $(this.contentWindow.test) but thery are different
  24. //they are two diferent references this might be a bug
  25. ref.bind('getUrl',{"xyz": event.data.ka}, function(event, extra1){
  26. var data = event.data
  27. overlayOff();
  28. //fill input with url
  29. if(special == ""){
  30. $(data.xyz).parent().parent().find(".abbreviationInput").val(extra1.url)
  31. }
  32. else if (special == "assigment"){
  33. $(data.xyz).parent().parent().find(".abbreviationInput").val(extra1.url)
  34. getImgText(extra1.url)
  35. }
  36. else if (special == "image"){
  37. clearForm();
  38. //hide current image
  39. var newSrc = extra1.url + "?rand=" + Math.random();
  40. image = new Image();
  41. $("#sliceImg").hide("puff")
  42. //show new image and perform a resize of the rectangle
  43. image.onload = function() {
  44. $("#sliceImg").hide("puff", function() {
  45. $(this).attr("src", newSrc).show("fold");
  46. resizeAllRect();
  47. fillFormName(extra1.url.substring(extra1.url.lastIndexOf('/') + 1).replace(/\.[^/.]+$/, ""));
  48. refreshassignments()
  49. });
  50. }
  51. image.src = newSrc;
  52. // $("#sliceImg").attr("src",extra1.url + "?rand=" + Math.random() )
  53. // resizeAllRect()
  54. }
  55. });
  56. });
  57. }
  58. function overlayOnImg(data) {
  59. var url = new URL("" + data, document.baseURI).href
  60. document.getElementById("overlay").style.display = "block";
  61. const imageext = ["png", "jpg", "svg"]
  62. const movieext = ["mp4"]
  63. var ext = url.substr(url.lastIndexOf('.') + 1);
  64. if(imageext.includes(ext)){
  65. $('#overlaycontentsize').load(url, function(){
  66. var width = $(this).children("svg").attr("width")
  67. var height = $(this).children("svg").attr("height")
  68. $(this).children("svg").attr("viewBox","0 0 " + width + " " + height);
  69. $(this).children("svg").attr("width",window.innerWidth * 0.7);
  70. $(this).children("svg").attr("height",window.innerHeight *0.7);
  71. });
  72. }
  73. else if(movieext.includes(ext)){
  74. $('#overlaycontentsize').append("<video id='overlaycontent' controls> <source src=" + url + " type=\"video/mp4\">Your browser does not support the video tag.</video>");
  75. }
  76. else{
  77. $('#overlaycontentsize').append("<iframe id='overlaycontent' src=" + url + "></iframe>");
  78. }
  79. }
  80. function overlayOff() {
  81. document.getElementById("overlay").style.display = "none";
  82. $('#overlaycontentsize').text("");
  83. document.getElementById("overlayNotClickable").style.display = "none";
  84. $('#overlaycontentsizeNotClickable').text("");
  85. }
  86. function saveStation() { //Save 2 DB
  87. if (confirm('Are you really, really, REALLY sure you want to create a New Station?')) {
  88. $.ajax({
  89. type: "POST",
  90. url: "../server/",
  91. success: function(res) {
  92. location.reload();
  93. }
  94. });
  95. }
  96. }
  97. function getStations(stationID , patternID ){ //Get DB 2 HTML
  98. $('#stations').text("");
  99. $.ajax({
  100. type: "GET",
  101. url: "../server/",
  102. dataType: "xml",
  103. success: function(xml) {
  104. $(xml).find('station').each(function(index){
  105. var clone = document.importNode(document.querySelector('#line').content,true);
  106. $('[data-class=station]',clone).text($(this).attr('id'));
  107. $('[data-class=pattern] a',clone).before("[");
  108. $('[data-class=pattern] a',clone).text("Add Pattern");
  109. $('[data-class=pattern] a',clone).after("]");
  110. $('[data-class=pattern] a',clone).attr('href','javascript:newPattern('+ $(this).attr('id') + ');');
  111. $('[data-class=duplicate]',clone).text("");
  112. $('[data-class=delete]',clone).text("");
  113. $('#stations').append(clone);
  114. var curstation=$(this).attr('id');
  115. $(this).find('pattern').each(function(index){
  116. var clonePattern = document.importNode(document.querySelector('#line').content,true);
  117. $('[data-class=pattern] a',clonePattern).text($(this).find('parts').children().map(function(i, element){return $(element).text()}).get().join("."));
  118. $('[data-class=pattern] a',clonePattern).attr('href','javascript:getPattern(' + curstation + ','+ $(this).attr('id') + ');');
  119. $('[data-class=date]',clonePattern).text($.format.date(Date.parse($(this).attr('changed')), 'yyyy/MM/dd HH:mm:ss'));
  120. $('[data-class=duplicate] a',clonePattern).attr('href','javascript:duplicatePattern(' + curstation + ','+ $(this).attr('id') + ');');
  121. $('[data-class=delete] a',clonePattern).attr('href','javascript:deletePattern(' + curstation + ','+ $(this).attr('id') + ');');
  122. if (patternID != null && patternID == $(this).attr('id')){
  123. $('tr',clonePattern).css("background-color","#99cce6");
  124. }
  125. $('#stations').append(clonePattern);
  126. });
  127. });
  128. }
  129. });
  130. }
  131. function newPattern(stationID) { //HTML
  132. getPattern(stationID);
  133. }
  134. function getPattern(stationID, patternID){ //Get DB 2 HTML
  135. getStations(stationID, patternID)
  136. //rest Pattern
  137. abk.forEach(function(item){
  138. $("#FormPattern_Form_" + item).val();
  139. $("#FormPattern_Form_" + item).val($("#FormPattern_Form_" + item + " option:first").val());
  140. });
  141. if (patternID == null){
  142. $('#patternform').attr('onsubmit', "savePattern("+stationID+")");
  143. $('#pattern_ID').text("");
  144. $('#pattern_description').val("");
  145. $('#imageListing').text("");
  146. $('#images').css("display", "none");
  147. $('#remove_pattern').css("display", "none");
  148. $('#error').css("display", "none");
  149. $('#replacements').css("display", "none");
  150. }
  151. else{
  152. $('#patternform').attr('onsubmit', "saveChangedPattern("+stationID+","+ patternID +")");
  153. $('#pattern_ID').text(patternID);
  154. getImages(stationID, patternID);
  155. $('#remove_pattern').css("display", "block");
  156. $('#remove_pattern').attr('onclick', "javascript:deletePattern("+stationID+","+ patternID +")");
  157. getError(stationID, patternID);
  158. getReplaceImages(stationID, patternID);
  159. $.ajax({
  160. type: "GET",
  161. url: "../server/"+stationID+ "/" + patternID,
  162. dataType: "xml",
  163. success: function(xml) {
  164. $('#pattern_description').val($(xml).find('pattern').attr('description'));
  165. $(xml).find('parts').children().each(function(index){
  166. /*
  167. $(this).find('pattern').each(function(index){
  168. var clonePattern = document.importNode(document.querySelector('#line').content,true);
  169. $('[data-class=pattern] a',clonePattern).text($(this).find('parts').children().map(function(i, element){return $(element).text()}).get().join("."));
  170. abk.forEach(function(item){
  171. if(typeof $("#FormPattern_Form_" + item).val() !== 'undefined' && typeof $("#FormPattern_Form_" + item).val() !== 'undefined'){
  172. $(xmlDocument).find("parts").append("<"+item+">" +$("#FormPattern_Form_" + item).find(":selected").text()+"</"+item+">")
  173. }
  174. });
  175. */
  176. //console.log($(this).prop("tagName"));
  177. //console.log($(this).text());
  178. $("#FormPattern_Form_" + $(this).prop("tagName")).val($(this).text());
  179. /*
  180. var pattern = $(this).attr('value').split(".")
  181. for(var i = 0; i < pattern.length; i++)
  182. {
  183. if(i == 0){
  184. $("#patternInput .patternPartInput").val(pattern[i]);
  185. $("#patternInput .patternPartInput").attr('size', pattern[i].length);
  186. }
  187. else{
  188. var clone = document.importNode(document.querySelector('#patternClone').content,true);
  189. $('[data-class=part]',clone).val(pattern[i]);
  190. $('[data-class=part]',clone).limitkeypress({ rexp: keypressRegex() });
  191. $('[data-class=part]',clone).attr('size', pattern[i].length);
  192. $("#patternInput").append(clone);
  193. }
  194. }
  195. $('#pattern').val($(this).attr('value'));
  196. */
  197. });
  198. }
  199. });
  200. }
  201. $('#pattern_details').css("display", "block");
  202. $('#pattern_station').text(stationID);
  203. //Reset Pattern
  204. $('#patternInput').text("");
  205. var clone = document.importNode(document.querySelector('#patternClone').content,true);
  206. $('[data-class=part]',clone).limitkeypress({rexp: keypressRegex()});
  207. $("#patternInput").append(clone);
  208. }
  209. function keypressRegex(){ //Helper Function
  210. return /^.{1,10}$/;
  211. //return /^[A-Za-z0-9\*]*$/; //Ohne Sonderzeichen
  212. }
  213. function removePatternPart(value) { //HTML
  214. if($( ".patternPart" ).length > 1)
  215. value.parent().remove();
  216. }
  217. function addPatternPart(useLast, curclass) { //HTML
  218. var clone = document.importNode(document.querySelector('#patternClone').content,true);
  219. $('[data-class=part]',clone).val("*");
  220. $('[data-class=part]',clone).limitkeypress({rexp: keypressRegex()});
  221. if(useLast){
  222. $("#" + curclass).children(".patternPart").last().after(clone);
  223. $("#" + curclass).last().children(".patternPartInput").focus();
  224. }else{
  225. $(':focus').parent().after(clone);
  226. $(':focus').parent().next().children(".patternPartInput").focus();
  227. }
  228. }
  229. function getPatternString(){ //Helper Function
  230. var val = "";
  231. var first = true;
  232. $(".patternPartInput").each(function() {
  233. if(first){
  234. first = false
  235. val += $(this).val()
  236. }
  237. else{
  238. val += "." + $(this).val()
  239. }
  240. });
  241. return val;
  242. }
  243. function savePattern(stationID) { //Save 2 DB
  244. var xmlDocument = $.parseXML("<pattern><parts></parts></pattern>");
  245. $(xmlDocument).find("pattern").attr('id','0');
  246. // #FormPattern
  247. abk.forEach(function(item){
  248. if(typeof $("#FormPattern_Form_" + item).val() !== 'undefined' && typeof $("#FormPattern_Form_" + item).val() !== 'undefined'){
  249. $(xmlDocument).find("parts").append("<"+item+">" +$("#FormPattern_Form_" + item).find(":selected").text()+"</"+item+">")
  250. }
  251. });
  252. $(xmlDocument).find("pattern").attr('description',$('#pattern_description').val());
  253. $(xmlDocument).find("pattern").attr('changed',new Date().toISOString());
  254. console.log((new XMLSerializer()).serializeToString(xmlDocument));
  255. $.ajax({
  256. type: "POST",
  257. headers: {"content-id": "pattern"},
  258. data: (new XMLSerializer()).serializeToString(xmlDocument),
  259. contentType: "application/xml; charset=utf-8",
  260. url: "../server/"+stationID,
  261. success: function(res) {
  262. //getPattern(stationID, res.id)
  263. },
  264. error: function (request, status, error) {
  265. //alert(request.responseText + status + error);
  266. }
  267. });
  268. }
  269. function saveChangedPattern(stationID, patternID) { //Save 2 DB
  270. var xmlDocument = $.parseXML("<pattern><parts></parts></pattern>");
  271. $(xmlDocument).find("pattern").attr('id',$('#pattern_ID').text());
  272. // #FormPattern
  273. abk.forEach(function(item){
  274. if(typeof $("#FormPattern_Form_" + item).val() !== 'undefined' && typeof $("#FormPattern_Form_" + item).val() !== 'undefined'){
  275. $(xmlDocument).find("parts").append("<"+item+">" +$("#FormPattern_Form_" + item).find(":selected").text()+"</"+item+">")
  276. }
  277. });
  278. $(xmlDocument).find("pattern").attr('description',$('#pattern_description').val());
  279. $(xmlDocument).find("pattern").attr('changed',new Date().toISOString());
  280. //Save Pattern
  281. $.ajax({
  282. type: "PUT",
  283. headers: {"content-id": "pattern"},
  284. data: (new XMLSerializer()).serializeToString(xmlDocument),
  285. contentType: "application/xml; charset=utf-8",
  286. url: "../server/"+stationID + "/" + patternID,
  287. //processData: false,
  288. success: function(res) {
  289. },
  290. error: function (request, status, error) {
  291. alert(request.responseText + status + error);
  292. }
  293. });
  294. //Update Labels
  295. $(".imageInput").each(function() {
  296. //Optimization only update if lable changed
  297. if($(this).val() != $(this).attr("origValue"))
  298. $.ajax({
  299. type: "PUT",
  300. data: { 'label' : $(this).val()},
  301. headers: {"content-id": "label"},
  302. url: "../server/"+stationID + "/" + patternID + "/images/" + $(this).parent().find(".imageID").text() +"/" + $('#image_language option:selected').text(),
  303. success: function(res) {
  304. },
  305. error: function (request, status, error) {
  306. alert(request.responseText + status + error);
  307. }
  308. });
  309. });
  310. //Update Image Ordering
  311. var order = []
  312. $(".imageID").each(function() {
  313. order.push(parseInt($(this).text()))
  314. });
  315. $.ajax({
  316. type: "PUT",
  317. data: JSON.stringify(order),
  318. headers: {"content-id": "orderlist"},
  319. contentType: "application/json",
  320. url: "../server/"+stationID + "/" + patternID + "/images/reorder/" + $('#image_language option:selected').text(),
  321. success: function(res) {
  322. },
  323. error: function (request, status, error) {
  324. alert(request.responseText + status + error);
  325. }
  326. });
  327. //Update Error
  328. var errorList = $.parseXML("<error/>");
  329. $(".errorInput").each(function() {
  330. $(errorList).find("error").append("<reason>" +$(this).val()+"</reason>")
  331. });
  332. $.ajax({
  333. type: "PUT",
  334. headers: {"content-id": "error"},
  335. data: (new XMLSerializer()).serializeToString(errorList),
  336. contentType: "application/xml; charset=utf-8",
  337. url: "../server/"+stationID + "/" + patternID + "/error",
  338. success: function(res) {
  339. },
  340. error: function (request, status, error) {
  341. alert(request.responseText + status + error);
  342. }
  343. });
  344. //Update Replacement
  345. var replaceList = $.parseXML("<replacement/>");
  346. $(".replaceInput").each(function() {
  347. //console.log($(this).find('.abbreviation').val())
  348. //console.log($(this).find('.url').val())
  349. $(replaceList).find("replacement").append("<item>" + "<abbreviation>" + $(this).find('.abbreviation').val() + "</abbreviation>" + "<url>" + $(this).find('.url').val() + "</url>"+"</item>")
  350. });
  351. $.ajax({
  352. type: "PUT",
  353. headers: {"content-id": "replacement"},
  354. data: (new XMLSerializer()).serializeToString(replaceList),
  355. contentType: "application/xml; charset=utf-8",
  356. url: "../server/"+stationID + "/" + patternID + "/replacement",
  357. success: function(res) {
  358. },
  359. error: function (request, status, error) {
  360. alert(request.responseText + status + error);
  361. }
  362. });
  363. getPattern(stationID, patternID)
  364. }
  365. function deletePattern(stationID, patternID) { //Delete From DB
  366. if (confirm('Are you really, really, REALLY sure!')) {
  367. $.ajax({
  368. type: "DELETE",
  369. url: "../server/" + stationID + "/" + patternID,
  370. success: function(res) {
  371. location.reload();
  372. }
  373. });
  374. }
  375. }
  376. function duplicatePattern(stationID, patternID){ //Get DB 2 HTML
  377. $.ajax({
  378. type: "PUT",
  379. headers: {"content-id": "patternID"},
  380. data: { "patternID":patternID},
  381. contentType: "application/json",
  382. url: "../server/"+stationID + "/" + patternID,
  383. success: function(res) {
  384. getPattern(stationID, res["id"])
  385. },
  386. error: function (request, status, error) {
  387. alert(request.responseText + status + error);
  388. }
  389. });
  390. }
  391. function getImages(stationID, patternID){ //Get From DB 2 HTML
  392. $('#images').css("display", "block");
  393. $('#imageListing').text("");
  394. $('#imgUpload').attr("action", "../server/" + stationID + "/" + patternID + "/images");
  395. $('#addExternalImageUrl').val("");
  396. $('#addExternalImage').attr("onclick", "addExternalImage(" + stationID + "," + patternID + ")");
  397. //Image preview needs pattern
  398. $.ajax({
  399. type: "GET",
  400. url: "../server/"+stationID+ "/" + patternID,
  401. dataType: "xml",
  402. success: function(xml) {
  403. pattern = xml.getElementsByTagName('pattern')[0].getAttribute("value");
  404. //get all images
  405. $.ajax({
  406. type: "GET",
  407. url: "../server/"+stationID+ "/" + patternID + "/images",
  408. dataType: "xml",
  409. success: function(xml) {
  410. var count = 0;
  411. $(xml).find('image').each(function(index){
  412. curID = $(this).attr('id')
  413. $(this).find('variant').each(function(){
  414. if($(this).attr('lang') == $('#image_language option:selected').text()){
  415. ++count;
  416. var clone = document.importNode(document.querySelector('#imagePreview').content,true);
  417. var imgsrcsingle = "../images/uploads/"+stationID+ "/" + patternID + "/" + curID + "/"+ $(this).attr('lang') + ".svg";
  418. var imgsrc = imgsrcsingle + "?" + Date.now();
  419. //$('[data-class=image]',clone).append('<img id="theImg" src="' + imgsrc +'" onclick="overlayOnImg(\'' +imgsrcsingle + '\')" height="100px" />')
  420. //$('[data-class=image]',clone).append('<object class="theImg" id="theImg" data="' + imgsrc +'" onclick="overlayOnImg(\'' +imgsrcsingle + '\')" height="100px" />')
  421. //managing that internal and external pictures look the same
  422. $('[data-class=image]',clone).load(imgsrc, function(){
  423. var width = $(this).children("svg").attr("width")
  424. var height = $(this).children("svg").attr("height")
  425. $(this).children("svg").attr("viewBox","0 0 " + pictureWidth + " " + pictureHeight + "");
  426. $(this).children("svg").attr("width","200");
  427. $(this).children("svg").attr("height","100");
  428. });
  429. $('[data-class=image]',clone).attr("onclick", "overlayOnImg('" + imgsrcsingle + "')" );
  430. //Image Preview
  431. $('[data-class=showimage]',clone).attr("href", "imageReplacement.php?___image___="+stationID+ "/" + patternID + "/" + curID + "/"+ $(this).attr('lang') + ".svg" +"&ProductCode=" + pattern + "&Station=" + "Station" + stationID);
  432. //$('[data-class=image]',clone).append('<object class="theImg" id="theImg" data="' + imgsrc +'" onclick="overlayOnImg(\'' +imgsrcsingle + '\')" height="100px" />')
  433. //$('[data-class=image]',clone).append('<div style="background-image: url(' + imgsrc+ ')" height="100px" />')
  434. $('[data-class=label]',clone).val($(this).attr('label'));
  435. $('[data-class=label]',clone).attr("origValue", $(this).attr('label'));
  436. $('[data-class=imageId]',clone).text(curID);
  437. $('[data-class=imageId]',clone).attr("class", "imageID")
  438. $('[data-class=options] a',clone).attr('href','javascript:deleteImage(' + stationID + ','+ patternID + ',' + curID + ',"' + $(this).attr('lang') + '");');
  439. $('#imageListing').append(clone);
  440. }
  441. });
  442. });
  443. $('#image_count').text(count);
  444. /*
  445. $(".image").each(function() {
  446. alert("mhm");
  447. $(this).children().attr("viewBox","0 0 " + "300" + " 300");
  448. });
  449. */
  450. }
  451. });
  452. }
  453. });
  454. new Sortable(document.getElementById('imageListing'),{
  455. handle: '.handle',
  456. animation: 150
  457. });
  458. new Sortable(document.getElementById('replaceImages'),{
  459. handle: '.handle2',
  460. animation: 150
  461. });
  462. }
  463. function addExternalImage(stationID, patternID){
  464. var extImage = $.parseXML("<externalImage/>");
  465. $(extImage).find("externalImage").append("<url>" + $('#addExternalImageUrl').val() +"</url>");
  466. $(extImage).find("externalImage").append("<lang>" + $('#image_language option:selected').text() + "</lang>");
  467. console.log(extImage);
  468. $.ajax({
  469. type: "POST",
  470. headers: {"content-id": "externalImage"},
  471. data: (new XMLSerializer()).serializeToString(extImage),
  472. contentType: "application/xml; charset=utf-8",
  473. url: "../server/" + stationID + "/" + patternID + "/images",
  474. success: function(res) {
  475. getPattern(stationID, patternID)
  476. }
  477. });
  478. }
  479. function deleteImage(stationID, patternID, imageID, lang) { //Delete From DB
  480. $.ajax({
  481. type: "DELETE",
  482. url: "../server/" + stationID + "/" + patternID + "/images/" + imageID + "/" + lang,
  483. success: function(res) {
  484. getPattern(stationID, patternID)
  485. }
  486. });
  487. }
  488. function addError() { //HTML
  489. //Will be added from DB on save
  490. var clone = document.importNode(document.querySelector('#errorCode').content,true);
  491. $('#errorCodes').append(clone);
  492. }
  493. function getError(stationID, patternID){ //Get From DB 2 HTML
  494. $('#error').css("display", "block");
  495. $('#errorCodes').text("");
  496. $.ajax({
  497. type: "GET",
  498. url: "../server/"+stationID+ "/" + patternID + "/error",
  499. dataType: "xml",
  500. success: function(xml) {
  501. $(xml).find('reason').each(function(index){
  502. var clone = document.importNode(document.querySelector('#errorCode').content,true);
  503. $('[data-class=errorInput]',clone).val($(this).text());
  504. $('#errorCodes').append(clone);
  505. });
  506. }
  507. });
  508. }
  509. function removeError(value) { //HTML
  510. //Will be removed from DB on save
  511. value.parent().parent().parent().remove();
  512. }
  513. function addBlankReplacement() { //HTML
  514. //Will be added from DB on save
  515. var clone = document.importNode(document.querySelector('#imageReplacements').content,true);
  516. $('#replaceImages').append(clone);
  517. }
  518. function getReplaceImages(stationID, patternID){ //Get From DB 2 HTML
  519. $('#replacements').css("display", "block");
  520. $('#replaceImages').text("");
  521. $.ajax({
  522. type: "GET",
  523. url: "../server/"+stationID+ "/" + patternID + "/replacement",
  524. dataType: "xml",
  525. success: function(xml) {
  526. $(xml).find('item').each(function(index){
  527. var clone = document.importNode(document.querySelector('#imageReplacements').content,true);
  528. $('[data-class=abbreviation]',clone).val($(this).find('abbreviation').text());
  529. $('[data-class=url]',clone).val($(this).find('url').text());
  530. $('#replaceImages').append(clone);
  531. });
  532. }
  533. });
  534. }
  535. function removeReplacement(value) { //HTML
  536. //Will be removed from DB on save
  537. value.parent().parent().parent().remove();
  538. }
  539. //Go to next PatternInput on . or space keydown
  540. $(window).keydown(function(e) {
  541. if ((e.which === 32 || e.which === 190) && $(':focus').attr('class') === "patternPartInput") {
  542. e.preventDefault();
  543. addPatternPart(false);
  544. }
  545. });
  546. $(document).ready(function() {
  547. getStations(); //Get all Stations
  548. $("#image_language" ).change(function() {
  549. getImages($('#pattern_station').text(), $('#pattern_ID').text())
  550. });
  551. $(document).on('submit', '#patternform', function() { //prevent page reload on form submit
  552. return false;
  553. });
  554. $('.patternPartInput').limitkeypress({rexp: keypressRegex()});
  555. });