Add markdown previews for generic forms in the site as well, not

just the admin site.
This commit is contained in:
Magnus Hagander
2009-09-18 15:40:20 +02:00
parent e808d4cdb3
commit 6ab39b4eb7
6 changed files with 57 additions and 7 deletions

View File

@ -635,6 +635,23 @@ img.pgArrowImage {
clear: both;
}
/* Generic forms class */
TABLE.pgGenericFormTable TR {
vertical-align: top;
}
TABLE.pgGenericFormTable TR TD INPUT {
width: 100%;
}
TABLE.pgGenericFormTable TR TD TEXTAREA {
width: 100%;
}
TABLE.pgGenericFormTable TR TD DIV.markdownpreview {
width: 100%;
}
/* Misc Classes */
.pgClearBoth {

View File

@ -3,7 +3,7 @@
var converter = null;
function attach_showdown_preview(objid) {
function attach_showdown_preview(objid, admin) {
if (!converter) {
converter = new Showdown.converter();
}
@ -13,17 +13,27 @@ function attach_showdown_preview(objid) {
alert('Could not locate object ' + objid + ' in DOM');
return;
}
obj.style.cssFloat = 'left';
obj.style.marginRight = '10px';
newdiv = document.createElement('div');
newdiv.className = 'markdownpreview';
if (admin) {
obj.style.cssFloat = 'left';
obj.style.marginRight = '10px';
obj.style.width = newdiv.style.width = "400px";
obj.style.height = newdiv.style.height = "200px";
}
obj.preview_div = newdiv;
obj.parentNode.insertBefore(newdiv, obj.nextSibling);
if (!admin) {
infospan = document.createElement('span');
infospan.innerHTML = 'This field supports markdown. See below for a preview.';
obj.parentNode.insertBefore(infospan, newdiv);
}
update_markdown(obj, newdiv);
window.onkeyup = function() {

View File

@ -23,8 +23,14 @@ def simple_form(instancetype, itemid, request, formclass, formtemplate='base/for
# Generate form
form = formclass(instance=instance)
if hasattr(instancetype, 'markdown_fields'):
markdownfields = instancetype.markdown_fields
else:
markdownfields = None
return render_to_response(formtemplate, {
'form': form,
'formitemtype': instance._meta.verbose_name,
'markdownfields': markdownfields,
}, NavContext(request, navsection))

View File

@ -16,7 +16,7 @@ Note that the summary field can use
tael = document.getElementsByTagName('textarea');
for (i = 0; i < tael.length; i++) {
if (tael[i].className.indexOf('markdown_preview') >= 0) {
attach_showdown_preview(tael[i].id);
attach_showdown_preview(tael[i].id, 1);
}
}
}

View File

@ -9,6 +9,7 @@
<style type="text/css" media="screen" title="Normal Text">@import url("/media/css/geckofixes.css");</style>
<link rel="alternate" type="application/rss+xml" title="PostgreSQL News" href="{{link_root}}/news.rss" />
<link rel="alternate" type="application/rss+xml" title="PostgreSQL Events" href="{{link_root}}/events.rss" />
{%block extrahead%}{%endblock%}
</head>
<body>
<div id="pgContainerWrap">

View File

@ -2,10 +2,26 @@
{%block contents%}
<h1>Edit {{formitemtype}}</h1>
<form method="post" action=".">
<table>
<table class="pgGenericFormTable">
{{form.as_table}}
</table>
<input type="submit" value="Save">
</form>
{%endblock%}
{% block extrahead %}
{{ block.super }}
{%if markdownfields%}
<link rel="stylesheet" type="text/css" href="/media/css/showdown_preview.css" />
<script type="text/javascript" src="/media/showdown/showdown.js"></script>
<script type="text/javascript" src="/media/js/showdown_preview.js"></script>
<script language="javascript">
window.onload = function() {
{%for mdf in markdownfields %}
attach_showdown_preview('id_{{mdf}}', 0);
{%endfor%}
}
</script>
{%endif%}
{%endblock%}