Découvrez les nouveautés de cette version : Fonctionnalités, améliorations et évolutions vous attendent ! 👉 Cliquez ici pour en savoir plus

Modifications pour le document DiagramEditSheet

Modifié par Admin le 19/03/2025 - 19:24

Depuis la version 5.1
modifié par Admin
sur 24/06/2024 - 15:24
Commentaire de modification : Install extension [com.xwiki.diagram:application-diagram/1.20.4]
À la version 4.1
modifié par Admin
sur 24/06/2024 - 14:19
Commentaire de modification : Install extension [com.xwiki.diagram:application-diagram/1.20.5]

Résumé

Détails

XWiki.JavaScriptExtension[1]
Code
... ... @@ -32,17 +32,13 @@
32 32   },
33 33   setData: function(data) {
34 34   this.input.val(data);
35 - let pages = this.ui.getPagesForXml(data);
36 - if (pages.length > 0) {
37 - this.ui.pages = this.ui.getPagesForXml(data);
38 - }
39 39   },
36 + isCompressed: function() {
37 + return false;
38 + },
40 40   open: function() {
41 41   var graphXML = this.getData() || '<mxGraphModel/>';
42 - var graphNode = mxUtils.parseXml(graphXML).documentElement;
43 - graphNode.fromStorage = true;
44 - this.ui.editor.setGraphXml(graphNode);
45 - this.ui.currentPage = this.ui.pages[0];
41 + this.ui.setFileData(graphXML);
46 46   this.changeListener = mxUtils.bind(this, function(sender, eventObject) {
47 47   this.setModified(true);
48 48   });
XWiki.JavaScriptExtension[2]
Code
... ... @@ -673,6 +673,325 @@
673 673   return converter;
674 674   };
675 675  
676 + // Copied from the drawio version 24.5.4 to include a fix for importing a file in an empty diagram. This method should
677 + // be removed once we upgrade to a drawio version >= 24.4.0. Being a big method, the structure was altered just to
678 + // make it shorter.
679 + var importFilesNew = function(files, x, y, maxSize, fn, resultFn, filterFn, barrierFn,
680 + resizeDialog, maxBytes, resampleThreshold, ignoreEmbeddedXml, evt) {
681 + maxSize = (maxSize != null) ? maxSize : this.maxImageSize;
682 + maxBytes = (maxBytes != null) ? maxBytes : this.maxImageBytes;
683 + var crop = x != null && y != null;
684 + var resizeImages = true;
685 + x = (x != null) ? x : 0;
686 + y = (y != null) ? y : 0;
687 + // Checks if large images are imported
688 + var largeImages = false;
689 + if (!mxClient.IS_CHROMEAPP && files != null) {
690 + var thresh = resampleThreshold || this.resampleThreshold;
691 + for (var i = 0; i < files.length; i++) {
692 + if (files[i].type.substring(0, 9) !== 'image/svg' &&
693 + files[i].type.substring(0, 6) === 'image/' &&
694 + files[i].size > thresh) {
695 + largeImages = true;
696 + break;
697 + }
698 + }
699 + }
700 +
701 + var doImportFiles = mxUtils.bind(this, function() {
702 + var graph = this.editor.graph;
703 + var gs = graph.gridSize;
704 +
705 + fn = (fn != null) ? fn : mxUtils.bind(this, function(data, mimeType, x, y, w, h, filename, done, file) {
706 + try {
707 + if (data != null && data.substring(0, 10) == '<mxlibrary') {
708 + this.spinner.stop();
709 + this.loadLibrary(new LocalLibrary(this, data, filename));
710 + this.showSidebar();
711 +
712 + return null;
713 + }
714 + else {
715 + // Drop on empty file ignores drop location
716 + if (this.isCompatibleString(data) && files.length == 1 && evt != null &&
717 + evt.type == 'drop' && this.isBlankFile() && !this.canUndo()) {
718 + crop = false;
719 + x = 0;
720 + y = 0;
721 + }
722 + return this.importFile(data, mimeType, x, y, w, h, filename,
723 + done, file, crop, ignoreEmbeddedXml, evt);
724 + }
725 + }
726 + catch (e) {
727 + this.handleError(e);
728 + return null;
729 + }
730 + });
731 +
732 + resultFn = (resultFn != null) ? resultFn : mxUtils.bind(this, function(cells) {
733 + graph.setSelectionCells(cells);
734 + });
735 +
736 + if (this.spinner.spin(document.body, mxResources.get('loading'))) {
737 + var count = files.length;
738 + var remain = count;
739 + var queue = [];
740 +
741 + // Barrier waits for all files to be loaded asynchronously
742 + var barrier = mxUtils.bind(this, function(index, fnc) {
743 + queue[index] = fnc;
744 + if (--remain == 0) {
745 + this.spinner.stop();
746 + if (barrierFn != null) {
747 + barrierFn(queue);
748 + }
749 + else {
750 + var cells = [];
751 + graph.getModel().beginUpdate();
752 + try {
753 + for (var j = 0; j < queue.length; j++) {
754 + var tmp = queue[j]();
755 + if (tmp != null) {
756 + cells = cells.concat(tmp);
757 + }
758 + }
759 + }
760 + finally {
761 + graph.getModel().endUpdate();
762 + }
763 + }
764 + resultFn(cells);
765 + }
766 + });
767 +
768 + for (var i = 0; i < count; i++) {
769 + (mxUtils.bind(this, function(index) {
770 + var file = files[index];
771 + if (file != null) {
772 + var reader = new FileReader();
773 + reader.onload = mxUtils.bind(this, function(e) {
774 + if (filterFn == null || filterFn(file)) {
775 + try {
776 + if (file.type.substring(0, 6) == 'image/') {
777 + if (file.type.substring(0, 9) == 'image/svg') {
778 + // Checks if SVG contains content attribute
779 + var data = Graph.clipSvgDataUri(e.target.result);
780 + var comma = data.indexOf(',');
781 + var svgText = decodeURIComponent(escape(atob(data.substring(comma + 1))));
782 + var root = mxUtils.parseXml(svgText);
783 + var svgs = root.getElementsByTagName('svg');
784 + if (svgs.length > 0) {
785 + var svgRoot = svgs[0];
786 + var cont = (ignoreEmbeddedXml) ? null : svgRoot.getAttribute('content');
787 + if (cont != null && cont.charAt(0) != '<' && cont.charAt(0) != '%') {
788 + cont = unescape((window.atob) ? atob(cont) : Base64.decode(cont, true));
789 + }
790 + if (cont != null && cont.charAt(0) == '%') {
791 + cont = decodeURIComponent(cont);
792 + }
793 + if (cont != null && (cont.substring(0, 8) === '<mxfile ' ||
794 + cont.substring(0, 14) === '<mxGraphModel ')) {
795 + barrier(index, mxUtils.bind(this, function() {
796 + return fn(cont, 'text/xml', x + index * gs, y + index * gs, 0, 0, file.name);
797 + }));
798 + }
799 + else {
800 + // SVG needs special handling to add viewbox if missing and
801 + // find initial size from SVG attributes (only for IE11)
802 + barrier(index, mxUtils.bind(this, function() {
803 + try {
804 + // Parses SVG and find width and height
805 + if (root != null) {
806 + var svgs = root.getElementsByTagName('svg');
807 + if (svgs.length > 0) {
808 + var svgRoot = svgs[0];
809 + var w = svgRoot.getAttribute('width');
810 + var h = svgRoot.getAttribute('height');
811 + if (w != null && w.charAt(w.length - 1) != '%') {
812 + w = parseFloat(w);
813 + }
814 + else {
815 + w = NaN;
816 + }
817 + if (h != null && h.charAt(h.length - 1) != '%') {
818 + h = parseFloat(h);
819 + }
820 + else {
821 + h = NaN;
822 + }
823 + // Check if viewBox attribute already exists
824 + var vb = svgRoot.getAttribute('viewBox');
825 + if (vb == null || vb.length == 0) {
826 + svgRoot.setAttribute('viewBox', '0 0 ' + w + ' ' + h);
827 + }
828 + // Uses width and height from viewbox for
829 + // missing width and height attributes
830 + else if (isNaN(w) || isNaN(h)) {
831 + var tokens = vb.split(' ');
832 + if (tokens.length > 3) {
833 + w = parseFloat(tokens[2]);
834 + h = parseFloat(tokens[3]);
835 + }
836 + }
837 + data = Editor.createSvgDataUri(mxUtils.getXml(svgRoot));
838 + var s = Math.min(1, Math.min(maxSize / Math.max(1, w)), maxSize / Math.max(1, h));
839 + var cells = fn(data, file.type, x + index * gs, y + index * gs, Math.max(
840 + 1, Math.round(w * s)), Math.max(1, Math.round(h * s)), file.name);
841 + // Hack to fix width and height asynchronously
842 + if (cells != null && (isNaN(w) || isNaN(h))) {
843 + var img = new Image();
844 + img.onload = mxUtils.bind(this, function() {
845 + w = Math.max(1, img.width);
846 + h = Math.max(1, img.height);
847 + cells[0].geometry.width = w;
848 + cells[0].geometry.height = h;
849 + svgRoot.setAttribute('viewBox', '0 0 ' + w + ' ' + h);
850 + data = Editor.createSvgDataUri(mxUtils.getXml(svgRoot));
851 + var semi = data.indexOf(';');
852 + if (semi > 0) {
853 + data = data.substring(0, semi) + data.substring(data.indexOf(',', semi + 1));
854 + }
855 + graph.setCellStyles('image', data, [cells[0]]);
856 + });
857 + img.src = Editor.createSvgDataUri(mxUtils.getXml(svgRoot));
858 + }
859 + return cells;
860 + }
861 + }
862 + }
863 + catch (e) {
864 + // ignores any SVG parsing errors
865 + }
866 + return null;
867 + }));
868 + }
869 + }
870 + else {
871 + barrier(index, mxUtils.bind(this, function() {
872 + return null;
873 + }));
874 + }
875 + }
876 + else {
877 + // Checks if PNG+XML is available to bypass code below
878 + var containsModel = false;
879 + if (file.type == 'image/png') {
880 + var xml = (ignoreEmbeddedXml) ? null : this.extractGraphModelFromPng(e.target.result);
881 + if (xml != null && xml.length > 0) {
882 + var img = new Image();
883 + img.src = e.target.result;
884 + barrier(index, mxUtils.bind(this, function() {
885 + return fn(xml, 'text/xml', x + index * gs, y + index * gs,
886 + img.width, img.height, file.name);
887 + }));
888 + containsModel = true;
889 + }
890 + }
891 + // Additional asynchronous step for finding image size
892 + if (!containsModel) {
893 + // Cannot load local files in Chrome App
894 + if (mxClient.IS_CHROMEAPP) {
895 + this.spinner.stop();
896 + this.showError(mxResources.get('error'), mxResources.get('dragAndDropNotSupported'),
897 + mxResources.get('cancel'), mxUtils.bind(this, function()
898 + {
899 + // Hides the dialog
900 + }), null, mxResources.get('ok'), mxUtils.bind(this, function()
901 + {
902 + // Redirects to import function
903 + this.actions.get('import').funct();
904 + })
905 + );
906 + }
907 + else {
908 + this.loadImage(e.target.result, mxUtils.bind(this, function(img) {
909 + this.resizeImage(img, e.target.result, mxUtils.bind(this, function(data2, w2, h2) {
910 + barrier(index, mxUtils.bind(this, function() {
911 + // Refuses to insert images above a certain size as they kill the app
912 + if (data2 != null && data2.length < maxBytes) {
913 + var s = (!resizeImages || !this.isResampleImageSize(
914 + file.size, resampleThreshold)) ? 1 :
915 + Math.min(1, Math.min(maxSize / w2, maxSize / h2));
916 + return fn(data2, file.type, x + index * gs, y + index * gs,
917 + Math.round(w2 * s), Math.round(h2 * s), file.name);
918 + }
919 + else {
920 + this.handleError({message: mxResources.get('imageTooBig')});
921 + return null;
922 + }
923 + }));
924 + }), resizeImages, maxSize, resampleThreshold, file.size);
925 + }), mxUtils.bind(this, function() {
926 + this.handleError({message: mxResources.get('invalidOrMissingFile')});
927 + }));
928 + }
929 + }
930 + }
931 + }
932 + else {
933 + var data = e.target.result;
934 + fn(data, file.type, x + index * gs, y + index * gs, 240, 160, file.name, function(cells) {
935 + barrier(index, function() {
936 + return cells;
937 + });
938 + }, file);
939 + }
940 + }
941 + catch (e) {
942 + // Ignores file parsing error
943 + barrier(index, mxUtils.bind(this, function() {
944 + return null;
945 + }));
946 + if (window.console != null) {
947 + console.error(e, file);
948 + }
949 + }
950 + }
951 + else {
952 + // Ignores file and decrements counter
953 + barrier(index, mxUtils.bind(this, function()
954 + {
955 + return null;
956 + }));
957 + }
958 + });
959 + // Handles special cases
960 + if (/(\.v(dx|sdx?))($|\?)/i.test(file.name) || /(\.vs(x|sx?))($|\?)/i.test(file.name)) {
961 + fn(null, file.type, x + index * gs, y + index * gs, 240, 160, file.name, function(cells) {
962 + barrier(index, function() {
963 + return cells;
964 + });
965 + }, file);
966 + }
967 + else if (file.type.substring(0, 5) == 'image' || file.type == 'application/pdf') {
968 + reader.readAsDataURL(file);
969 + }
970 + else {
971 + reader.readAsText(file);
972 + }
973 + }
974 + }))(i);
975 + }
976 + }
977 + });
978 + if (largeImages) {
979 + // Workaround for lost files array in async code
980 + var tmp = [];
981 + for (var i = 0; i < files.length; i++) {
982 + tmp.push(files[i]);
983 + }
984 + files = tmp;
985 + this.confirmImageResize(function(doResize) {
986 + resizeImages = doResize;
987 + doImportFiles();
988 + }, resizeDialog);
989 + }
990 + else {
991 + doImportFiles();
992 + }
993 + };
994 +
676 676   // Override for uploading the image as attachment instead of encode it to Base64.
677 677   var originalImportFiles = EditorUi.prototype.importFiles;
678 678   EditorUi.prototype.importFiles = function(files, x, y, maxSize, fn, resultFn, filterFn, barrierFn, resizeDialog,
... ... @@ -702,7 +702,7 @@
702 702   }
703 703   };
704 704   }
705 - originalImportFiles.apply(this, importFilesArgs);
1024 + importFilesNew.apply(this, importFilesArgs);
706 706   };
707 707  
708 708   // Add support for inserting images by specifying the XWiki attachment reference.