{% extends "base.html" %}
{% load endless %}
{% load truncatechars %}
{% block title %} — {{ supporter.username }}{% endblock %}
{% block extra_css %}
<link type="text/css" rel="stylesheet" href="/static/css/supporter_layout.css" />
<link type="text/css" rel="stylesheet" href="/static/css/searchandbrowse2.css" />
<link type="text/css" rel="stylesheet" href="/static/css/book_list.css" />
<link type="text/css" rel="stylesheet" href="/static/css/book_panel2.css" />
{% endblock %}
{% block extra_js %}
<script type="text/javascript" src="/static/js/wishlist.js"></script>
<script type="text/javascript" src="{{ jquery_ui_home }}"></script>
<script type="text/javascript" src="/static/js/greenpanel.js"></script>
<script type="text/javascript" src="/static/js/import_books.js"></script>
<script type="text/javascript" src="/static/js/counter.js"></script>

{% if works %}
<!-- when the user's wishlist is empty, views.py gives us works for a slideshow -->
<script src="/static/js/slides.min.jquery.js"></script>
<script src="/static/js/slideshow.js"></script>

<!-- toggle to panelview instead of listview default so slideshow will look right -->
<script type="text/javascript">
    var $j = jQuery.noConflict();
	$j(document).ready(function($) { 
        $('.listview').addClass("panelview").removeClass("listview");
    });    
</script>  
{% else %}
<!-- we only need these when there's stuff on the user's wishlist -->
<script type="text/javascript" src="/static/js/toggle.js"></script>
<script type="text/javascript" src="/static/js/tabs.js"></script>
{% endif %}

<!-- highlight LT/GR add functions when people click on import divs -->
<script type="text/javascript">
var $j = jQuery.noConflict();
function highlightTarget(targetdiv) {
	var target = $j(targetdiv);
    target.css({"background": "#8dc63f"}).animate(
        {backgroundColor: "white"}, 1500
    );
};
</script>
{% endblock %}
{% block extra_head %}
<link rel="alternate" type="application/atom+xml" title="feed for books from {{ supporter }}'s ungluing list" href="feed" />
{% endblock %}


{% block topsection %}
<div id="locationhash">{{ activetab }}</div>
{% ifequal supporter request.user %}
    <div class="launch_top pale">You are logged in as the administrator of {{ supporter.username }}
    </div>
{% endifequal %}

<div id="js-topsection">
    <div class="js-main">
        <div class="js-topnews">
            <div class="js-topnews1">
                <div class="js-topnews2">
                    <div class="js-topnews3">
                        <div class="user-block" itemscope itemtype="http://schema.org/Person">
                            <div id="user-block1">
                                <div class="block-inner">
                                    <img class="user-avatar" src="{{ supporter.profile.avatar_url }}" height="50" width="50" alt="Avatar for {{ supporter }}" title="Avatar" />
                                    <span class="user-name">
                                        <a href="#"><span itemprop="name">{{ supporter.username }}</span></a>
                                    </span>
                                </div>
                                <span class="user-badges">
                                    {% if supporter.profile.badges.all %}
                                        {% for badge in supporter.profile.badges.all %}
                                            <img src="{{ badge.path }}" alt="{{ badge.description }}" title="{{ badge.description }}" width="26" height="26" class="{{ badge.name }}" />                                
                                        {% endfor %}
                                    {% endif %}
                                </span>
                            </div>

                            <div class="user-block23">
                                <span class="user-short-info">
                                    {% with supporter.profile.tagline as tagline %}{% if tagline %}{{ tagline }}{% else %}&nbsp;{% endif %}{% endwith %}
                                </span>
                                {% if supporter.library.group in request.user.groups.all  %}
                                    <i>This is {{ request.user }}'s Library!</i>
                                {% else %}
                                    {% include supporter.library.join_template %}
                                {% endif %}
                            </div>

                            <div class="user-block4">
                                <div class="social">
                                {% if supporter.profile.home_url %}
                                   <a href="{{ supporter.profile.home_url }}" class="nounderline">
                                       <img src="/static/images/supporter_icons/home_square.png" alt="{{ supporter }}'s homepage" title="{{ supporter }}'s Homepage"  />
                                   </a>
                                {% endif %}
                                {% if supporter.profile.facebook_id %}
									<a href="http://www.facebook.com/profile.php?id={{supporter.profile.facebook_id}}" class="nounderline">
										<img src="/static/images/supporter_icons/facebook_square.png" alt="{{ supporter }}'s Facebook" title="{{ supporter }}'s Facebook"  />
									</a>
                                {% endif %}
                                {% if supporter.profile.twitter_id %}
									<a href="https://twitter.com/#!/{{ supporter.profile.twitter_id }}" class="nounderline">
										<img src="/static/images/supporter_icons/twitter_square.png" alt="{{ supporter }}'s Twitter" title="{{ supporter }}'s Twitter"  />
									</a>
                                {% endif %}
                                {% if supporter.profile.goodreads_user_link %}
									<a href="{{supporter.profile.goodreads_user_link}}" class="nounderline">
										<img src="/static/images/supporter_icons/goodreads_square.png" alt="{{ supporter }}'s profile on GoodReads" title="{{ supporter }}'s page on GoodReads"  />
									</a>
                                {% endif %}
                                {% if supporter.profile.librarything_id %}
									<a href="http://www.librarything.com/profile/{{ supporter.profile.librarything_id }}" class="nounderline">
										<img src="/static/images/supporter_icons/librarything_square.png" alt="{{ supporter }}'s profile on LibraryThing" title="{{ supporter }}'s page on LibraryThing"  />
									</a>
                                 {% endif %}
                               </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
       
    </div>
