bumi/tinyforms
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'New-forms-page' of https://github.com/bumi/tinyforms into New-forms-page

Browse Source
This commit is contained in:
karemarsy
2020-04-14 11:31:45 +02:00
parent f8dd4a777e b978d7d197
commit cd5483a9b6
35 changed files with 1073 additions and 182 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/views/forms/index.html.erb
View File

@@ -25,7 +25,7 @@
</div>
<div class="media-right has-text-right is-size-4">
<figure class="image is-48x48 ">
<%= link_to form.google_spreadsheet_url, {class: "has-text-success", target: "__blank"} do %>
<%= link_to form.spreadsheet_url, {class: "has-text-success", target: "__blank"} do %>
<i class="far fa-file-excel"></i>
<% end %>
</figure>

6
app/views/forms/show.html.erb
View File

@@ -3,12 +3,12 @@
<%= submission_url(@form) %>
</p>
<p>
<%= link_to 'Google spreadsheet', @form.google_spreadsheet_url %>
<%= link_to 'Google spreadsheet', @form.spreadsheet_url %>
</p>
<table>
<thead>
<tr>
<% @form.header_values.each do |value| %>
<% @form.spreadsheet_headers.each do |value| %>
<th><%= value %></th>
<% end %>
</tr>
@@ -16,7 +16,7 @@
<tbody>
<% @submissions.each do |submission| %>
<tr>
<% @form.header_values.each do |column| %>
<% @form.spreadsheet_headers.each do |column| %>
<td><%= submission.data[column] %></td>
<% end %>
</tr>

88
app/views/home/demo.html.erb Normal file
View File

@@ -0,0 +1,88 @@
<section class="section demo">
<div class="container content">
<div class="columns">
<div class="column is-one-third">
<form class="form demo-form" id="demo-form" action="<%= submission_url(DEMO_FORM) %>" method="POST" enctype="multipart/form-data" data-tinyforms="true">
<input type="hidden" name="ID" value="tinyforms_id">
<h3>Demo</h3>
<p>
This short form is connected to the embedded <%= link_to 'document', DEMO_FORM.spreadsheet_url %> on the right. <br>
Submit the form and see the update of the document in realtime.
</p>
<div id="demo-success" style="display:none;">
<p class="is-size-4 has-text-success">
<span id="demo-submission-name"></span>, thanks for your submission!
</p>
<p>See your entry in the spreadsheet?!</p>
<p>
<%= link_to "Create your form now!", signup_url, class: 'button' %>
<br>
or got <%= link_to 'further questions?', contact_url %>
</p>
</div>
<div id="demo-fields">
<div class="field">
<label class="label">What's your name?*</label>
<div class="control">
<input class="input" type="text" name="Name" required="true" placeholder="Your name">
</div>
</div>
<div class="field">
<label class="label">Where are you from?*</label>
<div class="control">
<div class="select">
<select name="Continent">
<option value="Africa">Africa</option>
<option value="Antartica">Antartica</option>
<option value="Asia">Asia</option>
<option value="Australia">Australia</option>
<option value="Europe">Europe</option>
<option value="North America">North America</option>
<option value="South America">South America</option>
<option value="Australia">Australia</option>
</select>
</div>
</div>
</div>
<div class="field">
<label class="label">Do you like Pizza with Pinapples?*</label>
<div class="control">
<label class="radio">
<input type="radio" name="Pinapples Pizza?" required value="yes">
Yes
</label>
<label class="radio">
<input type="radio" name="Pinapples Pizza?" required value="no">
Hell, no!
</label>
</div>
</div>
<div class="field">
<label class="label">What's your favorit cat picture?</label>
<div class="control">
<input class="input" type="file" name="Cat Picture">
</div>
</div>
<div class="field is-grouped">
<div class="control">
<button class="button is-link" id="demo-submit">Submit</button>
</div>
</div>
</div>
</form>
</div>
<div class="column">
<iframe id="demo-sheet" style="width:100%;height:100%;" src="https://docs.google.com/spreadsheets/d/<%= DEMO_FORM.google_spreadsheet_id %>/edit?usp=sharing&nocache=<%= Time.now.to_i %>#gid=0&range=<%= DEMO_FORM.submissions.count + 1 %>:<%= DEMO_FORM.submissions.count + 2 %>"></iframe>
<p class="has-text-grey has-text-centered">Document not loading? <%= link_to 'Open it here', DEMO_FORM.spreadsheet_url %>.</p>
</div>
</div>
</div>
</section>

29
app/views/layouts/_header.html.erb Normal file
View File

@@ -0,0 +1,29 @@
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="container">
<div class="navbar-brand">
<a class="navbar-item is-size-4 has-text-black has-text-weight-bold is-font-logo" href="/">
TinyForms
</a>
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
data-target="navbar-menu">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbar-menu" class="navbar-menu">
<div class="navbar-end">
<%= link_to 'Help', help_url, class: 'navbar-item' %>
<div class="navbar-item">
<% if !logged_in? -%>
<%= link_to "Login", login_url, { :class => "button is-primary"} %>
<% else -%>
<%= link_to "Logout", logout_url, { :class => "button is-light"} %>
<% end -%>
</div>
</div>
</div>
</div>
</nav>

47
app/views/layouts/application.html.erb
View File

@@ -11,49 +11,12 @@
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<!-- Wrapper -->
<div id="wrapper" class="has-text-centered-mobile">
<body class="has-text-centered-mobile">
<!-- Hero -->
<section class="hero is-medium is-light">
<div class="hero-head">
<div class="container">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item is-size-4 has-text-black has-text-weight-bold is-font-logo" href="/">
TinyForms
</a>
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
data-target="navbar">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbar" class="navbar-menu">
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
<% if !logged_in? -%>
<%= link_to "Login", login_url, { :class => "button is-primary"} %>
<% else -%>
<%= link_to "Logout", logout_url, { :class => "button is-light"} %>
<% end -%>
</div>
</div>
</div>
</div>
</nav>
</div>
</section>
<main>
<%= yield %>
</main>
</div>
<%= render 'layouts/header' %>
<main>
<%= yield %>
</main>
</body>
</html>

22
app/views/sessions/new.html.erb Normal file
View File

@@ -0,0 +1,22 @@
<div class="columns">
<div class="column">
</div>
<div class="column">
<div class="container has-text-centered">
<h1 class="title has-text-centered">
Login
</h1>
<%= link_to auth_at_provider_url(provider: 'google'), class: 'button google' do %>
<svg viewBox="0 0 15 15" class="googleLogo" style="width: 14px; height: 14px; display: block; fill: currentcolor; flex-shrink: 0; backface-visibility: hidden; margin-right: 6px;"><path d="M 7.28571 6.4125L 7.28571 9L 11.3929 9C 11.2143 10.0875 10.1429 12.225 7.28571 12.225C 4.78571 12.225 2.78571 10.0875 2.78571 7.5C 2.78571 4.9125 4.82143 2.775 7.28571 2.775C 8.71429 2.775 9.64286 3.4125 10.1786 3.9375L 12.1429 1.9875C 10.8929 0.75 9.25 0 7.28571 0C 3.25 0 0 3.3375 0 7.5C 0 11.6625 3.25 15 7.28571 15C 11.5 15 14.25 11.9625 14.25 7.6875C 14.25 7.2 14.2143 6.825 14.1429 6.45L 7.28571 6.45L 7.28571 6.4125Z"></path></svg>
Login with Google
<% end %>
<hr>
<p>
As tinyforms builds on Google Sheets.<br>
Simply login with your Google account.
</p>
</div>
</div>
<div class="column">
</div>
</div>