{% extends "main.html" %}

{% block header %}
<title>{{ name }} - owllook</title>
<link rel="stylesheet" href="static/novels/css/content.css">
<style>
    #yun-tie-sdk-wrap {
        background-color: #f8f3e9 !important;
        margin-top: 20px;
    }
</style>
{% endblock %}

{% block content %}

<nav class="navbar navbar-default nav-search">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="/">
            </a>
        </div>
        <form action="/search" method="get">
            <div class="col-xs-3 search">
                <input type="text" name="wd" placeholder="search" value="">
            </div>
        </form>
        {% if is_login %}
        <div class="header">
            {% include "login.html" %}
        </div>
        {% else %}
        <div class="login">
            <a class="btn btn-primary pull-right" href="#" role="button" data-toggle="modal" data-target="#login">登录</a>
        </div>
        {% endif %}
    </div>
</nav>

<div class="container all-content">
    <input id="content_url" type="hidden" value="{{content_url}}">
    <input id="url" type="hidden" value="{{url}}">
    <input id="chapter_url" type="hidden" value="{{chapter_url}}">
    <input id="novels_name" type="hidden" value="{{novels_name}}">
    <div class="title">
        {% if bookmark %}
        <a id="bookMark" title="书签" class="bookMarkAct"></a>
        {% else %}
        <a id="bookMark" title="书签" class="bookMark"></a>
        {% endif %}
        <h2 id="content_name">{{name}}</h2>
    </div>
    <div class="left-bar-list">
        <div class="left-bar-flag">
            <a href="/chapter?url={{chapter_url}}&novels_name={{novels_name}}">
                <span class="glyphicon glyphicon-list" aria-hidden="true"></span>
                <div>目录</div>
            </a>
        </div>
        <div class="left-bar-flag">
            <a href="">
                <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
                <div>设置</div>
            </a>
        </div>
        <div class="left-bar-flag">
            {% if book %}
            <a id="owllook_book" class="add-color" href="javascript:;">
                <span class="glyphicon glyphicon-book" aria-hidden="true"></span>
                <div>书架</div>
            </a>
            {% else %}
            <a id="owllook_book" href="javascript:;">
                <span class="glyphicon glyphicon-book" aria-hidden="true"></span>
                <div>书架</div>
            </a>
            {% endif %}

        </div>
        <div class="left-bar-flag">
            <a href="">
                <span class="glyphicon glyphicon-tasks" aria-hidden="true"></span>
                <div>书单</div>
            </a>
        </div>
    </div>
    <div class="show-content">
        {% for item in soup -%}
        {{item|safe}}
        {%- endfor %}
    </div>
    <div class="pre_next">
        {% for v in next_chapter%}

        <a href="/owllook_content?url={{next_chapter[v]}}&chapter_url={{chapter_url}}&novels_name={{novels_name}}"
           class="btn btn-default">
            {{v}}
        </a>

        {% endfor %}
    </div>
    <div class="move">
        <div class="move_up">
            <span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
        </div>
        <div class="move_down">
            <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
        </div>
    </div>
    <!--{% include "comment.html" %}-->
</div>
{% endblock %}
{% block script %}
<script src="static/novels/js/content.js"></script>
{% endblock %}