</div>

{% endblock %}

{% block content %}

    <div id="main-container">
    <div class="js-main">
        <div id="js-leftcol">
            {% include "explore.html" %}
        </div>

        <div id="js-maincol-fr">
        <div class="js-maincol-inner">
            <div id="content-block">

                {% if not works %}
                
                {% comment %}
                if we're in empty-wishlist, slideshow mode, suppress tab area
                {% endcomment %}

                <div class="content-block-heading wantto" id="tabs">
                    <ul class="tabs">
                        <li class="tabs1"><a href="#">Unglued</a></li>
                        <li class="tabs2"><a href="#">Active</a></li>
                        <li class="tabs3"><a href="#">Wishlisted</a></li>
                    </ul>
                                        
                        <ul class="book-list-view">
                            <li>View As:</li>
                            <li class="view-list">
                                <a href="#" id="toggle-list">
                                <img src="/static/images/booklist/view-list.png" alt="view list" title="view list" />
                                </a>
                            </li>
                            <li class="view-list">
                                <a href="#" id="toggle-panel">
                                <img src="/static/images/booklist/view-icon.png" alt="view icon" title="view icon" />
                                </a>
                            </li>
                        </ul>
                </div>
                {% endif %}
                
                <div id="content-block-content">
                    {% ifequal wishlist.works.all.count 0 %}
                        {% ifequal request.user supporter %}
                        <div class="empty-wishlist">
                        
                        	<div><h2 style="padding-left:35px;">Add a book to your list to get started.</h2><br /><br /></div>
                        	
                		    <div id="js-slide">
 	   							<div class="js-main">
        							<div class="jsmodule">
        							{% include "slideshow.html" %}
            						</div>
        						</div>
    						</div>

		                    <div id="js-maincontainer-bot-block">
        		                <div id="js-search">
                		        	<label>What book would you give to the world? </label>
				        		        <form action="{% url search %}" method="get">
                						    <input type="text" id="watermark" onfocus="imgfocus()" onblur="imgblur(0)" size="25" class="inputbox" name="q" value="{{ q }}">
                						    <input type="submit" class="greenbutton" value="Search">
               							</form>
                		        </div>
                		    </div>
                		    
                            <br /><br /><hr />We'd also love to hear your <a href="/feedback">feedback</a>.
                        </div>
                        {% else %}
                        <div class="empty-wishlist">
                            It looks like {{ supporter.username }} is just getting started, and hasn't added books just yet.<br /><br />
                        {% endifequal %}
                    {% else %}
                    
                    {% if request.user.is_anonymous %}
                    <div class="tabs-1 anon_about">
                    {% if works_unglued %}
                    {{ supporter }} wants you to know about these free books.  <a href="/about/unglued/" class="hijax">Find out why.</a>
                    {% else %}
                    {{ supporter }} isn't promoting any free books yet.  <a href="/about/unglued_empty/" class="hijax">Find out how you can.</a>
                    {% endif %}
                    </div>
                    <div class="tabs-2 anon_about">
                    {% if works_active %}
                    {{ supporter }} is helping to make these books free.  <a href="/about/active/" class="hijax">Find out how.</a>
                    {% else %}
                    {{ supporter }} isn't ungluing books at the moment.  <a href="/about/active_empty" class="hijax">Find out how you can.</a>
                    {% endif %}
                    </div>
                    <div class="tabs-3 anon_about">
                    {% if works_wished %}
                    {{ supporter }} wants these books to be free.  <a href="/about/wishlist/" class="hijax">Find out how to help.</a>
                    {% else %}
                    {{ supporter }} hasn't decided which books to give the world yet.  <a href="/about/wishlist_empty/" class="hijax">Learn more.</a>
                    {% endif %}
                    </div>
                    {% endif %}

                    {% lazy_paginate 20 works_unglued using "works_unglued" %}
                    {% for work in works_unglued %}
                    <div class="{% cycle 'row1' 'row2' %}">
					{% with work.googlebooks_id as googlebooks_id %}
                    {% include "book_panel.html" %}
                    {% endwith %}
                    </div>
                    {% endfor %}
                    <div class="pagination content-block-heading tabs-1">
                        {% get_pages %}
                        {% for page in pages %}
                        	<a href="{{ page.path }}#1" class="endless_page_link">{{ page.number }}</a>
                        {% endfor %}
                    </div>

                    {% lazy_paginate 20 works_active using "works_active" %}
                    {% for work in works_active %}
                    <div class="{% cycle 'row1' 'row2' %}">
					{% with work.googlebooks_id as googlebooks_id %}
                    {% include "book_panel.html" %}
                    {% endwith %}
                    </div>
                    {% endfor %}
                    <div class="pagination content-block-heading tabs-2">
                        {% get_pages %}
                        {% for page in pages %}
                        	<a href="{{ page.path }}#2" class="endless_page_link">{{ page.number }}</a>
                        {% endfor %}
                    </div>

                    {% lazy_paginate 20 works_wished using "works_wished" %}
                    {% for work in works_wished %}
                    <div class="{% cycle 'row1' 'row2' %}">
					{% with work.googlebooks_id as googlebooks_id %}
                    {% include "book_panel.html" %}
                    {% endwith %}
                    </div>
                    {% endfor %}
                    <div class="pagination content-block-heading tabs-3">
                        {% get_pages %}
                        {% for page in pages %}
                        	<a href="{{ page.path }}#3" class="endless_page_link">{{ page.number }}</a>
                        {% endfor %}
                    </div>
                    
                    {% endifequal %}
                </div>
            </div>    
        </div>
        </div>
    </div>
    </div>

{% endblock %}