From bb53153d3b103596c6ea74c1aeff9c77ac25baf3 Mon Sep 17 00:00:00 2001
From: jos <wjosdejong@gmail.com>
Date: Mon, 21 Jul 2014 21:04:11 +0200
Subject: [PATCH] Added an example showing how to load/save local files

---
 examples/04_load_and_save.html | 61 ++++++++++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 examples/04_load_and_save.html
diff --git a/examples/04_load_and_save.html b/examples/04_load_and_save.html
new file mode 100644
index 0000000..847174c
--- /dev/null
+++ b/examples/04_load_and_save.html
@@ -0,0 +1,61 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <title>JSONEditor | Load and save</title>
+  <link rel="stylesheet" type="text/css" href="../jsoneditor.css">
+  <script src="../jsoneditor.js"></script>
+
+  <script src="http://bgrins.github.io/filereader.js/filereader.js"></script>
+  <script src="http://eligrey.com/demos/FileSaver.js/FileSaver.js"></script>
+
+  <style>
+    html, body {
+      font: 11pt sans-serif;
+    }
+    #jsoneditor {
+      width: 500px;
+      height: 500px;
+    }
+  </style>
+</head>
+<body>
+<h1>Load and save JSON documents</h1>
+<p>
+  This examples uses HTML5 to load/save local files.
+  Powered by <a href="http://bgrins.github.io/filereader.js/">FileReader.js</a> and
+  <a href="https://github.com/eligrey/FileSaver.js">FileSaver.js</a>.<br>
+  Only supported on modern browsers (Chrome, FireFox, IE10+, Safari 6.1+, Opera 15+).
+</p>
+<p>
+  Load a JSON document: <input type="file" id="loadDocument" value="Load"/>
+</p>
+<p>
+  Save a JSON document: <input type="button" id="saveDocument" value="Save" />
+</p>
+
+<div id="jsoneditor"></div>
+
+<script type="text/javascript" >
+  // create the editor
+  var editor = new JSONEditor(document.getElementById('jsoneditor'));
+
+  // Load a JSON document
+  FileReaderJS.setupInput(document.getElementById('loadDocument'), {
+    readAsDefault: 'Text',
+    on: {
+      load: function (event, file) {
+        editor.setText(event.target.result);
+      }
+    }
+  });
+
+  // Save a JSON document
+  document.getElementById('saveDocument').onclick = function () {
+    var blob = new Blob([editor.getText()], {type: 'application/json;charset=utf-8'});
+    saveAs(blob, 'document.json');
+  };
+</script>
+</body>
+</html>
+
+
