{% load snipt_tags %}

<!DOCTYPE html>
<html lang="en" class="{% block html-class %}{% endblock %}">
<head>

    <title>{% block page-title %}Snipt{% endblock %}</title>

    <meta charset="utf-8" />

    {% block page-description %}
        <meta name="description" content="Long-term memory for coders. Share and store code snippets." />
    {% endblock %}

    {% if 'page' in request.GET %}
        <meta name="robots" content="noindex, follow" />
    {% endif %}

    {% if debug %}
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/bootstrap.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/style.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/themes.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/chosen.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/ambiance.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/blackboard.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/cobalt.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/eclipse.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/elegant.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/erlang-dark.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/lesser-dark.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/monokai.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/neat.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/night.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/rubyblue.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/solarized.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/twilight.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/vibrant-ink.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/codemirror-themes/xq-dark.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/highlightjs-themes/tomorrow.css" />
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/blog-themes/default/style.css" />
    {% else %}
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/snipt.css?77" />
    {% endif %}

    {% if has_snipts and not detail %}
        <link rel="alternate" type="application/rss+xml" title="RSS" href="{{ request.path }}?rss{% if not public %}&amp;api_key={{ request.user.api_key.key }}{% endif %}" />
    {% endif %}

    <link rel="author" href="/humans.txt" />

    {% block css %}{% endblock %}

    <!--[if IE]>
        <style type="text/css">
            .group {
                display: block;
                zoom: 1;
            }
        </style>
    <![endif]-->

    <!--[if lt IE 9]>
        <script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

