connect /donate to pledgie via jsonp
This commit is contained in:
parent
5ecd5f3ce4
commit
868dd003fd
4 changed files with 235 additions and 30 deletions
|
|
@ -1,3 +1,6 @@
|
|||
@import "compass/css3/gradient"
|
||||
@import "compass/css3/text-shadow"
|
||||
|
||||
body.static-donate
|
||||
#title
|
||||
margin-bottom: 0
|
||||
|
|
@ -9,6 +12,9 @@ body.static-donate
|
|||
#title, h2
|
||||
float: left
|
||||
|
||||
h2
|
||||
margin-bottom: .25em
|
||||
|
||||
.pledgie-link
|
||||
+awesome-button
|
||||
+loud-awesome-button-color
|
||||
|
|
@ -19,18 +25,53 @@ body.static-donate
|
|||
margin-top: .5em
|
||||
padding: .75em
|
||||
|
||||
#campaign-progress-wrapper
|
||||
+border-radius(8px)
|
||||
background: #aaa
|
||||
+linear-gradient(color-stops(#ccc, #aaa))
|
||||
|
||||
border: 4px solid $module-border-color
|
||||
clear: both
|
||||
margin-bottom: 1.5em
|
||||
position: relative
|
||||
visibility: hidden
|
||||
|
||||
#campaign-progress
|
||||
background: $module-border-color
|
||||
+linear-gradient(color-stops($module-border-color + #222, $module-border-color))
|
||||
border-right: 1px solid $module-border-color
|
||||
|
||||
#campaign-progress-wrapper, #campaign-progress
|
||||
height: 2.5em
|
||||
|
||||
#campaign-progress-label
|
||||
+text-shadow(#777, -1px, -1px, 0)
|
||||
color: white
|
||||
font-size: 150%
|
||||
left: 0
|
||||
position: absolute
|
||||
top: 0
|
||||
text-align: center
|
||||
width: 100%
|
||||
|
||||
$image-mode-preview-image-width: 300px
|
||||
$image-mode-preview-image-border-width: 1px
|
||||
$image-mode-preview-h-padding: 20px
|
||||
$image-mode-preview-border-width: 1px
|
||||
$image-mode-preview-right-margin: 20px
|
||||
$image-mode-preview-outer-width: $image-mode-preview-image-width + $image-mode-preview-right-margin + 2 * ($image-mode-preview-image-border-width + $image-mode-preview-h-padding + $image-mode-preview-border-width)
|
||||
#image-mode-preview
|
||||
border: $image-mode-preview-border-width solid $module-border-color
|
||||
$image-mode-preview-width: $image-mode-preview-image-width + 2 * ($image-mode-preview-image-border-width + $image-mode-preview-h-padding + $image-mode-preview-border-width)
|
||||
$image-mode-preview-outer-width: $image-mode-preview-width + $image-mode-preview-right-margin
|
||||
|
||||
#image-mode-data
|
||||
clear: both
|
||||
display: block
|
||||
float: left
|
||||
margin: 0 $image-mode-preview-right-margin 0 0
|
||||
margin-right: $image-mode-preview-right-margin
|
||||
width: $image-mode-preview-width
|
||||
|
||||
#image-mode-preview
|
||||
border: $image-mode-preview-border-width solid $module-border-color
|
||||
margin: 0 0 2em 0
|
||||
padding:
|
||||
top: $image-mode-preview-h-padding
|
||||
right: $image-mode-preview-h-padding
|
||||
|
|
@ -47,6 +88,19 @@ body.static-donate
|
|||
font-size: 250%
|
||||
text-align: center
|
||||
|
||||
#campaign-donors
|
||||
display: none
|
||||
margin-right: $image-mode-preview-right-margin
|
||||
width: $image-mode-preview-width
|
||||
|
||||
ol
|
||||
font-size: 85%
|
||||
padding-left: 2em
|
||||
|
||||
span
|
||||
color: $soft-text-color
|
||||
float: right
|
||||
|
||||
$image-mode-description-width: $container-width - $image-mode-preview-outer-width
|
||||
|
||||
$image-mode-beta-h-padding: 15px
|
||||
|
|
@ -75,7 +129,14 @@ body.static-donate
|
|||
.pledgie-link
|
||||
margin: .75em 0
|
||||
|
||||
#image-mode-description
|
||||
#image-mode-description, #image-mode-comments
|
||||
float: left
|
||||
width: $image-mode-description-width
|
||||
|
||||
&.campaign-loaded
|
||||
#campaign-progress-wrapper
|
||||
visibility: visible
|
||||
|
||||
#campaign-donors
|
||||
display: block
|
||||
|
||||
|
|
|
|||
|
|
@ -2,21 +2,36 @@
|
|||
= pledgie_link :id => 'pledgie-link-with-title'
|
||||
%h2 Image Mode is almost here, but we need your help!
|
||||
|
||||
%figure#image-mode-preview
|
||||
= image_tag 'image_mode_preview.png'
|
||||
%figcaption
|
||||
Image Mode ♥
|
||||
#campaign-progress-wrapper
|
||||
#campaign-progress{:style => 'width: 27%'}
|
||||
#campaign-progress-label
|
||||
We have
|
||||
= surround '$', ',' do
|
||||
%span.campaign-raised 100
|
||||
and need
|
||||
= precede '$' do
|
||||
%span.campaign-goal 360
|
||||
to run the upgraded server for a year
|
||||
|
||||
%article#image-mode-beta
|
||||
%header Donate $5 or more for early beta access
|
||||
%section#image-mode-data
|
||||
%figure#image-mode-preview
|
||||
= image_tag 'image_mode_preview.png'
|
||||
%figcaption
|
||||
Image Mode ♥
|
||||
#campaign-donors
|
||||
%h3 Thank you!
|
||||
%ol
|
||||
|
||||
#image-mode-beta
|
||||
%header Donate at least $5 for early beta access
|
||||
= pledgie_link
|
||||
%p
|
||||
Include your
|
||||
= link_to 'Dress to Impress username', login_path_with_return_to
|
||||
in Special Instructions.
|
||||
in PayPal's Special Instructions field.
|
||||
%p We'll email you soon!
|
||||
|
||||
%article#image-mode-description
|
||||
#image-mode-description
|
||||
:markdown
|
||||
**Soon, Dress to Impress will be able to both save outfits as images and
|
||||
even run entirely without Flash**. Image Mode. It's taken months to put
|
||||
|
|
@ -33,8 +48,44 @@
|
|||
need to do in order to have enough RAM to both convert Flash to image and
|
||||
also run a website with thousands of users a day.
|
||||
|
||||
**As a little treat, those who give at least $5 will get early access
|
||||
to Image Mode.** Though we're still missing quite a few converted SWFs,
|
||||
you'll be able to get a feel for what Image Mode will be when it's ready
|
||||
for prime time, and help make sure it's exactly as simple and powerful as
|
||||
it needs to be.
|
||||
|
||||
**Thank you for your continued support.** Dress to Impress is 100%
|
||||
user-funded, and we hope to stay that way. Our goal is to raise enough
|
||||
money to guarantee that we'll be up and running for the next 12 months. I
|
||||
think we can do it.
|
||||
know we can do it.
|
||||
|
||||
#image-mode-comments
|
||||
#disqus_thread
|
||||
:javascript
|
||||
var disqus_shortname = 'dresstoimpress';
|
||||
|
||||
// The following are highly recommended additional parameters. Remove the slashes in front to use.
|
||||
var disqus_identifier = 'dresstoimpress_donate';
|
||||
|
||||
/* * * DON'T EDIT BELOW THIS LINE * * */
|
||||
(function() {
|
||||
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
|
||||
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
|
||||
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
|
||||
|
||||
var s = document.createElement('script'); s.async = true;
|
||||
s.type = 'text/javascript';
|
||||
s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
|
||||
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
|
||||
}());
|
||||
%a.dsq-brlink{:href => "http://disqus.com"}
|
||||
blog comments powered by
|
||||
%span.logo-disqus Disqus
|
||||
|
||||
- content_for :javascripts do
|
||||
= include_javascript_libraries :jquery
|
||||
= javascript_include_tag 'static/donate'
|
||||
|
||||
- content_for :meta do
|
||||
%meta{:name => 'pledgie-campaign-id', :content => PLEDGIE_CAMPAIGN_ID}
|
||||
|
||||
|
|
|
|||
23
public/javascripts/static/donate.js
Normal file
23
public/javascripts/static/donate.js
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
(function () {
|
||||
var PLEDGIE_CAMPAIGN_ID = $('meta[name=pledgie-campaign-id]').attr('content');
|
||||
|
||||
var pledgieURL = 'http://pledgie.com/campaigns/' + PLEDGIE_CAMPAIGN_ID + '.json?callback=?';
|
||||
$.getJSON(pledgieURL, function (data) {
|
||||
var donorsEl = $('#campaign-donors');
|
||||
var donorsList = donorsEl.children('ol');
|
||||
var campaign = data.campaign;
|
||||
var pledges = campaign.pledges;
|
||||
|
||||
var pledge, pledgeEl;
|
||||
for(var i in pledges) {
|
||||
pledge = pledges[i];
|
||||
pledgeEl = $('<li/>');
|
||||
$('<strong/>', {text: pledge.display_name}).appendTo(pledgeEl);
|
||||
$('<span/>', {text: pledge.date}).appendTo(pledgeEl);
|
||||
pledgeEl.appendTo(donorsList);
|
||||
}
|
||||
|
||||
$(document.body).addClass('campaign-loaded');
|
||||
});
|
||||
})();
|
||||
|
||||
|
|
@ -2463,20 +2463,24 @@ body.pets-bulk .script-only {
|
|||
display: none;
|
||||
}
|
||||
|
||||
/* line 2, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 5, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
/* line 5, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 8, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate h2 {
|
||||
font-style: italic;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* line 9, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 12, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #title, body.static-donate h2 {
|
||||
float: left;
|
||||
}
|
||||
/* line 12, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 15, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate h2 {
|
||||
margin-bottom: 0.25em;
|
||||
}
|
||||
/* line 18, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate .pledgie-link {
|
||||
/* http://www.zurb.com/blog_uploads/0000/0617/buttons-03.html */
|
||||
-moz-border-radius: 5px;
|
||||
|
|
@ -2512,7 +2516,7 @@ body.static-donate .pledgie-link:active {
|
|||
body.static-donate .pledgie-link:hover {
|
||||
background-color: #ee4b00;
|
||||
}
|
||||
/* line 16, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 22, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #pledgie-link-with-title {
|
||||
float: right;
|
||||
font-size: 150%;
|
||||
|
|
@ -2520,30 +2524,88 @@ body.static-donate #pledgie-link-with-title {
|
|||
padding: 0.75em;
|
||||
}
|
||||
/* line 28, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-preview {
|
||||
border: 1px solid #006600;
|
||||
body.static-donate #campaign-progress-wrapper {
|
||||
-moz-border-radius: 8px;
|
||||
-webkit-border-radius: 8px;
|
||||
background: #aaaaaa;
|
||||
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #cccccc), color-stop(100%, #aaaaaa));
|
||||
background-image: -moz-linear-gradient(top, #cccccc 0%, #aaaaaa 100%);
|
||||
background-image: linear-gradient(top, #cccccc 0%, #aaaaaa 100%);
|
||||
border: 4px solid #006600;
|
||||
clear: both;
|
||||
margin-bottom: 1.5em;
|
||||
position: relative;
|
||||
visibility: hidden;
|
||||
}
|
||||
/* line 39, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #campaign-progress {
|
||||
background: #006600;
|
||||
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #228822), color-stop(100%, #006600));
|
||||
background-image: -moz-linear-gradient(top, #228822 0%, #006600 100%);
|
||||
background-image: linear-gradient(top, #228822 0%, #006600 100%);
|
||||
border-right: 1px solid #006600;
|
||||
}
|
||||
/* line 44, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #campaign-progress-wrapper, body.static-donate #campaign-progress {
|
||||
height: 2.5em;
|
||||
}
|
||||
/* line 47, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #campaign-progress-label {
|
||||
text-shadow: #777777 -1px -1px 0;
|
||||
color: white;
|
||||
font-size: 150%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
/* line 65, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-data {
|
||||
clear: both;
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0 20px 0 0;
|
||||
margin-right: 20px;
|
||||
width: 344px;
|
||||
}
|
||||
/* line 72, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-preview {
|
||||
border: 1px solid #006600;
|
||||
margin: 0 0 2em 0;
|
||||
padding-top: 20px;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 13.333px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
/* line 40, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 81, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-preview img {
|
||||
border: 1px solid #006600;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
/* line 44, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 85, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-preview figcaption {
|
||||
display: block;
|
||||
font-family: Calligraffitti;
|
||||
font-size: 250%;
|
||||
text-align: center;
|
||||
}
|
||||
/* line 56, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 91, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #campaign-donors {
|
||||
display: none;
|
||||
margin-right: 20px;
|
||||
width: 344px;
|
||||
}
|
||||
/* line 96, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #campaign-donors ol {
|
||||
font-size: 85%;
|
||||
padding-left: 2em;
|
||||
}
|
||||
/* line 100, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #campaign-donors ol span {
|
||||
color: #448844;
|
||||
float: right;
|
||||
}
|
||||
/* line 110, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-beta {
|
||||
background: #eeffee;
|
||||
border: 1px solid #006600;
|
||||
|
|
@ -2556,26 +2618,34 @@ body.static-donate #image-mode-beta {
|
|||
text-align: center;
|
||||
width: 404px;
|
||||
}
|
||||
/* line 66, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 120, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-beta header {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
}
|
||||
/* line 70, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 124, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-beta p {
|
||||
font-family: "Droid Sans", Helvetica, Arial, Verdana, sans-serif;
|
||||
font-size: 75%;
|
||||
margin: 0;
|
||||
}
|
||||
/* line 75, ../../../app/stylesheets/static/_donate.sass */
|
||||
/* line 129, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-beta .pledgie-link {
|
||||
margin: 0.75em 0;
|
||||
}
|
||||
/* line 78, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-description {
|
||||
/* line 132, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate #image-mode-description, body.static-donate #image-mode-comments {
|
||||
float: left;
|
||||
width: 436px;
|
||||
}
|
||||
/* line 137, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate.campaign-loaded #campaign-progress-wrapper {
|
||||
visibility: visible;
|
||||
}
|
||||
/* line 140, ../../../app/stylesheets/static/_donate.sass */
|
||||
body.static-donate.campaign-loaded #campaign-donors {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* line 1, ../../../app/stylesheets/static/_terms.sass */
|
||||
body.static-terms {
|
||||
|
|
|
|||
Loading…
Reference in a new issue