source: plugins_spip/import_video/emballe_medias/inclure/upload_formulaire_plupload.html @ 5901

Last change on this file since 5901 was 5901, checked in by kent1, 8 years ago

Des petites bidouilles

File size: 14.1 KB
Line 
1#CACHE{0}
2#SET{types,#FORM_TYPE{#ENV{type_media}}}
3<script type="text/javascript">
4<!--
5        /**
6         * Quelques variables nécessaires :
7         * -* isUploading : false quand on upload pas, true quand on upload
8         * -* nb_max : le nombre maximal de fichiers que l'on peut mettre en ligne
9         * -* nb_files : le nombre de fichiers dans la queue qui s'incrémente à chaque fichier ajouté
10         */
11        var isUploading = false;
12        var nb_max = #ENV{file_upload_limite,1};
13        var nb_files = 0;
14        var iTime = new Date();
15        var isIE = jQuery.browser.msie;
16       
17        $(function() {
18                var options = {
19                        runtimes : 'html4,html5,flash',
20                        container : 'em_form_upload',
21                        dragdrop : true,
22                        drop_element : 'dropbox_files',
23                        file_data_name:'Filedata',
24                        url : '[(#VAL{emballe_medias_upload_chunks}|generer_url_action|url_absolue)]',
25                        multipart_params:{
26                                "arg" : "#ENV{id_article}",
27                                "id_auteur" : "#SESSION{id_auteur}",
28                                "em_type" : "#ENV{em_type}",
29                                "id_rubrique" : "#ENV{id_rubrique}",
30                                "id_document":"#ENV{id_document}",
31                                "action_document": "#ENV{action_document}"
32                        },
33                        max_file_size : '[(#ENV{config_fichiers}|table_valeur{file_size_limit}|sinon{100})]mb',
34                        chunk_size : '1mb',
35                        unique_names : true,
36                        browse_button : 'spanButtonPlaceHolder',
37                        browse_button_hover: 'test_hover',
38                        browse_button_active: 'test_active',
39                        shim_bgcolor: 'transparent',
40                       
41                        // Specify what files to browse for
42                        filters : [
43                                {title : "Files", extensions : "[(#GET{types}|emballe_medias_liste_extensions|replace{'\*\.',''}|replace{'; ',','})]"}
44                        ],
45       
46                        // Flash settings
47                        [flash_swf_url : '(#CHEMIN{[(#EVAL{_DIR_LIB_PLUPLOAD})]plupload.flash.swf}|url_absolue)',]
48       
49                        // Silverlight settings
50                        [silverlight_xap_url : '(#CHEMIN{[(#EVAL{_DIR_LIB_PLUPLOAD})]plupload.silverlight.xap}|url_absolue)',]
51                       
52                        [multi_selection: (#ENV{file_upload_limite,1}|>{1}|oui{true,false}),]
53                       
54                        multiple_queues : [(#ENV{file_queue_limite}|>{1}|?{true,false})],
55                        debug: [(#ENV{config_fichiers}|table_valeur{upload_debug}|sinon{false}|=={on}|?{true}|sinon{false})],
56                        form_exists: "[(#ENV{doc_uploaded}|=={non}|?{0,1})]"
57                }
58                       
59                var uploader = new plupload.Uploader(options);
60               
61                uploader.bind('postInit', function(up,info) {
62                        em_uploader_init(up,info,up.settings.debug);
63                });
64               
65                uploader.init();
66               
67                uploader.bind('PostInit', function(up) {
68                        em_plupload_postinit(up,up.settings.debug)
69                });
70               
71                uploader.bind('Refresh', function(up) {
72                        em_plupload_refresh(up,up.settings.debug);
73                });
74               
75                uploader.bind('StateChanged', function(up) {
76                        em_plupload_statechanged(up,up.settings.debug);
77                });
78               
79                $('#uploadfiles').click(function(e) {
80                        uploader.start();
81                        e.preventDefault();
82                });
83               
84                uploader.bind('BeforeUpload', function(up, file) {
85                       
86                });
87                uploader.bind('UploadFile', function(up, file) {
88                        em_plupload_uploadfile(up, file,up.settings.debug)
89                });
90               
91                uploader.bind('UploadComplete', function(up, files) {
92                       
93                });
94               
95                uploader.bind('Error', function(up, err) {
96                        em_plupload_error(up,err,up.settings.debug);
97                });
98               
99                uploader.bind('QueueChanged', function(up) {
100                        em_plupload_queuechanged(up,up.settings.debug);
101                });
102               
103                /**
104                 *
105                 * Fonction utilisée à l'ajout de fichiers en file d'attente
106                 *
107                 * @param {Object} up - L'intance de l'uploader en question
108                 * @param {Object} files - Un array des fichiers donnant certaines informations sur eur :
109                 *      -* id : un identifiant numérique;
110                 *  -* name : le nom du fichier;
111                 *      -* size : leur taille en bytes;
112                 */
113                uploader.bind('FilesAdded', function(up, files) {
114                        if(up.settings.debug){
115                                em_plupload_log('[FilesAdded]');
116                                plupload.each(files, function(file) {
117                                        em_plupload_log('  File:', file);
118                                });
119                        }
120                        $('#'+up.settings.container+' .erreur').detach();
121                       
122                        if(files.length > nb_max){
123                                $.each(files, function(i, file) {
124                                        up.removeFile(file);
125                                });
126                                up.trigger('Error', {
127                                        code : '',
128                                        message : emballe_medias_langue.upload_limit_exceeded
129                                });
130                                return;
131                        }
132                        var container = up.settings.container;
133                        /**
134                         * Vérifier que l'auteur n'a pas déjà uploadé son quota de docs (dans un autre onglet par exemple)
135                         * Si c'est le cas on recharge la page
136                         */
137                        var upload_ok = false;
138                        if(files.length > 0){
139                                jQuery.ajax({
140                                        url: "#URL_PAGE{emballe_medias_file_upload_limit}",
141                                        async: false,
142                                        type: "GET",
143                                        data: ({
144                                                id_article:"#ENV{id_article}",
145                                                id_auteur : "#SESSION{id_auteur}",
146                                                em_type: "#ENV{em_type}"
147                                        }),
148                                        dataType: "html",
149                                        success: function(msg){
150                                                var nb = #ENV{file_upload_limite};
151                                                if (parseInt(msg) < nb) {
152                                                        upload_ok = true;
153                                                }
154                                        }
155                                });
156                                if (upload_ok != true) {
157                                        $.each(files, function(i, file) {
158                                                up.removeFile(file);
159                                        });
160                                        alert(emballe_medias_langue.queue_limit_exceeded);
161                                        window.location.reload(true);
162                                        return;
163                                }
164                        }
165                        $.each(files, function(i, file) {
166                                if(!$('#'+container+' .files').size()){
167                                        $('#'+container+' #dropbox_files').after('<div class="files"></div>');
168                                }
169                                $('#'+container+' .files').append(
170                                        '<div id="' + file.id + '" class="file"><span class="file_infos">' +
171                                                file.name + ' (' + plupload.formatSize(file.size) + ') <b class="remove">remove</b></span>' +
172                                        '</div>');
173                        });
174                       
175                        /**
176                         * On permet de supprimer des fichiers de la file d'attente
177                         */
178                        $('#'+container+' .files .remove').click(function(e){
179                                var file_id = $(this).parents('.file').attr('id');
180                                var file = {};
181                                file.id= file_id;
182                                up.removeFile(file);
183                        });
184                       
185                        /**
186                         * Si on a atteint la limite de fichier, on enlÚve le bouton de browser
187                         */
188                        nb_files = up.files.length ? up.files.length : 0;
189                        if(nb_files >= nb_max){
190                                if(up.features.dragdrop && $('#'+container).find('#dropbox_files').is(':visible')){
191                                        $('#'+container).find('#dropbox_files').fadeOut('slow');
192                                }
193                                if($('#'+container).find('#spanButtonPlaceHolder').is(':visible')){
194                                        $('#'+container).find('#spanButtonPlaceHolder').fadeOut('slow');
195                                        //$('#'+container).find('#spanButtonPlaceHolder').css({visibility:'hidden', height:'1px',margin:'0',border:'0'});
196                                }
197                                /**
198                                 * On affiche le bouton d'envoi s'il n'est pas affiché
199                                 */
200                                if($('#uploadfiles').is(':hidden')){
201                                        $('#uploadfiles').fadeIn();
202                                }
203                        }else{
204                                /**
205                                 * On affiche le bouton d'envoi s'il n'est pas affiché
206                                 */
207                                if($('#uploadfiles').is(':hidden')){
208                                        $('#uploadfiles').fadeIn();
209                                }
210                        }
211                        if((files.length == nb_max) && (files.length == 1)){
212                                up.start();
213                        }
214                });
215
216                uploader.bind('FilesRemoved', function(up,files) {
217                        em_plupload_filesremoved(up, files,up.settings.debug);
218                });
219               
220                uploader.bind('UploadProgress', function(up, file) {
221                        em_plupload_uploadprogress(up, file,up.settings.debug);
222                });
223       
224                uploader.bind('FileUploaded', function(up, file, datas) {
225                        if(up.settings.debug)
226                                em_plupload_log('[FileUploaded] File:', file, "Info:", datas);
227                        datas = jQuery.parseJSON(datas.response)
228                        isUploading = false;
229                        up.refresh();
230                        $('.em_charger_fichiers').tabs('enable',1);
231                       
232                        nb_files++;
233                        jQuery('#'+file.id+' .cancel').detach();
234                        /**
235                         * Si le retour n'est pas numérique, il y a une erreur quelque part
236                         * Il vaut mieux que l'on rafraichisse la page pour éviter tout déborderment par la suite
237                         */
238                        if((isNaN(parseFloat(datas.id_article)) || !isFinite(datas.id_article))){
239                                window.location.reload(true);
240                        }
241                       
242                        if(up.settings.file_queue_limit > up.settings.file_upload_limit){
243                                up.settings.file_queue_limit = up.settings.file_upload_limit;
244                        }
245                       
246                        var container = up.settings.container;
247                       
248                       
249                        var retour = (up.settings.file_upload_limit > 0) ? 'form':'haut';
250                       
251                        /**
252                         * Au cas où nous n'avions pas d'id_article auparavant,
253                         * on utilise le nouvel article créé si upload multiple
254                         */
255                        up.settings.multipart_params.arg = datas.id_article;
256                       
257                        jQuery.ajax({
258                                url: "#URL_PAGE{inc-media_uploaded}",
259                                type: "GET",
260                                data: ({
261                                        redirect : "#SELF",
262                                        id_article:datas.id_article,
263                                        retour : retour
264                                }),
265                                dataType: "html",
266                                beforeSend : function(){
267                                        jQuery("#em_upload_fichier").animeajax().addClass('loading');
268                                },
269                                success: function(msg){
270                                        if(nb_files == nb_max){
271                                                jQuery('#em_upload_document').fadeOut('slow',function(){
272                                                        jQuery('#em_upload_document').detach();
273                                                });
274                                        }else{
275                                                nb_max =  nb_max-1;
276                                                jQuery('#'+up.settings.container+' .em_message_file_queue_limit').html(emballe_medias_langue.queue_limit_max+" : "+nb_max);
277                                                jQuery('#'+up.settings.container+' .em_message_file_upload_limit').html("<:emballe_medias:file_upload_limit_public:> "+nb_max);
278                                        }
279                                       
280                                        /**
281                                         * Si on ne peut plus ajouter de fichiers,
282                                         * - On enlÚve le formulaire d'upload
283                                         * - On destroy l'uploader
284                                         */
285                                        if(nb_max == 0){
286                                                jQuery('.em_charger_fichiers,#'+container).fadeOut('slow',function(){
287                                                        jQuery('.em_charger_fichiers,#'+container).detach();
288                                                })
289                                                up.destroy();
290                                        }
291                                        jQuery("#em_upload_fichier").removeClass('loading').html(msg);
292                                        if (up.settings.form_exists == 0) {
293                                                jQuery('#formulaire_diogene').load('[(#URL_PAGE{inc-emballe_media_form})]',{
294                                                                //redirect: "#SELF",
295                                                                id_article: datas.id_article,
296                                                                id_trad: "#ENV{id_trad}",
297                                                                id_rubrique: "#ENV{id_rubrique}",
298                                                                em_type: "#ENV{em_type}"
299                                                        }).fadeIn();
300                                                up.settings.form_exists = 1;
301                                        }
302                                        /**
303                                         * Si le plugin SPIP ancres douces est activé
304                                         */
305                                        if(typeof jQuery.localScroll=="function")
306                                                jQuery.localScroll({hash:true});
307                                }
308                        });
309                });
310               
311                uploader.bind('ChunkUploaded', function(up, file, response) {
312                        if(up.settings.debug)
313                                em_plupload_log('[ChunkUploaded] File:', file, "Info:", response);
314                        if((file.status == plupload.FAILED) && (typeof(file.cancelled) == 'undefined')){
315                                if(up.settings.debug)
316                                        em_plupload_log('[UploadProgress] : FAILED');
317                                em_spipmotion_cancel(up,file);
318                                var url = up.settings.url;
319                                var complement = up.settings.multipart_params;
320                                complement.delete_tmp = 'oui';
321                                complement.name = file.target_name;
322                                jQuery.ajax({
323                                        url: url,
324                                        type: "POST",
325                                        data: (complement)
326                                });
327                                up.stop();
328                                return;
329                        }
330                        //Should return a status 200 if the chunk was uploaded successfully
331                        if(response.status != null){
332                                if(response.status != "200" || (response.response.indexOf("Error") != -1)){
333                                        if(response.response.indexOf("Error") != -1){
334                                                //Prompt the user with the custom error message
335                                                $("div.error:first").show().html('<p>'+response.response+'</p>');
336                                        }
337                                        else{
338                                                //Log this as an error
339                                                //Custom line of code to log error on server would go here
340                         
341                                                //Notify user of error
342                                                $("div.error:first").show().html('<p>There was an error uploading your file '+ file.name +' Support has been notified.</p>');
343                                        }
344                                        $('#' + file.id).addClass("cancelled");
345                                        up.stop();
346                                }else{
347                                       
348                                }
349                        }
350                });
351               
352                uploader.bind('ExifData', function(up,file,datas) {
353                        up.refresh();
354                });
355               
356                uploader.bind('GpsData', function(up,file,datas) {
357                        up.refresh();
358                });
359
360                uploader.bind('Destroy', function(up) {
361                       
362                });
363               
364                $('#dropbox_files').bind('dragenter',function(e){
365                        e.preventDefault();
366                        jQuery(this).addClass('dragenter');
367                });
368                $('#dropbox_files').bind('dragleave',function(e){
369                        e.preventDefault();
370                        jQuery(this).removeClass('dragenter');
371                });
372                $('#dropbox_files').bind('dragdrop',function(e){
373                        e.preventDefault();alert('drop');
374                        jQuery(this).removeClass('dragenter');
375                });
376                /**
377                 * A la sortie de la page, si on est en cours d'upload, on le signale
378                 */
379                window.onbeforeunload = function(){
380                        if(isUploading){
381                                return emballe_medias_langue.erreur_beforeunload;
382                        }
383                };
384                jQuery('#formulaire_em_charger_media_ftp form').submit(function(){
385                        jQuery('.em_charger_fichiers').tabs('disable',0);
386                });
387                jQuery(window).unload(function(){
388                        uploader.destroy();
389                });
390        });
391
392-->
393</script>
394<div id="em_upload_document[_(#ENV{id_document})]" class="formulaire_spip">
395        <div id="divLoadingContent" class="reponse_formulaire_erreur">
396                <:emballe_medias:chargement_uploader:>
397        </div>
398        <div id="divLongLoading" class="reponse_formulaire_erreur" style="display:none">
399                <:emballe_medias:erreur_chargement_uploader_long_failed:>
400        </div>
401        <div id="divAlternateContent" class="reponse_formulaire_erreur" style="display:none">
402                <:emballe_medias:erreur_chargement_uploader_failed:>
403        </div>
404        <form id="em_form_upload" action="#SELF" method="post" enctype="multipart/form-data">
405                <div>
406                        <ul>
407                                <li class="fieldset">
408                                        <fieldset>
409                                        <h3 class="legend">[(#ENV{legende_upload,[(#ENV{file_upload_limite}|>{1}|?{<:emballe_medias:legend_mise_en_ligne_multiple:>,<:emballe_medias:legend_mise_en_ligne_unique:>})]})]</h3>
410                                        <ul>
411                                                <li>
412                                                <div id="em_message_attente" class="explication">
413                                                        <:emballe_medias:verification_fichier:>
414                                                </div>
415                                                <div id="em_message_avant_upload" class="explication">
416                                                        [(#ENV{config_fichiers}|table_valeur{texte_upload}|propre)]
417                                                        [(#SET{types,[(#GET{types}|emballe_medias_liste_extensions)]})]
418                                                        [(#ENV{file_upload_limite}|>{1}|oui)<p class="explications em_message_file_upload_limit"><:emballe_medias:file_upload_limit_public:> #ENV{file_upload_limite}</p>]
419                                                        [(#ENV{file_queue_limite}|>{1}|oui)<p class="explications em_message_file_queue_limit"><:emballe_medias:queue_limit_max:> #ENV{file_queue_limite}</p>]
420                                                        <p class="explications">
421                                                                <:emballe_medias:types_fichiers_autorises{types=#GET{types}}:>
422                                                        </p>
423                                                        [(#SET{taille,[(#ENV{config_fichiers}|table_valeur{file_size_limit}|sinon{100})]})]
424                                                        <p class="explications">
425                                                                <:emballe_medias:file_size_limit{taille=#GET{taille}}:>
426                                                        </p>
427                                                </div>
428                                                </li>
429                                                <li>
430                                                        <div id="dropbox_files" style="display:none">
431                                                                [(#ENV{file_upload_limite}|>{1}|?{<:emballe_medias:message_drag_files:>,<:emballe_medias:message_drag_file:>})]
432                                                        </div>
433                                                </li>
434                                        </ul>
435                                        </fieldset>
436                                </li>
437                        </ul>
438                        <div class="boutons">
439                                <input type="submit" class="submit" id="spanButtonPlaceHolder" value="<:emballe_medias:browse:>" />
440                                <input type="submit" class="submit" id="uploadfiles" value="<:bouton_upload:>" />
441                        </div>
442                        <noscript><:emballe_medias:swfupload_alternative_js:></noscript>
443                </div>
444        </form>
445</div>
Note: See TracBrowser for help on using the repository browser.