Skip to content

Commit

Permalink
Update add location form to not request a GitHub account. Yay!
Browse files Browse the repository at this point in the history
  • Loading branch information
jimthoburn committed Jul 13, 2017
1 parent cf6a2b1 commit 8ecd0a6
Show file tree
Hide file tree
Showing 4 changed files with 148 additions and 99 deletions.
87 changes: 87 additions & 0 deletions _includes/add-form.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
<section>
<h1>Add a Healthy Food Location</h1>
<h2>
<span class="label">Hi, <span id="userNameSpan">friend</span>!</span>
</h2>
<p>Please complete this form, to add a new location on the <a href="/locations/">map</a>!</p>
<form id="addForm" action="https://foodoasis-contribute.glitch.me/add" method="post" style="margin-top: 3em;">
<p>
<label>
Location Title<br />
<input type="text" name="title" id="locationTitle" />
</label>
</p>
<p>
<label>
Category<br />
<input type="text" name="category" id="locationCategory" /><br />
<small style="font-style: italic;">Examples: Farmers Market, Community Garden, Food Pantry, Supermarket</small>
</label>
</p>
<p>
<label>
Street Address<br />
<input type="text" name="address_1" id="locationAddress1" />
</label>
</p>
<p>
<label>
Street Address 2<br />
<input type="text" name="address_2" id="locationAddress2" />
</label>
</p>
<p>
<label>
City<br />
<input type="text" name="city" id="locationCity" />
</label>
</p>
<p>
State<br />
<input type="text" name="state" value="California" disabled />
</p>
<p>
<label>
ZIP Code<br />
<input type="text" name="zip" id="locationZip" />
</label>
</p>
<p>
<label>
Website<br />
<input type="text" name="website" id="locationWebsite" />
</label>
</p>
<p>
<label>
Phone<br />
<input type="text" name="phone" id="locationPhone" />
</label>
</p>
<p>
<label>
Is there anything else you’d like to tell us about this location?<br />
<textarea name="notes" id="userText"></textarea>
</label>
</p>
<p>
<label>
Your Name<br />
<input type="text" name="contributor_name" />
</label>
</p>
{% comment %}
<p>
<label>
Your Email<br />
<input type="text" name="contributor_email" />
</label>
<br />
<em>We’ll only use this to contact you with questions about this submission.</em>
</p>
{% endcomment %}
<p class="action">
<button type="submit">Add Location</button>
</p>
</form>
</section>
39 changes: 39 additions & 0 deletions add-confirmation.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
---
layout: default
title: Add Healthy Food Location, Food Oasis Los Angeles
---

<section class="success" role="status" id="messageSection">
<h1>Thanks! Your suggestion has been submitted!</h1>
<p>
Once approved, your suggestion will appear on our map.
</p>
</section>

<template id="link-template">
<p><a href="">View your suggestion on GitHub here!</a></p>
</template>

<script>
// Test to see if the browser supports the HTML template element by checking
// for the presence of the template element's content attribute.
// KUDOS: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template
if ('content' in document.createElement('template')) {

var pr_link = window.location.href.match(/\?pr_link=(.*)/)[1];
if (pr_link) {
var template = document.getElementById('link-template');

var link = template.content.querySelector('a');
link.setAttribute('href', pr_link);

var clone = document.importNode(template.content, true);

var messageSection = document.getElementById('messageSection');
messageSection.insertBefore(clone, messageSection.querySelector('p'));
}
}

</script>

{% include add-form.html %}
21 changes: 21 additions & 0 deletions add-error.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
---
layout: default
title: Uh oh! Something went wrong, Food Oasis Los Angeles
---

<section class="error" role="status">
<h1>Uh oh! Something went wrong</h1>
<p>
Your submission may not have been sent.
</p>
<p>
This is a problem on our end. You may want to try again at later time.
</p>
<p>You can also <a href="mailto:[email protected]">contact us</a> to let us know what happened. Thanks!</p>
</section>

{% comment %}
TODO: Repopulate data in the form below
{% endcomment %}

{% include add-form.html %}
100 changes: 1 addition & 99 deletions add.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,102 +3,4 @@ layout: default
title: Add Healthy Food Location, Food Oasis Los Angeles
---

<h1>Add a Healthy Food Location</h1>

<!--
Before sign in
-->
<section id="loginSection">
<p>Create a free account on <a href="https://github.com">GitHub</a>, and then add a new location on the <a href="/locations/">map</a>!</p>
<p class="action">
<a id="login" href="https://github.com/login/oauth/authorize?client_id=7ebf83bd679d38d56577&amp;scope=public_repo">Start</a>
</p>
</section>

<!--
After sign in
-->
<section id="inputSection" class="hidden">
<h2>
<span class="label">Hi, <span id="userNameSpan">friend</span>!</span>
</h2>
<p>Please complete this form, to add a new location on the <a href="/locations/">map</a>!</p>
<form id="addForm" action="/add" method="post" style="margin-top: 3em;">
<p>
<label>
Location Title<br />
<input type="text" id="locationTitle" />
</label>
</p>
<p>
<label>
Category<br />
<input type="text" id="locationCategory" /><br />
<small style="font-style: italic;">Examples: Farmers Market, Community Garden, Food Pantry, Supermarket</small>
<!--
<select id="locationCategory">
<option value="other">Other</option>
<option value="farmers-market">Farmer’s Market</option>
<option value="community-garden">Community Garden</option>
<option value="food-pantry">Food Pantry</option>
<option value="supermarket">Supermarket</option>
</select>
-->
</label>
</p>
<p>
<label>
Street Address<br />
<input type="text" id="locationAddress1" />
</label>
</p>
<p>
<label>
Street Address 2<br />
<input type="text" id="locationAddress2" />
</label>
</p>
<p>
<label>
City<br />
<input type="text" id="locationCity" />
</label>
</p>
<p>
State<br />
<input type="text" value="California" disabled />
</p>
<p>
<label>
ZIP Code<br />
<input type="text" id="locationZip" />
</label>
</p>
<p>
<label>
Website<br />
<input type="text" id="locationWebsite" />
</label>
</p>
<p>
<label>
Phone<br />
<input type="text" id="locationPhone" />
</label>
</p>
<p>
<label>
Is there anything else you’d like to tell us about this location?<br />
<textarea id="userText"></textarea>
</label>
</p>
<p class="action">
<button type="submit" id="submit">Add Location</button>
</p>
</form>
</section>

<section class="success hidden" role="status" id="messageSection">
</section>

<script src="/assets/js/github-backend.js"></script>
{% include add-form.html %}

0 comments on commit 8ecd0a6

Please sign in to comment.