In js-supporting browsers, use ctrl-enter to submit toots

This pulls in our first external javascript dependency! And thus a yarn.lock.
This commit is contained in:
Jason McBrayer 2018-06-12 08:35:23 -04:00
parent 9c430fbca3
commit eae810c15c
10 changed files with 100 additions and 20 deletions

1
.gitignore vendored
View File

@ -109,3 +109,4 @@ lib64
pip-selfcheck.json
/Pipfile.lock
/dev_https
node_modules

11
brutaldon/static/js/mousetrap.min.js vendored Normal file
View File

@ -0,0 +1,11 @@
/* mousetrap v1.6.2 craig.is/killing/mice */
(function(p,t,h){function u(a,b,d){a.addEventListener?a.addEventListener(b,d,!1):a.attachEvent("on"+b,d)}function y(a){if("keypress"==a.type){var b=String.fromCharCode(a.which);a.shiftKey||(b=b.toLowerCase());return b}return m[a.which]?m[a.which]:q[a.which]?q[a.which]:String.fromCharCode(a.which).toLowerCase()}function E(a){var b=[];a.shiftKey&&b.push("shift");a.altKey&&b.push("alt");a.ctrlKey&&b.push("ctrl");a.metaKey&&b.push("meta");return b}function v(a){return"shift"==a||"ctrl"==a||"alt"==a||
"meta"==a}function z(a,b){var d,e=[];var c=a;"+"===c?c=["+"]:(c=c.replace(/\+{2}/g,"+plus"),c=c.split("+"));for(d=0;d<c.length;++d){var k=c[d];A[k]&&(k=A[k]);b&&"keypress"!=b&&B[k]&&(k=B[k],e.push("shift"));v(k)&&e.push(k)}c=k;d=b;if(!d){if(!n){n={};for(var h in m)95<h&&112>h||m.hasOwnProperty(h)&&(n[m[h]]=h)}d=n[c]?"keydown":"keypress"}"keypress"==d&&e.length&&(d="keydown");return{key:k,modifiers:e,action:d}}function C(a,b){return null===a||a===t?!1:a===b?!0:C(a.parentNode,b)}function e(a){function b(a){a=
a||{};var b=!1,l;for(l in n)a[l]?b=!0:n[l]=0;b||(w=!1)}function d(a,b,r,g,F,e){var l,D=[],h=r.type;if(!f._callbacks[a])return[];"keyup"==h&&v(a)&&(b=[a]);for(l=0;l<f._callbacks[a].length;++l){var d=f._callbacks[a][l];if((g||!d.seq||n[d.seq]==d.level)&&h==d.action){var c;(c="keypress"==h&&!r.metaKey&&!r.ctrlKey)||(c=d.modifiers,c=b.sort().join(",")===c.sort().join(","));c&&(c=g&&d.seq==g&&d.level==e,(!g&&d.combo==F||c)&&f._callbacks[a].splice(l,1),D.push(d))}}return D}function h(a,b,d,g){f.stopCallback(b,
b.target||b.srcElement,d,g)||!1!==a(b,d)||(b.preventDefault?b.preventDefault():b.returnValue=!1,b.stopPropagation?b.stopPropagation():b.cancelBubble=!0)}function c(a){"number"!==typeof a.which&&(a.which=a.keyCode);var b=y(a);b&&("keyup"==a.type&&x===b?x=!1:f.handleKey(b,E(a),a))}function k(a,d,r,g){function l(d){return function(){w=d;++n[a];clearTimeout(p);p=setTimeout(b,1E3)}}function e(d){h(r,d,a);"keyup"!==g&&(x=y(d));setTimeout(b,10)}for(var c=n[a]=0;c<d.length;++c){var f=c+1===d.length?e:l(g||
z(d[c+1]).action);m(d[c],f,g,a,c)}}function m(a,b,c,g,e){f._directMap[a+":"+c]=b;a=a.replace(/\s+/g," ");var h=a.split(" ");1<h.length?k(a,h,b,c):(c=z(a,c),f._callbacks[c.key]=f._callbacks[c.key]||[],d(c.key,c.modifiers,{type:c.action},g,a,e),f._callbacks[c.key][g?"unshift":"push"]({callback:b,modifiers:c.modifiers,action:c.action,seq:g,level:e,combo:a}))}var f=this;a=a||t;if(!(f instanceof e))return new e(a);f.target=a;f._callbacks={};f._directMap={};var n={},p,x=!1,q=!1,w=!1;f._handleKey=function(a,
c,e){var g=d(a,c,e),f;c={};var l=0,k=!1;for(f=0;f<g.length;++f)g[f].seq&&(l=Math.max(l,g[f].level));for(f=0;f<g.length;++f)g[f].seq?g[f].level==l&&(k=!0,c[g[f].seq]=1,h(g[f].callback,e,g[f].combo,g[f].seq)):k||h(g[f].callback,e,g[f].combo);g="keypress"==e.type&&q;e.type!=w||v(a)||g||b(c);q=k&&"keydown"==e.type};f._bindMultiple=function(a,b,c){for(var d=0;d<a.length;++d)m(a[d],b,c)};u(a,"keypress",c);u(a,"keydown",c);u(a,"keyup",c)}if(p){var m={8:"backspace",9:"tab",13:"enter",16:"shift",17:"ctrl",
18:"alt",20:"capslock",27:"esc",32:"space",33:"pageup",34:"pagedown",35:"end",36:"home",37:"left",38:"up",39:"right",40:"down",45:"ins",46:"del",91:"meta",93:"meta",224:"meta"},q={106:"*",107:"+",109:"-",110:".",111:"/",186:";",187:"=",188:",",189:"-",190:".",191:"/",192:"`",219:"[",220:"\\",221:"]",222:"'"},B={"~":"`","!":"1","@":"2","#":"3",$:"4","%":"5","^":"6","&":"7","*":"8","(":"9",")":"0",_:"-","+":"=",":":";",'"':"'","<":",",">":".","?":"/","|":"\\"},A={option:"alt",command:"meta","return":"enter",
escape:"esc",plus:"+",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},n;for(h=1;20>h;++h)m[111+h]="f"+h;for(h=0;9>=h;++h)m[h+96]=h.toString();e.prototype.bind=function(a,b,d){a=a instanceof Array?a:[a];this._bindMultiple.call(this,a,b,d);return this};e.prototype.unbind=function(a,b){return this.bind.call(this,a,function(){},b)};e.prototype.trigger=function(a,b){if(this._directMap[a+":"+b])this._directMap[a+":"+b]({},a);return this};e.prototype.reset=function(){this._callbacks={};
this._directMap={};return this};e.prototype.stopCallback=function(a,b){return-1<(" "+b.className+" ").indexOf(" mousetrap ")||C(b,this.target)?!1:"INPUT"==b.tagName||"SELECT"==b.tagName||"TEXTAREA"==b.tagName||b.isContentEditable};e.prototype.handleKey=function(){return this._handleKey.apply(this,arguments)};e.addKeycodes=function(a){for(var b in a)a.hasOwnProperty(b)&&(m[b]=a[b]);n=null};e.init=function(){var a=e(t),b;for(b in a)"_"!==b.charAt(0)&&(e[b]=function(b){return function(){return a[b].apply(a,
arguments)}}(b))};e.init();p.Mousetrap=e;"undefined"!==typeof module&&module.exports&&(module.exports=e);"function"===typeof define&&define.amd&&define(function(){return e})}})("undefined"!==typeof window?window:null,"undefined"!==typeof window?document:null);

