Revert "Adds JavaScript example"

This reverts commit 384261c.
jgraph · Jan 28, 2020 · e2a7f9d · e2a7f9d
1 parent 384261c
commit e2a7f9d
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 422 deletions.
diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
-# Draw.io Integration
+# Draw.io HTML5 Integration
 
 Integration, or "embed mode" is used for cases where the storage of the diagram is taken care of by a host application,
 and draw.io is used for diagram editing. In this case, draw.io is used inside an iframe or window with special URL
@@ -16,7 +16,7 @@ Depending on the requirements, a PNG or SVG image or the XML for the diagram can
 - Images (PNG and SVG) should be used for fast loading with no initial delay. Embedding the diagram data for editing in PNG and SVG images can be used to avoid saving the image and diagram separately, but will result in bigger image files. When using a viewer or editor, images should be used to show a placeholder or preview.
 - SVG images should be used if hyperlinks and vector images are required. (The SVG output of draw.io uses foreign objects, which are not
 supported in IE11 and earlier. To fully support IE11 in SVG output, certain application features must be disabled, which is not recommended.)
-- XML should be used if no image version of the diagram is required or to store the XML separately from the image. A viewer or editor is required
+- XML should be used if no image version of the diagram is required or to store the XML separately from the image. A viewer or editor is required 
 to handle these files.
 - PNG images should be used if a bitmap image is required, to support IE11 and earlier or for special fonts.
 
@@ -34,9 +34,12 @@ Fonts, colors, default styles, libraries, CSS and more can be configured to matc
 
 The following examples are available:
 
-* <a href="http://jgraph.github.io/drawio-html5/javascript-api.html" target="_blank">JavaScript API</a> for editing embedded SVG and PNG images in a HTML page
 * <a href="http://jgraph.github.io/drawio-html5/localstorage.html#default" target="_blank">Using Local Storage</a> Saving and loading a draw.io diagram to/from HTML5 local storage (use the part of the hash-tag to change the local storage key)
 * <a href="http://jgraph.github.io/drawio-html5/localstorage-svg.html#default" target="_blank">Using Local Storage (SVG)</a> Saving and loading a draw.io diagram to/from HTML5 local storage as SVG (use the part of the hash-tag to change the local storage key). This example uses an SVG element instead of an image to support hyperlinks. Keep in mind that draw.io uses foreignObjects for text labels in static SVG output. ForeignObjects are not supported in IE11 and earlier. (For draft states, a special dialog is now available.)
 * <a href="http://jgraph.github.io/drawio-html5/localfile.html" target="_blank">Using Local File</a> Saving and loading to/from a self-modifying local file
-* <a href="https://github.com/jgraph/drawio-html5/webdav" target="_blank">Using embed mode with WebDav</a>
-* <a href="https://github.com/jgraph/drawio-github" target="_blank">Using embed mode with GitHub</a>
+* <a href="http://jgraph.github.io/drawio-html5/collapsed.html" target="_blank">Embedded diagram in hidden container</a> Test case for hidden containers
+
+Additional examples are available in the following repositories:
+
+* <a href="https://github.com/jgraph/drawio-webdav">Using embed mode with WebDav</a>
+* <a href="https://github.com/jgraph/drawio-github">Using embed mode with GitHub</a>
diff --git a/collapsed.html b/collapsed.html
@@ -0,0 +1,11 @@
+<html>
+<body>
+<div style="display:none;" id="section">
+<div class="mxgraph" style="position:relative; overflow:auto; width:99%; background-color:#ffffff;">
+<div style="width:1px; height:1px; overflow:hidden;">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</div>
+</div>
+</div>
+<button onclick="document.getElementById('section').style.display = 'block';">Expand</button>
+<script type="text/javascript" src="https://www.draw.io/embed.js"></script>
+</body>
+</html>