xref: /dokuwiki/lib/scripts/media.js (revision 30fd72fbc3c8bd3fbcae4f7041aa0e001a719c6a) 
1/*jslint white: true, onevar: true, undef: true, nomen: true, eqeqeq: true, plusplus: true, bitwise: true, regexp: false, strict: true, newcap: true, immed: true, sloppy: true, browser: true */
2/*global jQuery, DOKU_BASE, LANG, bind, DokuCookie, opener, confirm*/
3
4/**
5 * JavaScript functionality for the media management popup
6 *
7 * @author Andreas Gohr <andi@splitbrain.org>
8 * @author Pierre Spring <pierre.spring@caillou.ch>
9 */
10
11var dw_mediamanager = {
12    keepopen: false,
13    hide: false,
14    popup: false,
15    display: false,
16    ext: false,
17    $popup: null,
18
19    // Image insertion opts
20    align: false,
21    link: false,
22    size: false,
23    forbidden_opts: {},
24
25    // File list view type
26    view: false,
27
28    layout_width: 0,
29
30    init: function () {
31        var $content, $tree;
32        $content = jQuery('#media__content');
33        $tree    = jQuery('#media__tree');
34
35        dw_mediamanager.prepare_content($content);
36
37        dw_mediamanager.attachoptions();
38        dw_mediamanager.initpopup();
39
40        // add the action to autofill the "upload as" field
41        $content.delegate('#upload__file', 'change', dw_mediamanager.suggest)
42                // Attach the image selector action to all links
43                .delegate('a.select', 'click', dw_mediamanager.select)
44                // Attach deletion confirmation dialog to the delete buttons
45                .delegate('#media__content a.btn_media_delete', 'click',
46                          dw_mediamanager.confirmattach)
47                .delegate('#mediamanager__done_form', 'submit', dw_mediamanager.list);
48
49        $tree.dw_tree({toggle_selector: 'img',
50                       load_data: function (show_sublist, $clicky) {
51                           // get the enclosed link (is always the first one)
52                           var $link = $clicky.parent().find('div.li a.idx_dir');
53
54                           jQuery.post(
55                               DOKU_BASE + 'lib/exe/ajax.php',
56                               $link[0].search.substr(1) + '&call=medians',
57                               show_sublist,
58                               'html'
59                           );
60                       },
61
62                       toggle_display: function ($clicky, opening) {
63                           $clicky.attr('src',
64                                        DOKU_BASE + 'lib/images/' +
65                                        (opening ? 'minus' : 'plus') + '.gif');
66                       }});
67        $tree.delegate('a', 'click', dw_mediamanager.list);
68
69        dw_mediamanager.set_filelist_view(dw_mediamanager.view, false);
70        jQuery('#mediamanager__form_sort').find('input[type=submit]').hide();
71        dw_mediamanager.image_diff();
72        dw_mediamanager.init_ajax_uploader();
73
74        // changing opened tab in the file list panel
75        jQuery('#mediamanager__layout_list').delegate('#mediamanager__tabs_files a', 'click', dw_mediamanager.list)
76            // changing type of the file list view
77            .delegate('#mediamanager__tabs_list a', 'click', dw_mediamanager.list_view)
78            // loading file details
79            .delegate('#mediamanager__file_list a', 'click', dw_mediamanager.details)
80            // search form
81            .delegate('#dw__mediasearch', 'submit', dw_mediamanager.list)
82            // "upload as" field autofill
83            .delegate('#upload__file', 'change', dw_mediamanager.suggest)
84            // sort type selection
85            .delegate('#mediamanager__form_sort select', 'change', dw_mediamanager.list)
86            // uploaded images
87            .delegate('.qq-upload-file a', 'click', dw_mediamanager.details);
88
89        // changing opened tab in the file details panel
90        jQuery('#mediamanager__layout_detail').delegate('#mediamanager__tabs_details a', 'click', dw_mediamanager.details)
91            // "update new version" button
92            .delegate('#mediamanager__btn_update', 'submit', dw_mediamanager.list)
93            // revisions form
94            .delegate('#page__revisions', 'submit', dw_mediamanager.details)
95            .delegate('#page__revisions a', 'click', dw_mediamanager.details)
96            // meta edit form
97            .delegate('#mediamanager__save_meta', 'submit', dw_mediamanager.details)
98            // delete button
99            .delegate('#mediamanager__btn_delete', 'submit', dw_mediamanager.details)
100            // "restore this version" button
101            .delegate('#mediamanager__btn_restore', 'submit', dw_mediamanager.details)
102            // less/more recent buttons in media revisions form
103            .delegate('.btn_newer, .btn_older', 'submit', dw_mediamanager.details);
104
105    },
106
107    /**
108     * build the popup window
109     *
110     * @author Dominik Eckelmann <eckelmann@cosmocode.de>
111     */
112    initpopup: function () {
113        var opts, $insp, $insbtn;
114
115        dw_mediamanager.$popup = jQuery(document.createElement('div'))
116                 .attr('id', 'media__popup_content')
117                 .dialog({autoOpen: false, width: 280, modal: true,
118                          draggable: true, title: LANG.mediatitle,
119                          resizable: false});
120
121        opts = [{id: 'link', label: LANG.mediatarget,
122                 btns: ['lnk', 'direct', 'nolnk', 'displaylnk']},
123                {id: 'align', label: LANG.mediaalign,
124                 btns: ['noalign', 'left', 'center', 'right']},
125                {id: 'size', label: LANG.mediasize,
126                 btns: ['small', 'medium', 'large', 'original']}
127               ];
128
129        jQuery.each(opts, function (_, opt) {
130            var $p, $l;
131            $p = jQuery(document.createElement('p'))
132                 .attr('id', 'media__' + opt.id);
133
134            if (dw_mediamanager.display === "2") {
135                $p.hide();
136            }
137
138            $l = jQuery(document.createElement('label'))
139                 .text(opt.label);
140            $p.append($l);
141
142            jQuery.each(opt.btns, function (i, text) {
143                var $btn, $img;
144                $btn = jQuery(document.createElement('button'))
145                       .addClass('button')
146                       .attr('id', "media__" + opt.id + "btn" + (i + 1))
147                       .attr('title', LANG['media' + text])
148                       .click(bind(dw_mediamanager.setOpt, opt.id));
149
150                $img = jQuery(document.createElement('img'))
151                       .attr('src', DOKU_BASE + 'lib/images/media_' +
152                                    opt.id + '_' + text + '.png');
153
154                $btn.append($img);
155                $p.append($btn);
156            });
157
158            dw_mediamanager.$popup.append($p);
159        });
160
161        // insert button
162        $insp = jQuery(document.createElement('p'))
163                .addClass('btnlbl');
164        dw_mediamanager.$popup.append($insp);
165
166        $insbtn = jQuery(document.createElement('input'))
167                  .attr('id', 'media__sendbtn')
168                  .attr('type', 'button')
169                  .addClass('button')
170                  .val(LANG.mediainsert);
171        $insp.append($insbtn);
172    },
173
174    /**
175     * Insert the clicked image into the opener's textarea
176     *
177     * @author Andreas Gohr <andi@splitbrain.org>
178     * @author Dominik Eckelmann <eckelmann@cosmocode.de>
179     * @author Pierre Spring <pierre.spring@caillou.ch>
180     */
181    insert: function (id) {
182        var opts, alignleft, alignright, edid, s;
183
184        // set syntax options
185        dw_mediamanager.$popup.dialog('close');
186
187        opts = '';
188        alignleft = '';
189        alignright = '';
190
191        if ({img: 1, swf: 1}[dw_mediamanager.ext] === 1) {
192
193            if (dw_mediamanager.link === '4') {
194                    opts = '?linkonly';
195            } else {
196
197                if (dw_mediamanager.link === "3" && dw_mediamanager.ext === 'img') {
198                    opts = '?nolink';
199                } else if (dw_mediamanager.link === "2" && dw_mediamanager.ext === 'img') {
200                    opts = '?direct';
201                }
202
203                s = parseInt(dw_mediamanager.size, 10);
204
205                if (s && s >= 1 && s < 4) {
206                    opts += (opts.length)?'&':'?';
207                    opts += dw_mediamanager.size + '00';
208                    if (dw_mediamanager.ext === 'swf') {
209                        switch (s) {
210                        case 1:
211                            opts += 'x62';
212                            break;
213                        case 2:
214                            opts += 'x123';
215                            break;
216                        case 3:
217                            opts += 'x185';
218                            break;
219                        }
220                    }
221                }
222                alignleft = dw_mediamanager.align === '2' ? '' : ' ';
223                alignright = dw_mediamanager.align === '4' ? '' : ' ';
224            }
225        }
226        edid = String.prototype.match.call(document.location, /&edid=([^&]+)/);
227        opener.insertTags(edid ? edid[1] : 'wiki__text',
228                          '{{'+alignleft+id+opts+alignright+'|','}}','');
229
230        if(!dw_mediamanager.keepopen) {
231            window.close();
232        }
233        opener.focus();
234        return false;
235    },
236
237    /**
238     * Prefills the wikiname.
239     *
240     * @author Andreas Gohr <andi@splitbrain.org>
241     */
242    suggest: function(){
243        var $file, $name, text;
244
245        $file = jQuery(this);
246        $name = jQuery('#upload__name');
247
248        if ($name.val() != '') return;
249
250        if(!$file.length || !$name.length) {
251            return;
252        }
253
254        text = $file.val();
255        text = text.substr(text.lastIndexOf('/')+1);
256        text = text.substr(text.lastIndexOf('\\')+1);
257        $name.val(text);
258    },
259
260    /**
261     * list the content of a namespace using AJAX
262     *
263     * @author Andreas Gohr <andi@splitbrain.org>
264     * @author Pierre Spring <pierre.spring@caillou.ch>
265     */
266    list: function (event) {
267        var $link, $content, params;
268        $link = jQuery(this);
269
270        event.preventDefault();
271
272        jQuery('div.success, div.info, div.error, div.notify').remove();
273
274        if (document.getElementById('media__content')) {
275            //popup
276            $content = jQuery('#media__content');
277        } else {
278            //fullscreen media manager
279            $content = jQuery('#mediamanager__layout_list');
280
281            if ($link.hasClass('idx_dir')) {
282                //changing namespace
283                jQuery('#mediamanager__layout_detail').empty();
284                jQuery('#media__tree .selected').each(function(){
285                    jQuery(this).removeClass('selected');
286                });
287                $link.addClass('selected');
288            }
289        }
290
291        params = '';
292
293        if ($link[0].search) {
294            params = $link[0].search.substr(1)+'&call=medialist';
295        } else if ($link[0].action) {
296            params = dw_mediamanager.form_params($link)+'&call=medialist';
297        } else if ($link.parents('form')) {
298            params = dw_mediamanager.form_params($link.parents('form'))+'&call=medialist';
299
300            if ($link.parents('form')[0].id == 'mediamanager__form_sort') {
301                DokuCookie.setValue('sort', $link[0].value);
302                params += '&q=' + jQuery('#mediamanager__sort_textfield').val();
303                params += '&mediado=searchlist';
304            }
305        }
306
307        // fetch the subtree
308        dw_mediamanager.update_content($content, params);
309
310        if (document.getElementById('media__content')) {
311            //popup
312            $content = jQuery('#media__content');
313            $content.html('<img src="' + DOKU_BASE + 'lib/images/loading.gif" alt="..." class="load" />');
314        } else {
315            //fullscreen media manager
316            jQuery('.scroll-container', $content).html('<img src="' + DOKU_BASE + 'lib/images/loading.gif" alt="..." class="load" />');
317        }
318    },
319
320     /**
321     * Returns form parameters
322     *
323     * @author Kate Arzamastseva <pshns@ukr.net>
324     */
325    form_params: function ($form) {
326        if (!$form.length) return;
327        var elements = $form.serialize();
328        var action = '';
329        var i = $form[0].action.indexOf('?');
330        if (i >= 0) action = $form[0].action.substr(i+1);
331        return elements+'&'+action;
332    },
333
334     /**
335     * Changes view of media files list
336     *
337     * @author Kate Arzamastseva <pshns@ukr.net>
338     */
339    list_view: function (event) {
340        var $link, $content;
341        $link = jQuery(this);
342
343        event.preventDefault();
344
345        $content = jQuery('#mediamanager__file_list');
346
347        if ($link[0].id == 'mediamanager__link_thumbs') {
348            dw_mediamanager.set_filelist_view('thumbs', true);
349
350        } else if ($link[0].id == 'mediamanager__link_list') {
351            dw_mediamanager.set_filelist_view('list', true);
352        }
353    },
354
355    set_filelist_view: function (type, cookies) {
356        var $content = jQuery('#mediamanager__file_list');
357        if (!type) type = DokuCookie.getValue('view');
358
359        if (type == 'thumbs') {
360            $content.removeClass('mediamanager-list');
361            $content.addClass('mediamanager-thumbs');
362            if (cookies) DokuCookie.setValue('view', 'thumbs');
363            dw_mediamanager.view = 'thumbs';
364
365        } else if (type == 'list') {
366            $content.removeClass('mediamanager-thumbs');
367            $content.addClass('mediamanager-list');
368            if (cookies) DokuCookie.setValue('view', 'list');
369            dw_mediamanager.view = 'list';
370        }
371    },
372
373     /**
374     * Lists the content of the right column (image details) using AJAX
375     *
376     * @author Kate Arzamastseva <pshns@ukr.net>
377     */
378    details: function (event) {
379        var $link, $content, params, update_list;
380        $link = jQuery(this);
381
382        event.preventDefault();
383
384        jQuery('div.success, div.info, div.error, div.notify').remove();
385
386        if ($link[0].id == 'mediamanager__btn_delete' && !confirm(LANG['del_confirm'])) return false;
387        if ($link[0].id == 'mediamanager__btn_restore' && !confirm(LANG['restore_confirm'])) return false;
388
389        $content = jQuery('#mediamanager__layout_detail');
390        params = '';
391
392        if ($link[0].search) {
393            params = $link[0].search.substr(1)+'&call=mediadetails';
394        } else if ($link[0].action) {
395            params = dw_mediamanager.form_params($link)+'&call=mediadetails';
396        } else if ($link.parents('form')) {
397            params = dw_mediamanager.form_params($link.parents('form'))+'&call=mediadetails';
398        }
399
400        update_list = ($link[0].id == 'mediamanager__btn_delete' || $link[0].id == 'mediamanager__btn_restore');
401        dw_mediamanager.update_content($content, params, update_list);
402
403        if (jQuery('.scroll-container', $content).length) {
404            jQuery('.scroll-container', $content).html('<img src="' + DOKU_BASE + 'lib/images/loading.gif" alt="..." class="load" />');
405        } else {
406            jQuery($content).html('<img src="' + DOKU_BASE + 'lib/images/loading.gif" alt="..." class="load" />');
407        }
408    },
409
410    update_content: function ($content, params, update_list) {
411        jQuery.post(
412            DOKU_BASE + 'lib/exe/ajax.php',
413            params,
414            function (data) {
415                jQuery('.ui-resizable').each(function(){
416                    jQuery(this).resizable('destroy');
417                });
418
419                $content.html(data);
420
421                dw_mediamanager.prepare_content($content);
422                dw_mediamanager.updatehide();
423
424                dw_mediamanager.update_resizable();
425                dw_behaviour.revisionBoxHandler();
426                jQuery('#mediamanager__form_sort').find('input[type=submit]').hide();
427                dw_mediamanager.set_filelist_view(dw_mediamanager.view, false);
428                dw_mediamanager.image_diff();
429                dw_mediamanager.init_ajax_uploader();
430
431                if (update_list) {
432                    var $link1, $content1, params1;
433                    $link1 = jQuery('a.files');
434                    params1 = $link1[0].search.substr(1)+'&call=medialist';
435                    $content1 = jQuery('#mediamanager__layout_list');
436                    dw_mediamanager.update_content($content1, params1);
437                    jQuery('.scroll-container', $content1).html('<img src="' + DOKU_BASE + 'lib/images/loading.gif" alt="..." class="load" />');
438                }
439            },
440            'html'
441        );
442    },
443
444    window_resize: function () {
445        if (jQuery('#mediamanager__layout').width() == dw_mediamanager.layout_width) {
446            return;
447        }
448
449        dw_mediamanager.layout_width = jQuery('#mediamanager__layout').width();
450        $r = jQuery("#mediamanager__layout .layout-resizable, #mediamanager__layout .layout");
451
452        var w = 0, wSum = 0, mCount = 0, mArray = [];
453        $r.each(function() {
454            w = jQuery(this).width();
455            if (w == parseFloat(jQuery(this).css("min-width"))) {
456                wSum += w;
457            } else {
458                mArray[mCount] = jQuery(this);
459                mCount++;
460            }
461        });
462
463        if (mCount > 0) {
464            var width = (0.95 * jQuery('#mediamanager__layout').width() - wSum - 30);
465            wSum = 0;
466            for(var i = 0; i < mArray.length; i++) {
467                wSum += mArray[i].width();
468            }
469            for(var i = 0; i < mArray.length; i++) {
470                w = mArray[i].width();
471                w = 100*w / wSum;
472                mArray[i].width(width*w/100);
473            }
474        }
475
476        $r.each(function() {
477            w = jQuery(this).width();
478            w = (100 * w / jQuery('#mediamanager__layout').width());
479            w += "%";
480            jQuery(this).width(w);
481        });
482
483        dw_mediamanager.opacity_slider();
484        dw_mediamanager.portions_slider();
485    },
486
487    /**
488     * Updates mediamanager layout
489     *
490     * @author Kate Arzamastseva <pshns@ukr.net>
491     */
492    update_resizable: function () {
493        $resizable = jQuery("#mediamanager__layout .layout-resizable");
494
495        $resizable.resizable({ handles: 'e' ,
496            resize: function(event, ui){
497                var w = 0;
498                $resizable.each(function() {
499                    w += jQuery(this).width();
500                });
501                wSum = w + parseFloat(jQuery('#mediamanager__layout_detail').css("min-width"));
502
503                // max width of resizable column
504                var maxWidth = 0.95 * jQuery('#mediamanager__layout').width() - wSum + jQuery(this).width() - 30;
505                $resizable.resizable( "option", "maxWidth", maxWidth );
506
507                // percentage width of the first two columns
508                var wLeft = ( 100*(w+30) / jQuery('#mediamanager__layout').width() );
509
510                // width of the third column
511                var wRight = 95-wLeft;
512                wRight += "%";
513                jQuery('#mediamanager__layout_detail').width(wRight);
514
515                $resizable.each(function() {
516                    w = jQuery(this).width();
517                    w = (100 * w / jQuery('#mediamanager__layout').width());
518                    w += "%";
519                    jQuery(this).width(w);
520                });
521
522                dw_mediamanager.opacity_slider();
523                dw_mediamanager.portions_slider();
524            }
525        });
526
527        var windowHeight = jQuery(window).height();
528        var height = windowHeight - 300;
529        jQuery('#mediamanager__layout .scroll-container').each(function (i) {
530            jQuery(this).height(height);
531        });
532        $resizable.each(function() {
533            jQuery(this).height(height+100);
534        });
535    },
536
537     /**
538     * Prints 'select' for image difference representation type
539     *
540     * @author Kate Arzamastseva <pshns@ukr.net>
541     */
542    image_diff: function () {
543        if (jQuery('#mediamanager__difftype').length) return;
544
545        $form = jQuery('#mediamanager__form_diffview');
546        if (!$form.length) return;
547
548        $label = jQuery(document.createElement('label'));
549        $label.append('<span>'+LANG.media_diff+'</span>');
550        $select = jQuery(document.createElement('select'))
551         .attr('id', 'mediamanager__difftype')
552         .attr('name', 'difftype')
553         .change(dw_mediamanager.change_diff_type);
554        $select.append(new Option(LANG.media_diff_both, "both"));
555        $select.append(new Option(LANG.media_diff_opacity, "opacity"));
556        $select.append(new Option(LANG.media_diff_portions, "portions"));
557        $label.append($select);
558        $form.append($label);
559
560    	// for IE
561    	var select = document.getElementById('mediamanager__difftype');
562    	select.options[0].text = LANG.media_diff_both;
563    	select.options[1].text = LANG.media_diff_opacity;
564    	select.options[2].text = LANG.media_diff_portions;
565    },
566
567    /**
568     * Handles selection of image difference representation type
569     *
570     * @author Kate Arzamastseva <pshns@ukr.net>
571     */
572    change_diff_type: function () {
573        $select = jQuery('#mediamanager__difftype');
574        $content = jQuery('#mediamanager__diff');
575
576        params = dw_mediamanager.form_params($select.parents('form'))+'&call=mediadiff';
577        jQuery.post(
578            DOKU_BASE + 'lib/exe/ajax.php',
579            params,
580            function (data) {
581                $content.html(data);
582                dw_mediamanager.portions_slider();
583                dw_mediamanager.opacity_slider();
584            },
585            'html'
586        );
587    },
588
589    /**
590     * Sets options for opacity diff slider
591     *
592     * @author Kate Arzamastseva <pshns@ukr.net>
593     */
594    opacity_slider: function () {
595        var $slider = jQuery( "#mediamanager__opacity_slider" );
596        if (!$slider.length) return;
597
598        var $image = jQuery('#mediamanager__diff_opacity_image1 img');
599        if (!$image.length) return;
600        $slider.width($image.width()-20);
601
602        $slider.slider();
603        $slider.slider("option", "min", 0);
604        $slider.slider("option", "max", 0.999);
605        $slider.slider("option", "step", 0.001);
606        $slider.slider("option", "value", 0.5);
607        $slider.bind("slide", function(event, ui) {
608            jQuery('#mediamanager__diff_opacity_image2').css({ opacity: $slider.slider("option", "value")});
609        });
610    },
611
612     /**
613     * Sets options for red line diff slider
614     *
615     * @author Kate Arzamastseva <pshns@ukr.net>
616     */
617    portions_slider: function () {
618        var $image1 = jQuery('#mediamanager__diff_portions_image1 img');
619        var $image2 = jQuery('#mediamanager__diff_portions_image2 img');
620        if (!$image1.length || !$image2.length) return;
621
622        var $div = jQuery("#mediamanager__diff_layout");
623        if (!$div.length) return;
624
625        $div.width('100%');
626        $image2.parent().width('97%');
627        $image1.width('100%');
628        $image2.width('100%');
629
630        if ($image1.width() < $div.width()) {
631            $div.width($image1.width());
632        }
633
634        $image2.parent().width('50%');
635        $image2.width($image1.width());
636        $image1.width($image1.width());
637
638        var $slider = jQuery("#mediamanager__portions_slider");
639        if (!$slider.length) return;
640        $slider.width($image1.width()-20);
641
642        $slider.slider();
643        $slider.slider("option", "min", 0);
644        $slider.slider("option", "max", 97);
645        $slider.slider("option", "step", 1);
646        $slider.slider("option", "value", 50);
647        $slider.bind("slide", function(event, ui) {
648            jQuery('#mediamanager__diff_portions_image2').css({ width: $slider.slider("option", "value")+'%'});
649        });
650    },
651
652    params_toarray: function (str) {
653        var vars = [], hash;
654        var hashes = str.split('&');
655        for(var i = 0; i < hashes.length; i++) {
656            hash = hashes[i].split('=');
657            vars[hash[0]] = hash[1];
658        }
659        return vars;
660    },
661
662    init_ajax_uploader: function () {
663        if (!jQuery('#mediamanager__uploader').length) return;
664        if (jQuery('.qq-upload-list').length) return;
665
666        var params = dw_mediamanager.form_params(jQuery('#dw__upload'))+'&call=mediaupload';
667        params = dw_mediamanager.params_toarray(params);
668
669        var uploader = new qq.FileUploaderExtended({
670            element: document.getElementById('mediamanager__uploader'),
671            action: DOKU_BASE + 'lib/exe/ajax.php',
672            params: params
673        });
674    },
675
676    prepare_content: function ($content) {
677        // hide syntax example
678        $content.find('div.example:visible').hide();
679    },
680
681    /**
682     * shows the popup for a image link
683     */
684    select: function(event){
685        var $link, id, dot, ext;
686
687        event.preventDefault();
688
689        $link = jQuery(this);
690        id = $link.attr('name').substr(2);
691
692        if(!opener){
693            // if we don't run in popup display example
694            // the id's are a bit wierd and jQuery('#ex_wiki_dokuwiki-128.png')
695            // will not be found by Sizzle (the CSS Selector Engine
696            // used by jQuery), hence the document.getElementById() call
697            jQuery(document.getElementById('ex_'+id.replace(/:/g,'_').replace(/^_/,''))).dw_toggle();
698            return;
699        }
700
701        dw_mediamanager.ext = false;
702        dot = id.lastIndexOf(".");
703
704        if (-1 === dot) {
705            dw_mediamanager.insert(id);
706            return;
707        }
708
709        ext = id.substr(dot);
710
711        if ({'.jpg':1, '.jpeg':1, '.png':1, '.gif':1, '.swf':1}[ext] !== 1) {
712            dw_mediamanager.insert(id);
713            return;
714        }
715
716        // remove old callback from the insert button and set the new one.
717        jQuery('#media__sendbtn').unbind().click(bind(dw_mediamanager.insert, id));
718
719        dw_mediamanager.unforbid('ext');
720        if (ext === '.swf') {
721            dw_mediamanager.ext = 'swf';
722            dw_mediamanager.forbid('ext', {link: ['1', '2'],
723                                           size: ['4']});
724        } else {
725            dw_mediamanager.ext = 'img';
726        }
727
728        // Set to defaults
729        dw_mediamanager.setOpt('link');
730        dw_mediamanager.setOpt('align');
731        dw_mediamanager.setOpt('size');
732
733        // toggle buttons for detail and linked image, original size
734        jQuery('#media__linkbtn1, #media__linkbtn2, #media__sizebtn4')
735            .toggle(dw_mediamanager.ext === 'img');
736
737        dw_mediamanager.$popup.dialog('open');
738
739        jQuery('#media__sendbtn').focus();
740    },
741
742    /**
743     * Deletion confirmation dialog to the delete buttons.
744     *
745     * @author Michael Klier <chi@chimeric.de>
746     * @author Pierre Spring <pierre.spring@caillou.ch>
747     */
748    confirmattach: function(e){
749        if(!confirm(LANG.del_confirm + "\n" + jQuery(this).attr('title'))) {
750            e.preventDefault();
751        }
752    },
753
754    /**
755     * Creates checkboxes for additional options
756     *
757     * @author Andreas Gohr <andi@splitbrain.org>
758     * @author Pierre Spring <pierre.spring@caillou.ch>
759     */
760    attachoptions: function(){
761        var $obj, opts;
762
763        $obj = jQuery('#media__opts');
764        if($obj.length === 0) {
765            return;
766        }
767
768        opts = [];
769        // keep open
770        if(opener){
771            opts.push(['keepopen', 'keepopen']);
772        }
773        opts.push(['hide', 'hidedetails']);
774
775        jQuery.each(opts,
776                    function(_, opt) {
777                        var $box, $lbl;
778                        $box = jQuery(document.createElement('input'))
779                                 .attr('type', 'checkbox')
780                                 .attr('id', 'media__' + opt[0])
781                                 .click(bind(dw_mediamanager.toggleOption,
782                                             opt[0]));
783
784                        if(DokuCookie.getValue(opt[0])){
785                            $box.prop('checked', true);
786                            dw_mediamanager[opt[0]] = true;
787                        }
788
789                        $lbl = jQuery(document.createElement('label'))
790                                 .attr('for', 'media__' + opt[0])
791                                 .text(LANG[opt[1]]);
792
793                        $obj.append($box, $lbl, document.createElement('br'));
794                    });
795
796        dw_mediamanager.updatehide();
797    },
798
799    /**
800     * Generalized toggler
801     *
802     * @author Pierre Spring <pierre.spring@caillou.ch>
803     */
804    toggleOption: function (variable) {
805        if (jQuery(this).prop('checked')) {
806            DokuCookie.setValue(variable, 1);
807            dw_mediamanager[variable] = true;
808        } else {
809            DokuCookie.setValue(variable, '');
810            dw_mediamanager[variable] = false;
811        }
812        if (variable === 'hide') {
813            dw_mediamanager.updatehide();
814        }
815    },
816
817    initFlashUpload: function () {
818        var $oform, $oflash;
819        if(!hasFlash(8)) {
820            return;
821        }
822
823        $oform  = jQuery('#dw__upload');
824        $oflash = jQuery('#dw__flashupload');
825
826        if(!$oform.length || !$oflash.length) {
827            return;
828        }
829
830        jQuery(document.createElement('img'))
831            .attr('src', DOKU_BASE+'lib/images/multiupload.png')
832            .attr('title', LANG.mu_btn)
833            .attr('alt', LANG.mu_btn)
834            .css('cursor', 'pointer')
835            .click(
836                function () {
837                    $oform.hide();
838                    $oflash.show();
839                }
840            )
841            .appendTo($oform);
842    },
843
844    /**
845     * Sets the visibility of the image details accordingly to the
846     * chosen hide state
847     *
848     * @author Andreas Gohr <andi@splitbrain.org>
849     */
850    updatehide: function(){
851        jQuery('#media__content div.detail').dw_toggle(!dw_mediamanager.hide);
852    },
853
854    /**
855     * set media insertion option
856     *
857     * @author Dominik Eckelmann <eckelmann@cosmocode.de>
858     */
859    setOpt: function(opt, e){
860        var val, i;
861        if (typeof e !== 'undefined') {
862            val = this.id.substring(this.id.length - 1);
863        } else {
864            val = dw_mediamanager.getOpt(opt);
865        }
866
867        if (val === false) {
868            DokuCookie.setValue(opt,'');
869            dw_mediamanager[opt] = false;
870            return;
871        }
872
873        if (opt === 'link') {
874            if (val !== '4' && dw_mediamanager.link === '4') {
875                dw_mediamanager.unforbid('linkonly');
876                dw_mediamanager.setOpt('align');
877                dw_mediamanager.setOpt('size');
878            } else if (val === '4') {
879                dw_mediamanager.forbid('linkonly', {align: false, size: false});
880            }
881
882            jQuery("#media__size, #media__align").dw_toggle(val !== '4');
883        }
884
885        DokuCookie.setValue(opt, val);
886        dw_mediamanager[opt] = val;
887
888        for (i = 1; i <= 4; i++) {
889            jQuery("#media__" + opt + "btn" + i).removeClass('selected');
890        }
891        jQuery('#media__' + opt + 'btn' + val).addClass('selected');
892    },
893
894    unforbid: function (group) {
895        delete dw_mediamanager.forbidden_opts[group];
896    },
897
898    forbid: function (group, forbids) {
899        dw_mediamanager.forbidden_opts[group] = forbids;
900    },
901
902    allowedOpt: function (opt, val) {
903        var ret = true;
904        jQuery.each(dw_mediamanager.forbidden_opts,
905                    function (_, forbids) {
906                        ret = forbids[opt] !== false &&
907                              jQuery.inArray(val, forbids[opt]) === -1;
908                        return ret;
909                    });
910        return ret;
911    },
912
913    getOpt: function (opt) {
914        var allowed = bind(dw_mediamanager.allowedOpt, opt);
915
916        // Current value
917        if (dw_mediamanager[opt] !== false && allowed(dw_mediamanager[opt])) {
918            return dw_mediamanager[opt];
919        }
920
921        // From cookie
922        if (DokuCookie.getValue(opt) && allowed(DokuCookie.getValue(opt))) {
923            return DokuCookie.getValue(opt);
924        }
925
926        // size default
927        if (opt === 'size' && allowed('2')) {
928            return '2';
929        }
930
931        // Whatever is allowed, and be it false
932        return jQuery.grep(['1', '2', '3', '4'], allowed)[0] || false;
933    }
934};
935
936// moved from helpers.js temporarily here
937/**
938 * Very simplistic Flash plugin check, probably works for Flash 8 and higher only
939 *
940 */
941function hasFlash(version){
942    var ver = 0, axo;
943    try{
944        if(navigator.plugins !== null && navigator.plugins.length > 0){
945           ver = navigator.plugins["Shockwave Flash"].description.split(' ')[2].split('.')[0];
946        }else{
947           axo = new ActiveXObject("ShockwaveFlash.ShockwaveFlash");
948           ver = axo.GetVariable("$version").split(' ')[1].split(',')[0];
949        }
950    }catch(e){ }
951
952    return ver >= version;
953}
954
955jQuery(document).ready(function() {
956    dw_mediamanager.update_resizable();
957    dw_mediamanager.layout_width = jQuery("#mediamanager__layout").width();
958    jQuery(window).resize(dw_mediamanager.window_resize);
959});
960
961jQuery(dw_mediamanager.init);
962