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