</head>
<body class="{% block body-class %}{% endblock %} {% if request.user.profile.is_pro %}is-pro{% endif %}">
    {% block header %}
        <header class="main">
            <div class="inner">
                <div class="shadey"></div>
                <h1><a href="{% if request.user.is_authenticated %}/{{ request.user.username }}/{% else %}/{% endif %}">snip<span>t</span></a></h1> 
                <form class="search" action="/search/" method="get">
                    <fieldset>
                        <div class="fields">
                            <input type="text" id="search-query" name="q" value="{{ query }}" placeholder="Search snipts" />
                        </div>
                    </fieldset>
                </form>
                <nav class="public">
                    <ul>
                        {% if not request.user.is_authenticated %}
                            <li>
                                <a href="/public/" {% if '/public/' in request.path or public %} class="active"{% endif %}>Public snipts</a>
                            </li>
                            <li>
                                <a href="/login/?next={{ request.path }}" {% if '/login/' in request.path %} class="active"{% endif %}>Log in</a>
                            </li>
                            <li>
                                <a href="/signup/" {% if '/signup/' in request.path %} class="active"{% endif %}>Sign up</a>
                            </li>
                        {% else %}
                            <li>
                                <a href="/{{ request.user.username }}/" {% if request.user.username in request.path %} class="active"{% endif %}>My snipts</a>
                            </li>
                            <li>
                                <a href="/public/" {% if '/public/' in request.path or public %} class="active"{% endif %}>Public snipts</a>
                            </li>
                            <li class="add-snipt">
                                <button class="btn btn-info btn-large" id="add-snipt">
                                    Add {% if request.user.username == 'blog' %}Post{% else %}Snipt{% endif %}
                                    <i class="icon-search icon-plus icon-white"></i>
                                </button>
                            </li>
                        {% endif %}
                    </ul>
                </nav>
                {% if request.user.is_authenticated %}
                    <aside class="nav">
                        <a href="#" class="mini-profile">
                            <span class="avatar" style="background-image: url('https://secure.gravatar.com/avatar/{{ request.user.email|md5 }}?s=35');"></span>
                            <span class="info">
                                <span class="username">{{ request.user.username }}</span>
                                <i class="icon-cog icon-white"></i>
                                <span class="type">
                                    {% if request.user.profile.is_pro %}
                                        <span class="is-pro">Pro</span>
                                    {% else %}
                                        Basic member
                                    {% endif %}
                                </span>
                            </span>
                        </a>
                        <ul>
                            <li>
                                <a href="/{{ request.user.username }}/">
                                    <i class="icon-user icon-white"></i>
                                    Profile
                                </a>
                            </li>
                            {% if request.user.profile.is_pro %}
                                <li>
                                    <a href="/account/stats/">
                                        <i class="icon-star icon-white"></i>
                                        Stats
                                    </a>
                                </li>
                            {% endif %}
                            <li>
                                <a href="/account/">
                                    <i class="icon-cog icon-white"></i>
                                    Account
                                </a>
                            </li>
                            {% if not request.user.profile.is_pro %}
                                <li>
                                    <a href="/pro/">
                                        <i class="icon-star-empty icon-white"></i>
                                        Go Pro
                                    </a>
                                </li>
                            {% endif %}
                            {% if request.user.is_superuser %}
                                <li>
                                    <a href="/admin/">
                                        <i class="icon-cog icon-white"></i>
                                        Admin
                                    </a>
                                </li>
                            {% endif %}
                            <li>
                                <a href="/logout/?next={{ request.path }}">
                                    <i class="icon-off icon-white"></i>
                                    Log out
                                </a>
                            </li>
                        </ul>
                    </aside>
                {% endif %}
            </div>
        </header>
    {% endblock %}
    {% block sub-header %}
        <header class="sub">
            <div class="inner group">
                <ul class="bcrumb">
                    <li class="prompt">/</li>
                    {% block breadcrumb %}{% endblock %}
                </ul>
                <div class="shortcuts">
                    Type "h" for KB shortcuts
                </div>
            </div>
        </header>
    {% endblock %}
    {% block main %}
        <section class="main group" id="main">
            {% block aside %}
                <aside class="main">
                    <div class="save-nate">
                        <a href="http://savenatenow.com/">Save Nate</a>
                    </div>
                    {% block aside-top %}{% endblock %}
                    {% block aside-inner %}{% endblock %}
                    <nav class="footer">
                        <ul>
                            <li class="api">
                                <a href="/api/" {% if '/api/' in request.path %}class="active"{% endif %}><span>API</span></a>
                            </li>
                            <li class="twitter">
                                <a href="https://twitter.com/#!/snipt"><span>@snipt</span></a>
                            </li>
                            {% if not request.user.profile.is_pro %}
                                <li class="pro">
                                    <a href="/pro/"><span>Go Pro</span></a>
                                </li>
                            {% endif %}
                            <li class="blog">
                                <a href="https://blog.snipt.net/"><span>Snipt Blog</span></a>
                            </li>
                            <li class="blog">
                                <a href="/blogging/" {% if '/blogging/' in request.path %}class="active"{% endif %}><span>Blogging on Snipt</span></a>
                            </li>
                            <li class="roadmap">
                                <a href="https://github.com/nicksergeant/snipt/"><span>Open source on GitHub</span></a>
                            </li>
                            <li class="roadmap">
                                <a href="https://github.com/nicksergeant/snipt/issues?state=open"><span>Bugs & feature requests</span></a>
                            </li>
                        </ul>
                    </nav>
                    <div class="linode">
                        <a href="http://www.linode.com/" title="Linode - Xen VPS Hosting. Deploy and Manage Linux Virtual Servers in the Linode Cloud." target="blank">
                            <span>Proudly hosted on</span>
                        </a>
                    </div>
                </aside>
            {% endblock %}
            <div class="inner">
                {% block content %}{% endblock %}
                {% block rochester-made %}
                    <div class="rochester-made">
                        <a href="http://rochestermade.com/" title="Proudly made in Rochester, NY, USA">
                            <img src="{{ STATIC_URL }}images/rochester-made.png" alt="" />
                        </a>
                    </div>
                {% endblock %}
            </div>
            <div class="left-y ruler"></div>
            <div class="right-y ruler"></div>
        </section>
    {% endblock %}
    {% block main-edit %}
        <section class="main group hidden" id="main-edit"></section>
    {% endblock %}
    {% block keyboard-shortcuts %}
        <div class="modal hide" id="keyboard-shortcuts">
            <div class="modal-header">
                <a href="#" class="close">×</a>
                <h3><span>Keyboard shortcuts</span></h3>
            </div>
            <div class="modal-body">
                <table class="table table-striped table-bordered table-condensed">
                    <thead>
                        <tr>
                            <th>Key</th>
                            <th>Function</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>h</td>
                            <td>Show / hide keyboard shortcuts</td>
                        </tr>
                        <tr>
                            <td>/</td>
                            <td>Focus search field</td>
                        </tr>
                        <tr>
                            <td>esc</td>
                            <td>Unfocus search field / deselect snipt</td>
                        </tr>
                        <tr>
                            <td>j</td>
                            <td>Next snipt</td>
                        </tr>
                        <tr>
                            <td>k</td>
                            <td>Previous snipt</td>
                        </tr>
                        <tr>
                            <td>o / return</td>
                            <td>Go to snipt</td>
                        </tr>
                        <tr>
                            <td>u</td>
                            <td>Go to snipt's author</td>
                        </tr>
                        <tr>
                            <td>e</td>
                            <td>Expand / collapse snipt</td>
                        </tr>
                        <tr>
                            <td>v</td>
                            <td>Embed snipt</td>
                        </tr>
                        <tr>
                            <td>c</td>
                            <td>Copy snipt</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-e&gt;</td>
                            <td>Edit snipt</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-delete&gt; or &lt;ctrl-backspace&gt;</td>
                            <td>Delete snipt</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-n&gt; or &lt;alt+n&gt;</td>
                            <td>Add new snipt</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-s&gt;</td>
                            <td>Save snipt</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-c&gt;</td>
                            <td>Save snipt and close</td>
                        </tr>
                        <tr>
                            <td>n</td>
                            <td>Next page</td>
                        </tr>
                        <tr>
                            <td>p</td>
                            <td>Previous page</td>
                        </tr>
                        <tr>
                            <td>g</td>
                            <td>Scroll to top of page</td>
                        </tr>
                        <tr>
                            <td>G</td>
                            <td>Scroll to bottom of page</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-h&gt;</td>
                            <td>Back</td>
                        </tr>
                        <tr>
                            <td>&lt;ctrl-l&gt;</td>
                            <td>Forward</td>
                        </tr>
                        <tr>
                            <td>t</td>
                            <td>Open new window/tab</td>
                        </tr>
                        <tr>
                            <td>r</td>
                            <td>Refresh page</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    {% endblock %}

    {% block extra-scripts %}{% endblock %}
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
    <script type="text/javascript" src="{{ STATIC_URL }}js/snipt.js?45"></script>

    {% block inline-js %}
        <script type="text/javascript">
            {% block js %}

                window.user = '{{ request.user.username }}';
                window.user_id = {{ request.user.id }};
                window.user_profile_id = {{ request.user.profile.id }};

                {% if public %}
                    window.pub = {{ public|lower }};
                {% else %}
                    window.pub = null;
                {% endif %}

                window.api_key = '{{ request.user.api_key.key }}';

            {% endblock %}
            {% if tag %}

                window.tag = '{{ tag.name }}';

            {% endif %}
            {% if request.user.profile.is_pro %}

                window.user_is_pro = true;
                window.default_editor = '{{ request.user.profile.get_default_editor_display|lower }}';
                window.editor_theme = '{{ request.user.profile.editor_theme }}';

            {% else %}

                window.user_is_pro = false;

            {% endif %}
        </script>
    {% endblock %}
    {% if has_snipts and detail %}
        <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    {% endif %}
    {% block snipt-templates %}
        <div class="hidden" id="templates">
            {% include 'snipts/snipt-js-template.html' %}
            {% include 'snipts/snipt-edit-js-template.html' %}
        </div>
    {% endblock %}
    {% if request.user.is_authenticated %}
        {% if not debug %}
            {% block intercom %}
                <script id="IntercomSettingsScriptTag">
                    var intercomSettings = {
                        app_id: 'sajf131y',
                        email: '{{ request.user.email }}',
                        created_at: {{ request.user.date_joined|date:"U" }},
                        custom_data: {
                            'snipts count': {% snipts_count_for_user %},
                            'profile link': 'https://snipt.net/{{ request.user.username }}/'
                        },
                        widget: {
                            activator: '#IntercomDefaultWidget',
                            label: 'Support Chat'
                        }
                    };
                </script>
                <script>
                    (function() {
                         function async_load() {
                             var s = document.createElement('script');
                             s.type = 'text/javascript'; s.async = true;
                             s.src = 'https://api.intercom.io/api/js/library.js';
                             var x = document.getElementsByTagName('script')[0];
                             x.parentNode.insertBefore(s, x);
                         }
                         if (window.attachEvent) {
                             window.attachEvent('onload', async_load);
                         } else {
                             window.addEventListener('load', async_load, false);
                         }
                     })();
                </script>
            {% endblock %}
        {% endif %}
    {% endif %}

    {% include 'analytics.html' %}

    {% block preload %}
        <div class="hidden">
            <img src="{{ STATIC_URL }}images/header-fixed-save.gif" alt="" />
            <img src="{{ STATIC_URL }}images/chosen-sprite.png" alt="" />
            <img src="{{ STATIC_URL }}images/aside-nav-open-bottom-bg.gif" alt="" />
            <img src="{{ STATIC_URL }}images/aside-nav-open-top-bg.gif" alt="" />
        </div>
    {% endblock %}
    
</body>
</html>
