Changed tweet. Show link on perpetrator if no usage example. Moved li…

…st of guff to main page. Show submission date next to latest guff.
ft-interactive · Dec 8, 2015 · 2844064 · 2844064
1 parent 71aa753
commit 2844064
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 35 deletions.
diff --git a/client/definition-page.hbs b/client/definition-page.hbs
@@ -6,12 +6,10 @@
      	<div class="line"></div>
      	<a href="../guffipedia-form" class="o-buttons o-buttons--standout">Suggest an entry</a>
 
-     	<a href="list.html">Guff Index</a>
-
 		<div class="detailed-guff">
 			<div class="word">
 				{{word}}
-				<a href="https://twitter.com/share" class="twitter-share-button"{count} data-text="Crime against the English language #{{wordid}}"></a>
+				<a href="https://twitter.com/share" class="twitter-share-button"{count} data-text="@lucykellaway explains what '{{word}}' really means"></a>
 				<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
 			</div>
 			<div class="details">
@@ -21,7 +19,9 @@
 				{{#if showPerpetratorData}}
 					<p class="detail perpetrator"><strong>Perpetrator</strong>
 				{{/if}}
-					{{#if perpetrator}}{{perpetrator}}{{/if}}{{#if perpetrator}}{{#if usagesource}}, {{/if}}{{/if}}{{#if usagesource}}{{usagesource}}{{/if}}
+					{{#unless usageexample}}{{#if sourceurl}}<a href="{{sourceurl}}" target="_blank">{{/if}}{{/unless}}
+						{{#if perpetrator}}{{perpetrator}}{{/if}}{{#if perpetrator}}{{#if usagesource}}, {{/if}}{{/if}}{{#if usagesource}}{{usagesource}}{{/if}}
+					{{#unless usageexample}}{{#if sourceurl}}</a>{{/if}}{{/unless}}
 				{{#if showPerpetratorData}}
 					</p>
 				{{/if}}

diff --git a/client/list-page.hbs b/client/list-page.hbs
diff --git a/client/main-page.hbs b/client/main-page.hbs
@@ -7,12 +7,10 @@
      	<div class="line"></div>
      	<a href="../guffipedia-form" class="o-buttons o-buttons--standout">Suggest an entry</a>
 
-     	<a href="list.html">Guff Index</a>
-
 		<ul class="guffs">
 			{{#each homewords}}
 			<li class="guff">
-				<div class="paraHeads">{{#if @first}}Latest{{else}}Random{{/if}} guff</div>
+				<div class="paraHeads">{{#if @first}}Latest guff <span>added on {{formatteddate}}</span>{{else}}Random guff{{/if}}</div>
 				<a class="word" href="{{@key}}/">{{word}}</a>
 				<div class="details">
 					{{#if definition}}
@@ -30,6 +28,12 @@
 				</div>
 			</li>
 			{{/each}}
+			{{#each words}}
+				<li class="guff">
+					{{#if @first}}<div class="paraHeads">All the guff</div>{{/if}}
+					<a class="word" href="{{@key}}/">{{word}}</a>
+				</li>
+			{{/each}}
 		</ul>
     </main>
 {{> bottom }}
diff --git a/client/styles/_colours.scss b/client/styles/_colours.scss
@@ -1,2 +1,4 @@
 $dark-pink: #b0797a;
 $blue: #007dc5;
+$light-grey: #ccc2c2;
+$dark-grey: #6a6d68;
diff --git a/client/styles/main.scss b/client/styles/main.scss
@@ -59,7 +59,7 @@ body {
   line-height: 1.1em;
   width: 100%;
   margin-top: 8px;
-  background-color: #ccc2c2;
+  background-color: $light-grey;
   border-width: 0px;
   &:hover {
     color: inherit;
@@ -81,7 +81,7 @@ main {
     font-size: 2em;
     line-height: 1.4em;
     margin: 0px;
-    color: #000000;
+    color: black;
     @include oGridRespondTo(S) {
       font-size: 4em;
       text-align: left;
@@ -121,7 +121,7 @@ main {
     line-height: 1em;
     text-align: left;
     margin-top: 2px;
-    color: #6a6d68;
+    color: $dark-grey;
     @include oGridRespondTo(S) {
       font-size: 1.8em;
       text-align: left;
@@ -136,10 +136,15 @@ main {
     text-align: left;
     font-size: 1em;
     line-height: 1.2em;
-    color: #6a6d68;
+    color: $dark-grey;
     @include oGridRespondTo(S) {
       font-size: 1.5em;
     }
+    span {
+      font-size: 0.7em;
+      font-style: italic;
+      font-weight: normal;
+    }
   }
 
   .guffs {
@@ -183,7 +188,7 @@ main {
     text-align: left;
     font-size: 1em;
     line-height: 1.2em;
-    color: #6a6d68;
+    color: $dark-grey;
     @include oGridRespondTo(S) {
       font-size: 1.4em;
       margin-top: 8px;

diff --git a/gulpfile.babel.js b/gulpfile.babel.js
@@ -270,6 +270,13 @@ gulp.task('download-data', () => fetch(SPREADSHEET_URL)
       sortedWords[word] = words[word];
     }
 
+    let monthNames = [
+      "January", "February", "March",
+      "April", "May", "June", "July",
+      "August", "September", "October",
+      "November", "December"
+    ];
+
     for (const row of spreadsheet) {
       let currentSlug = row.slug;
 
@@ -307,6 +314,10 @@ gulp.task('download-data', () => fetch(SPREADSHEET_URL)
       if(words[currentSlug].wordid) {
         words[currentSlug].wordid = words[currentSlug].wordid.substring(4,words[currentSlug].wordid.length);
       }
+
+      let date = new Date(words[currentSlug].submissiondate);
+
+      words[currentSlug].formatteddate = monthNames[date.getMonth()] + " " + date.getDate() + ", " + date.getFullYear();
     }
 
     fs.writeFileSync('client/words.json', JSON.stringify(sortedWords, null, 2));
@@ -345,10 +356,6 @@ gulp.task('templates', () => {
   const homewords = JSON.parse(fs.readFileSync('client/homewords.json', 'utf8'));
 
   const mainPageTemplate = Handlebars.compile(fs.readFileSync('client/main-page.hbs', 'utf8'));
-  const mainPageHtml = mainPageTemplate({homewords});
+  const mainPageHtml = mainPageTemplate({homewords, words});
   fs.writeFileSync(`.tmp/index.html`, mainPageHtml);
-
-  const listPageTemplate = Handlebars.compile(fs.readFileSync('client/list-page.hbs', 'utf8'));
-  const listPageHtml = listPageTemplate({words});
-  fs.writeFileSync(`.tmp/list.html`, listPageHtml);
 });