diff --git a/static/img_preview.js b/static/img_preview.js
deleted file mode 100644
index d362f7d..0000000
--- a/static/img_preview.js
+++ /dev/null
@@ -1,11 +0,0 @@
-function setOnchange() {
-    let imgPreview = document.getElementById('img-preview');
-    let imgUpload = document.getElementById('img-upload');
-    imgUpload.onchange = event => {
-        const [file] = imgUpload.files;
-        if (file) {
-            console.log(file)
-            imgPreview.src = URL.createObjectURL(file);
-        }
-    };
-}
\ No newline at end of file
diff --git a/static/js/csv_download.js b/static/js/csv_download.js
new file mode 100644
index 0000000..d8fa934
--- /dev/null
+++ b/static/js/csv_download.js
@@ -0,0 +1,3 @@
+function saveCsv(csvString) {
+
+}
diff --git a/static/js/img_preview.js b/static/js/img_preview.js
new file mode 100644
index 0000000..e622cb9
--- /dev/null
+++ b/static/js/img_preview.js
@@ -0,0 +1,9 @@
+let imgPreview = document.getElementById('img-preview');
+let imgUpload = document.getElementById('img-upload');
+imgUpload.onchange = event => {
+    const [file] = imgUpload.files;
+    if (file) {
+        console.log(file)
+        imgPreview.src = URL.createObjectURL(file);
+    }
+};
diff --git a/templates/base.html b/templates/base.html
index 24a1a0b..8e8310b 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -2,6 +2,8 @@
 <head>
     <title>Pyrometry Application</title>
     <link rel="stylesheet" href="{{ url_for('static', filename='app.css') }}">
+    {% block head %}
+    {% endblock %}
 </head>
 <body>
     <div class="navbar">
diff --git a/templates/index.html b/templates/index.html
index 9bc4396..705d89a 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,4 +1,8 @@
 {% extends "base.html" %}
+
+{% block head %}
+{% endblock %}
+
 {% block content %} 
 <form action="/ratio_pyro" method="POST" enctype="multipart/form-data">
     <h2>Ratio Pyrometry Interface</h2>
@@ -58,17 +62,7 @@
     <input type="submit" value="Generate Heatmap"/>
 </form>
 
-<!-- <script src="/img_preview.js" onload="setOnChange()"></script> -->
-<script>
-    let imgPreview = document.getElementById('img-preview');
-    let imgUpload = document.getElementById('img-upload');
-    imgUpload.onchange = event => {
-        const [file] = imgUpload.files;
-        if (file) {
-            console.log(file)
-            imgPreview.src = URL.createObjectURL(file);
-        }
-    };
-</script>
+<!-- Image Preview -->
+<script src="/s/js/img_preview.js"></script>
 
 {% endblock %} 
diff --git a/templates/projected-area.html b/templates/projected-area.html
index 460086d..e2971ba 100644
--- a/templates/projected-area.html
+++ b/templates/projected-area.html
@@ -14,26 +14,25 @@
     <label for="area_threshold">Area threshold (to remove dust particles) in px</label>
     <input type="number" name="area_threshold" value="250"/>
     <br>
+    <br>
 
     <label for="min_display_threshold">Minimum display threshold (in px)</label>
     <input type="number" name="min_display_threshold" value="300"/>
     <br>
+    <br>
+
+    <label for="min_display_threshold">Page size</label>
+    <input type="number" name="paper_width" value="8.5"/>
+    X
+    <input type="number" name="paper_height" value="11"/> inches
+    <br>
+    <br>
 
     <br>
     <input type="submit" value="Generate Projected Sizes"/>
 </form>
 
-<!-- <script src="/img_preview.js" onload="setOnChange()"></script> -->
-<script>
-    let imgPreview = document.getElementById('img-preview');
-    let imgUpload = document.getElementById('img-upload');
-    imgUpload.onchange = event => {
-        const [file] = imgUpload.files;
-        if (file) {
-            console.log(file)
-            imgPreview.src = URL.createObjectURL(file);
-        }
-    };
-</script>
+<!-- Image Preview -->
+<script src="/s/js/img_preview.js"></script>
 
 {% endblock %}
\ No newline at end of file
