{% extends "base.html" %}
{% load url from future %}
+{% load compress %}
{% block title %}
{{ note.name }}
{% endblock %}
{% block pagestyle %}
- <link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/note_course_pages.css">
- <link type="text/css" rel="stylesheet" href="{{ STATIC_URL }}css/annotator.min.css" />
+ {% compress css %}
+ <link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/note_course_pages.css">
+ <link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/annotator.min.css" />
+ {% endcompress %}
{% endblock %}
{% block pagescripts %}
var annotator_js_url = "{{ STATIC_URL }}js/annotator-full.min.js";
var annotator_css_url = "{{ STATIC_URL }}css/annotator.min.css";
var setup_ajax_url = "{{ STATIC_URL }}js/setup-ajax.js";
- var empty_js = "{{ STATIC_URL }}js/empty.js";
+ var note_edit_url = "{% url 'edit_note' note.id %}";
+ var user_authenticated = {% if user.is_authenticated %}true{% else %}false{% endif %};
</script>
- <script src="{{ STATIC_URL }}js/setup-ajax.js"></script>
-{% endblock %}
-
-{% block bodyscripts %}
- <script src="{{ STATIC_URL }}js/note-detail.js" ></script>
- <script src="{{ STATIC_URL }}js/pxem.jQuery.js"></script>
- <script src="{{ STATIC_URL }}js/marked.js" ></script>
- <script src="{{ STATIC_URL }}js/annotator-full.min.js"></script>
- <script src="{{ STATIC_URL }}js/jquery.cookie.js"></script>
+ {% compress js %}
+ <script src="{{ STATIC_URL }}js/setup-ajax.js"></script>
+ <script src="{{ STATIC_URL }}js/note-detail.js" ></script>
+ <script src="{{ STATIC_URL }}js/pxem.jQuery.js"></script>
+ <script src="{{ STATIC_URL }}js/marked.js" ></script>
+ <script src="{{ STATIC_URL }}js/annotator-full.min.js"></script>
+ {% endcompress %}
<script>
- $(function() {
- $(document).foundation('joyride', 'start');
- });
+ {% if show_note_container %}
+ $(function() {
+ $(document).foundation('joyride', 'start');
+ initNoteContentPage();
+ });
+ {% endif %}
+
+ {% if show_keywords %}
+ $(function() {
+ initNoteKeywordsPage();
+ });
+ {% endif %}
</script>
{% endblock %}
<div class="return-to-course show-for-large-up">
<div class="row">
<div class="small-12 columns">
- <a href="{{ note.course.get_absolute_url }}">
+ <a href="{{ note.course.get_absolute_url }}" class="inherit-color">
<i class="fa fa-angle-double-left"></i> See all notes for {{ note.course.name }}
</a>
</div>
{{ note.course.school.name }}
{% endif %}
- <span style="display: inline;"><span class="show-for-large-up"><i class="fa fa-thumbs-up"></i> <span id="thank-number">{{ note.thanks }}</span> Thanks</span></span>
+ <span style="display: inline;"><span class="show-for-large-up"><i class="fa fa-thumbs-up"></i> <span id="thank-number">{{ note.thanks }}</span> Thank{{ note.thanks|pluralize }}</span></span>
</div>
</div>
<button id="flag-button-disabled" class="modify-button disabled opentip"
data-ot="You've already reported this note"
{% include 'partial/opentip_settings.html' %}>
- <i class="fa fa-thumbs-up"></i> Report Note</button>
+ <i class="fa fa-flag"></i> Report Note</button>
{% else %}
- <button id="flag-button" class="modify-button"><i class="fa fa-thumbs-up"></i> Report Note</button>
+ <button id="flag-button" class="modify-button"><i class="fa fa-flag"></i> Report Note</button>
<button id="flag-button-disabled" class="modify-button disabled opentip hide"
data-ot="You've already reported this note"
{% include 'partial/opentip_settings.html' %}>
- <i class="fa fa-thumbs-up"></i> Report Note</button>
+ <i class="fa fa-flag"></i> Report Note</button>
{% endif %}
{% else %}
<button id="flag-button-disabled" class="modify-button disabled opentip"
data-ot="Log in to report this note"
{% include 'partial/opentip_settings.html' %}>
- <i class="fa fa-thumbs-up"></i> Report Note</button>
+ <i class="fa fa-flag"></i> Report Note</button>
{% endif %}
{% if user.is_authenticated %}
<i class="fa fa-download"></i> Download Note</button>
{% endif %}
- {% if user.get_profile.can_edit_items %}
+ {% if user.get_profile.can_edit_items and note.user != user %}
<button id="edit-note-tags" class="modify-button" data-reveal-id="note-tag-dialog">
<i class="fa fa-pencil-square-o"></i> Edit Tags
</button>
{% endif %}
+
+ {% if note.user == request.user %}
+ <button id="edit-button" data-reveal-id="note-edit-dialog" class="modify-button"> <i class="fa fa-edit"></i> Edit This Note</button>
+ {% endif %}
+
+ {% if note.license %}
+ {{ note.license.html|safe }} {% if note.upstream_link %}<a href="{{ note.upstream_link }}" target="_blank">{{ note.upstream_link|slice:":80" }}</a>{% endif %}
+ {% endif %}
</span>
</span>
</div>
<strong>Tags: </strong>
<span class="tags">
{% for tag in note.tags.all %}
- <span class="tag-span">{{ tag.name }}</span>
+ <span class="tag-span">
+ {{ tag.name }}{% if not forloop.last %}, {% endif %}
+ </span>
{% endfor %}
</span>
</div><!-- /note_tags -->
<a class="close-reveal-modal">×</a>
<div class="row">
<div class="small-12 columns">
- <p>Edit this note's tags:
- <input id="note_tags_input" type="text" value="{% for tag in note.tags.all %}{{ tag.name }}{% if not forloop.last %}, {% endif %}{% endfor %}"></p>
- <button id="save_note_tags" type=button><i class="fa fa-save"></i> Save</button>
+ <h3>Edit this note's tags</h3>
+ <input id="note_tags_input" type="text" value="{% for tag in note.tags.all %}{{ tag.name }}{% if not forloop.last %}, {% endif %}{% endfor %}">
+ <button id="save_note_tags" type="submit" value="tags-form"><i class="fa fa-save"></i> Save</button>
</div>
</div>
</div>
- {% if note.license %}
+ <div id="note-edit-dialog" class="reveal-modal" data-reveal>
+ <a class="close-reveal-modal">×</a>
<div class="row">
- <div id="note_pedigree" class="twelve columns activity_details_status">
- {{ note.license.html|safe }} {% if note.upstream_link %}<a href="{{note.upstream_link}}" target="_blank">{{ note.upstream_link|slice:":80" }}</a>{% endif %}
- </div><!-- /note_pedigree -->
+ <div class="small-8 columns">
+ <h3>Edit Your Note</h3>
+ </div>
+ <div class="small-4 columns text-right">
+ <form method="POST" action="{% url 'note_delete' %}">
+ {% csrf_token %}
+ {{ note_delete_form }}
+ <button id="delete-note-button" type="submit" class="scary"><i class="fa fa-trash-o"></i> Delete Note</button>
+ </form>
+ </div>
+ </div>
+ <div class="row">
+ <form method="POST" action="{{ note.get_absolute_url }}">
+ {% csrf_token %}
+ <div class="small-12 large-6 columns">
+ {% with note_edit_form.name as field %}
+ {{ field.errors|safe }}
+ <label for="{{ field.id_for_label }}">{{ field.label }}:</label>
+ {{ field }}
+ <p>{{ field.help_text }}</p>
+ {% endwith %}
+ </div>
+ <div class="small-12 large-6 columns">
+ {% with note_edit_form.tags as field %}
+ {{ field.errors|safe }}
+ <label for="{{ field.id_for_label }}">{{ field.label }}:</label>
+ {{ field }}
+ <p>{{ field.help_text }}</p>
+ {% endwith %}
+ </div>
+ <div class="small-12 columns text-center">
+ <button type="submit"><i class="fa fa-save"></i> Save</button>
+ </div>
+ </form>
</div>
- {% endif %}
+ </div>
</div><!-- /note header -->
<div class="row">
<div id="tabs" class="small-12 columns">
- <dl class="tabs show-for-large-up" data-tab>
- <dd class="active"><a href="#note_container">Note</a></dd>
- <dd><a href="#keywords">Keywords</a></dd>
+ <dl class="tabs">
+ <dd id="note-tab-button" class="{% if show_note_container %}active{% endif %}">
+ <a href="{{ note.get_absolute_url }}">Note</a>
+ </dd>
+ <dd id="keywords-tab-button" class="{% if show_keywords %}active{% endif %}">
+ <a href="{{ note.get_absolute_keywords_url }}">Key Terms & Definitions</a>
+ </dd>
</dl>
<div class="tabs-content">
- <div id="note_container" class="content active">
+ </div>
+ {% if show_note_container %}
+ <div id="note_container" class="">
{% if pdf_controls %}
<div id="zoom-buttons" class="row show-for-medium-up">
<div id="outline-btn-wrapper" class="small-1 columns hide show-for-medium-up">
<div class="row">
<div class="small-12 small-centered columns medium-12 large-12 body_copy">
{% if note.static_html %}
- <div class="note-text">
+ <div id="note-content-wrapper" class="note-text">
{% if note.has_markdown %}
<span id="note-markdown" data-markdown="{{note.notemarkdown.markdown}}"></span>
{% else %}
</div><!-- /body_copy -->
</div>
</div><!-- /note_container -->
-
+ {% endif %}
+ {% if show_keywords %}
<div id="keywords" class="content">
<div class="row">
<div class="small-12 columns">
- <form id="keyword-form" action="{% url 'keyword_edit' note.slug %}" method="post">
+ {% if user.is_authenticated %}
+ <p id="keyword-intro">These key terms and definitions have been defined by KarmaNotes users.
+ You can edit them for accuracy and add more if you like.</p>
+ <p><button id="edit-keywords-button" class="museo700"><i class="fa fa-edit"></i> Edit Key Terms & Definitions</button></p>
+ {% else %}
+ <p id="keyword-intro">These key terms and definitions have been defined by KarmaNotes users.</p>
+ {% endif %}
+ <table id="keywords-data-table">
+ <thead>
+ <tr>
+ <td>Key Terms</td>
+ <td>Definitions</td>
+ </tr>
+ </thead>
+ {% for keyword in keywords %}
+ <tr>
+ <td>{{ keyword.word }}</td>
+ <td>{{ keyword.definition }}</td>
+ </tr>
+ {% endfor %}
+ </table>
+
+ <form id="keyword-form" action="{{ note.get_absolute_keywords_url }}" method="post" class="hide">
{% csrf_token %}
{{ keyword_formset.management_form }}
<div class="hide" id="keyword-form-prototype">
<hr class="hide-for-large-up" />
{% endfor %}
</div>
- <div id="row">
- <div class="small-1 columns">
- <i id="add-row-btn" class="fa fa-plus fa-2x"></i>
+ <div class="row hide-for-medium-down">
+ <div class="small-12 columns">
+ <p class="keywords-hint">(Click <i class="fa fa-plus"></i> or press TAB in the last definition for another row)</p>
+ </div>
+ </div>
+ <div class="row">
+ <div class="small-2 columns">
+ <button type="submit" name="action" value="keyword-form">Save</button>
</div>
- <div class="small-10 large-11 columns center">
- <button type="submit" name="action">Save</button>
+ <div class="small-9 large-10 columns center">
+ <i id="add-row-btn" class="fa fa-plus fa-2x"></i>
</div>
</div>
</form>
</div>
</div>
- </div>
- </div>
+ </div> <!-- keywords -->
+ {% endif %}
</div>
</div>
<ol class="joyride-list" data-joyride
data-options="cookie_monster: true; cookie_name: note_detail_joyride">
- <li data-id="note-markdown" data-text="Awesome!" data-options="tip_location: top">
+ <li data-id="note-content-wrapper" data-text="Awesome!" data-options="tip_location: top">
<p>You can highlight important words or phrases in this note to add definitions for them.</p>
</li>
+ <li data-id="keywords-tab-button" data-text="Awesome!" data-options="tip_location: top">
+ <p>Keywords you define will appear here, and you can define new ones here too.</p>
+ </li>
</ol>
{% endblock %}