| /trunk/widget/modules/photo/squelettes/photo.tpl.html |
|---|
| 21,25 → 21,37 |
| <link rel="icon" type="image/png" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png" /> |
| <link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.ico" /> |
| <!-- Javascript : bibliothèques --> |
| <script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.4.4/jquery-1.4.4.min.js"></script> |
| <script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.2/jquery.fancybox-1.3.2.js"></script> |
| <!-- Feuilles de styles --> |
| <link rel="stylesheet" type="text/css" href="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.2/jquery.fancybox-1.3.2.css" media="screen" /> |
| <link rel="stylesheet" type="text/css" href="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css" media="screen" /> |
| <link rel="stylesheet" type="text/css" href="<?=$url_css?>photo.css" media="screen" /> |
| <style type="text/css"> |
| #contenu, #galerie-photo{ |
| width:<?=($colonne * 69)?>px; |
| html { |
| overflow:hidden; |
| } |
| #galerie-photo #photo-extra img{ |
| width:<?=(($colonne * 63) + 18)?>px; |
| body{ |
| overflow:hidden; |
| padding:0; |
| margin:0; |
| width:100%; |
| height:100%; |
| background-color:#4A4B4C; |
| color:#CCC; |
| } |
| #cel-photo-contenu, #cel-galerie-photo{ |
| width:<?=(($colonne * 69))?>px; |
| } |
| #cel-galerie-photo #cel-photo-extra img{ |
| width:<?=(($colonne * 69)-6)?>px; |
| } |
| </style> |
| <!-- Javascript : bibliothèques --> |
| <script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.4.4/jquery-1.4.4.min.js"></script> |
| <script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.js"></script> |
| </head> |
| <body> |
| <!-- WIDGET:CEL:PHOTO - DEBUT --> |
| <div id="contenu"> |
| <div id="cel-photo-contenu"> |
| <?php if (isset($erreurs) || isset($informations)) : ?> |
| <h1>Erreur & informations</h1> |
| <p>Impossible d'afficher le flux.</p> |
| 62,32 → 74,32 |
| CEL |
| </a> |
| <a href="<?=$flux_rss_url?>" |
| id="flux-suivre" |
| id="cel-photo-flux" |
| title="Suivre les images" |
| onclick="window.open(this.href);return false;"> |
| Suivre les images |
| <img src="http://www.tela-botanica.org/sites/commun/generique/images/rss.png" alt="Suivre les images" /> |
| </a> |
| </h1> |
| <div id="galerie-photo"> |
| <div id="cel-galerie-photo"> |
| <?php foreach ($items as $item) : ?> |
| <div class="photo"> |
| <div class="cel-photo"> |
| <a href="<?=$item['lien']?>" class="cel-img" title="<?=$item['titre']?> - Publiée le <?=$item['date']?> - GUID : <?=$item['guid']?>" rel="galerie-princ"> |
| <img src="<?=sprintf($item['url_tpl'], 'S')?>" alt="<?=$item['titre']?>"/> |
| </a> |
| <div id="cel-info-<?=$item['guid']?>" class="infos"> |
| <div id="cel-info-<?=$item['guid']?>" class="cel-infos"> |
| <strong> |
| <a class="img-titre" href="<?=$item['eflore_url']?>" |
| <a class="cel-img-titre" href="<?=$item['eflore_url']?>" |
| onclick="window.open(this.href);return false;" |
| title="Cliquez pour accéder à la fiche eFlore"> |
| <?=$item['titre']?> |
| </a> |
| </strong><br /> |
| <span class="img-date">Publiée le <?=$item['date']?></span> |
| <span class="cel-img-date">Publiée le <?=$item['date']?></span> |
| </div> |
| </div> |
| <?php endforeach; ?> |
| <?php if ($extra_actif) : ?> |
| <div id="photo-extra" class="photo"> |
| <div id="cel-photo-extra" class="cel-photo"> |
| <a href="<?=$extra['lien']?>" class="cel-img" title="<?=$extra['titre']?> - Publiée le <?=$extra['date']?> - GUID : <?=$extra['guid']?>" rel="galerie-princ"> |
| <img src="<?=sprintf($extra['url_tpl'], 'M')?>" alt="<?=$extra['titre']?>"/> |
| </a> |
| 94,40 → 106,34 |
| </div> |
| </div> |
| <?php endif ?> |
| <p id="date-generation" class="discretion nettoyage">Au <?=strftime('%A %d %B %Y à %H:%M:%S')?></p> |
| <p id="cel-photo-date-generation" class="discretion nettoyage">Au <?=strftime('%A %d %B %Y à %H:%M:%S')?></p> |
| <script type="text/Javascript"> |
| //<![CDATA[ |
| var $doc = window.document; |
| function formaterTitre(titre, currentArray, currentIndex, currentOpts) { |
| var motif = /GUID : ([0-9]+)$/; |
| motif.exec(titre); |
| var guid = 'cel-info-'+RegExp.$1; |
| var info = $('#'+guid, $doc).html(); |
| var tpl = |
| '<div id="legende">'+ |
| '<p id="legende-vei">'+'Image n°' + (currentIndex + 1) + ' sur ' + currentArray.length +'<\/p>'+ |
| var motif = /GUID : ([0-9]+)$/; |
| motif.exec(titre); |
| var guid = RegExp.$1; |
| var info = $('#cel-info-'+guid).clone().html(); |
| var tpl = |
| '<div id="cel-legende">'+ |
| '<p id="cel-legende-vei">'+'Image n°' + (currentIndex + 1) + ' sur ' + currentArray.length +'<\/p>'+ |
| (titre && titre.length ? '<p>'+info+'<\/p>' : '' )+ |
| '<\/div>'; |
| return tpl; |
| } |
| (function($, originalInit) { |
| parent.jQuery.fn.init = function(selector, context) { |
| //alert('hello: ' + originalInit); |
| return new originalInit(selector, context || $doc); |
| }; |
| $(window).load(function() { |
| $('a.cel-img', $doc).attr('rel', 'galerie-princ').fancybox({ |
| transitionIn : 'elastic', |
| transitionOut : 'elastic', |
| speedIn : 600, |
| speedOut : 200, |
| overlayShow : true, |
| titlePosition : 'inside', |
| titleFormat : formaterTitre |
| }); |
| $(document).ready(function() { |
| $('a.cel-img').attr('rel', 'galerie-princ').fancybox({ |
| transitionIn:'elastic', |
| transitionOut:'elastic', |
| speedIn :600, |
| speedOut:200, |
| overlayShow:true, |
| titleShow:true, |
| titlePosition:'inside', |
| titleFormat:formaterTitre |
| }); |
| }(parent.jQuery, parent.jQuery.fn.init)); |
| }); |
| //]]> |
| </script> |
| <?php endif; ?> |
| /trunk/widget/modules/photo/squelettes/photo_ajax.tpl.html |
|---|
| New file |
| 0,0 → 1,101 |
| <!-- WIDGET:CEL:PHOTO - DEBUT --> |
| <div id="cel-photo-contenu"> |
| <!-- Feuilles de styles --> |
| <style type="text/css"> |
| #cel-photo-contenu, #cel-galerie-photo{ |
| width:<?=(($colonne * 69))?>px; |
| } |
| #cel-galerie-photo #cel-photo-extra img{ |
| width:<?=(($colonne * 69)-6)?>px; |
| } |
| </style> |
| <!-- Javascript : bibliothèques --> |
| <script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.js"></script> |
| <?php if (isset($erreurs) || isset($informations)) : ?> |
| <h1>Erreur & informations</h1> |
| <p>Impossible d'afficher le flux.</p> |
| <!-- Affichage des erreurs et messages d'information : --> |
| <?php if ($erreurs) : ?> |
| <?php foreach ($erreurs as $erreur) : ?> |
| <p class="erreur"><?=$erreur;?></p> |
| <?php endforeach; ?> |
| <?php endif; ?> |
| <?php if ($informations) : ?> |
| <?php foreach ($informations as $information) : ?> |
| <p class="info"><?=$information;?></p> |
| <?php endforeach; ?> |
| <?php endif; ?> |
| <?php else : ?> |
| <h1> |
| Dernières images du |
| <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href);return false;"> |
| CEL |
| </a> |
| <a href="<?=$flux_rss_url?>" |
| id="cel-photo-flux" |
| title="Suivre les images" |
| onclick="window.open(this.href);return false;"> |
| <img src="http://www.tela-botanica.org/sites/commun/generique/images/rss.png" alt="Suivre les images" /> |
| </a> |
| </h1> |
| <div id="cel-galerie-photo"> |
| <?php foreach ($items as $item) : ?> |
| <div class="cel-photo"> |
| <a href="<?=$item['lien']?>" class="cel-img" title="<?=$item['titre']?> - Publiée le <?=$item['date']?> - GUID : <?=$item['guid']?>" rel="galerie-princ"> |
| <img src="<?=sprintf($item['url_tpl'], 'S')?>" alt="<?=$item['titre']?>"/> |
| </a> |
| <div id="cel-info-<?=$item['guid']?>" class="cel-infos"> |
| <strong> |
| <a class="cel-img-titre" href="<?=$item['eflore_url']?>" |
| onclick="window.open(this.href);return false;" |
| title="Cliquez pour accéder à la fiche eFlore"> |
| <?=$item['titre']?> |
| </a> |
| </strong><br /> |
| <span class="cel-img-date">Publiée le <?=$item['date']?></span> |
| </div> |
| </div> |
| <?php endforeach; ?> |
| <?php if ($extra_actif) : ?> |
| <div id="cel-photo-extra" class="cel-photo"> |
| <a href="<?=$extra['lien']?>" class="cel-img" title="<?=$extra['titre']?> - Publiée le <?=$extra['date']?> - GUID : <?=$extra['guid']?>" rel="galerie-princ"> |
| <img src="<?=sprintf($extra['url_tpl'], 'M')?>" alt="<?=$extra['titre']?>"/> |
| </a> |
| </div> |
| </div> |
| <?php endif ?> |
| <p id="cel-photo-date-generation" class="discretion nettoyage">Au <?=strftime('%A %d %B %Y à %H:%M:%S')?></p> |
| <script type="text/Javascript"> |
| //<![CDATA[ |
| function formaterTitre(titre, currentArray, currentIndex, currentOpts) { |
| var motif = /GUID : ([0-9]+)$/; |
| motif.exec(titre); |
| var guid = RegExp.$1; |
| var info = $('#cel-info-'+guid).clone().html(); |
| var tpl = |
| '<div id="cel-legende">'+ |
| '<p id="cel-legende-vei">'+'Image n°' + (currentIndex + 1) + ' sur ' + currentArray.length +'<\/p>'+ |
| (titre && titre.length ? '<p>'+info+'<\/p>' : '' )+ |
| '<\/div>'; |
| return tpl; |
| } |
| $(document).ready(function() { |
| $('a.cel-img').attr('rel', 'galerie-princ').fancybox({ |
| transitionIn:'elastic', |
| transitionOut:'elastic', |
| speedIn :600, |
| speedOut:200, |
| overlayShow:true, |
| titleShow:true, |
| titlePosition:'inside', |
| titleFormat:formaterTitre |
| }); |
| }); |
| //]]> |
| </script> |
| <?php endif; ?> |
| </div> |
| <!-- WIDGET:CEL:PHOTO - FIN --> |
| /trunk/widget/modules/photo/squelettes/css/photo.css |
|---|
| 1,113 → 1,95 |
| @charset "UTF-8"; |
| html { |
| overflow:hidden; |
| } |
| body{ |
| overflow:hidden; |
| padding:0; |
| margin:0; |
| width:100%; |
| height:100%; |
| /*+-----------------------------------------------------------------------------------------------------------------+*/ |
| /* Widget */ |
| #cel-photo-contenu{ |
| position:relative; |
| padding:0 5px; |
| margin:5px auto; |
| font-family:Arial,verdana,sans-serif; |
| font-size:12px; |
| background-color:#4A4B4C; |
| color:#CCC; |
| } |
| img { |
| border:0; |
| } |
| h1 { |
| #cel-photo-contenu h1 { |
| margin:5px; |
| font-size:1.6em; |
| background-color:transparent; |
| } |
| h2 { |
| font-size:1.4em; |
| #cel-photo-contenu h1 #cel-photo-flux{ |
| width:16px; |
| height:20px; |
| } |
| a, a:active, a:visited { |
| #cel-photo-contenu img { |
| border:0; |
| } |
| #cel-photo-contenu a, #cel-photo-contenu a:active, #cel-photo-contenu a:visited { |
| border-bottom:1px dotted #666; |
| color:#CCC; |
| text-decoration:none; |
| } |
| a:active { |
| #cel-photo-contenu a:active { |
| outline:none; |
| } |
| a:focus { |
| #cel-photo-contenu a:focus { |
| outline:thin dotted; |
| } |
| a:hover { |
| #cel-photo-contenu a:hover { |
| color:#56B80E; |
| border-bottom:1px dotted #56B80E; |
| } |
| #cel-photo-date-generation{ |
| text-align:right; |
| } |
| /*+-----------------------------------------------------------------------------------------------------------------+*/ |
| /* Général */ |
| .discretion { |
| #cel-photo-contenu .discretion { |
| color:grey; |
| font-family:arial; |
| font-size:11px; |
| font-weight:bold; |
| } |
| .nettoyage { |
| #cel-photo-contenu .nettoyage { |
| clear:both; |
| } |
| hr.nettoyage { |
| visibility:hidden; |
| } |
| /*+-----------------------------------------------------------------------------------------------------------------+*/ |
| /* Widget */ |
| #contenu{ |
| position:relative; |
| margin:5px auto; |
| } |
| #date-generation{ |
| text-align:right; |
| } |
| #flux-suivre { |
| color:rgba(0,0,0,0); |
| background:url("http://www.tela-botanica.org/sites/commun/generique/images/rss.png") no-repeat scroll 0 2px transparent; |
| width:16px; |
| height:20px; |
| overflow:hidden; |
| } |
| #flux-suivre:hover { |
| color:rgba(0,0,0,0); |
| } |
| /*+-----------------------------------------------------------------------------------------------------------------+*/ |
| /* Galerie Photos CEL */ |
| #galerie-photo .photo a{ |
| #cel-photo-contenu .cel-photo a{ |
| float:left; |
| padding:2px; |
| border:1px solid white; |
| } |
| #galerie-photo .photo a:hover{ |
| #cel-photo-contenu .cel-photo a:hover{ |
| border:1px dotted #FD8C13; |
| } |
| #galerie-photo .photo a img{ |
| #cel-photo-contenu .cel-photo a img{ |
| float:left; |
| width:63px; |
| height:63px; |
| } |
| #galerie-photo #photo-extra img{ |
| #cel-photo-contenu #cel-photo-extra img{ |
| height:auto; |
| } |
| .infos { |
| #cel-photo-contenu .cel-infos { |
| display:none; |
| } |
| #legende{ |
| /*+-----------------------------------------------------------------------------------------------------------------+*/ |
| /* Diaporama */ |
| #cel-legende{ |
| text-align:left; |
| } |
| #legende-vei{ |
| #cel-legende-vei{ |
| float:right; |
| } |
| #legende p{ |
| #cel-legende p{ |
| color:black; |
| font-size:12px; |
| margin:5px 0; |
| } |
| #legende a { |
| #cel-legende a { |
| color:#333; |
| border-bottom:1px dotted gainsboro; |
| } |
| #legende a:hover { |
| #cel-legende a:hover { |
| color:#56B80E; |
| border-bottom:1px dotted #56B80E; |
| } |
| /trunk/widget/modules/photo/Photo.php |
|---|
| 62,9 → 62,20 |
| $cache->sauver($id_cache, $contenu); |
| } |
| } |
| $this->envoyer($contenu); |
| if (isset($retour['type']) && $retour['type'] == 'jsonp') { |
| $this->envoyerJsonp(array('contenu' => $contenu)); |
| } else { |
| $this->envoyer($contenu); |
| } |
| } |
| private function executerAjax() { |
| $widget = $this->executerPhoto(); |
| $widget['squelette'] = 'photo_ajax'; |
| $widget['type'] = 'jsonp'; |
| return $widget; |
| } |
| private function executerPhoto() { |
| $widget = null; |
| extract($this->parametres); |
| 90,7 → 101,9 |
| $item = array(); |
| // Formatage date |
| $item['date'] = strftime('%A %d %B %Y', $entree->pubDate); |
| $date = $entree->updated ? $entree->updated : null; |
| $date = $entree->pubDate ? $entree->pubDate : $date; |
| $item['date'] = strftime('%A %d %B %Y', $date); |
| $item['lien'] = $entree->link; |
| $item['url_tpl'] = preg_replace('/[SML]\.jpg$/', '%s.jpg', $entree->guid); |
| // Formatage titre |