Changeset 62003 in spip-zone


Ignore:
Timestamp:
Jun 1, 2012, 8:45:43 PM (7 years ago)
Author:
kent1@…
Message:

On règle un problème sur le scroll dans la modale...

C'est quand même compliqué cette modale

Location:
_plugins_/photospip
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/photospip/branches/v1/formulaires/editer_image.html

    r61976 r62003  
    143143                        largeur = parseFloat(#GET{largeur_image});
    144144                        hauteur = parseFloat(#GET{hauteur_image});
    145                         ratio = largeur/parseFloat($('#image-container img').width());
     145                        //ratio = largeur/parseFloat($('#image-container img').width());
    146146                        [(#CONFIG{photospip/image_recadre,on}|=={on}|oui)
    147147                                var x1, y1, x2, y2, w, h, ias;
     
    268268                                }
    269269                        }
    270                         if(typeof(jQuery) == 'function'){
     270                        if(typeof($) == 'function' && typeof(jQuery) == 'function'){
    271271                                jQuery(document).ready(function() {
    272272                                        var cbox = '[(#EVAL{_AJAX}|?{oui,non})]';
     273                                       
    273274                                        /**
    274275                                         * Cas où l'on se trouve dans une mediabox
    275276                                         */
    276                                         if(cbox == 'oui'){
    277                                                 $(document).bind('cbox_complete', function(){
     277                                        var container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top;
     278                                        if((cbox == 'oui') || ($('#image-container').parents('#cboxLoadedContent').size()>0)){
     279                                                var boxoffset, boxmargins,container_offset;
     280                                                var init_box = function(){
    278281                                                        $('input[type=number]').spinner();
    279282                                                        if($('#modifier_image img').width() > $('#modifier_image').width()){
    280283                                                                $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
    281                                                                 ratio = largeur/parseFloat($('#image-container img').width());
    282                                                         }
     284                                                        }
     285                                                        ratio = largeur/parseFloat($('#image-container img').width());
     286                                                       
    283287                                                        jQuery('.cache').hide();
    284                                                         var boxoffset = $('#cboxLoadedContent').offset();
    285                                                         var container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top;
    286                                                         var container_width = $('#image-container').width();
     288                                                       
    287289                                                        /**
    288290                                                         * Si on est en modal et si la hauteur de l'image affichée est inférieure à la hauteur
    289291                                                         * de la div de la modale, on fait scroller l'image lors du scroll dans la modale
    290                                                          */
    291                                                         if($('#image-container').height() < $('#cboxLoadedContent').height()){
    292                                                                 $('#cboxLoadedContent').scroll(function() {
    293                                                                         var limite_image = boxoffset.top;
    294                                                                         var limite_bas = limite_image+$('#image-container').parents("form").height()-$('#image-container').parents("form").find(".boutons").height();
    295                                                                         var pos_bas = $('#image-container').offset().top+$('#image-container').height();
    296                                                                         if(($('#cboxLoadedContent').scrollTop() >= container_offset) && (pos_bas <= limite_bas) && ($('#cboxLoadedContent').scrollTop()+$('#image-container').offset().top < limite_bas)){
    297                                                                                 var margintop = $('#cboxLoadedContent').scrollTop() - container_offset+20;
    298                                                                                 if(!$('#image-container').hasClass("image_flottant"))
    299                                                                                         $('#image-container').addClass("image_flottant");
    300                                                                                 $('#image-container').css({"margin-top": margintop+"px"});
    301                                                                                 if(typeof(ias) == 'object'){
    302                                                                                         ias.update();
    303                                                                                 }
    304                                                                         }
    305                                                                         else if(($('cboxLoadedContent').scrollTop() < container_offset)||(pos_bas > limite_bas) ){
    306                                                                                 $('#image-container').removeClass("image_flottant").css({"margin-top": "0px", "width": "auto"});
    307                                                                                 if(typeof(ias) == 'object'){
    308                                                                                         ias.update();
    309                                                                                 }
    310                                                                         }
    311                                                                 });
    312                                                         }
    313                                                 });
     292                                                         * jusqu'aux boutons au maximum
     293                                                         */                                                     
     294                                                        boxoffset = $('#cboxLoadedContent').offset();
     295                                                        boxmargins = $('#cboxContent').height() - $('#cboxLoadedContent').height();
     296                                                        container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top+10;
     297                                                        $('#cboxLoadedContent').unbind('scroll').scroll(function() {
     298                                                                var limite_image = boxoffset.top;
     299                                                                var limite_bas = $('#cboxContent .boutons').last().offset().top-$('#cboxContent .boutons').last().outerHeight();
     300                                                                var pos_bas = $('#image-container').offset().top+$('#image-container').height();
     301                                                                if(($('#cboxLoadedContent').scrollTop() >= container_offset) && (pos_bas < limite_bas) && ($('#cboxLoadedContent').scrollTop()+$('#image-container').offset().top < limite_bas)){
     302                                                                        var margintop = $('#cboxLoadedContent').scrollTop() - container_offset+(boxmargins/2);
     303                                                                        if(!$('#image-container').hasClass("image_flottant"))
     304                                                                                $('#image-container').addClass("image_flottant");
     305                                                                        $('#image-container').css({"margin-top": margintop+"px"});
     306                                                                        if(typeof(ias) == 'object'){
     307                                                                                ias.update();
     308                                                                        }
     309                                                                }
     310                                                                else if($('#image-container').hasClass("image_flottant") && ($('#cboxLoadedContent').scrollTop() < container_offset)){
     311                                                                        $('#image-container').removeClass("image_flottant").css({"margin-top": "0px", "width": "auto"});
     312                                                                        if(typeof(ias) == 'object'){
     313                                                                                ias.update();
     314                                                                        }
     315                                                                }
     316                                                        });
     317                                                }
     318                                                /**
     319                                                 * On initialise les js de la box qui si la box est complete
     320                                                 */
     321                                                if($('#cboxLoadedContent').html() == ''){
     322                                                        $(document).bind('cbox_complete', function(){
     323                                                                init_box();
     324                                                        });
     325                                                }else{
     326                                                        init_box();
     327                                                }
    314328                                                if($('#modifier_image').width() != 0){
    315329                                                        if($('#modifier_image img').width() > $('#modifier_image').width()){
     
    320334                                                if($('#modifier_image img').width() > $('#modifier_image').width()){
    321335                                                        $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
    322                                                         ratio = largeur/parseFloat($('#image-container img').width());
    323336                                                }
     337                                                ratio = largeur/parseFloat($('#image-container img').width());
    324338                                                $('input[type=number]').spinner();
    325339                                                jQuery('.cache').hide();
  • _plugins_/photospip/branches/v1/plugin.xml

    r61948 r62003  
    44_ © 2008-2012 - Distribué sous licence GNU/GPL
    55        </auteur>
    6         <version>0.4.2</version>
     6        <version>0.4.3</version>
    77        <version_base>0.4</version_base>
    88        <prefix>photospip</prefix>
  • _plugins_/photospip/branches/v1/prive/style_prive_plugin_photospip.html

    r61976 r62003  
    2626#image-container{
    2727        position:relative;
    28         margin:15px 0px;
     28        margin:0 0px;
    2929        text-align:center;
    3030}
     
    118118        background:url(#CHEMIN{img_pack/tourner-gauche.gif}) no-repeat left center;
    119119}
     120
     121#modifier_image .spip_documents{
     122        margin:0;
     123        padding:0;
     124}
    120125[(#REM) </style>]
    121126
  • _plugins_/photospip/trunk/formulaires/editer_image.html

    r61966 r62003  
    143143                        largeur = parseFloat(#GET{largeur_image});
    144144                        hauteur = parseFloat(#GET{hauteur_image});
    145                         ratio = largeur/parseFloat($('#image-container img').width());
     145                        //ratio = largeur/parseFloat($('#image-container img').width());
    146146                        [(#CONFIG{photospip/image_recadre,on}|=={on}|oui)
    147147                                var x1, y1, x2, y2, w, h, ias;
     
    268268                                }
    269269                        }
    270                         if(typeof(jQuery) == 'function'){
     270                        if(typeof($) == 'function' && typeof(jQuery) == 'function'){
    271271                                jQuery(document).ready(function() {
    272272                                        var cbox = '[(#EVAL{_AJAX}|?{oui,non})]';
     273                                       
    273274                                        /**
    274275                                         * Cas où l'on se trouve dans une mediabox
    275276                                         */
    276                                         if(cbox == 'oui'){
    277                                                 $(document).bind('cbox_complete', function(){
     277                                        var container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top;
     278                                        if((cbox == 'oui') || ($('#image-container').parents('#cboxLoadedContent').size()>0)){
     279                                                var boxoffset, boxmargins,container_offset;
     280                                                var init_box = function(){
    278281                                                        $('input[type=number]').spinner();
    279282                                                        if($('#modifier_image img').width() > $('#modifier_image').width()){
    280283                                                                $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
    281                                                                 ratio = largeur/parseFloat($('#image-container img').width());
    282                                                         }
     284                                                        }
     285                                                        ratio = largeur/parseFloat($('#image-container img').width());
     286                                                       
    283287                                                        jQuery('.cache').hide();
    284                                                         var boxoffset = $('#cboxLoadedContent').offset();
    285                                                         var container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top;
    286                                                         var container_width = $('#image-container').width();
     288                                                       
    287289                                                        /**
    288290                                                         * Si on est en modal et si la hauteur de l'image affichée est inférieure à la hauteur
    289291                                                         * de la div de la modale, on fait scroller l'image lors du scroll dans la modale
    290                                                          */
    291                                                         if($('#image-container').height() < $('#cboxLoadedContent').height()){
    292                                                                 $('#cboxLoadedContent').scroll(function() {
    293                                                                         var limite_image = boxoffset.top;
    294                                                                         var limite_bas = limite_image+$('#image-container').parents("form").height()-$('#image-container').parents("form").find(".boutons").height();
    295                                                                         var pos_bas = $('#image-container').offset().top+$('#image-container').height();
    296                                                                         if(($('#cboxLoadedContent').scrollTop() >= container_offset) && (pos_bas <= limite_bas) && ($('#cboxLoadedContent').scrollTop()+$('#image-container').offset().top < limite_bas)){
    297                                                                                 var margintop = $('#cboxLoadedContent').scrollTop() - container_offset+20;
    298                                                                                 if(!$('#image-container').hasClass("image_flottant"))
    299                                                                                         $('#image-container').addClass("image_flottant");
    300                                                                                 $('#image-container').css({"margin-top": margintop+"px"});
    301                                                                                 if(typeof(ias) == 'object'){
    302                                                                                         ias.update();
    303                                                                                 }
    304                                                                         }
    305                                                                         else if(($('cboxLoadedContent').scrollTop() < container_offset)||(pos_bas > limite_bas) ){
    306                                                                                 $('#image-container').removeClass("image_flottant").css({"margin-top": "0px", "width": "auto"});
    307                                                                                 if(typeof(ias) == 'object'){
    308                                                                                         ias.update();
    309                                                                                 }
    310                                                                         }
    311                                                                 });
    312                                                         }
    313                                                 });
     292                                                         * jusqu'aux boutons au maximum
     293                                                         */                                                     
     294                                                        boxoffset = $('#cboxLoadedContent').offset();
     295                                                        boxmargins = $('#cboxContent').height() - $('#cboxLoadedContent').height();
     296                                                        container_offset = $('#image-container').offset().top-$('#cboxLoadedContent').offset().top+10;
     297                                                        $('#cboxLoadedContent').unbind('scroll').scroll(function() {
     298                                                                var limite_image = boxoffset.top;
     299                                                                var limite_bas = $('#cboxContent .boutons').last().offset().top-$('#cboxContent .boutons').last().outerHeight();
     300                                                                var pos_bas = $('#image-container').offset().top+$('#image-container').height();
     301                                                                if(($('#cboxLoadedContent').scrollTop() >= container_offset) && (pos_bas < limite_bas) && ($('#cboxLoadedContent').scrollTop()+$('#image-container').offset().top < limite_bas)){
     302                                                                        var margintop = $('#cboxLoadedContent').scrollTop() - container_offset+(boxmargins/2);
     303                                                                        if(!$('#image-container').hasClass("image_flottant"))
     304                                                                                $('#image-container').addClass("image_flottant");
     305                                                                        $('#image-container').css({"margin-top": margintop+"px"});
     306                                                                        if(typeof(ias) == 'object'){
     307                                                                                ias.update();
     308                                                                        }
     309                                                                }
     310                                                                else if($('#image-container').hasClass("image_flottant") && ($('#cboxLoadedContent').scrollTop() < container_offset)){
     311                                                                        $('#image-container').removeClass("image_flottant").css({"margin-top": "0px", "width": "auto"});
     312                                                                        if(typeof(ias) == 'object'){
     313                                                                                ias.update();
     314                                                                        }
     315                                                                }
     316                                                        });
     317                                                }
     318                                                /**
     319                                                 * On initialise les js de la box qui si la box est complete
     320                                                 */
     321                                                if($('#cboxLoadedContent').html() == ''){
     322                                                        $(document).bind('cbox_complete', function(){
     323                                                                init_box();
     324                                                        });
     325                                                }else{
     326                                                        init_box();
     327                                                }
    314328                                                if($('#modifier_image').width() != 0){
    315329                                                        if($('#modifier_image img').width() > $('#modifier_image').width()){
     
    320334                                                if($('#modifier_image img').width() > $('#modifier_image').width()){
    321335                                                        $('#image-container img').attr('width','').attr('height','').width('100%').height('auto');
    322                                                         ratio = largeur/parseFloat($('#image-container img').width());
    323336                                                }
     337                                                ratio = largeur/parseFloat($('#image-container img').width());
    324338                                                $('input[type=number]').spinner();
    325339                                                jQuery('.cache').hide();
  • _plugins_/photospip/trunk/plugin.xml

    r61948 r62003  
    44_ © 2008-2012 - Distribué sous licence GNU/GPL
    55        </auteur>
    6         <version>0.4.2</version>
     6        <version>0.4.3</version>
    77        <version_base>0.4</version_base>
    88        <prefix>photospip</prefix>
  • _plugins_/photospip/trunk/prive/style_prive_plugin_photospip.html

    r61977 r62003  
    2626#image-container{
    2727        position:relative;
    28         margin:15px 0px;
     28        margin:0 0px;
    2929        text-align:center;
    3030}
     
    118118        background:url(#CHEMIN{img_pack/tourner-gauche.gif}) no-repeat left center;
    119119}
     120
     121#modifier_image .spip_documents{
     122        margin:0;
     123        padding:0;
     124}
    120125[(#REM) </style>]
    121126
Note: See TracChangeset for help on using the changeset viewer.