diff --git a/package.json b/package.json
index c76784a..ca08ac8 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "create-build-dirs": "mkdir -p www/js www/css www/img",
     "test": "npm run lint",
     "build": "npm run create-build-dirs && npm run build-fonts && npm run build-images && npm run build-html && npm run build-js && npm run build-less",
-    "build-html": "cp src/index.html www/",
+    "build-html": "cp src/*.html www/",
     "build-fonts": "cp -R node_modules/bootstrap/dist/fonts www && cp -R node_modules/ionicons/fonts www ",
     "build-less": "lessc --silent src/less/style.less www/css/style.css && cleancss -d --s0 -o www/css/style.css www/css/style.css",
     "build-js": "./scripts/build-js.sh",
diff --git a/src/index.html b/src/index.html
index 913627a..4fa68da 100644
--- a/src/index.html
+++ b/src/index.html
@@ -19,6 +19,7 @@
     </div>
     <footer>
       <a class="btn btn-success btn-lg animated pulse infinite">Open Document / Images</a>
+      <input type="file" style="display: none" />
     </footer>
     <script type="text/javascript" src="cordova.js"></script>
     <script type="text/javascript" src="js/libs.js"></script>
diff --git a/src/js/app.js b/src/js/app.js
index a2c66c9..ac1ee40 100644
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -17,3 +17,14 @@ document.addEventListener("deviceready", function () {
   var watchID = navigator.compass.watchHeading(onSuccess, onError, options);
 
 }, false);
+
+$('footer .btn').click(function(e) {
+  $('footer input').trigger('click');
+});
+
+$('footer input').on('change', function () {
+  const file = $(this)[0].files[0];
+  let reader = new FileReader();
+  reader.onload = function(e) { $('#compass').attr('src', e.target.result); };
+  reader.readAsDataURL(file);
+});