1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
|
{% extends 'base.html' %}
{% block extrastyles %}
<link rel="stylesheet" href="/media/quill.snow.css" />
{% endblock %}
{% block breadcrumbs %}
<li><a href="{%url 'notes:note-list' user.username %}">Notes</a></li>
{% endblock %}
{% block content %}
<main>
<article class="note-container">
<header class="note-header">
<button class="hide btn btn-accent" id="edit-toggle-btn">Edit</button>
<div class="note-header-float">
<h2 class="note-time">{{object.date_created|date:"M d, Y"}}</h2>
{% if object.url %}<h3 class="note-url"><a class="btn btn-small btn-subtle" href="{{object.url}}">Source</a><a class="btn btn-small btn-subtle left-margin-2" href="object.cache">Archive</a></h3>{% endif %}
</div>
</header>
<h1 id="note-title" class="note-title">{{object.title}}</h1>
<div id="q-container" class="inactive"><div id="note-body">{% if object.body_html %}{{object.body_html|safe}}{%else%}{{object.body_text}}{%endif%}</div></div>
<form action="" method="post" id="note-edit-form">{% csrf_token %}
{% for field in form %}{% if field.name in "title body_text" %}
<div class="hide">{{field}}</div>
{% endif%}{% endfor %}
<input id="btn-js-hide" type="submit" class="btn sm" value="Save" >
</form>
</article>
<aside class="note-list-container">
<div class="">
<ul>{% for obj in notes_list %}
<li>
<a href="{% url 'notes:note-detail' user.username obj.slug %}">
<h4>{{obj.title}}</h4>
<div class="note-preview">{{obj.body_text|truncatewords:12}}</div>
</a>
</li>
{% endfor %}</ul>
</div>
</aside>
</main>
{% endblock %}
{% block jsinclude %}
<script src="/media/js/highlight.pack.js"></script>
<script src="/media/js/quill.min.js"></script>
{% endblock %}
<script>
{% block jsdomready %}
var btn = document.getElementById("edit-toggle-btn"),
qcontainer = document.getElementById('q-container'),
title = document.getElementById('note-title'),
form = document.getElementById('note-edit-form'),
note_html = document.createElement('textarea'),
note_qjson = document.createElement('textarea');
window.editing = false;
window.quillchange = false;
btn.classList.remove('hide');
initQuill("#note-body");
note_html.setAttribute('name', 'body_html');
note_html.setAttribute('class', 'hide');
note_html.setAttribute('id', 'id_body_html');
note_qjson.setAttribute('name', 'body_qjson');
note_qjson.setAttribute('id', 'id_body_qjson');
note_qjson.setAttribute('class', 'hide');
form.appendChild(note_html);
form.appendChild(note_qjson);
document.getElementById("btn-js-hide").classList.add("hide");
btn.addEventListener('click', function(){edit_note(this, title, qcontainer, window.quill, "{% url 'notes-api-detail' object.pk %}" )}, false)
{%endblock%}
</script>
'indent
'align
'direction
'code-block
|