Changeset 77240 in spip-zone


Ignore:
Timestamp:
Oct 15, 2013, 3:48:20 PM (6 years ago)
Author:
cedric@…
Message:

Coquille
+ injecter le CSS+JS global si il y a une image responsive, meme si on a fait aucun remplacement (preparation au support en filtre)
+ utiliser jQuery a la place de window.onload si possible

Location:
_plugins_/respim/trunk
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/respim/trunk/paquet.xml

    r77239 r77240  
    22        prefix="respim"
    33        categorie="multimedia"
    4         version="0.4.0"
     4        version="0.4.1"
    55        etat="dev"
    66        compatibilite="[3.0.12-dev;3.0.*]"
  • _plugins_/respim/trunk/respim_options.php

    r77239 r77240  
    5252                $mw20 = ($prev_width?"(min-width:".round($prev_width/2)."px)":"(max-width:".round($w/2)."px)");
    5353                $mw15 = ($prev_width?"(min-width:".round($prev_width/1.5)."px)":"(max-width:".round($w/1.5)."px)");
    54                 $medias[$w] = "@media screen and $mw,screen and (-webkit-min-device-pixel-ratio: 2) and $mw20,screen and (-webkit-min-device-pixel-ratio: 1.5) and $mw15,screen and (min--moz-device-pixel-ratio: 2) and $mw20,screen and (min--moz-device-pixel-ratio: 1.5) and $mw15{b.$cid,b.$cid:after{background-image:url($file?);}}";
     54                $medias[$w] = "@media screen and $mw,screen and (-webkit-min-device-pixel-ratio: 2) and $mw20,screen and (-webkit-min-device-pixel-ratio: 1.5) and $mw15,screen and (min--moz-device-pixel-ratio: 2) and $mw20,screen and (min--moz-device-pixel-ratio: 1.5) and $mw15{b.$cid,b.$cid:after{background-image:url($file);}}";
    5555                $prev_width = $w+1;
    5656        }
     
    138138 */
    139139function respim_affichage_final($texte){
     140        $respim_ins = false;
    140141        if ($GLOBALS['html']){
    141142                #spip_timer();
     
    148149                        }
    149150                }
    150                 if (count($replace))
     151                if (count($replace)){
     152                        $respim_ins = true;
    151153                        $texte = str_replace(array_keys($replace),array_values($replace),$texte);
     154                }
     155                if ($respim_ins OR strpos($texte,"respwrapper")!==false){
     156                        // les styles communs a toutes les images responsive en cours de chargement
     157                        $ins = "<style type='text/css'>"."img.respim{opacity:0.70;max-width:100%;height:auto;}"
     158                        ."b.respwrapper{display:inline-block;max-width:100%;position:relative;background-size:100%;background-repeat:no-repeat;}"
     159                        ."b.respwrapper:after{position:absolute;top:0;left:0;right:0;bottom:0;background-size:100%;background-repeat:no-repeat;display:inline-block;max-width:100%;content:\"\"}"
     160                        ."</style>";
     161                        // le script qui est appele post-chargement pour finir le rendu (rend les images enregistrables par clic-droit aussi)
     162                        $async_style = "html img.respim{opacity:0.01}html b.respwrapper:after{display:none;}";
     163                        $ins .= "<script>var respim_onload = function(){"
     164                          ."var sa = document.createElement('style'); sa.type = 'text/css';"
     165                          ."sa.innerHTML = '$async_style';"
     166                          ."var s = document.getElementsByTagName('style')[0]; s.parentNode.insertBefore(sa, s);};"
     167                                ."if (typeof jQuery!=='undefined') jQuery(function(){jQuery(window).load(respim_onload)}); else window.onload=respim_onload;</script>";
     168                        // inserer abant le premier <script> ou <link a defaut
     169                        if ($p = strpos($texte,"<link") OR $p = strpos($texte,"<script") OR $p = strpos($texte,"</head"))
     170                                $texte = substr_replace($texte,"<!--[if !IE]-->$ins<!--[endif]-->\n",$p,0);
     171                }
    152172                #var_dump(spip_timer());
    153                 // les styles communs a toutes les images responsive en cours de chargement
    154                 $ins = "<style type='text/css'>"."img.respim{opacity:0.70;max-width:100%;height:auto;}"
    155                 ."b.respwrapper{display:inline-block;max-width:100%;position:relative;background-size:100%;background-repeat:no-repeat;}"
    156                 ."b.respwrapper:after{position:absolute;top:0;left:0;right:0;bottom:0;background-size:100%;background-repeat:no-repeat;display:inline-block;max-width:100%;content:\"\"}"
    157                 ."</style>";
    158                 // le script qui est appele post-chargement pour finir le rendu (rend les images enregistrables par clic-droit aussi)
    159                 $async_style = "html img.respim{opacity:0.01}html b.respwrapper:after{display:none;}";
    160                 $ins .= "<script>window.onload = function(){"
    161                   ."var sa = document.createElement('style'); sa.type = 'text/css';"
    162                   ."sa.innerHTML = '$async_style';"
    163                   ."var s = document.getElementsByTagName('style')[0]; s.parentNode.insertBefore(sa, s);}</script>";
    164                 // inserer abant le premier <script> ou <link a defaut
    165                 if ($p = strpos($texte,"<link") OR $p = strpos($texte,"<script") OR $p = strpos($texte,"</head"))
    166                         $texte = substr_replace($texte,"<!--[if !IE]-->$ins<!--[endif]-->\n",$p,0);
    167173        }
    168174        return $texte;
Note: See TracChangeset for help on using the changeset viewer.