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