Changeset 61948 in spip-zone


Ignore:
Timestamp:
Jun 1, 2012, 9:45:34 AM (7 years ago)
Author:
kent1@…
Message:

Tentative de respect des proportions lorsqu'un ratio est sélectionné

On passe en version 0.4.2

Location:
_plugins_/photospip/trunk
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/photospip/trunk/formulaires/configurer_photospip.html

    r61884 r61948  
    11<!-- nom=photospip -->
    22
    3 <div class="formulaire_spip formulaire_editer formulaire_cfg">
     3<div class="formulaire_spip formulaire_editer formulaire_cfg formulaire_#FORM">
    44        [<p class="reponse_formulaire reponse_formulaire_ok">(#ENV*{message_ok})</p>]
    55        [<p class="reponse_formulaire reponse_formulaire_erreur">(#ENV*{message_erreur})</p>]
  • _plugins_/photospip/trunk/formulaires/editer_image.html

    r61884 r61948  
    359359                                                }
    360360                                               
    361                                                 jQuery('#recadre_x1,#recadre_y1,#recadre_width,#recadre_height').change(function(){
    362                                                         //,#recadre_x2,#recadre_y2
     361                                                jQuery('#recadre_x1,#recadre_y1,#recadre_width,#recadre_height,#recadre_x2,#recadre_y2').change(function(){
    363362                                                        if(typeof(ias) == 'object'){
    364363                                                                var ias_selection = ias.getSelection();
     364                                                                var ratio_selected = $('input[name=ratio]:checked').val();
    365365                                                                if($(this).is('#recadre_width')){
    366                                                                         if($(this).val() < largeur){
     366                                                                        if($(this).val() <= largeur){
    367367                                                                                var width_ratio = parseInt(parseInt($(this).val())/ratio);
    368368                                                                                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);
     369                                                                                var height_new = $('#resize_height').val();
     370                                                                                /**
     371                                                                                 * Faire attention aux ratios
     372                                                                                 */
     373                                                                                if(ratio_selected == '1:1'){
     374                                                                                        /**
     375                                                                                         * Ratio 1:1
     376                                                                                         * largeur = hauteur
     377                                                                                         */
     378                                                                                        height_new = parseInt($(this).val());
     379                                                                                        $('#recadre_height').val(height_new);
     380                                                                                        ias_selection.y2 = parseInt(ias_selection.y1)+width_ratio;
     381                                                                                }else if(ratio_selected == '4:3'){
     382                                                                                        /**
     383                                                                                         * Ratio 4:3
     384                                                                                         * largeur = hauteur
     385                                                                                         */
     386                                                                                        height_new = parseInt((parseInt($(this).val())*3)/4);
     387                                                                                        $('#recadre_height').val(height_new);
     388                                                                                        var height_ratio = parseInt((width_ratio*3)/4);
     389                                                                                        ias_selection.y2 = parseInt(ias_selection.y1)+height_ratio;
     390                                                                                }else if(ratio_selected == '16:9'){
     391                                                                                        /**
     392                                                                                         * Ratio 16:9
     393                                                                                         * largeur = hauteur
     394                                                                                         */
     395                                                                                        height_new = parseInt(($(this).val()*9)/16);
     396                                                                                        $('#recadre_height').val(height_new);
     397                                                                                        var height_ratio = parseInt((width_ratio*9)/16);
     398                                                                                        ias_selection.y2 = parseInt(ias_selection.y1)+height_ratio;
     399                                                                                }
     400                                                                                if(height_new <= hauteur){
     401                                                                                        /**
     402                                                                                         * La nouvelle hauteur en prenant compte du ratio est inférieur
     403                                                                                         * à la hauteur maximale
     404                                                                                         * Sinon on ne fait rien car on ne peut augmenter la taille
     405                                                                                         */
     406                                                                                        if((parseInt($('#recadre_x1').val())+parseInt($(this).val())) > parseInt(largeur)){
     407                                                                                                /**
     408                                                                                                 * Là on doit déplacer x2 à fond et x1 un petit peu
     409                                                                                                 * sinon x2 se retrouverait hors zone
     410                                                                                                 */
     411                                                                                                $('#recadre_x2').val(largeur);
     412                                                                                                ias_selection.x2 = parseInt(largeur/ratio);
     413                                                                                                $('#recadre_x1').val(largeur-parseInt($(this).val()));
     414                                                                                                ias_selection.x1 = (parseInt(largeur)-parseInt($(this).val()))/ratio;
     415                                                                                        }else{
     416                                                                                                /**
     417                                                                                                 * Là on doit déplacer seulement x2
     418                                                                                                 */
     419                                                                                                var width = (parseInt($('#recadre_x1').val())+parseInt($(this).val()));
     420                                                                                                $('#recadre_x2').val(width);
     421                                                                                        }
     422                                                                                        if(ratio_selected != ''){
     423                                                                                                if((parseInt($('#recadre_y1').val())+height_new) > parseInt(hauteur)){
     424                                                                                                        /**
     425                                                                                                         * Là on doit déplacer y2 à fond et y1 un petit peu
     426                                                                                                         * sinon y2 se retrouverait hors zone
     427                                                                                                         */
     428                                                                                                        $('#recadre_y2').val(hauteur);
     429                                                                                                        ias_selection.y2 = parseInt(hauteur/ratio);
     430                                                                                                        $('#recadre_y1').val(hauteur-height_new);
     431                                                                                                        ias_selection.y1 = (parseInt(hauteur)-parseInt(height_new))/ratio;
     432                                                                                                }else{
     433                                                                                                        /**
     434                                                                                                         * Là on doit déplacer seulement y2
     435                                                                                                         */
     436                                                                                                        var height = (parseInt($('#recadre_y1').val())+parseInt(height_new));
     437                                                                                                        $('#recadre_y2').val(height);
     438                                                                                                }
     439                                                                                        }
    384440                                                                                }
    385441                                                                        }else{
     
    398454                                                                                var height_ratio = parseInt(parseInt($(this).val())/ratio);
    399455                                                                                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);
     456                                                                                /**
     457                                                                                 * Faire attention aux ratios
     458                                                                                 */
     459                                                                                if(ratio_selected == '1:1'){
     460                                                                                        /**
     461                                                                                         * Ratio 1:1
     462                                                                                         * largeur = hauteur
     463                                                                                         */
     464                                                                                        width_new = parseInt($(this).val());
     465                                                                                        $('#recadre_width').val(width_new);
     466                                                                                        ias_selection.x2 = parseInt(ias_selection.x1)+height_ratio;
     467                                                                                }else if(ratio_selected == '4:3'){
     468                                                                                        /**
     469                                                                                         * Ratio 4:3
     470                                                                                         * largeur = hauteur
     471                                                                                         */
     472                                                                                        width_new = parseInt((parseInt($(this).val())*4)/3);
     473                                                                                        $('#recadre_width').val(width_new);
     474                                                                                        var width_ratio = parseInt((height_ratio*4)/3);
     475                                                                                        ias_selection.x2 = parseInt(ias_selection.x1)+width_ratio;
     476                                                                                }else if(ratio_selected == '16:9'){
     477                                                                                        /**
     478                                                                                         * Ratio 16:9
     479                                                                                         * largeur = hauteur
     480                                                                                         */
     481                                                                                        width_new = parseInt(($(this).val()*16)/9);
     482                                                                                        $('#recadre_width').val(width_new);
     483                                                                                        var width_ratio = parseInt((height_ratio*16)/9);
     484                                                                                        ias_selection.x2 = parseInt(ias_selection.x1)+width_ratio;
     485                                                                                }
     486                                                                                if(width_new <= largeur){
     487                                                                                        if(parseInt($('#recadre_y2').val()) >= parseInt(hauteur)){
     488                                                                                                /**
     489                                                                                                 * Là on doit déplacer y2 à fond et y1 un petit peu
     490                                                                                                 * sinon y2 se retrouverait hors zone
     491                                                                                                 */
     492                                                                                                $('#recadre_y2').val(hauteur);
     493                                                                                                ias_selection.y2 = parseInt(hauteur/ratio);
     494                                                                                                $('#recadre_y1').val(hauteur-parseInt($(this).val()));
     495                                                                                                ias_selection.y1 = (parseInt(hauteur)-parseInt($(this).val()))/ratio;
     496                                                                                        }else{
     497                                                                                                /**
     498                                                                                                 * Là on doit déplacer seulement y2
     499                                                                                                 */
     500                                                                                                var height = (parseInt($('#recadre_y1').val())+parseInt($(this).val()));
     501                                                                                                $('#recadre_y2').val(height);
     502                                                                                        }
     503                                                                                        if(ratio_selected != ''){
     504                                                                                                if((parseInt($('#recadre_x1').val())+width_new) > parseInt(largeur)){
     505                                                                                                        /**
     506                                                                                                         * Là on doit déplacer x2 à fond et x1 un petit peu
     507                                                                                                         * sinon x2 se retrouverait hors zone
     508                                                                                                         */
     509                                                                                                        $('#recadre_x2').val(largeur);
     510                                                                                                        ias_selection.x2 = parseInt(largeur/ratio);
     511                                                                                                        $('#recadre_x1').val(largeur-width_new);
     512                                                                                                        ias_selection.x1 = (parseInt(largeur)-parseInt(width_new))/ratio;
     513                                                                                                }else{
     514                                                                                                        /**
     515                                                                                                         * Là on doit déplacer seulement x2
     516                                                                                                         */
     517                                                                                                        var width = (parseInt($('#recadre_x1').val())+parseInt(width_new));
     518                                                                                                        $('#recadre_x2').val(width);
     519                                                                                                }
     520                                                                                        }
    415521                                                                                }
    416522                                                                        }else{
     
    474580                                                });
    475581                                                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: ''});
     582                                                        if(typeof(ias) == "object"){
     583                                                                if (jQuery(this).val() != ''){
     584                                                                        /**
     585                                                                         * On met l'option correct à l'objet
     586                                                                         */
     587                                                                        ias.setOptions({aspectRatio: jQuery(this).val()});
     588                                                                        var ias_selection = ias.getSelection();
     589                                                                       
     590                                                                        /**
     591                                                                         * On redimentionne la sélection en fonction du nouveau ratio
     592                                                                         */
     593                                                                        var largeur_image = #LARGEUR;
     594                                                                        var hauteur_image = #HAUTEUR;
     595                                                                        var largeur_actuelle = (parseInt($('#recadre_x2').val()) - parseInt($('#recadre_x1').val()));
     596                                                                        var hauteur_actuelle = (parseInt($('#recadre_y2').val()) - parseInt($('#recadre_y1').val()));
     597                                                                        var largeur_cadre = (ias_selection.x2 - ias_selection.x1);
     598                                                                        var hauteur_cadre = (ias_selection.y2 - ias_selection.y1);
     599                                                                       
     600                                                                        if(jQuery(this).val() == '1:1'){
     601                                                                                if(hauteur_image >= largeur_actuelle){
     602                                                                                        /**
     603                                                                                         * On transforme la hauteur en largeur
     604                                                                                         */
     605                                                                                        if((parseInt($('#recadre_y1').val()) + largeur_actuelle) > hauteur_image){
     606                                                                                                /**
     607                                                                                                 * On va devoir remonter l'image pour qu'elle rentre dans le cadre
     608                                                                                                 */
     609                                                                                                var y1 = hauteur_image - largeur_actuelle;
     610                                                                                                var y2 = hauteur_image;
     611                                                                                                $('#recadre_y1').val(y1)
     612                                                                                                $('#recadre_y2').val(y2);
     613                                                                                                ias_selection.y2 = $('#image_modifier img').height();
     614                                                                                                ias_selection.y1 = ias_selection.y2-largeur_cadre;
     615                                                                                        }else{
     616                                                                                                /**
     617                                                                                                 * L'image reste en place, on change les dimensions seulement
     618                                                                                                 */
     619                                                                                                var y2 = parseInt($('#recadre_y1').val()) + largeur_actuelle;
     620                                                                                                $('#recadre_y2').val(y2);
     621                                                                                                ias_selection.y2 = parseInt(ias_selection.y1)+largeur_cadre;
     622                                                                                        }
     623                                                                                        $('#recadre_height').val($('#recadre_width').val());
     624                                                                                }else{
     625                                                                                        /**
     626                                                                                         * On transforme la largeur en hauteur
     627                                                                                         */
     628                                                                                        if((parseInt($('#recadre_x1').val()) + hauteur_actuelle) > largeur_image){
     629                                                                                                /**
     630                                                                                                 * On va devoir déplacer l'image
     631                                                                                                 * pour qu'elle rentre dans le cadre
     632                                                                                                 */
     633                                                                                                var x1 = largeur_image - hauteur_actuelle;
     634                                                                                                var x2 = largeur_image;
     635                                                                                                $('#recadre_x1').val(x1)
     636                                                                                                $('#recadre_x2').val(x2);
     637                                                                                                ias_selection.x2 = $('#image_modifier img').width();
     638                                                                                                ias_selection.x1 = ias_selection.x2-hauteur_cadre;
     639                                                                                        }else{
     640                                                                                                /**
     641                                                                                                 * L'image reste en place, on change les dimensions seulement
     642                                                                                                 */
     643                                                                                                var x2 = parseInt($('#recadre_x1').val()) + hauteur_actuelle;
     644                                                                                                $('#recadre_x2').val(x2);
     645                                                                                                ias_selection.x2 = parseInt(ias_selection.x1)+hauteur_cadre;
     646                                                                                        }
     647                                                                                        $('#recadre_width').val($('#recadre_height').val());
     648                                                                                }
     649                                                                        }
     650                                                                        else if((jQuery(this).val() == '4:3') || (jQuery(this).val() == '16:9')){
     651                                                                                if(jQuery(this).val() == '4:3'){
     652                                                                                        var ratio_l = 4;
     653                                                                                        var ratio_h = 3;
     654                                                                                }else if(jQuery(this).val() == '16:9'){
     655                                                                                        var ratio_l = 16;
     656                                                                                        var ratio_h = 9;
     657                                                                                }
     658                                                                                //var largeur_ratio = ((largeur_actuelle*ratio_l)/ratio_h);
     659                                                                                var largeur_ratio = largeur_actuelle;
     660                                                                                var hauteur_ratio = ((largeur_actuelle*ratio_h)/ratio_l);
     661                                                                                //var largeur_cadre_ratio = (((ias_selection.x2 - ias_selection.x1)*ratio_l)/ratio_h);
     662                                                                                var largeur_cadre_ratio = (ias_selection.x2 - ias_selection.x1);
     663                                                                                var hauteur_cadre_ratio = (((ias_selection.x2 - ias_selection.x1)*ratio_h)/ratio_l);
     664                                                                                if(hauteur_ratio <= hauteur_image){
     665                                                                                        /**
     666                                                                                         * On redimentionne la hauteur
     667                                                                                         */
     668                                                                                        if((parseInt($('#recadre_y1').val()) + hauteur_ratio) > hauteur_actuelle){
     669                                                                                                /**
     670                                                                                                 * On va devoir remonter l'image pour qu'elle rentre dans le cadre
     671                                                                                                 */
     672                                                                                                var y1 = hauteur_image - hauteur_ratio.toFixed(0);
     673                                                                                                var y2 = hauteur_image.toFixed(0);
     674                                                                                                $('#recadre_y1').val(y1)
     675                                                                                                $('#recadre_y2').val(y2);
     676                                                                                                ias_selection.y2 = $('#image_modifier img').height();
     677                                                                                                ias_selection.y1 = (ias_selection.y2-hauteur_cadre_ratio).toFixed(0);
     678                                                                                        }else{
     679                                                                                                /**
     680                                                                                                 * L'image reste en place, on change les dimensions seulement
     681                                                                                                 */
     682                                                                                                var y2 = (parseInt($('#recadre_y1').val()) + hauteur_ratio).toFixed(0);
     683                                                                                                $('#recadre_y2').val(y2);
     684                                                                                                ias_selection.y2 = (parseInt(ias_selection.y1)+hauteur_cadre_ratio).toFixed(0);
     685                                                                                        }
     686                                                                                        $('#recadre_height').val(((parseInt($('#recadre_width').val())*ratio_h)/ratio_l).toFixed(0));
     687                                                                                }else{
     688                                                                                        /**
     689                                                                                         * On transforme la largeur car la hauteur sera trop grande
     690                                                                                         */
     691                                                                                        if((parseInt($('#recadre_x1').val()) + hauteur_ratio) > largeur_image){
     692                                                                                                /**
     693                                                                                                 * On va devoir déplacer l'image
     694                                                                                                 * pour qu'elle rentre dans le cadre
     695                                                                                                 */
     696                                                                                                var x1 = largeur_image - hauteur_ratio;
     697                                                                                                var x2 = largeur_image;
     698                                                                                                $('#recadre_x1').val(x1)
     699                                                                                                $('#recadre_x2').val(x2);
     700                                                                                                ias_selection.x2 = $('#image_modifier img').width();
     701                                                                                                ias_selection.x1 = (ias_selection.x2-hauteur_cadre_ratio).toFixed(0);
     702                                                                                        }else{
     703                                                                                                /**
     704                                                                                                 * L'image reste en place, on change les dimensions seulement
     705                                                                                                 */
     706                                                                                                var x2 = parseInt($('#recadre_x1').val()) + hauteur_ratio;
     707                                                                                                $('#recadre_x2').val(x2);
     708                                                                                                ias_selection.x2 = (parseInt(ias_selection.x1)+hauteur_cadre_ratio).toFixed(0);
     709                                                                                        }
     710                                                                                        $('#recadre_width').val(((parseInt($('#recadre_width').val())*ratio_l)/ratio_h).toFixed(0));
     711                                                                                }
     712                                                                        }
     713                                                                        ias.setSelection(ias_selection.x1,ias_selection.y1,ias_selection.x2,ias_selection.y2);
     714                                                                        ias.update();
     715                                                                }
     716                                                                else{
     717                                                                        ias.setOptions({aspectRatio: ''});
     718                                                                }
    481719                                                        }
    482720                                                });
  • _plugins_/photospip/trunk/formulaires/editer_image_format.html

    r61884 r61948  
    6565                        </div>
    6666                        <div class="choix">
    67                                 <input type="radio" id="ratio1" name="ratio" value="1:1"[(#ENV{ratio}|=={'1:1'}|oui)checked="checked"] />
     67                                <input type="radio" id="ratio1" name="ratio" value="1:1"[(#ENV{ratio,''}|=={'1:1'}|oui)checked="checked"] />
    6868                                <label for="ratio1">1:1</label>
    6969                        </div>
    7070                        <div class="choix">
    71                                 <input type="radio" id="ratio2" name="ratio" value="4:3"[(#ENV{ratio}|=={'4:3'}|oui)checked="checked"] />
     71                                <input type="radio" id="ratio2" name="ratio" value="4:3"[(#ENV{ratio,''}|=={'4:3'}|oui)checked="checked"] />
    7272                                <label for="ratio2">4:3</label>
    7373                        </div>
    7474                        <div class="choix">
    75                                 <input type="radio" id="ratio3" name="ratio" value="16:9"[(#ENV{ratio}|=={'16:9'}|oui)checked="checked"] />
     75                                <input type="radio" id="ratio3" name="ratio" value="16:9"[(#ENV{ratio,''}|=={'16:9'}|oui)checked="checked"] />
    7676                                <label for="ratio3">16:9</label>
    7777                        </div>
  • _plugins_/photospip/trunk/plugin.xml

    r61874 r61948  
    44_ © 2008-2012 - Distribué sous licence GNU/GPL
    55        </auteur>
    6         <version>0.4.1</version>
     6        <version>0.4.2</version>
    77        <version_base>0.4</version_base>
    88        <prefix>photospip</prefix>
Note: See TracChangeset for help on using the changeset viewer.