Add a MarkdownInput widget, and make use of it

Signed-off-by: Skia <skia@libskia.so>
This commit is contained in:
Skia 2017-06-10 19:39:40 +02:00
parent 4b9fa0cd57
commit 2925cde8ab
6 changed files with 38 additions and 14 deletions

View File

@ -515,6 +515,12 @@ textarea {
margin: 1px; margin: 1px;
font-size: smaller; font-size: smaller;
} }
a {
color: $black-color;
}
a:hover {
text-decoration: underline;
}
} }
.tools { .tools {
@ -551,6 +557,12 @@ textarea {
margin: 1px; margin: 1px;
font-size: smaller; font-size: smaller;
} }
a {
color: $black-color;
}
a:hover {
text-decoration: underline;
}
} }
.category { .category {

View File

@ -248,8 +248,7 @@ function add_syntax(e, choice) {
} }
$(document).ready(function() { $(document).ready(function() {
textarea = $('.markdown_editor textarea'); editor = $('.markdown_editor');
editor = textarea.parent();
editor.prepend('<a onclick="javascript:add_syntax(this, \'image\')">{% trans %}Image{% endtrans %}</a>'); editor.prepend('<a onclick="javascript:add_syntax(this, \'image\')">{% trans %}Image{% endtrans %}</a>');
editor.prepend('<a onclick="javascript:add_syntax(this, \'link\')">{% trans %}Link{% endtrans %}</a>'); editor.prepend('<a onclick="javascript:add_syntax(this, \'link\')">{% trans %}Link{% endtrans %}</a>');
editor.prepend('<a onclick="javascript:add_syntax(this, \'sup\')"><sup>{% trans %}sup{% endtrans %}</sup></a>'); editor.prepend('<a onclick="javascript:add_syntax(this, \'sup\')"><sup>{% trans %}sup{% endtrans %}</sup></a>');
@ -258,7 +257,6 @@ $(document).ready(function() {
editor.prepend('<a onclick="javascript:add_syntax(this, \'underline\')"><u>{% trans %}U{% endtrans %}</u></a>'); editor.prepend('<a onclick="javascript:add_syntax(this, \'underline\')"><u>{% trans %}U{% endtrans %}</u></a>');
editor.prepend('<a onclick="javascript:add_syntax(this, \'italic\')"><i>{% trans %}I{% endtrans %}</i></a>'); editor.prepend('<a onclick="javascript:add_syntax(this, \'italic\')"><i>{% trans %}I{% endtrans %}</i></a>');
editor.prepend('<a onclick="javascript:add_syntax(this, \'bold\')"><b>{% trans %}B{% endtrans %}</b></a>'); editor.prepend('<a onclick="javascript:add_syntax(this, \'bold\')"><b>{% trans %}B{% endtrans %}</b></a>');
console.log(textarea.parent());
}); });
</script> </script>
{% endblock %} {% endblock %}

View File

@ -27,7 +27,7 @@ from django import forms
from django.db import transaction from django.db import transaction
from django.core.exceptions import ValidationError from django.core.exceptions import ValidationError
from django.contrib.auth import logout, login, authenticate from django.contrib.auth import logout, login, authenticate
from django.forms import CheckboxSelectMultiple, Select, DateInput, TextInput, DateTimeInput from django.forms import CheckboxSelectMultiple, Select, DateInput, TextInput, DateTimeInput, Textarea
from django.utils.translation import ugettext_lazy as _ from django.utils.translation import ugettext_lazy as _
from django.utils.translation import ugettext from django.utils.translation import ugettext
from phonenumber_field.widgets import PhoneNumberInternationalFallbackWidget from phonenumber_field.widgets import PhoneNumberInternationalFallbackWidget
@ -73,6 +73,13 @@ class SelectDate(DateInput):
attrs = {'class': "select_date"} attrs = {'class': "select_date"}
return super(SelectDate, self).render(name, value, attrs) return super(SelectDate, self).render(name, value, attrs)
class MarkdownInput(Textarea):
def render(self, name, value, attrs=None):
output = '<div class="markdown_editor">%(content)s</div>' % {
'content': super(MarkdownInput, self).render(name, value, attrs),
}
return output
class SelectFile(TextInput): class SelectFile(TextInput):
def render(self, name, value, attrs=None): def render(self, name, value, attrs=None):
if attrs: if attrs:

View File

@ -30,10 +30,10 @@ from django.views.generic.edit import UpdateView, CreateView, DeleteView
from django.contrib.auth.decorators import login_required, permission_required from django.contrib.auth.decorators import login_required, permission_required
from django.utils.decorators import method_decorator from django.utils.decorators import method_decorator
from django.forms.models import modelform_factory from django.forms.models import modelform_factory
from django.forms import CheckboxSelectMultiple from django.forms import CheckboxSelectMultiple, modelform_factory
from core.models import Page, PageRev, LockError from core.models import Page, PageRev, LockError
from core.views.forms import PagePropForm from core.views.forms import PagePropForm, MarkdownInput
from core.views import CanViewMixin, CanEditMixin, CanEditPropMixin, CanCreateMixin from core.views import CanViewMixin, CanEditMixin, CanEditPropMixin, CanCreateMixin
class PageListView(CanViewMixin, ListView): class PageListView(CanViewMixin, ListView):
@ -147,7 +147,7 @@ class PagePropView(CanEditPropMixin, UpdateView):
class PageEditView(CanEditMixin, UpdateView): class PageEditView(CanEditMixin, UpdateView):
model = PageRev model = PageRev
fields = ['title', 'content',] form_class = modelform_factory(model=PageRev, fields=['title', 'content',], widgets={'content': MarkdownInput})
template_name = 'core/pagerev_edit.jinja' template_name = 'core/pagerev_edit.jinja'
def get_object(self): def get_object(self):

View File

@ -22,18 +22,16 @@
<div id="forum"> <div id="forum">
<h3>{{ topic.title }}</h3> <h3>{{ topic.title }}</h3>
<h4>{% trans %}Reply{% endtrans %}</h4> <h4>{% trans %}Reply{% endtrans %}</h4>
{% else %} {% else %}
<div id="forum">
<h4>{% trans %}New topic{% endtrans %}</h4> <h4>{% trans %}New topic{% endtrans %}</h4>
{% endif %} {% endif %}
<form action="" method="post" enctype="multipart/form-data"> <form action="" method="post" enctype="multipart/form-data">
{% csrf_token %} {% csrf_token %}
<p>{{ form.title.errors }}<label for="{{ form.title.name }}">{{ form.title.label }}</label> {{ form.title }}</p> <p>{{ form.title.errors }}<label for="{{ form.title.name }}">{{ form.title.label }}</label> {{ form.title }}</p>
<p>{{ form.message.errors }}<label for="{{ form.message.name }}">{{ form.message.label }}</label> </p> <p>{{ form.message.errors }}<label for="{{ form.message.name }}">{{ form.message.label }}</label> </p>
<p><a href="{{ syntax_help_page.get_absolute_url() }}">{% trans %}Help on the syntax{% endtrans %}</a> <p><a href="{{ syntax_help_page.get_absolute_url() }}">{% trans %}Help on the syntax{% endtrans %}</a>
<div class="markdown_editor">
{{ form.message }} {{ form.message }}
</div>
</p>
<p><input type="button" value="{% trans %}Preview{% endtrans %}" onclick="javascript:make_preview();" /></p> <p><input type="button" value="{% trans %}Preview{% endtrans %}" onclick="javascript:make_preview();" /></p>
<p><input type="submit" value="{% trans %}Save{% endtrans %}" /></p> <p><input type="submit" value="{% trans %}Save{% endtrans %}" /></p>
</form> </form>

View File

@ -38,6 +38,7 @@ from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
from ajax_select import make_ajax_form, make_ajax_field from ajax_select import make_ajax_form, make_ajax_field
from core.views import CanViewMixin, CanEditMixin, CanEditPropMixin, CanCreateMixin, TabedViewMixin from core.views import CanViewMixin, CanEditMixin, CanEditPropMixin, CanCreateMixin, TabedViewMixin
from core.views.forms import MarkdownInput
from core.models import Page from core.models import Page
from forum.models import Forum, ForumMessage, ForumTopic, ForumMessageMeta from forum.models import Forum, ForumMessage, ForumTopic, ForumMessageMeta
@ -142,6 +143,9 @@ class TopicForm(forms.ModelForm):
class Meta: class Meta:
model = ForumMessage model = ForumMessage
fields = ['title', 'message'] fields = ['title', 'message']
widgets = {
'message': MarkdownInput,
}
title = forms.CharField(required=True, label=_("Title")) title = forms.CharField(required=True, label=_("Title"))
class ForumTopicCreateView(CanCreateMixin, CreateView): class ForumTopicCreateView(CanCreateMixin, CreateView):
@ -162,6 +166,11 @@ class ForumTopicCreateView(CanCreateMixin, CreateView):
form.instance.author = self.request.user form.instance.author = self.request.user
return super(ForumTopicCreateView, self).form_valid(form) return super(ForumTopicCreateView, self).form_valid(form)
def get_context_data(self, **kwargs):
kwargs = super(ForumTopicCreateView, self).get_context_data(**kwargs)
kwargs['syntax_help_page'] = Page.get_page_by_full_name(settings.SITH_CORE_PAGE_SYNTAX)
return kwargs
class ForumTopicEditView(CanEditMixin, UpdateView): class ForumTopicEditView(CanEditMixin, UpdateView):
model = ForumTopic model = ForumTopic
fields = ['forum'] fields = ['forum']
@ -205,7 +214,7 @@ class ForumMessageView(SingleObjectMixin, RedirectView):
class ForumMessageEditView(CanEditMixin, UpdateView): class ForumMessageEditView(CanEditMixin, UpdateView):
model = ForumMessage model = ForumMessage
fields = ['title', 'message'] form_class = forms.modelform_factory(model=ForumMessage, fields=['title', 'message',], widgets={'message': MarkdownInput})
template_name = "forum/reply.jinja" template_name = "forum/reply.jinja"
pk_url_kwarg = "message_id" pk_url_kwarg = "message_id"
@ -243,7 +252,7 @@ class ForumMessageUndeleteView(SingleObjectMixin, RedirectView):
class ForumMessageCreateView(CanCreateMixin, CreateView): class ForumMessageCreateView(CanCreateMixin, CreateView):
model = ForumMessage model = ForumMessage
fields = ['title', 'message'] form_class = forms.modelform_factory(model=ForumMessage, fields=['title', 'message',], widgets={'message': MarkdownInput})
template_name = "forum/reply.jinja" template_name = "forum/reply.jinja"
def dispatch(self, request, *args, **kwargs): def dispatch(self, request, *args, **kwargs):