Rewrite of category icon onclick handler.

NOTE: This is not testable right now since something's broken in
      inserting images from the media db.
This commit is contained in:
Matthias Mees 2013-06-01 14:52:34 +02:00
parent d4e47e9dd6
commit 2e886e9405
2 changed files with 22 additions and 10 deletions

View File

@ -96,16 +96,9 @@
<div class="clearfix">
<div class="form_field">
<label for="category_icon">{$CONST.IMAGE}</label>
{* TODO: this should probably become/fallback to input[type=file] *}
<input id="category_icon" name="serendipity[cat][icon]" type="text" value="{$this_cat.category_icon|default:""|escape:"html"}" onchange="document.getElementById('imagepreview').src = this.value; document.getElementById('imagepreview').style.display = '';">
<script>
var category_icon = document.getElementById('category_icon');
var imgBtn = document.createElement('div');
imgBtn.id = "insert_image";
imgBtn.innerHTML = '<input type="button" name="insImage" value="{$CONST.IMAGE}" onclick="window.open(\'serendipity_admin_image_selector.php?serendipity[htmltarget]=category_icon&amp;serendipity[filename_only]=true\', \'ImageSel\', \'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1\');">';
category_icon.parentNode.insertBefore(imgBtn, category_icon.nextSibling);
</script>
<!-- noscript>FIXXME: Emit a warning if JS is disabled</noscript -->
{* TODO: this should probably become/fallback to input[type=file]; also needs
a no-js fallback since this is unusable without JS as of now *}
<input id="category_icon" name="serendipity[cat][icon]" type="text" value="{$this_cat.category_icon|default:""|escape:"html"}">
</div>
<figure id="preview">

View File

@ -677,6 +677,25 @@ function highlightComment(id, checkvalue) {
e.preventDefault();
});
// Category icon preview
// NOTE: This is just to replace the old functionality; ideally, this should
// have a working no-js fallback
var $catIcon = $('body').has('#category_icon');
if($catIcon.size() > 0) {
$('<input id="insert_image" name="insImage" type="button" value="{$CONST.IMAGE}">').insertAfter('#category_icon');
}
$('#insert_image').click(function(e) {
window.open('serendipity_admin_image_selector.php?serendipity[htmltarget]=category_icon&amp;serendipity[filename_only]=true',
'ImageSel',
'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1');
});
$('#category_icon').change(function(e) {
$('#imagepreview').attr('src', $('#category_icon').val());
});
// Add media db upload field
var $uploadForm = $('body').has('#uploadform');