Allan Davis avatar Allan Davis committed b81890b

have checkout form displaying

Comments (0)

Files changed (6)

includes/css/FFOP.css

+/* http://www.robobilly.com/FFOP */
 body {font-family: Cooper helvetica verdana; background: #fff; margin: 0px auto 0px; padding: 0px; text-align: center;}
 .body{font-family: Cooper helvetica verdana;padding: 0px;margin: 0px;}
 #content{margin: 0px auto 0px;padding: 5px 0px 10px 0px;width: 900px; height: 500px; background: #fff;}
 a{font-size: 12px; font-family: Verdana; text-align: left; margin: 0px; padding: 0px; color: #D4145A; text-decoration: none;}
 a:hover{font-size: 12px; font-family: Verdana; text-align: left; margin: 0px; padding: 0px; color: #D4145A; text-decoration: underline;}
 
-#toptopBar{background: url(http://www.robobilly.com/FFOP/images/top.png); height: 36px;}
+#toptopBar{background: url(/includes/images/top.png); height: 36px;}
 #toptopBar_Content{margin: 0px auto 0px;width:900px;margin-left: -450px; position: absolute;left: 50%; text-align: right;}
 #toptopBar_Content p{font-size: 16px; text-align: right; margin: 1px 50px 0px 0px; color: #fff;}
 #toptopBar_Content a{text-decoration: none; color: #fff;}
 #faq {width: 410px; margin: 15px 5px 0px 270px; padding: 0px 20px 0px 20px; border-right: 1px dashed #FF0000; border-left: 1px dashed #FF0000;}
 #who {float: right; width: 150px; margin: 15px 5px 0px 0px; padding: 0px 0px 0px 0px;text-align: center;}
 
-a#rollover1 { background-image:url(http://www.robobilly.com/FFOP/images/directions.jpg); height: 72px; width:702px; display:block; float: right; margin: 5px 30px 0px 0px;}
+a#rollover1 { background-image:url(/includes/images/directions.jpg); height: 72px; width:702px; display:block; float: right; margin: 5px 30px 0px 0px;}
 a#rollover1 span { display:none; }
-a#rollover1:hover { background-image:url(http://www.robobilly.com/FFOP/images/directions.gif); float: right; margin: 5px 30px 0px 0px;}
+a#rollover1:hover { background-image:url(/includes/images/directions.gif); float: right; margin: 5px 30px 0px 0px;}
 
 
-a#rollover2 { background-image:url(http://www.robobilly.com/FFOP/images/PFF_logo2.png); height: 151px; width:159px; display:block; margin: -40px 0px 0px 0px; float: left; position:absolute;}
+a#rollover2 { background-image:url(/includes/images/PFF_logo2.png); height: 151px; width:159px; display:block; margin: -40px 0px 0px 0px; float: left; position:absolute;}
 a#rollover2 span { display:none; }
-a#rollover2:hover { background-image:url(http://www.robobilly.com/FFOP/images/PFF_logo1.png); margin: -40px 0px 0px 0px;position:absolute;}
+a#rollover2:hover { background-image:url(/includes/images/PFF_logo1.png); margin: -40px 0px 0px 0px;position:absolute;}
 
-a#rollover3 { background-image:url(http://www.robobilly.com/FFOP/images/checkout.png); height: 54px; width:153px; display:block; margin: 0px 0px 0px 10px;}
+a#rollover3 { background-image:url(/includes/images/checkout.png); height: 54px; width:153px; display:block; margin: 0px 0px 0px 10px;}
 a#rollover3 span { display:none; }
-a#rollover3:hover { background-image:url(http://www.robobilly.com/FFOP/images/checkout2.png);}
+a#rollover3:hover { background-image:url(/includes/images/checkout2.png);}
 
-a#rollover4 { background-image:url(http://www.robobilly.com/FFOP/images/ccstb.png); height: 81px; width:135px; display:block; float:left; margin: 0px 6px 0px 0px;}
+a#rollover4 { background-image:url(/includes/images/ccstb.png); height: 81px; width:135px; display:block; float:left; margin: 0px 6px 0px 0px;}
 a#rollover4 span { display:none; }
-a#rollover4:hover { background-image:url(http://www.robobilly.com/FFOP/images/ccstb2.png);}
+a#rollover4:hover { background-image:url(/includes/images/ccstb2.png);}
 
-a#rollover5 { background-image:url(http://www.robobilly.com/FFOP/images/lightningFace.png); height: 54px; width:135px; display:block; float:left; margin: 0px 6px 0px 0px;}
+a#rollover5 { background-image:url(/includes/images/lightningFace.png); height: 54px; width:135px; display:block; float:left; margin: 0px 6px 0px 0px;}
 a#rollover5 span { display:none; }
-a#rollover5:hover { background-image:url(http://www.robobilly.com/FFOP/images/lightningFace2.png);}
+a#rollover5:hover { background-image:url(/includes/images/lightningFace2.png);}
 
-.removeLink { background-image:url(http://www.robobilly.com/FFOP/images/x.png); height: 15px; width:16px; display:block; float: left;padding: 0px 3px 0px 0px;}
+.removeLink { background-image:url(/includes/images/x.png); height: 15px; width:16px; display:block; float: left;padding: 0px 3px 0px 0px;}
 .removeLink span { display:none; }
-.removeLink:hover { background-image:url(http://www.robobilly.com/FFOP/images/x2.png);}
+.removeLink:hover { background-image:url(/includes/images/x2.png);}
 
 
 #stuff {border: 1px solid #d6d6d6; height: 100px; width: 150px; margin: 0px 0px 10px 10px; overflow: auto;}
     """ Form for donations input from external user """
     class Meta:
         model = Donation
+        fields = ('name', 'email', 'anonymous', 'amount', )
+        widgets = {
+            'amount' : forms.HiddenInput(),
+        }
 
 
 from forms import DonationForm
 
 def index(request):
-    cause = Cause.objects.filter(active_donation_target_exact=True)[0]
-    donations = cause.donations.objects.order_by('-donation_date')[:20]
-    return render_to_response("index.html", {"cause": cause, "donations": donations})
+    cause = Cause.objects.filter(active_donation_target=True)[0]
+    #if(cause.donations):
+    #    donations = cause.donations.objects.order_by('-donation_date')[:20]
+    #else:
+    #    donations = []
+    params = {
+        "cause": cause,
+        #"donations": donations,
+        }
+    return render_to_response("index.html", params )
 
 def checkout(request):
-    amount = request.GET['amount']
-    form = DonationForm(inital={"amount":amount})
-    
-    return render_to_response("checkout.html", {"form":form})
+    amount = request.POST['amount']
+    lbs = request.POST['lbs']
+    form = DonationForm() #initial={"amount":amount}
+    params = {
+        "form":form,
+        "amount":amount,
+        "pounds":lbs,
+        }
+    return render_to_response("checkout.html", params)
 
 def process(request):
     pass

templates/base.html

 	<title>{% block title %}Pixels for Food{% endblock %}</title>
 	<meta name="keywords" content="food, donations, food drive, virtual food drive" />
 	<meta name="description" content="Buy food for people who need it." />
-	<link href='includes/css/FFOP.css' rel='stylesheet' type='text/css' media='all'>		
+	<link href='/includes/css/FFOP.css' rel='stylesheet' type='text/css' media='all'>		
 	<link rel="icon" href="faviconFFOP.ico" />
 	
 	<script type="text/javascript" src="/js/nav.js"></script>
 	<script type="text/javascript" src="/js/jquery-1.2.3.pack.js"></script>
 	<script type="text/javascript" src="jquery.easynews.plus.js"></script>
 	
-  <script language='javascript' type='text/javascript' src='includes/js/jquery-1.2.6.min.js'></script>
-  <script language='javascript' type='text/javascript' src='includes/js/jquery-ui-personalized-1.6rc4.min.js'></script>   	
+  <script language='javascript' type='text/javascript' src='/includes/js/jquery-1.2.6.min.js'></script>
+  <script language='javascript' type='text/javascript' src='/includes/js/jquery-ui-personalized-1.6rc4.min.js'></script>   	
 	
 
 {% block header%}
 {% endblock %}
 </head>
 <body>
-    <div id="toptopBar">
+<div id="toptopBar">
 <div id="toptopBar_Content">
 <p>
   <a href="javascript:void(0)" onClick="goToByScroll('about')">ABOUT</a> | 
 </div>
 
 <div id="about">
-<img style="float:left; margin: 0px 6px 0px 0px;" src="includes/img/about.png" width="141" alt="about">
+<img style="float:left; margin: 0px 6px 0px 0px;" src="/includes/img/about.png" width="141" alt="about">
 <p>I work at a <a href="http://www.ccstb.org">food pantry outside of New Orleans</a> through a program called the <a href="http://www.digitalartscorps.org">Digital Arts Service Corps</a> (basically AmeriCorps for geeks). I wanted to make an easy, fun way to help fund hunger organizations - and this website was the result. If you have any questions, ideas, or criticisms feel free to send me an <a href="mailto:billybrown00@gmail.com">email</a>. Thanks!</p>
 
 </div>
 <div id="faq">
-<img style="float:left; margin: 0px 6px 0px 0px;" src="includes/img/faq.png" width="81" alt="about">
+<img style="float:left; margin: 0px 6px 0px 0px;" src="/includes/img/faq.png" width="81" alt="about">
 <p><strong>Where does my donation go exactly?</strong></p>
 <p style="padding: 0px 0px 5px 0px;">Every month we choose a different hunger charity to donate to and 100% of all donations go towards that charity.</p>
 <p><strong>Does the Nonprofit actually buy the food I select?</strong></p>

templates/checkout.html

 {%block content %}
 <div id="middleBar">
 <div id="middleBar_Content">
-<h3>You are donating <span id="poundTotal">0</span> lbs of food worth $<span id="total">0.00</span></h3>
+<h3>You are donating <span id="poundTotal">{{pounds}}</span> lbs of food worth $<span id="total">{{amount}}</span></h3>
 </div>
 </div>
 <div id="content" >
     <form action="process" method="post" >
-        {% form.to_p %}
+        {{ form.as_p }}
         <p><input type="submit" value="Submit" /></p>
     </form>
 </div>

templates/index.html

         
         // scroll to anchors
         function goToByScroll(anchor){
-     		 $('html,body').animate({scrollTop: $("#" + anchor).offset().top}, 5000);
-		    }
+     	   $('html,body').animate({scrollTop: $("#" + anchor).offset().top}, 5000);
+	}
+	
+	function checkout(){
+	   $("#lbs").val( $("#poundTotal").html());
+	   $("#amount").val($("#total").html());
+	   $("#checkout_form").submit();
+	}
 
     </script>    	
 
   	 items placed here dynamically from javascript above
     -->
   </div>
-  <a href="javascript:alert('Check out process not yet available.');" id="rollover3"><span>Checkout</span></a>
+  <a href="javascript:checkout();" id="rollover3"><span>Checkout</span></a>
+  <form action="checkout/" method="post" name="checkout_form" id="checkout_form">
+	<input type="hidden" name="amount" id="amount" value="" />
+	<input type="hidden" name="lbs" id="lbs" value="" />
+  </form>
 </div>
 
 <div id="foodstuffs">
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.