Saturday, October 31, 2009

Templates for the Main Page

index_loggedout.html : Template to display when user is not logged in.

{% extends "base.html" %}

{% block content %}

  <img src="/ra/static/images/runaround_image.jpg" class="welcome_img" />

  <div class="welcome_dialog">
   <h3>Welcome to the Run Around</h3>

   <p>This is a simple site where you can log your runs and chart progress on your workout routine.</p>

  <div class="clearfix">
   <form action="/runaround/login/" method="post">
      <div class="login_sector">
       <div class="login_prompt">
        <b>Login</b>:
       </div>
       <div class="clearfix">
        <label>Username:</label>
        <input name="username" class="inputtext" type="text" size="20" value="" />
       </div>
         <div class="clearfix">
          <label>Password:</label>
          <input name="password" class="inputtext" type="password" size="20" value=""/>
         </div>
         <input id="submit" class="inputsubmit" value="Login" name="submit" type="submit" />
      </div>
      
      
      <div class="login_sector_fb">
       <div class="login_prompt">Or <b>login</b> with Facebook:</div>
        {% fbconnect_button "medium" %}
      </div>
      
    </form>
    
   </div>
   
    <div class="signup_container">
     Don't have an account? <a href="/runaround/register">Register Now!</a>
    </div>
    
  </div>
 
{% endblock content %}



index.html: Template to display when user is logged in


{% extends "base.html" %}

{% block content %}

 <div class="clearfix">
  <div class="bluebox">
  
   <h3>Where did you run recently?</h3>
   <form action="index.php" method="post">

    <table class="add_run_table">
       
       <tr>
        <td class="editor_key">
          <label id="label_route" for="route">Where did you go?</label>
         </td>
         <td class="editor_value">
           <input id="route" class="inputtext" type="text" size="20" value="" name="route"/>
         </td>
        </tr>
        
        <tr>
        <td class="editor_key">
          <label id="label_miles" for="miles">Number of miles</label>
         </td>
         <td class="editor_value">
           <input id="miles" class="inputtext" type="text" size="20" value="" name="miles"/>
         </td>
        </tr>
        
       <tr>
        <td class="editor_key"><label>Date (MM/DD/YYYY)</label></td>
         <td class="editor_value">
          <input id="date_month" class="inputtext datefield" name="date_month" type="text" size="2" maxlength="2" />
          /<input id="date_day" class="inputtext datefield" name="date_day" type="text" size="2" maxlength="2" />
          /<input id="date_year" class="inputtext datefield" name="date_year" type="text" size="4" maxlength="4" />
         </td>
         </tr>
      </table>
  
    <p id="publish_fb_checkbox" style="'.$style.'" >
        <img src="http://static.ak.fbcdn.net/images/icons/favicon.gif" /> 
        <input type="checkbox" name="publish_to_facebook" checked /> 
        Publish this run to Facebook
         </p>
    <input class="inputsubmit" type="submit" name="submit" value="Add Run"/>
    
   </form>
   
  </div>
 </div>
  
{% endblock content %}

0 comments:

Post a Comment