From d9b8ea5b09e52f171d47098eee2273f9df7136bc Mon Sep 17 00:00:00 2001
From: Michael Bumann <hello@michaelbumann.com>
Date: Sun, 26 Apr 2020 19:14:47 +0200
Subject: [PATCH] Form blank state

---
 app/views/forms/_form_example.html.erb    |  4 +-
 app/views/forms/_form_example_js.html.erb |  2 +-
 app/views/forms/show.html.erb             | 70 +++++++++++++++++------
 3 files changed, 54 insertions(+), 22 deletions(-)

diff --git a/app/views/forms/_form_example.html.erb b/app/views/forms/_form_example.html.erb
index 58844d6..fed070c 100644
--- a/app/views/forms/_form_example.html.erb
+++ b/app/views/forms/_form_example.html.erb
@@ -6,6 +6,6 @@
       <%= text_field_tag header %>
     </p>
   <% end %>
-    ...
-  <%= submit_tag 'Submit' %>
+  ...
+  <input type="submit" value="Submit">
 </form>
diff --git a/app/views/forms/_form_example_js.html.erb b/app/views/forms/_form_example_js.html.erb
index 6ef5a7d..15311f0 100644
--- a/app/views/forms/_form_example_js.html.erb
+++ b/app/views/forms/_form_example_js.html.erb
@@ -7,5 +7,5 @@
     </p>
   <% end %>
     ...
-  <%= submit_tag 'Submit' %>
+  <input type="submit" value="Submit">
 </form>
diff --git a/app/views/forms/show.html.erb b/app/views/forms/show.html.erb
index c5abbcb..1f2270d 100644
--- a/app/views/forms/show.html.erb
+++ b/app/views/forms/show.html.erb
@@ -18,24 +18,56 @@
     <%= @form.title %>
   </h1>
 
-  <div class="box table-wrapper is-clearfix" style="clear:both">
-    <table class="submission-table table is-fullwidth is-striped is-hoverable">
-      <thead>
-        <tr>
-          <% @form.spreadsheet_headers.each do |value| %>
-          <th><%= value %></th>
+
+  <% if @form.submissions.empty? %>
+
+    <div class="columns is-centered">
+      <div class="column is-two-thirds">
+
+        <h3 class="title">Setup your online form:</h3>
+        <p>
+          Your form submission URL: <code><%= submission_url(@form) %></code>
+        </p>
+        <p>
+          Set the <code>action</code> of your online form to this URL and make sure your fields have proper <code>name</code> attributes.
+        </p>
+        <h4 class="subtitle" style="margin-top:1em">Example:</h4>
+        <pre><code class="html">
+<%= html_escape_once render('form_example', form: @form) %>
+        </code></pre>
+        <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.0.0/build/styles/default.min.css">
+        <script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.0.0/build/highlight.min.js"></script>
+
+        <p>
+          Let us know if you need <%= link_to 'help', help_url %> - we also build the form for you!
+        </p>
+
+      </div>
+    </div>
+
+  <% else %>
+
+    <div class="box table-wrapper is-clearfix" style="clear:both">
+      <table class="submission-table table is-fullwidth is-striped is-hoverable">
+        <thead>
+          <tr>
+            <% @form.spreadsheet_headers.each do |value| %>
+            <th><%= value %></th>
+            <% end %>
+          </tr>
+        </thead>
+        <tbody>
+          <% @submissions.each do |submission| %>
+          <tr>
+            <% @form.spreadsheet_headers.each do |column| %>
+            <td><%= submission.data[column] %></td>
+            <% end %>
+          </tr>
           <% end %>
-        </tr>
-      </thead>
-      <tbody>
-        <% @submissions.each do |submission| %>
-        <tr>
-          <% @form.spreadsheet_headers.each do |column| %>
-          <td><%= submission.data[column] %></td>
-          <% end %>
-        </tr>
-        <% end %>
-      </tbody>
-    </table>
-  </div>
+        </tbody>
+      </table>
+    </div>
+
+  <% end %>
+
 </div>