[JS] вывод окна с выбором картинок

PooH

как проще всего реализовать такую вещь:
кнопка addimage
при нажатии - всплывает окно с выбором картинок

PooH

пока нашел showModalDialog
и window.open

okis

Можно создать centered box: http://snippets.dzone.com/posts/show/2959 и его включать



document.getElementById(...).style.visibility='visible'

document.getElementById(...).style.visibility='hidden'

uncle17

если честно, постановка задачи не ясна

PooH

сейчас распишу поподробнее
делаю сайт на wordpress, посвященный доте :ooo:

соответственно, всякие гайды по доте перегружены картинками, иконками героев, вещей и заклинаний, еще видео и т.д.
писать каждый раз руками и вставлять эти самые иконки - дело муторное
появилась задача - переделать встроенный редактор под свои нужды
что-то выходит - смог добавить свою кнопку на панель редактора:

потом смог реализовать подгрузку с помощью AJAX небольшой html'ки с иконками героев, которая появляется при клике и исчезает при повторном:

при клике на иконку в поле ввода пишется что-то вроде [hero_omni]
потом будут писать фильтр для превращения этих вот [hero_omni] в картинку, и попап на JS со всякими полезными вещами
кому интересно - вот код на php этой задачи

 add_filter('admin_footer', 'button_quicklink_callback');



function button_quicklink_callback

{

    if(strpos($_SERVER['REQUEST_URI'], 'post.php'

    {

?>

<script language="JavaScript" type="text/javascript">

var toolbar = document.getElementById("ed_toolbar");

<?php

        edit_insert_dotabutton("", "dotabutton_handler_hero");    

?>



var state_dotabutton_button_hero = true;



function dotabutton_handler_hero

{

    if(state_dotabutton_button_hero)

    {

      jQuery('<div id=modalheropickerbox></div>').appendTo("#ed_toolbar").get(0)

     	jQuery('#modalheropickerbox').load('<?php echo home_url('wp-content/plugins/dota_buttons') ?>/heroes.html')

    }

    else

    {

      jQuery("#modalheropickerbox").remove;

    }

    state_dotabutton_button_hero = !state_dotabutton_button_hero;

}



</script>

<?php

    }

}



if(!function_exists('edit_insert_dotabuttons'

{

    function edit_insert_dotabutton($dotatag, $js_onclick, $title = '')

    {

    ?>

    if(toolbar)

    {

        var theButton = document.createElement('input');

        theButton.type = 'button';

        theButton.value = 'heroes';

        theButton.onclick = <?php echo $js_onclick; ?>;

        theButton.className = 'ed_button';

        theButton.title = "<?php echo $title; ?>";

        theButton.id = "<?php echo "ed_{$caption}"; ?>";

        toolbar.appendChild(theButton);

    }

    <?php

    }

}

PooH

очень долго гуглил модификацию редактора
полез ломать tinyMCE (визуальный но сломался на этапе написания плагина к нему
забил и реализовал в обычном редакторе
все остальное - быстро и легко

hwh2010

при нажатии - всплывает окно с выбором картинок

учти, что не всем нравится оконные интерфейсы. Надеюсь, твоя поделка будет юзабельной и в том случае, если всплывать будет вкладка (нормальные браузеры так и делают, когда вызывается window.open).
А вообще единственное чего тебе может не хватать для реализации этой функциональности — это знания о window.opener

zorin29

Когда мне нужен был всплывающий диалог, я пользовался JQuery UI. Если не хочешь тащить всю библиотеку, посмотри, как там реализован dialog. Насколько я понимаю, это просто плавающий div.

abur

а ещё можно юзать библиотеку dojo

PooH

уже реализовал через ajax через jQuery
если кому надо - пишите, расскажу

Оставить комментарий