Merge branch 'master' into forms-show-page

This commit is contained in:
Yannick 2020-04-16 17:42:16 +02:00
commit f91730bcd6
12 changed files with 166 additions and 29 deletions

View File

@ -25,6 +25,19 @@ class FormsController < ApplicationController
end
end
def edit
@form = current_user.forms.find_by!(token: params[:id])
end
def update
@form = current_user.forms.find_by!(token: params[:id])
if @form.update(form_params)
redirect_to form_url(@form)
else
render :edit
end
end
def form
@form = Form.find_by!(token: params[:id])
end

View File

@ -3,4 +3,12 @@ class HomeController < ApplicationController
def index
redirect_to forms_url if logged_in?
end
def demo
if params[:backend] == 'airtable'
render 'demo-airtable'
else
render 'demo-google'
end
end
end

View File

@ -13,8 +13,13 @@ document.addEventListener("turbolinks:load", function () {
var name = document.getElementById('demo-submission-name');
var demoFields = document.getElementById('demo-fields');
var demoSucess = document.getElementById('demo-success');
var demoIframe = document.getElementById('demo-sheet');
demoFields.style.display = 'none';
demoSucess.style.display = 'block';
name.innerText = e.detail.submission.Name;
// The airtable sheet must be reloaded for the submission to get visible
if (demoIframe.dataset.refresh) {
demoIframe.src = demoIframe.src + '&c=' + new Date().getTime();
}
});
});

View File

@ -37,7 +37,7 @@ class Submission < ApplicationRecord
attachment = ActiveStorage::Attachment.new(record: self, name: 'files', blob: create_one.blob)
attachment.save
# return the URL that we use to show in the Spreadsheet
Rails.application.routes.url_helpers.file_upload_url(form_id: form, submission_id: self, id: attachment.token, host: DEFAULT_HOST)
Rails.application.routes.url_helpers.file_upload_url(form_id: form, submission_id: self, id: attachment.token, host: DEFAULT_HOST, filename: attachment.blob.filename)
else
value.to_s
end

View File

@ -0,0 +1,15 @@
<%= form_for form, local: true do |f| %>
<div class="field">
<div class="control">
<%= f.text_field :title, class: 'input', placeholder: 'Title' %>
</div>
</div>
<div class="field">
<div class="control">
<%= f.text_field :thank_you_url, class: 'input', placeholder: 'Thank you url' %>
</div>
</div>
<div>
<%= f.submit class: 'button is-primary' %>
</div>
<% end %>

View File

@ -0,0 +1,14 @@
<div class="section">
<div class=" columns ">
<div class="column is-half is-offset-one-quarter">
<div class="box">
<div class="content has-text-centered">
<h1 class="has-text-weight-light">Update <%= @form.title %></h1>
<%= render 'form', form: @form %>
</div>
</div>
</div>
</div>
</div>

View File

@ -4,21 +4,9 @@
<div class="box">
<div class="content has-text-centered">
<h1 class="has-text-weight-light">Create a new form</h1>
<%= form_for @form do |f| %>
<div class="field">
<div class="control">
<%= f.text_field :title, class: 'input', placeholder: 'Title' %>
</div>
</div>
<div class="field">
<div class="control">
<%= f.text_field :thank_you_url, class: 'input', placeholder: 'Thank you url' %>
</div>
</div><br>
<div>
<%= f.submit class: 'button is-primary' %>
<% end %>
</divdiv>
<%= render 'form', form: @form %>
</div>
</div>
</div>

View File

@ -0,0 +1,87 @@
<section class="section demo">
<div class="container">
<div class="columns">
<div class="column is-one-third">
<form class="form demo-form" id="demo-form" action="<%= submission_url(AIRTABLE_DEMO_FORM) %>" method="POST" enctype="multipart/form-data" data-tinyforms="true">
<input type="hidden" name="ID" value="tinyforms_id">
<h3 class="title">Demo</h3>
<p>
This short form is connected to the embedded <%= link_to 'document', AIRTABLE_DEMO_EMBED_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 Pineapples?*</label>
<div class="control">
<label class="radio">
<input type="radio" name="Pineapple Pizza?" required value="yes">
Yes
</label>
<label class="radio">
<input type="radio" name="Pineapple Pizza?" required value="no">
Hell, no!
</label>
</div>
</div>
<div class="field">
<label class="label">What's your favorite 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" data-refresh="true" style="width:100%;height:100%;" src="<%= AIRTABLE_DEMO_EMBED_URL %>" frameborder="0" onmousewheel=""></iframe>
</div>
</div>
</div>
</section>