View File

@ -14,6 +14,8 @@
integrity="sha256-MGU/JUq/40CFrfxjXb5pZjpoZmxiP2KuICN5ElLFNd8="
crossorigin="anonymous">
<link rel="stylesheet" href="{% static "css/brutaldon.css" %}">
{% block page_scripts %}
{% endblock %}
{% else %}
<link rel="stylesheet" href="{% static "css/fullbrutalism.css" %}" >
{% endif %}
@ -126,6 +128,9 @@ document.addEventListener('DOMContentLoaded', function () {
});
</script>
{% block page_scripts_inline %}
{% endblock %}
{% endif %}
</body>

View File

@ -1,10 +1,27 @@
{% extends "base.html" %}
{% load static %}
{% block title %} Brutaldon - toot {% endblock %}
{% block page_scripts %}
<script src="{% static 'js/mousetrap.min.js' %}" type="application/javascript"></script>
{% endblock %}
{% block content %}
<h1 class="title" >Toot!</h1>
<div class="box">
{% include "main/post_partial.html" %}
</div>
{% endblock %}
{% block page_scripts_inline %}
<script type="application/javascript">
document.addEventListener('DOMContentLoaded', function () {
Mousetrap.bind('ctrl+enter', function(e) {
var form = document.querySelector('#post-form');
form.submit();
return true;
});
});
</script>
{% endblock %}

View File

@ -1,11 +1,11 @@
{% load widget_tweaks %}
<form method="post" action="{% url "toot" %}" enctype="multipart/form-data">
<form method="post" id="post-form" action="{% url "toot" %}" enctype="multipart/form-data">
{% csrf_token %}
<div class="field" >
<label class="label" >{{ form.status.label }}</label>
<div class="control">
{% render_field form.status class+="textarea is-primary" rows="4" %}
{% render_field form.status class+="textarea is-primary mousetrap" rows="4" %}
</div>
</div>

View File

