{% load markup %}
{% load thumbnail %}
{% load emailer %}

<div id="wrapperEmailer">
	<link rel="stylesheet" href="/static/css/modules/emailer.css" type="text/css" /> 
       
	<div id="headerEmailer">

		<img src="/static/images/emailer/logo-erang.jpg" width="151" height="127" alt="logo-erang" id="logoImg" /><!-- LOGO IMG -->

		<img src="/static/images/emailer/logoItfSmall.jpg" width="125" height="34" alt="logo-itf-small" id="logoItfSmall" /><!-- LOGO ITF SMALL -->		
        <div class="clear"></div>
        <p id="issueNo">Issue No: {{ issue.issue_no }}<span id="issueDate">{{ issue.date|date:"F j, Y" }}</span></p><!-- ISSUE NO CLOSING -->
		
		<!--<p id="emailerDescription">A fortnightly theatre e-journal from the India Theatre Forum<br>Co-Editors: Vikram Iyengar, Joyoti Roy</p>EMAILER DESCRIPTION CLOSING -->
        
		<ul id="navEmailer">
			<li><a href="#subscribe" id="subscribe" class="toggleBtn" data-toggle="subscribeForm">Subscribe |</a></li>
			<li><a href="#comments">Feedback </a></li>
			<!--<li><a href="">Bulletin Board |</a></li>
			<li><a href="">Links</a></li>-->
		</ul><!--NAV EMAILER CLOSING -->
	    
        <div class="clear"></div>
        <div id="subscribeForm">
            <input id="subscribeInput" />
            <button id="subscribeBtn">Subscribe</button>
        </div>
        <div class="clear"></div>
    
    </div><!-- HEADER EMAILER CLOSING -->

	<div id="contentEmailer">
{% if weblinks %}
		<div class="contentBoxes">
			<h1>WEB LINKS</h1>
            {% for weblink in weblinks %}
            <p>• {{ weblink.box_title|truncatewords:12 }}</p>
            {% endfor %}
            <p class="contentBoxesMore"><a href="#weblinks">More &#187;</a></p>
		</div><!-- CONTENT BOXES CLOSING -->
{% endif %}
{% if bbitems %}
		<div class="contentBoxes">
			<h1>BULLETIN BOARD</h1>
            {% for bbitem in bbitems %}
                <p>• {{ bbitem.box_title|truncatewords:12 }}</p>
            {% endfor %}
            <p class="contentBoxesMore"><a href="#bbitems">More &#187;</a></p>
		</div><!-- CONTENT BOXES CLOSING -->
{% endif %}
        </div><!-- CONTENT BOXES CLOSING -->

	    <div class="clear"></div>
        
		<div class="articleEmailer">
            {% for article in articles %}
			<div class="articleTitle">{{ article.title }}</div>
            {% if article.author %}
            <div class="articleAuthor">by: {{ article.author }}</div><!-- ARTICLE TITLE CLOSING -->
            {% endif %}
			<div class="clear"></div>

            {% if article.main_image %}            	
			<div class="articleImg">
                {% thumbnail article.main_image "x380" as im %}
                    <img class="itfInfoImg" src="{{ im.url }}" />
                {% endthumbnail %}
            </div><!-- ARTICLE IMAGE CLOSING -->
            {% endif %}
			<div class="articleCaption">{{ article.subtitle|markdown }}</div><!-- ARTICLE CAPTION CLOSING -->
			<div class="articleText">{{ article.text|insert_images_web:article.id|markdown }}</div>
            <div class="authorBio">{{ article.author_bio|markdown }}</div>
            {% endfor %}
        </div><!-- ARTICLE EMAILER CLOSING -->
{% if weblinks %}
		<div class="contentLinks">
        	<a name="weblinks"></a><h1>WEB LINKS</h1>
            {% for weblink in weblinks %}
            <h2><a href="{{weblink.url}}" target="_blank">{{ weblink.title }}</a></h2>
            {{ weblink.text|markdown }}
            {% endfor %}
        </div><!-- WEB LINKS CLOSING -->
{% endif %}
{% if bbitems %}
		<div class="contentLinks">
        	<a name="bbitems"></a><h1>BULLETIN BOARD</h1>
            {% for bbitem in bbitems %}
            <h2 class="orange">{{ bbitem.title }}</h2>
            {{ bbitem.text|markdown }}
            {% endfor %}
        </div><!-- WEB LINKS CLOSING -->
{% endif %}

	</div><!-- CONTENT EMAILER CLOSING -->

	<div id="footerEmailer">
    	<p>A fortnightly theatre e-journal from the India Theatre Forum<br />
		 Co-Editors: Vikram Iyengar, Joyoti Roy</p>
        <p>Views expressed in the articles in e-Rang are personal.<br />
        e-Rang does not hold copyright of any piece.<br />
		Any enquiry for re-use of articles should be addressed to the authors.</p>
        <p>Contribute your articles to e-Rang and become part of this theatre community! Email us at <a href="">erang@theatreforum.in</a> to know
more about how to contribute..</p>
		<p>The India Theatre Forum (ITF), a Prithvi Theatre initiative, was formed in 2006 as a loose 
association of theatre people coming together in the larger interests of theatre. For more on the ITF, please visit 
<a href="">www.theatreforum.in</a>. The ITF is currently supported by HIVOS.</p>

<p>If you'd prefer not to receive theatre updates and theatre news, simply click here to <a href="">unsubscribe.</a></p>
    
    </div><!-- FOOTER EMAILER CLOSING -->


    <div id="commentWrapper">
      {% load comments %}
      <h3>Comments and Feedback</h3>

      {% get_comment_list for issue as comment_list %}

      {% ifnotequal comment_list|length 0 %}
        <div id="comments_list">
          {% for comment in comment_list %}
            <div class="comment {% cycle 'commentOdd' 'commentEven' %}">
              <div class="comment_user">
              {{ comment.user_name }}:
              </div>
              <div class="comment_comment">
              {{ comment.comment }}
              </div>
            </div>
          {% endfor %}
        </div>
      {% endifnotequal %}


      {% get_comment_form for issue as form %}

      <div id="comment_form">
        <a name="comments"></a>
        <h4 class="formHeader">
          Leave a Response:
        </h4>
        <form action="{% comment_form_target %}" method="POST">
          {% csrf_token %}
          <input type="hidden" name="next" value="{{ issue.get_absolute_url }}" />
          <table id="form_table">
            <tr class="leave_response">
              <th></th>
              <td>
               
              </td>
            </tr>
        {{ form }}
            <tr>
              <th></th>
              <td><input type="submit" name="post" class="submit-post" value="Post"></td>
            </tr>
          </table>
        </form>
      </div>
    </div>


</div>

<script type="text/javascript">
    $('#subscribeBtn').click(function() {
        $(this).attr("disabled", "disabled");
        var email = $.trim($('#subscribeInput').val());
        if (!isRFC822ValidEmail(email)) {
            alert("please enter a valid email address");
        } else {
            $.post("/erang/subscribe/", {
                'email': email
            }, function(response) {
                $('#subscribeForm').text(email + " has been subscribed. Thanks.");
            });
        }
    });

</script>