View File

@ -1,12 +1,12 @@
<section class="section demo">
<div class="container content">
<div class="container">
<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">
<form class="form demo-form" id="demo-form" action="<%= submission_url(GOOGLE_DEMO_FORM) %>" method="POST" enctype="multipart/form-data" data-tinyforms="true">
<input type="hidden" name="ID" value="tinyforms_id">
<h3>Demo</h3>
<h3 class="title">Demo</h3>
<p>
This short form is connected to the embedded <%= link_to 'document', DEMO_FORM.spreadsheet_url %> on the right. <br>
This short form is connected to the embedded <%= link_to 'document', GOOGLE_DEMO_FORM.spreadsheet_url %> on the right. <br>
Submit the form and see the update of the document in realtime.
</p>
@ -49,21 +49,21 @@
</div>
<div class="field">
<label class="label">Do you like Pizza with Pinapples?*</label>
<label class="label">Do you like Pizza with Pineapples?*</label>
<div class="control">
<label class="radio">
<input type="radio" name="Pinapples Pizza?" required value="yes">
<input type="radio" name="Pineapple Pizza?" required value="yes">
Yes
</label>
<label class="radio">
<input type="radio" name="Pinapples Pizza?" required value="no">
<input type="radio" name="Pineapple Pizza?" required value="no">
Hell, no!
</label>
</div>
</div>
<div class="field">
<label class="label">What's your favorit cat picture?</label>
<label class="label">What's your favorite cat picture?</label>
<div class="control">
<input class="input" type="file" name="Cat Picture">
</div>
@ -79,8 +79,8 @@
</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>
<iframe id="demo-sheet" style="width:100%;height:100%;" src="https://docs.google.com/spreadsheets/d/<%= GOOGLE_DEMO_FORM.google_spreadsheet_id %>/edit?usp=sharing&nocache=<%= Time.now.to_i %>#gid=0&range=<%= GOOGLE_DEMO_FORM.submissions.count + 1 %>:<%= GOOGLE_DEMO_FORM.submissions.count + 2 %>"></iframe>
<p class="has-text-grey has-text-centered">Document not loading? <%= link_to 'Open it here', GOOGLE_DEMO_FORM.spreadsheet_url %>.</p>
</div>
</div>
</div>

View File

@ -1 +1,3 @@
DEMO_FORM = Form.find_by(id: ENV['DEMO_FORM_ID'])
GOOGLE_DEMO_FORM = Form.find_by(id: ENV['GOOGLE_DEMO_FORM_ID'])
AIRTABLE_DEMO_FORM = Form.find_by(id: ENV['AIRTABLE_DEMO_FORM_ID'])
AIRTABLE_DEMO_EMBED_URL = ENV['AIRTABLE_DEMO_EMBED_URL']

View File

@ -6,7 +6,9 @@ Rails.application.routes.draw do
resources :submissions
end
# short link for submission file uploads
get '/s/:form_id/:submission_id/:id' => 'file_uploads#show', as: :file_upload
# we add the filename as part of the URL which allows e.g. Airtable to identify and name the file properly
# the constraint makes sure that a . (dot) can be in the filename. e.g. cat.jpg
get '/s/:form_id/:submission_id/:id(/:filename)' => 'file_uploads#show', as: :file_upload, constraints: { filename: /[^\/]+/ }
# form post url to save new submissions
post '/s/:form_id' => 'submissions#create', as: :submission
@ -21,7 +23,7 @@ Rails.application.routes.draw do
get '/logout' => 'sessions#destroy', as: :logout
get '/auth' => 'sessions#auth', as: :auth
get '/demo' => 'home#demo', as: :demo
get '/demo(/:backend)' => 'home#demo', as: :demo
get '/contact' => 'home#contact', as: :contact
get '/help', to: redirect('https://www.notion.so/Tinyforms-Help-Center-04f13b5908bc46cfb4283079a3cb1149')

View File

@ -2,3 +2,6 @@ GOOGLE_CLIENT_ID=clientid
GOOGLE_CLIENT_SECRET=secret
GOOGLE_PROJECT_ID=projectid
LOCKBOX_MASTER_KEY=f7b18b63d3f7ec48fa78bab327cdf81b0969020f70dc16947b14572cde3e2b7d
GOOGLE_DEMO_FORM_ID=1
AIRTABLE_DEMO_FROM_ID=2
AIRTABLE_DEMO_EMBED_URL=''