@ -1,7 +1,7 @@
{% load widget_tweaks %}
{% if reply %}
<form method="post" action="{% url "reply" toot.id %}" enctype="multipart/form-data">
<form method="post" id="post-form" action="{% url "reply" toot.id %}" enctype="multipart/form-data">
{% else %}
<form method="post" action="{% url "toot" %}" enctype="multipart/form-data">
{% endif %}
@ -10,14 +10,14 @@
<div class="field">
<label class="label"> {{ form.spoiler_text.label }}</label>
<div class="control">
{% render_field form.spoiler_text class+="input" placeholder="Optional" %}
{% render_field form.spoiler_text class+="input mousetrap" placeholder="Optional" %}
</div>
</div>
<div class="field" >
<label class="label" >{{ form.status.label }}</label>
<div class="control">
{% render_field form.status class+="textarea is-primary" rows="4" %}
{% render_field form.status class+="textarea mousetrap is-primary" rows="4" %}
</div>
</div>
@ -48,7 +48,7 @@
</label>
</div>
<div class="control is-expanded">
{% render_field form.media_text_1 class+="input" placeholder="Describe attachment" %}
{% render_field form.media_text_1 class+="input mousetrap" placeholder="Describe attachment" %}
</div>
</div>
@ -67,7 +67,7 @@
</label>
</div>
<div class="control is-expanded">
{% render_field form.media_text_2 class+="input" placeholder="Describe attachment" %}
{% render_field form.media_text_2 class+="input mousetrap" placeholder="Describe attachment" %}
</div>
</div>
@ -86,7 +86,7 @@
</label>
</div>
<div class="control is-expanded">
{% render_field form.media_text_3 class+="input" placeholder="Describe attachment" %}
{% render_field form.media_text_3 class+="input mousetrap" placeholder="Describe attachment" %}
</div>
</div>
<div class="field has-addons">
@ -104,7 +104,7 @@
</label>
</div>
<div class="control is-expanded">
{% render_field form.media_text_4 class+="input" placeholder="Describe attachment" %}
{% render_field form.media_text_4 class+="input mousetrap" placeholder="Describe attachment" %}
</div>
</div>

View File

@ -1,20 +1,37 @@
{% extends "base.html" %}
{% load humanize %}
{% load static %}
{% block title %}
Brutaldon - reply
Brutaldon - reply
{% endblock %}
{% block page_scripts %}
<script src="{% static 'js/mousetrap.min.js' %}" type="application/javascript"></script>
{% endblock %}
{% block content %}
<h1 class="title">Thread</h1>
{% for ancestor in context.ancestors %}
{% include "main/toot_partial.html" with toot=ancestor %}
<hr class="is-hidden">
{% endfor %}
{% include "main/toot_partial.html" with toot=toot active=True %}
<hr class="is-hidden">
<div class="box">
{% include "main/post_partial.html" %}
</div>
<h1 class="title">Thread</h1>
{% for ancestor in context.ancestors %}
{% include "main/toot_partial.html" with toot=ancestor %}
<hr class="is-hidden">
{% endfor %}
{% include "main/toot_partial.html" with toot=toot active=True %}
<hr class="is-hidden">
<div class="box">
{% include "main/post_partial.html" %}
</div>
{% endblock %}
{% block page_scripts_inline %}
<script type="application/javascript">
document.addEventListener('DOMContentLoaded', function () {
Mousetrap.bind('ctrl+enter', function(e) {
var form = document.querySelector('#post-form');
form.submit();
return true;
});
});
</script>
{% endblock %}

View File

@ -1,10 +1,15 @@
{% extends "base.html" %}
{% load humanize %}
{% load static %}
{% block title %}
Brutaldon - {{ timeline_name }} timelime
{% endblock %}
{% block page_scripts %}
<script src="{% static 'js/mousetrap.min.js' %}" type="application/javascript"></script>
{% endblock %}
{% block content %}
{% if form %}
<h1 class="title">Post</h1>
@ -34,3 +39,15 @@ Brutaldon - {{ timeline_name }} timelime
</nav>
{% endblock %}
{% endblock %}
{% block page_scripts_inline %}
<script type="application/javascript">
document.addEventListener('DOMContentLoaded', function () {
Mousetrap.bind('ctrl+enter', function(e) {
var form = document.querySelector('#post-form');
form.submit();
return true;
});
});
</script>
{% endblock %}

5
package.json Normal file
View File

@ -0,0 +1,5 @@
{
"dependencies": {
"mousetrap": "^1.6.2"
}
}

7
yarn.lock Normal file
View File

@ -0,0 +1,7 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
mousetrap@^1.6.2:
version "1.6.2"
resolved "https://registry.yarnpkg.com/mousetrap/-/mousetrap-1.6.2.tgz#caadd9cf886db0986fb2fee59a82f6bd37527587"