source: spip-zone/_plugins_/photospip/trunk/formulaires/editer_image.html @ 61884

Last change on this file since 61884 was 61884, checked in by kent1@…, 8 years ago

Un seul slider pour image_reduire car on garde les proportions...

On vire certains filtres qui seront pour la version SPIP 3.0

Conditionner les slider à l'existence de la fonction et à leur présence dans la page

File size: 20.9 KB
Line 
1<div class='formulaire_spip formulaire_editer formulaire_#FORM formulaire_#FORM-#ENV{id_document}' style="position:relative;overflow:auto;">
2        [<p class="reponse_formulaire reponse_formulaire_ok">(#ENV**{message_ok})</p>]
3        [<p class="reponse_formulaire reponse_formulaire_erreur">(#ENV*{message_erreur})</p>]
4        <BOUCLE_editable(CONDITION){si #ENV{editable}|oui}>
5        <BOUCLE_document(DOCUMENTS){id_document}{mode IN vignette,image,document}{tout}>
6        [(#REM)
7                Calcul du ratio entre notre image originale et la prévisualisation
8                Utile pour les opération de recadrage notamment
9        ]
10        #SET{largeur_max,#ENV{largeur_previsu,#ENV{erreurs}|table_valeur{largeur_previsu}|sinon{450}}}
11        #SET{hauteur_max,#CONFIG{photospip/hauteur_previsu,#ENV{erreurs}|table_valeur{hauteur_previsu}|sinon{450}}}
12        [(#SET{largeur_reduit,[(#FICHIER|image_reduire{#GET{largeur_max},#GET{hauteur_max}}|extraire_attribut{width})]})]
13        #SET{ratio,#LARGEUR|div{#GET{largeur_reduit}}}
14        #SET{ratio_image,#LARGEUR|div{#HAUTEUR}}
15        #SET{largeur_image,#LARGEUR}
16        #SET{hauteur_image,#HAUTEUR}
17        <form method='post' action='#ENV{action}' enctype='multipart/form-data'><div>
18                [(#REM) declarer les hidden qui declencheront le service du formulaire
19                parametre : url d'action ]
20                #ACTION_FORMULAIRE{#ENV{action}}
21                <input type='hidden' name='id_document' value='#ENV{id_document}' />
22                <input type="submit" class="submit" name="tester" style="display:none;" value="<:photospip:bouton_tester:>" />
23                <div id="modifier_image">
24                        <div id="image-container">
25                                <div id="image_modifier" class="spip_documents spip_documents_center">
26                                        [(#ENV{erreurs}|table_valeur{filtre}|oui)
27                                        [(#_document:FICHIER|photospip_appliquer_filtre{[(#ENV{erreurs}|table_valeur{filtre})],[(#ENV{erreurs}|table_valeur{param1})],[(#ENV{erreurs}|table_valeur{param2})],[(#ENV{erreurs}|table_valeur{param3})],[(#ENV{erreurs}|table_valeur{param})]}|image_reduire{#GET{largeur_max},#GET{hauteur_max}}|inserer_attribut{alt,' '})]]
28                                        [(#ENV{erreurs}|table_valeur{filtre}|non)
29                                        [(#_document:FICHIER|image_reduire{#GET{largeur_max},#GET{hauteur_max}}|inserer_attribut{alt,' '})]]
30                                </div>
31                        </div>
32                        [(#ENV{erreurs}|table_valeur{message}|oui)
33                        <div class="notice">
34                                [(#ENV{erreurs}|table_valeur{message}|=={previsu}|oui)
35                                <span><:previsualisation:></span><br />
36                                <:photospip:erreur_previsu:>]
37                                [(#ENV{erreurs}|table_valeur{message}|=={sanstest}|oui)
38                                <:photospip:sanstest:>]
39                                [(#ENV{erreurs}|table_valeur{message}|=={sansfiltre}|oui)
40                                <:photospip:sansfiltre:>]
41                                [(#ENV{erreurs}|table_valeur{message}|=={sansconf}|oui)
42                                <:photospip:sansconf:>]
43                        </div>]
44                </div>
45                <div class="editer_image_inputs">
46                        <BOUCLE_si_versions_et_vignettes(CONDITION){si #ENV{mode}|!={vignette}|ou{#ENV{mode}|=={vignette}|et{#ENV{vignette}|=={oui}}}|oui}>
47                        <B_interd_nb>
48                        <ul class="liste-versions">
49                                <li class="fieldset">
50                                        <h3 class="legend">[(#GRAND_TOTAL|singulier_ou_pluriel{photospip:info_nb_versions_une,photospip:info_nb_versions})]</h3>
51                                        <BOUCLE_interd_nb(DOCUMENTS_INTERS){id_document}{!par version}> </BOUCLE_interd_nb>
52                                        <ul>
53                                        <B_interd>
54                                                <li id="image-versions" class="editer editer_version">
55                                                <BOUCLE_interd(DOCUMENTS_INTERS){id_document}{!par version}>
56                                                <div class="photospip_version choix">
57                                                <label for="version_#VERSION" title="<:photospip:title_version{version=#VERSION}:>">
58                                                        [(#HAUTEUR|>{#LARGEUR}|non)
59                                                        [(#SET{fichier,[(#FICHIER|get_spip_doc)]})]
60                                                        [(#SET{miniature,[(#FICHIER|get_spip_doc|image_reduire{80,80}|inserer_attribut{alt,Version #VERSION})]})]]
61                                                        [(#HAUTEUR|>{#LARGEUR}|oui)
62                                                        [(#SET{fichier,[(#FICHIER|get_spip_doc)]})]
63                                                        [(#SET{miniature,[(#FICHIER|get_spip_doc|image_reduire{80,80}|inserer_attribut{alt,Version #VERSION}|inserer_attribut{style,'vertical-align:bottom;'})]})]]
64                                                        #GET{miniature}
65                                                </label>
66                                                <input type="radio" name="version" id="version_#VERSION" value="#VERSION" />
67                                                </div>
68                                                </BOUCLE_interd>
69                                                </li>
70                                                <li class="boutons">
71                                                        <input type="submit" class="submit" name="revenir_version" value="<:photospip:bouton_revenir_version:>" />
72                                                        <input type="submit" class="submit" name="supprimer_version" value="<:photospip:bouton_supprimer_version:>" />
73                                                </li>
74                                        </B_interd>
75                                        </ul>
76                                </li>
77                        </ul>
78                        </B_interd_nb>
79                        </BOUCLE_si_versions_et_vignettes>
80                        <BOUCLE_modifiable(CONDITION){si #ENV{modifiable,oui}|oui}>
81                        <ul>
82                                #CHEMIN{formulaires/editer_image_format}
83                                [<li class="fieldset" id="fragment-format">
84                                        <h3 class="legend"><:photospip:legende_filtres_format:></h3>
85                                        <ul>
86                                        (#INCLURE{fond=formulaires/editer_image_format,env}|trim)
87                                        </ul>
88                                </li>]
89                               
90                                [<li class="fieldset" id="fragment-couleurs">
91                                        <h3 class="legend"><:photospip:legende_filtres_de_couleur:></h3>
92                                        <ul>
93                                                (#INCLURE{fond=formulaires/editer_image_couleurs,env}|trim)
94                                        </ul>
95                                </li>]
96                                <BOUCLE_resultats_sup_un(CONDITION){si #ENV{mode}|!={vignette}|et{#CONFIG{photospip/resultats,#ARRAY{0,remplacer_image,1,creer_nouvelle_image,2,creer_version_image}}|count|>{1}}|oui}>
97                                <li>
98                                        <label><:photospip:label_type_modification:></label>
99                                        <BOUCLE_resultats(POUR){tableau #CONFIG{photospip/resultats,#ARRAY{0,remplacer_image,1,creer_nouvelle_image,2,creer_version_image}}}>
100                                        <div class="choix">
101                                                <input type="radio" id="#VALEUR" name="type_modification" value="#VALEUR"[(#ENV{type_modification,#CONFIG{photospip/resultats_defaut,creer_version_image}}|=={#VALEUR}|oui)checked="checked"] />
102                                                <label for="#VALEUR">[(#VAL{photospip:label_modif_}|concat{#VALEUR}|_T)]</label>
103                                        </div>
104                                        </BOUCLE_resultats>
105                                </li>
106                                </BOUCLE_resultats_sup_un>
107                                [(#REM)
108                               
109                                        Les résultats possible dans le cas d'une vignette.
110                                       
111                                        On affiche ce choix de résultat uniquement lorsque la vignette existe réellement
112                                       
113                                        Contrairement aux résultats du travail sur le document, seuls 2 résultats sont possibles :
114                                        -* Le remplacement de la vignette purement et simplement;
115                                        -* La création de versions de la vignette
116                                ]
117                                <BOUCLE_resultats_sup_vignette_un(CONDITION){si #ENV{mode}|=={vignette}|et{#ENV{vignette}|=={oui}}|et{#CONFIG{photospip/resultats_vignette,#ARRAY{0,remplacer_image,1,creer_version_image}}|count|>{1}}|oui}>
118                                <li>
119                                        <label><:photospip:label_type_modification:></label>
120                                        <BOUCLE_resultats_vignette(POUR){tableau #CONFIG{photospip/resultats_vignette,#ARRAY{0,remplacer_image,1,creer_version_image}}}>
121                                        <div class="choix">
122                                                <input type="radio" id="#VALEUR" name="type_modification" value="#VALEUR"[(#ENV{type_modification,#CONFIG{photospip/resultats_defaut_vignette,creer_version_image}}|=={#VALEUR}|oui)checked="checked"] />
123                                                <label for="#VALEUR">[(#VAL{photospip:label_modif_vignette_}|concat{#VALEUR}|_T)]</label>
124                                        </div>
125                                        </BOUCLE_resultats_vignette>
126                                </li>
127                                </BOUCLE_resultats_sup_vignette_un>
128                        </ul>
129                </div>
130          [(#REM) ajouter les saisies supplementaires : extra et autre, a cet endroit ]
131          <!--extra-->
132          <p class="boutons">
133                <input type="submit" class="submit" name="tester" value="<:photospip:bouton_tester:>" />
134                [(#ENV{mode}|=={vignette}|et{#ENV{vignette}|=={oui}}|oui)
135                <input type="submit" class="submit" name="supprimer_vignette" value="<:photospip:bouton_supprimer_vignette:>" />
136                ]
137                <input type="submit" class="submit" name="validation_continuer" value="<:photospip:bouton_valider_continuer:>" />
138                <input type="submit" class="submit" name="validation_fermer" value="<:photospip:bouton_valider_fermer:>" />
139          </p>
140         <script type="text/javascript"><!--
141                        var ratio, ratio_image,largeur,hauteur;
142                        ratio_image = parseFloat([(#GET{ratio_image})]);
143                        largeur = parseFloat(#GET{largeur_image});
144                        hauteur = parseFloat(#GET{hauteur_image});
145                        ratio = largeur/parseFloat($('#image-container img').width());
146                        [(#CONFIG{photospip/image_recadre,on}|=={on}|oui)
147                                var x1, y1, x2, y2, w, h, ias;
148                                function image_crop_selectchange(img, selection){
149                                        /**
150                                         *  Le ratio est la relation entre notre image normale et la prévisualisation
151                                         */
152                                        if(!isNaN(parseFloat(selection.x1*ratio))){
153                                                x1.val(parseFloat(selection.x1*ratio).toFixed(0));
154                                                y1.val(parseFloat(selection.y1*ratio).toFixed(0));
155                                                x2.val(parseFloat(selection.x2*ratio).toFixed(0));
156                                                y2.val(parseFloat(selection.y2*ratio).toFixed(0));
157                                                w.val(parseFloat(selection.width*ratio).toFixed(0));
158                                                h.val(parseFloat(selection.height*ratio).toFixed(0));
159                                        }
160                                }
161
162                                var image_crop = function(){
163                                        if(typeof(ias) == 'object'){
164                                                image_crop_close();
165                                        }
166
167                                        ias = jQuery('#image_modifier img').imgAreaSelect(
168                                                {
169                                                        parent:jQuery('#modifier_image'),
170                                                        x1:[(#ENV{recadre_x1}|>{0}|?{[(#ENV{recadre_x1}|div{#GET{ratio}}|intval)],10})],
171                                                        y1:[(#ENV{recadre_y1}|>{0}|?{[(#ENV{recadre_y1}|div{#GET{ratio}}|intval)],10})],
172                                                        x2:[(#ENV{recadre_x2}|>{0}|?{[(#ENV{recadre_x2}|div{#GET{ratio}}|intval)],60})],
173                                                        y2:[(#ENV{recadre_y2}|>{0}|?{[(#ENV{recadre_y2}|div{#GET{ratio}}|intval)],60})],
174                                                        show:true,
175                                                        instance: true,
176                                                        handles: true,
177                                                        keys: true,
178                                                        fadeSpeed:400,
179                                                        enable:true,
180                                                        onInit: function(img, c) {
181                                                                image_crop_selectchange(img,c);
182                                                        },
183                                                        onSelectStart: function(img, c) {},
184                                                        onSelectEnd: function(img, c) {},
185                                                        onSelectChange: function(img, c) {
186                                                                image_crop_selectchange(img,c);
187                                                        }
188                                                }
189                                        );
190                                }
191                               
192                                var image_crop_close = function(){
193                                        if(typeof(ias) == 'object')
194                                                ias.remove();
195                                }
196                        ]
197                        var activatesliders = function(){
198                                if(typeof($.fn.slider) == 'function'){
199                                        if(jQuery('#sliderrotation').size() > 0){
200                                                var slider_image_rotation = jQuery('#sliderrotation').slider({
201                                                        min: -180,
202                                                        max: 180,
203                                                        value: [(#ENV{params_image_rotation}|intval|sinon{45})],
204                                                        slide: function( event, ui ) {
205                                                                jQuery(this).parent().find('input').val(ui.value.toFixed(0));
206                                                        }
207                                                });
208                                                $("#param_image_rotation").change(function() {
209                                                        var val = parseInt($(this).val());
210                                                        slider_image_rotation.slider("value", val);
211                                                });
212                                        }
213                                        if(jQuery('#slidergamma').size() > 0){
214                                                var slider_image_gamma = jQuery('#slidergamma').slider({
215                                                        min: -254,
216                                                        max: 254,
217                                                        value: [(#ENV{params_image_gamma}|sinon{10}|intval)],
218                                                        slide: function(event, ui) {
219                                                                jQuery(this).parent().find('input').val(ui.value.toFixed(0));
220                                                        }
221                                                });
222                                                $("#param_image_gamma").change(function() {
223                                                        var val = parseInt($(this).val());
224                                                        slider_image_gamma.slider("value", val);
225                                                });
226                                        }
227                                        if(jQuery('#sliderflou').size() > 0){
228                                                var slider_image_flou = jQuery('#sliderflou').slider({
229                                                        min: 1,
230                                                        max: 11,
231                                                        value: [(#ENV{param_image_flou}|sinon{3}|intval)],
232                                                        slide: function(event, ui) {
233                                                                jQuery(this).parent().find('input').val(ui.value.toFixed(0));
234                                                        }
235                                                });
236                                                $("#param_image_flou").change(function() {
237                                                        var val = parseInt($(this).val());
238                                                        slider_image_flou.slider("value", val);
239                                                });
240                                        }
241                                        if(jQuery('#slider_image_reduire').size() > 0){
242                                                /**
243                                                 * On utilise qu'un slider pour les deux valeurs
244                                                 * car on fait dans le proportionnel ici
245                                                 */
246                                                var slider_image_reduire = jQuery('#slider_image_reduire').slider({
247                                                        min: 5,
248                                                        max: 100,
249                                                        value: [(#ENV{reduire_width,#LARGEUR}|div{#LARGEUR}|mult{100}|intval)],
250                                                        slide: function(event, ui) {
251                                                                jQuery(this).parent().find('input#reduire_width').val(((ui.value.toFixed(0)*#LARGEUR)/100).toFixed(0));
252                                                                jQuery(this).parent().find('input#reduire_height').val(((ui.value.toFixed(0)*#HAUTEUR)/100).toFixed(0));
253                                                        }
254                                                });
255                                                $("#reduire_width").change(function() {
256                                                        var val = (parseInt($(this).val())/parseInt(#LARGEUR))*100;
257                                                        slider_image_reduire.slider("value", val);
258                                                        var height = ((parseInt(#HAUTEUR)*val)/100).toFixed(0);
259                                                        $("#reduire_height").val(height);
260                                                });
261                                                $("#reduire_height").change(function() {
262                                                        var val = (parseInt($(this).val())/parseInt(#HAUTEUR))*100;
263                                                        slider_image_reduire.slider("value", val);
264                                                        var height = ((parseInt(#LARGEUR)*val)/100).toFixed(0);
265                                                        $("#reduire_width").val(height);
266                                                });
267                                        }
268                                }
269                        }
270                        if(typeof(jQuery) == 'function'){
271                                jQuery(document).ready(function() {
272                                        /**
273                                         * Cas où l'on se trouve dans une mediabox
274                                         */
275                                        if($('#cboxLoadedContent').is(':visible')){
276                                                $(document).bind('cbox_complete', function(){
277                                                        $('input[type=number]').spinner();
278                                                        if($('#modifier_image img').width() > $('#modifier_image').width()){
279                                                                $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
280                                                                ratio = largeur/parseFloat($('#image-container img').width());
281                                                        }
282                                                        jQuery('.cache').hide();
283                                                        var boxoffset = $('#cboxLoadedContent').offset();
284                                                        var container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top;
285                                                        var container_width = $('#image-container').width();
286                                                        if($('#image-container').height() < $('#cboxLoadedContent').height()){
287                                                                $('#cboxLoadedContent').scroll(function() {
288                                                                        var limite_multilang = boxoffset.top;
289                                                                        var limite_bas = limite_multilang+$('#image-container').parents("form").height()-$('#image-container').parents("form").find(".boutons").height();
290                                                                        var pos_bas = $('#image-container').offset().top+$('#image-container').height();
291                                                                        if(($('#cboxLoadedContent').scrollTop() >= container_offset) && (pos_bas <= limite_bas) && ($('#cboxLoadedContent').scrollTop()+$('#image-container').offset().top < limite_bas)){
292                                                                                var margintop = $('#cboxLoadedContent').scrollTop() - container_offset+20;
293                                                                                if(!$('#image-container').hasClass("image_flottant"))
294                                                                                        $('#image-container').addClass("image_flottant");
295                                                                                $('#image-container').css({"margin-top": margintop+"px"});
296                                                                                if(typeof(ias) == 'object'){
297                                                                                        ias.update();
298                                                                                }
299                                                                        }
300                                                                        else if(($('cboxLoadedContent').scrollTop() < container_offset)||(pos_bas > limite_bas) ){
301                                                                                $('#image-container').removeClass("image_flottant").css({"margin-top": "0px", "width": "auto"});
302                                                                                if(typeof(ias) == 'object'){
303                                                                                        ias.update();
304                                                                                }
305                                                                        }
306                                                                });
307                                                        }
308                                                });
309                                                if($('#modifier_image').width() != 0){
310                                                        if($('#modifier_image img').width() > $('#modifier_image').width()){
311                                                                $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
312                                                        }
313                                                }
314                                        }else{
315                                                if($('#modifier_image img').width() > $('#modifier_image').width()){
316                                                        $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
317                                                        ratio = largeur/parseFloat($('#image-container img').width());
318                                                }
319                                                $('input[type=number]').spinner();
320                                                jQuery('.cache').hide();
321                                        }
322                                        if(typeof($.fn.scrollTo) == 'function'){
323                                                $('input[type=submit]').click(function(){
324                                                        $('#cboxLoadedContent').scrollTo( { top: 0, left:'0' });
325                                                });
326                                        }
327                                       
328                                        activatesliders();
329                                        /**
330                                         * On cache les options des filtres
331                                         */
332                                       
333                                        /**
334                                         * On affiche les options du filtre sélectionné
335                                         */
336                                        jQuery('input[name=filtre]:checked').parent().find('.cache').addClass('visible').show();
337                                        jQuery('form input[type=radio]').unbind().click(function(){
338                                                if(jQuery(this).next().next('.cache').is(':hidden')){
339                                                        jQuery(".visible").slideUp().removeClass('visible');
340                                                        jQuery(this).parent().find('.cache').slideDown().addClass('visible');
341                                                        if(jQuery(this).attr('id') == 'image_recadre'){
342                                                                image_crop();
343                                                        }
344                                                        else{   
345                                                                image_crop_close();
346                                                        }
347                                                }
348                                        });
349                                        <BOUCLE_si_image_reduire(CONDITION){si #CONFIG{photospip/image_recadre,on}|oui}>
350                                                x1 = jQuery('#recadre_x1');
351                                                y1 = jQuery('#recadre_y1');
352                                                x2 = jQuery('#recadre_x2');
353                                                y2 = jQuery('#recadre_y2');
354                                                w = jQuery('#recadre_width');
355                                                h = jQuery('#recadre_height');
356                                               
357                                                if(jQuery('#image_recadre').is(':checked')){
358                                                        image_crop();
359                                                }
360                                               
361                                                jQuery('#recadre_x1,#recadre_y1,#recadre_width,#recadre_height').change(function(){
362                                                        //,#recadre_x2,#recadre_y2
363                                                        if(typeof(ias) == 'object'){
364                                                                var ias_selection = ias.getSelection();
365                                                                if($(this).is('#recadre_width')){
366                                                                        if($(this).val() < largeur){
367                                                                                var width_ratio = parseInt(parseInt($(this).val())/ratio);
368                                                                                ias_selection.x2 = parseInt(ias_selection.x1)+width_ratio;
369                                                                                if(parseInt($('#recadre_x2').val()) >= parseInt(largeur)){
370                                                                                        /**
371                                                                                         * Là on doit déplacer x2 à fond et x1 un petit peu
372                                                                                         * sinon x2 se retrouverait hors zone
373                                                                                         */
374                                                                                        $('#recadre_x2').val(largeur);
375                                                                                        ias_selection.x2 = parseInt(largeur/ratio);
376                                                                                        $('#recadre_x1').val(largeur-parseInt($(this).val()));
377                                                                                        ias_selection.x1 = (parseInt(largeur)-parseInt($(this).val()))/ratio;
378                                                                                }else{
379                                                                                        /**
380                                                                                         * Là on doit déplacer seulement x2
381                                                                                         */
382                                                                                        var width = (parseInt($('#recadre_x1').val())+parseInt($(this).val()));
383                                                                                        $('#recadre_x2').val(width);
384                                                                                }
385                                                                        }else{
386                                                                                /**
387                                                                                 * On occuper toute la largeur
388                                                                                 */
389                                                                                $(this).val(largeur);
390                                                                                ias_selection.x1 = 0;
391                                                                                $('#recadre_x1').val(0);
392                                                                                ias_selection.x2 = parseInt(largeur/ratio);
393                                                                                $('#recadre_x2').val(largeur);
394                                                                        }
395                                                                }
396                                                                else if($(this).is('#recadre_height')){
397                                                                        if($(this).val() < hauteur){
398                                                                                var height_ratio = parseInt(parseInt($(this).val())/ratio);
399                                                                                ias_selection.y2 = parseInt(ias_selection.y1)+height_ratio;
400                                                                                if(parseInt($('#recadre_y2').val()) >= parseInt(hauteur)){
401                                                                                        /**
402                                                                                         * Là on doit déplacer y2 à fond et y1 un petit peu
403                                                                                         * sinon y2 se retrouverait hors zone
404                                                                                         */
405                                                                                        $('#recadre_y2').val(hauteur);
406                                                                                        ias_selection.y2 = parseInt(hauteur/ratio);
407                                                                                        $('#recadre_y1').val(hauteur-parseInt($(this).val()));
408                                                                                        ias_selection.y1 = (parseInt(hauteur)-parseInt($(this).val()))/ratio;
409                                                                                }else{
410                                                                                        /**
411                                                                                         * Là on doit déplacer seulement y2
412                                                                                         */
413                                                                                        var height = (parseInt($('#recadre_y1').val())+parseInt($(this).val()));
414                                                                                        $('#recadre_y2').val(height);
415                                                                                }
416                                                                        }else{
417                                                                                /**
418                                                                                 * On occuper toute la hauteur
419                                                                                 */
420                                                                                $(this).val(hauteur);
421                                                                                ias_selection.y1 = 0;
422                                                                                $('#recadre_y1').val(0);
423                                                                                ias_selection.y2 = parseInt(hauteur/ratio);
424                                                                                $('#recadre_y2').val(hauteur);
425                                                                        }
426                                                                }
427                                                                else{
428                                                                        var largeur_image = parseFloat($('#image-container img').width());
429                                                                        var width = parseInt($('#recadre_width').val());
430                                                                        var height = parseInt($('#recadre_height').val());
431                                                                        if($(this).is('#recadre_x1')){
432                                                                                var width_left = parseInt($(this).val()) + parseInt(width);
433                                                                                if(width_left >= largeur){
434                                                                                        $('#recadre_x2').val(largeur);
435                                                                                        ias_selection.x2 = parseInt(largeur)/ratio;
436                                                                                        $('#recadre_x1').val(largeur-width);
437                                                                                        ias_selection.x1 = parseInt(ias_selection.x2)-parseInt(width/ratio);
438                                                                                }else{
439                                                                                        var x1_ratio = (parseInt($(this).val())/ratio);
440                                                                                        ias_selection.x1 = x1_ratio;
441                                                                                        ias_selection.x2 = parseInt(x1_ratio)+parseInt(width/ratio);
442                                                                                        $('#recadre_x2').val(parseInt($(this).val())+width);
443                                                                                }
444                                                                        }
445                                                                        else if($(this).is('#recadre_y1')){
446                                                                                var height_top = parseInt($(this).val()) + parseInt(height);
447                                                                                if(height_top >= hauteur){
448                                                                                        $('#recadre_y2').val(hauteur);
449                                                                                        ias_selection.y2 = parseInt(hauteur)/ratio;
450                                                                                        $('#recadre_y1').val(hauteur-width);
451                                                                                        ias_selection.y1 = parseInt(ias_selection.y2)-parseInt(height/ratio);
452                                                                                }else{
453                                                                                        var y1_ratio = (parseInt($(this).val())/ratio);
454                                                                                        ias_selection.y1 = y1_ratio;
455                                                                                        ias_selection.y2 = y1_ratio+parseInt(height/ratio);
456                                                                                        $('#recadre_y2').val(parseInt($(this).val())+height);
457                                                                                }
458                                                                        }
459                                                                        else if($(this).is('#recadre_x2')){
460                                                                                var x2_ratio = (parseFloat($(this).val())/ratio).toFixed(0);
461                                                                                ias_selection.x2 = parseInt(x2_ratio);
462                                                                        }
463                                                                        else if($(this).is('#recadre_y2')){
464                                                                                var y2_ratio = (parseFloat($(this).val())/ratio).toFixed(0);
465                                                                                ias_selection.y2 = parseInt(y2_ratio);
466                                                                        }
467                                                                }
468                                                                /**
469                                                                 * On met à jour la sélection visuelle
470                                                                 */
471                                                                ias.setSelection(ias_selection.x1,ias_selection.y1,ias_selection.x2,ias_selection.y2);
472                                                                ias.update();
473                                                        }
474                                                });
475                                                jQuery('.image_recadre input[type=radio]').click(function(){
476                                                        if (jQuery(this).val() != ''){
477                                                                jQuery('#image_modifier img').imgAreaSelect({aspectRatio: jQuery(this).val()});
478                                                        }
479                                                        else{
480                                                                jQuery('#image_modifier img').imgAreaSelect({aspectRatio: ''});
481                                                        }
482                                                });
483                                        </BOUCLE_si_image_reduire>
484                                });
485                        }
486        // --></script>
487        </BOUCLE_modifiable>
488        </div></form>
489        </BOUCLE_document>
490        </BOUCLE_editable>
491</div>
Note: See TracBrowser for help on using the repository browser.