From 7757ef39dfa0e0bbc478a5d9cec48da3744cc6a6 Mon Sep 17 00:00:00 2001
From: Jesse Grant <jesse.grant@gmail.com>
Date: Mon, 14 Jan 2013 16:32:33 -0500
Subject: [PATCH] added place holder image to show instead of video

---
 app/assets/javascripts/preorder.js.coffee   |  7 +++++++
 app/assets/stylesheets/application.css      |  4 ++++
 app/views/preorder/homepage/_stats.html.erb | 16 +++++++++++++++-
 config/settings.yml                         |  6 ++++++
 4 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/preorder.js.coffee b/app/assets/javascripts/preorder.js.coffee
index aec14e9..fb7da4e 100644
--- a/app/assets/javascripts/preorder.js.coffee
+++ b/app/assets/javascripts/preorder.js.coffee
@@ -11,6 +11,7 @@ Selfstarter =
       $("#amazon_button").addClass("disabled") unless $("#amazon_button").hasClass("disabled")
   init: ->
     checkoutOffset = $('body').height() - 101 #needs to be done upon init
+
     $("#email").bind "textchange", ->
       Selfstarter.validateEmail()
     $("#email").bind "hastext", ->
@@ -19,6 +20,12 @@ Selfstarter =
     $("#email").change ->
       Selfstarter.firstTime = false
 
+    # init placeholder image for video
+    $("#video_image").on "click", ->
+      $("#player").removeClass("hidden")
+      $(this).hide()
+      $("#player iframe").click()
+
     # if they are using the optional payment options section on the checkout page, need to conditional fix the email
     # field and button to the bottom of the page so it's displayed after selecting a radio button
     if $('.payment_options').length > 0
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index e19465f..ccdd0e3 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -12,3 +12,7 @@
  *= require reset
  *= require main
  */
+.hidden
+{
+  display: none;
+}
diff --git a/app/views/preorder/homepage/_stats.html.erb b/app/views/preorder/homepage/_stats.html.erb
index 4eb8c29..e8aebd1 100644
--- a/app/views/preorder/homepage/_stats.html.erb
+++ b/app/views/preorder/homepage/_stats.html.erb
@@ -1,6 +1,20 @@
 <div class="wrapper clearfix">
   <div id="video">
-    <iframe width='512' height='385' src="<%= video_url %>"></iframe>
+    <% if !Settings.video_placeholder_img_path.nil? %>
+      <div id="video_image">
+        <img alt="video_place_holder" src="/assets/<%= Settings.video_placeholder_img_path %>" />
+      </div>
+      <div id="player" class="hidden">
+        <object width="512" height="385">
+          <param name="movie" value="https://www.youtube.com/v/D1L3o88GKew?autohide=1&showinfo=0&rel=0&autoplay=1" />
+          <param name="allowFullScreen" value="true" />
+          <param name="allowscriptaccess" value="always" />
+          <embed src="<%= Settings.video_embed_url %>?autohide=1&showinfo=0&rel=0&autoplay=1" type="application/x-shockwave-flash" width="512" height="385" allowscriptaccess="always" allowfullscreen="true"></embed>
+        </object>
+      </div>
+    <% else %>
+      <iframe width='512' height='385' src="<%= video_url %>"></iframe>
+    <% end %>
   </div>
 
   <div id="backing">
diff --git a/config/settings.yml b/config/settings.yml
index 32f1017..732c6a3 100644
--- a/config/settings.yml
+++ b/config/settings.yml
@@ -22,6 +22,12 @@ value_proposition: "Roll your own crowdfunding"
 # YouTube or Vimeo Video URL (The embed URL, without the query string options)
 video_embed_url: "https://www.youtube.com/v/D1L3o88GKew"
 
+# This image file will be shown in place of the youtube (or whatever) video.  When the user clicks it, the vid will
+# replace the image and start playing.  Note that you can leave this blank, and no image will be use - first frame
+# of the video will be displayed
+# NOTE: this only works for youtube video at the moment.  If its not for youtube, then just leave this property blank
+video_placeholder_img_path: "video_placeholder.png"
+
 # Amazon settings -- you'll need an Amazon Payments account, sign up here --> http://bit.ly/SGksTv
 
 # To find your access key and secret key, head over to here --> http://bit.ly/R4I4ky (Follow that guide in the Seller Central page)