Как добавить утилиту загрузки в редактор wmd?

Неужели кому-то удалось это сделать?Как добавить утилиту загрузки в редактор wmd?

2009-11-05 Mask

Не могли бы вы быть более конкретными? Вы пытаетесь добавить предварительно созданную утилиту или пытаетесь написать свой собственный? –

Оба могут сделать это для меня. – Mask

Имеет ли значение в какой версии ОМУ? –

Добавить кнопку на панель управления ОМУ.
Искать следующую строку, чтобы найти место, где добавляются кнопки: italicButton.XShift
В my version, функция находится в классе SpritedButtonRow и называется сборки.

Игнорировать установка и textOp атрибуты. XShift - это положение изображения кнопки в css-спрайте, которое поставляется с WMD. Вместо этого дайте кнопке класс, а в классе укажите фоновое изображение. Затем просто добавьте событие onclick на кнопку , которая будет делать то, что вам нужно.
Но, я не думаю, что кнопка загрузки должна находиться внутри текстового редактора, не имеет смысла.

источник

2009-11-13 05:13:37

Я выполнил это, заменив Util.prompt моим собственным методом jquery.dialog. Функция prompt принимает параметр в качестве обратного вызова, что упрощает создание замены для замены.

if (isImage) { 
    // OLD: util.prompt(imageDialogText, imageDefaultText, makeLinkMarkdown); 
    // WMD_IMAGE_GALLERY_URL loaded from a global settings elsewhere 
    util.imageGallery(WMD_IMAGE_GALLERY_URL, makeLinkMarkdown); 
} 
else { 
    util.prompt(linkDialogText, linkDefaultText, makeLinkMarkdown); 
}

Если вы заинтересованы, я написал blog entry о нем (с картинками!), Который имеет еще некоторые примеры кода, а также некоторые из проблем/решений с которыми я столкнулся в реализации этого.

источник

2009-11-18 22:08:53

Могу ли я получить код для него ... :) – Moon

Мне также очень хотелось бы увидеть код для всего этого, так как мне нужно реализовать загрузку в соответствии с stackoverflow. – marcusstarnes

Для выполнения загрузки файлов AJAX необходимо использовать jQuery, jQuery UI и Mike Alsup's jQuery Form Plugin. Хак работает со связанными версиями (jQ 1.7.2 и jQUI 1.8.20). Я не могу гарантировать совместимость с другими версиями.

В вашем <head>, вам необходимо включить зависимостей:

<script type='text/javascript' src='jquery.min.js'></script> 
<link href='theme/jquery-ui.css' rel='stylesheet' type='text/css' /> 
<script type='text/javascript' src='jquery-ui.js'></script> 
<script type='text/javascript' src='wmd/showdown.js'></script> 
<script type='text/javascript' src='wmd/wmd.js'></script> 
<link type='text/css' rel='stylesheet' href='wmd/wmd.css'/> 
<script type='text/javascript' src='jquery.form.js'></script>

Мы на самом деле нужно сделать одно изменение в wmd.js.
Перейти в там и поиск (Ctrl + F) для var form = doc.createElement("form");
Сразу после этой строки, присвоить форме идентификатор, dialogform будет делать: form.id = "dialogform";

Теперь на переднем конце, выполните следующую команду:

$(document).ready(function(){ 
    $("#wmd-image-button").live("click",function(){ 
     setTimeout(function(){ 
      $(".wmd-prompt-dialog").css({"opacity": "0", display: "none"}); 
     }, 100); 
     var $div = $("<div>"); 
     var $form = $("<form>").attr({action: "submit_image.php", method: "post"}) 
     var $file = $("<input/>").attr({type: "file", name: "image"}); 
     var $name = $("<input/>").attr({type: "text", name: "name", placeholder: "Name"}); 
     var $submit = $("<input/>").attr("type", "submit"); 
     $form.append($name, $file, $submit).ajaxForm(function(r) { 
      r = $.parseJSON(r); 
      if(r.success){ 
       $("#dialogform input[type='text']").val(r.filename); 
       $("#dialogform input[value='OK']").trigger("click"); 
       $div.dialog("close"); 
      } 
     }); 
     $div.append($form).dialog({title: "Upload Image"}); 
    }); 
    $("#wmd-link-button").live("click", function(){ 
     setTimeout(function(){ 
      $(".wmd-prompt-dialog").css("opacity", "1"); 
     }, 100); 
    }); 
});

Помните, что пост был написан для JQuery 1.7.2, и live() с тех пор является устаревшим.Пожалуйста, включите в on(), если вы используете более позднюю версию JQuery

А на внутреннем интерфейсе, в submit_image.php:

$f = $_FILES['image']; 
    $p = $_POST; 
    $allowedTypes = array(IMAGETYPE_PNG, IMAGETYPE_JPEG, IMAGETYPE_GIF); 
    $detectedType = exif_imagetype($f['tmp_name']); 
    if(in_array($detectedType, $allowedTypes)){ 
     $pi = pathinfo($f['name']); 
     $ext = $pi['extension']; 
     $target = "img/" . strtolower(str_replace(" ", "-", $p['name'])) . "." . $ext; 
     if(move_uploaded_file($f['tmp_name'], $target)){ 
      $returnArr = array(
       "success" => true, 
       "filename" => site_url($target) 
      ); 
      echo json_encode($returnArr); 
     } 
     else echo json_encode(array("success" => false)); 
    } 
    else echo json_encode(array("success" => false, "msg" => "Invalid File Type."));

Хотелось бы надеяться, что поможет вам начать работу. Это было написано пару лет назад, когда мои навыки javascript были более низкими! Ха-ха. Раньше я это делал в блоге (который сейчас мертв), с пошаговыми инструкциями и пояснениями; много ненужного пуха. Спасибо @Kamiccolo за сообщение этой ссылки. Мне нужно было проконсультироваться с машиной, чтобы оживить ее.

источник

2012-09-18 07:00:55

Не могли бы вы рассказать подробнее, а не просто отказаться от ссылки? имея в виду, что сайт мертв. По крайней мере, на данный момент. – Kamiccolo

спасибо @Kamiccolo - исправлено. –

Как добавить утилиту загрузки в редактор wmd?

ответ

Смежные вопросы