simplify UX

when you submit the form you download the json file instructions are simplified
HorizonsRC · Feb 4, 2018 · 436f77a · 436f77a
1 parent 7ba804d
commit 436f77a
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 28 deletions.
diff --git a/static/index.html b/static/index.html
@@ -6,43 +6,25 @@
   </head>
   <body>
 
-    <div class="ui text container">
-      <div class="ui segment">
-      <h1 class='ui dividing header'>Data.govt.nz Dcat Generator</h1>
-      <a href='https://github.com/data-govt-nz/schema' rel='nofollow'>
-        Clone me on github ond run me anywhere
-      </a>
-      <p>
-          Part of moving to the CKAN data portal is improving our adaoption of international standards that aid in interoperability. One of these is the data.json standard that was put together as part of the US Project Open Data initiaive and has since been adopted by many other countries as a consistent way to express stocktakes of open data at an agency level.
-      </p>
-      <p>The idea here is to replace the current and dated ATOM/RSS feed standard which is no longer fit for purpose.</p>
-      <p>The data.json schema:</p>
-      <ul>
-        <li>is able to represent individual file level resources for example you might have a csv, kml, shp file of the same data set.</li>
-        <li>is an international standard used by many other government data portals.</li>
-        <li>allows for easy automation of harvesting into the the new CKAN data portal.</li>
-      </ul>
-      </div>
-    </div>
-
     <div class="ui text container csv-upload-form">
       <div class="ui segment">
-        <h1 class='ui dividing header'>Convert your csv to DCAT</h1>
-        <p>Upload a csv and the url where you will be hosting the created json file</p>
-        <p><a href="/example.csv">Download the example csv content here</a></p>
+        <h1 class='ui dividing header'>Convert CSV to DCAT json</h1>
+        <ol class="ui list">
+          <li>Find the data sources in your organization</li>
+          <li>Download the <a href="/example.csv">example CSV</a> and update it with your information</li>
+          <li>Upload your csv and convert it into a data.json dataset file</li>
+        </ol>
+        </p>
         <form class='ui form' method="post" action="/submit" enctype="multipart/form-data">
           <div class="field">
-            <label>Source URL
+            <div class="ui pointing below basic red label">Enter the base url of your data.json host</div>
             <input required type="text" name='source_url' placeholder='<yoursite>/data.json'/>
-            </label>
           </div>
           <div class="field">
-            <label>
-              Source CSV
               <input required type="file" name="csv_file" id="">
-            </label>
+              <div class="ui pointing basic red label">Upload the csv with your dataset information</div>
           </div>
-          <button class='ui button primary' type="submit">Create a dcat API endpoint</button>
+          <button class='ui button green' type="submit">Download your data.json</button>
         </form>
       </div>
     </div>

diff --git a/web.js b/web.js
@@ -67,6 +67,8 @@ app.get('/api/:id/data.json', (req, res) => {
     return
   }
   res.header('Content-Type', 'application/json')
+  res.header(`Content-Disposition`, `attachment; filename="data.json"`)
+  res.header('Content-Transfer-Encoding', 'binary')
   res.status(200);
   res.send(GLOBAL_DATA[req.params.id].dcat)
 })