ext-server_opensave.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. /*
  2. * ext-server_opensave.js
  3. *
  4. * Licensed under the Apache License, Version 2
  5. *
  6. * Copyright(c) 2010 Alexis Deveria
  7. *
  8. */
  9. svgEditor.addExtension("server_opensave", {
  10. callback: function() {
  11. var save_svg_action = 'extensions/filesave.php';
  12. var save_png_action = 'extensions/filesave.php';
  13. // Create upload target (hidden iframe)
  14. var target = $('<iframe name="output_frame" src="#"/>').hide().appendTo('body');
  15. svgEditor.setCustomHandlers({
  16. save: function(win, data) {
  17. var svg = "<?xml version=\"1.0\" encoding=\"UTF-8\" ?>\n" + data; // Chamilo add encoding="UTF-8"
  18. var title = svgCanvas.getDocumentTitle();
  19. //var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');//Chamilo replace by below
  20. var filename =title;//Chamilo TODO:check if the filter through filesave.php is enough
  21. var form = $('<form>').attr({
  22. method: 'post',
  23. action: save_svg_action,
  24. target: 'output_frame'
  25. }) .append('<input type="hidden" name="output_svg" value="' + encodeURI(svg) + '">')
  26. .append('<input type="hidden" name="filename" value="' + filename + '">')
  27. .appendTo('body')
  28. .submit().remove();
  29. },
  30. pngsave: function(win, data) {
  31. var issues = data.issues;
  32. if(!$('#export_canvas').length) {
  33. $('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
  34. }
  35. var c = $('#export_canvas')[0];
  36. c.width = svgCanvas.contentW;
  37. c.height = svgCanvas.contentH;
  38. canvg(c, data.svg, {renderCallback: function() {
  39. var datauri = c.toDataURL('image/png');
  40. var uiStrings = svgEditor.uiStrings;
  41. var note = '';
  42. // Check if there's issues
  43. if(issues.length) {
  44. var pre = "\n \u2022 ";
  45. note += ("\n\n" + pre + issues.join(pre));
  46. }
  47. if(note.length) {
  48. alert(note);
  49. }
  50. var title = svgCanvas.getDocumentTitle();
  51. //var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');//Chamilo replace by below
  52. var filename =title;//Chamilo TODO:check if the filter through filesave.php is enough
  53. var form = $('<form>').attr({
  54. method: 'post',
  55. action: save_png_action,
  56. target: 'output_frame'
  57. }) .append('<input type="hidden" name="output_png" value="' + datauri + '">')
  58. .append('<input type="hidden" name="filename" value="' + filename + '">')
  59. .appendTo('body')
  60. .submit().remove();
  61. }});
  62. }
  63. });
  64. // Do nothing if client support is found
  65. if(window.FileReader) return;
  66. var cancelled = false;
  67. // Change these to appropriate script file
  68. var open_svg_action = 'extensions/fileopen.php?type=load_svg';
  69. var import_svg_action = 'extensions/fileopen.php?type=import_svg';
  70. var import_img_action = 'extensions/fileopen.php?type=import_img';
  71. // Set up function for PHP uploader to use
  72. svgEditor.processFile = function(str64, type) {
  73. if(cancelled) {
  74. cancelled = false;
  75. return;
  76. }
  77. $('#dialog_box').hide();
  78. if(type != 'import_img') {
  79. var xmlstr = svgCanvas.Utils.decode64(str64);
  80. }
  81. switch ( type ) {
  82. case 'load_svg':
  83. svgCanvas.clear();
  84. svgCanvas.setSvgString(xmlstr);
  85. svgEditor.updateCanvas();
  86. break;
  87. case 'import_svg':
  88. svgCanvas.importSvgString(xmlstr);
  89. svgEditor.updateCanvas();
  90. break;
  91. case 'import_img':
  92. svgCanvas.setGoodImage(str64);
  93. break;
  94. }
  95. }
  96. // Create upload form
  97. var open_svg_form = $('<form>');
  98. open_svg_form.attr({
  99. enctype: 'multipart/form-data',
  100. method: 'post',
  101. action: open_svg_action,
  102. target: 'output_frame'
  103. });
  104. // Create import form
  105. var import_svg_form = open_svg_form.clone().attr('action', import_svg_action);
  106. // Create image form
  107. var import_img_form = open_svg_form.clone().attr('action', import_img_action);
  108. // It appears necessory to rebuild this input every time a file is
  109. // selected so the same file can be picked and the change event can fire.
  110. function rebuildInput(form) {
  111. form.empty();
  112. var inp = $('<input type="file" name="svg_file">').appendTo(form);
  113. function submit() {
  114. // This submits the form, which returns the file data using svgEditor.uploadSVG
  115. form.submit();
  116. rebuildInput(form);
  117. $.process_cancel("Uploading...", function() {
  118. cancelled = true;
  119. $('#dialog_box').hide();
  120. });
  121. }
  122. if(form[0] == open_svg_form[0]) {
  123. inp.change(function() {
  124. // This takes care of the "are you sure" dialog box
  125. svgEditor.openPrep(function(ok) {
  126. if(!ok) {
  127. rebuildInput(form);
  128. return;
  129. }
  130. submit();
  131. });
  132. });
  133. } else {
  134. inp.change(function() {
  135. // This submits the form, which returns the file data using svgEditor.uploadSVG
  136. submit();
  137. });
  138. }
  139. }
  140. // Create the input elements
  141. rebuildInput(open_svg_form);
  142. rebuildInput(import_svg_form);
  143. rebuildInput(import_img_form);
  144. // Add forms to buttons
  145. $("#tool_open").show().prepend(open_svg_form);
  146. $("#tool_import").show().prepend(import_svg_form);
  147. $("#tool_image").prepend(import_img_form);
  148. }
  149. });