aboutsummaryrefslogtreecommitdiff
path: root/design/templates
diff options
context:
space:
mode:
authorluxagraf <sng@luxagraf.net>2018-11-24 22:29:02 -0600
committerluxagraf <sng@luxagraf.net>2018-11-24 22:29:02 -0600
commit0c2a092e8d8ad33a1c306ee9efca0da96eb56415 (patch)
tree0aaf48f20771c97ec30e005ef818ef6ce4856097 /design/templates
parent7a284139f6b97bb06548e69d47eef188bc99099d (diff)
way to much for a single commit
Diffstat (limited to 'design/templates')
-rw-r--r--design/templates/base.html29
-rw-r--r--design/templates/notes/create.html18
-rw-r--r--design/templates/notes/notes_create.html52
-rw-r--r--design/templates/notes/notes_detail.html78
-rw-r--r--design/templates/notes/notes_list.html2
-rw-r--r--design/templates/pages/page.html16
6 files changed, 160 insertions, 35 deletions
diff --git a/design/templates/base.html b/design/templates/base.html
index 6b6ef8c..f14e5df 100644
--- a/design/templates/base.html
+++ b/design/templates/base.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+{% load static %}<!DOCTYPE html>
<!--[if lt IE 8]> <html class="lte8"> <![endif]-->
<!--[if IE 8]> <html class="ie8 lte8"> <![endif]-->
<!--[if IE 9]> <html class="ie9"> <![endif]-->
@@ -10,9 +10,10 @@
<meta property="og:description" content="Note taking for writers">
<meta property="og:site_name" content="Notes">
<meta property="og:image" content="">
-<link rel="stylesheet" href="/media/screenv1.css?{{now}}" type="text/css">
+<link rel="stylesheet" href="/media/screenv1.css?{%now "u"%}" type="text/css">
+{% block extrastyles %}{%endblock%}
<link rel="icon" type="image/png" href="">
-<link rel="manifest" href="/webmanifest.json">
+<!--<link rel="manifest" href="/webmanifest.json">-->
<link rel="apple-touch-icon" sizes="256x256" href="">
</head>
<body class="{% block bodyclass %}{% endblock %}">
@@ -37,11 +38,17 @@
</header>
</div>
<div class="wrapper">
+ <ul class="breadcrumb" id="breadcrumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
+ <li>
+ <a href="/" title="home" itemprop="url"><span itemprop="title">Home</span></a>
+ </li>
+ {% block breadcrumbs %}{% endblock %}
+ </ul>
{% block content %}
{% endblock %}
</div>
<footer>
- <p>&copy; Luxagraf Software. Problems or questions? Contact <a href="{% url 'pages' slug='terms-of-service' %}" title="">support@notes.tld</a>.</p>
+ <p>&copy; Arkhangelsk Software. Problems or questions? Contact <a href="{% url 'pages' slug='terms-of-service' %}" title="">support@notes.tld</a>.</p>
<nav>
<ul>
<li><a href="{% url 'pages' slug='terms-of-service' %}" title="">Terms of Service</a></li>
@@ -56,21 +63,11 @@
{% block extra %}
{%endblock%}
<script async src="/media/js/package.min.js"></script>
+{% block jsinclude %}{%endblock%}
<script>
// Waiting for the DOM to load
document.addEventListener("DOMContentLoaded", function () {
- // Select your overlay trigger
- var trigger = document.querySelector('#overlay-trigger');
- trigger.addEventListener('click', function(e){
- e.preventDefault();
- novicell.overlay.create({
- 'selector': trigger.getAttribute('data-element'),
- 'class': 'selector-overlay',
- "onCreate": function() { console.log('created'); },
- "onLoaded": function() { console.log('loaded'); },
- "onDestroy": function() { console.log('Destroyed'); }
- });
- });
+ {% block jsdomready %}{%endblock%}
});
</script>
</body>
diff --git a/design/templates/notes/create.html b/design/templates/notes/create.html
deleted file mode 100644
index 3bd765d..0000000
--- a/design/templates/notes/create.html
+++ /dev/null
@@ -1,18 +0,0 @@
-{% extends 'base.html' %}
-{% block content %}
-<main>
- <h1>Create a new note</h1>
-<form action="" method="post">
-{% csrf_token %}
-{{ form.non_field_errors }}
-{% for field in form %}
-<fieldset {% if field.errors %}class="error"{%endif%}>
-{{field.label_tag}}
-{{field}}
-{% if field.errors %}{{field.errors}}{% endif %}
-</fieldset>
-{% endfor %}
-<p><input class="btn" value="submit" type="submit" /></p>
-</form>
-</main>
-{% endblock %}
diff --git a/design/templates/notes/notes_create.html b/design/templates/notes/notes_create.html
new file mode 100644
index 0000000..9bbdb26
--- /dev/null
+++ b/design/templates/notes/notes_create.html
@@ -0,0 +1,52 @@
+{% extends 'base.html' %}
+
+{% block extrastyles %}
+<link rel="stylesheet" href="/media/quill.snow.css" />
+{% endblock %}
+{% block content %}
+<main>
+ <h1>Create a new note</h1>
+ <form id="new-note-form" action="{% url 'notes:note-create' %}" method="post">
+{% csrf_token %}
+{{ form.non_field_errors }}
+{% for field in form %}
+<fieldset class="{% if field.errors %}error {%endif%}{% if field.name == 'body_qjson' or field.name == 'body_html' %}hide {%endif%}" id="fs-{{field.name}}" >
+{{field.label_tag}}
+{{field}}
+{% if field.errors %}{{field.errors}}{% endif %}
+</fieldset>
+{% if field.name == 'body_qjson' %}
+<div id="q-container">
+ <div id="note-body"></div>
+</div>
+{% endif %}
+{% endfor %}
+<p><input class="btn btn-inline" value="submit" type="submit" /></p>
+</form>
+</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 note_text = document.getElementById('id_body_text');
+ note_text.innerHTML = "q";
+ var plaintext = document.getElementById("fs-body_text");
+ plaintext.classList.add('hide')
+ initQuill("#note-body");
+ var form = document.getElementById('new-note-form');
+ console.log(form);
+ form.onsubmit = function() {
+ var note_qjson = document.getElementById('id_body_qjson');
+ note_qjson.innerHTML= JSON.stringify(window.quill.getContents());
+ var note_html = document.getElementById('id_body_html');
+ note_html.innerHTML = window.quill.root.innerHTML;
+ var note_text = document.getElementById('id_body_text');
+ note_text.innerHTML = window.quill.getText();
+ };
+{% endblock %}
+</script>
diff --git a/design/templates/notes/notes_detail.html b/design/templates/notes/notes_detail.html
new file mode 100644
index 0000000..bf46ab8
--- /dev/null
+++ b/design/templates/notes/notes_detail.html
@@ -0,0 +1,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
diff --git a/design/templates/notes/notes_list.html b/design/templates/notes/notes_list.html
index 4451588..8066369 100644
--- a/design/templates/notes/notes_list.html
+++ b/design/templates/notes/notes_list.html
@@ -3,7 +3,7 @@
<main>
<h1> Notes</h1>
<ul>{% for obj in object_list %}
- <li><a href="{{obj.get_absolute_url}}">{{obj}}</a></li>
+ <li><a href="{% url 'notes:note-detail' user.username obj.slug %}">{{obj}}</a></li>
{% endfor %}</ul>
</main>
{% endblock %}
diff --git a/design/templates/pages/page.html b/design/templates/pages/page.html
index 91d4732..3feff75 100644
--- a/design/templates/pages/page.html
+++ b/design/templates/pages/page.html
@@ -13,3 +13,19 @@
</div>
{% endif %}
{%endblock%}
+{% block jsdomready %}
+{% if login_form %}
+ // Select your overlay trigger
+ var trigger = document.querySelector('#overlay-trigger');
+ trigger.addEventListener('click', function(e){
+ e.preventDefault();
+ novicell.overlay.create({
+ 'selector': trigger.getAttribute('data-element'),
+ 'class': 'selector-overlay',
+ "onCreate": function() { console.log('created'); },
+ "onLoaded": function() { console.log('loaded'); },
+ "onDestroy": function() { console.log('Destroyed'); }
+ });
+ });
+{% endif %}
+{%endblock%}