Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

koha:personnalisation_graphique:affichage_notice:xslt_jacquettes_et_extraits_musicaux [2017/07/19 17:11] (Version actuelle)
llefaucheur ↷ Page déplacée et renommée de koha:xslt_-_jacquettes_et_extraits_musicaux à koha:personnalisation_graphique:affichage_notice:xslt_jacquettes_et_extraits_musicaux
Ligne 1: Ligne 1:
 +====== Affichage des jacquettes et ecoute des extraits musicaux======
  
 +===== Affichage des jacquettes de CD =====
 +
 +A partir des feuilles de style XSLT vous pouvez afficher les jacquettes de CD au niveau des résultats de recherche ainsi qu'au niveau du détail bibliographique.
 +
 +
 +<note important>​La notice bibliographique doit posséder une zone 316$u où sera placée l'​adresse(URL) de l'​image de la jacquette</​note>​
 +
 +Exemple : 
 +{{:​koha:​jacquette.png?​400|}}
 +
 +Au niveau de la feuille de style le contenu de la 316$u va correspondre à une variable (coverCD)
 +
 +<​code>​
 +<​xsl:​variable name="​coverCD"​ select="​marc:​datafield[@tag=316]/​marc:​subfield[@code='​u'​]"/>​
 +</​code>​
 +
 +Ensuite on demande d'​afficher le contenu de la 361$u
 +
 +<​code>​
 +<xsl:if test="​$coverCD!='​ '">​
 +      <xsl:if test="​marc:​datafield[@tag=316]">​
 +   <​xsl:​for-each select="​marc:​datafield[@tag=316]">​
 + <img height="​100"​ width="​100"><​xsl:​attribute name="​src"><​xsl:​value-of select="​marc:​subfield[@code='​u'​]"/></​xsl:​attribute></​img>​
 +          <​xsl:​choose>​
 +            <​xsl:​when test="​position()=last()"/>​
 +          </​xsl:​choose>​
 +        </​xsl:​for-each>​
 +   </​xsl:​if>​
 +</​code>​
 +
 +===== Ecoute des extraits musicaux =====
 +
 +A partir des feuilles de style XSLT vous pouvez mettre en écoute des extraits musicaux.
 +
 +<note important>​Au niveau de la notice bibliographique,​ l'​adresse de chaque extrait musical devra être classé sous une 464$u. Quant au titres des morceaux ils seront placés en 464$t</​note>​
 +
 +Exemple :
 +{{:​koha:​extraitesmusicaux.png?​400|}}
 +
 +
 +
 +{{:​koha:​player.png?​80|}}
 +
 +Les titres des morceaux(464$t) seront classés en 1ière colonne d'un tableau alors que les liens vers les fichiers mp3 seront classés en 2nd colonne de ce même tableau.
 +
 +<​code>​
 +<xsl:if test="​marc:​datafield[@tag=464]">​
 +
 +
 +   <​div class="​panel panel-default results_summary">​
 +     <​div class="​panel-heading"​ style="​background-color:#​FAFAFA">​
 +     ​Contenu :
 +     </​div>​
 +    <div class="​panel-body"​ style="​height:​190px;​overflow:​auto;​background-color:#​FAFAFA">​
 +
 +      <​xsl:​for-each select="​marc:​datafield[@tag=464]">​
 +    <p>
 +        <​xsl:​choose>​
 +        <​xsl:​when test="​marc:​subfield[@code='​u'​]">​
 +        <a>
 +        <​xsl:​attribute name="​href"><​xsl:​value-of select="​marc:​subfield[@code='​u'​]"/></​xsl:​attribute>​
 +        <​xsl:​attribute name="​title"><​xsl:​text>​play-pause</​xsl:​text></​xsl:​attribute>​
 +        <​xsl:​attribute name="​class"><​xsl:​text>​sm2_button</​xsl:​text></​xsl:​attribute>​
 +        <​xsl:​text>​play-pause</​xsl:​text>​
 +        </a>
 +        </​xsl:​when>​
 +        <​xsl:​otherwise>​
 +          <img id="​noplay"​ width="​18"​ height="​18"><​xsl:​attribute name="​src">/​public/​images/​noplay.png</​xsl:​attribute></​img>​
 +        </​xsl:​otherwise>​
 +        </​xsl:​choose>​
 +        <​xsl:​text>​ - </​xsl:​text>​
 +       <​xsl:​if test="​marc:​subfield[@code='​h'​]">​
 +        <​xsl:​value-of select="​marc:​subfield[@code='​h'​]"/><​xsl:​text>​ - </​xsl:​text>​
 +        </​xsl:​if>​
 +        <​xsl:​choose>​
 +        <​xsl:​when test="​marc:​subfield[@code='​t'​]"><​xsl:​value-of select="​marc:​subfield[@code='​t'​]"/></​xsl:​when>​
 +        <​xsl:​when test="​marc:​subfield[@code='​i'​]"><​xsl:​value-of select="​marc:​subfield[@code='​i'​]"/></​xsl:​when>​
 +        <​xsl:​otherwise>​Titre inconnu</​xsl:​otherwise>​
 +        </​xsl:​choose>​
 +        <xsl:if test="​marc:​subfield[@code='​a'​]">​
 +           <​i>​
 +<​xsl:​for-each select="​marc:​subfield[@code='​a'​]">​
 +           <​xsl:​text>​ - </​xsl:​text><​xsl:​value-of select="​."/>​
 +           </​xsl:​for-each>​
 +           </​i>​
 +        </​xsl:​if>​
 +  </​code>​
 +  ​
 + ​== ​ intranetusercss ==
 +
 +<​hidden>​
 +
 +.audiospan{
 +        line-height:​30px;​
 +        cursor:​pointer;​
 +}
 +
 +.audiospan_withoutmp3{
 +        line-height:​30px;​
 +}
 +
 +a.sm2_button {
 + ​position:​relative;​
 + ​display:​inline-block;​ /* If you worry about old browser bugs, Firefox 2 might not like this and may need -moz-inline-box instead. :D */
 + ​width:​18px;​
 + ​height:​18px;​
 + ​text-indent:​-9999px;​ /* don't show link text */
 + ​overflow:​hidden;​ /* don't draw inner link text */
 + ​vertical-align:​middle;​
 + /* and, a bit of round-ness for the cool browsers. */
 + ​border-radius:​2px;​
 + ​margin-top:​-1px;​ /* vertical align tweak */
 + /* safari 3.1+ fun (/W3 working draft extension, TBD.) */
 + ​-webkit-transition-property:​ hover;
 + ​-webkit-transition:​ all 0.2s ease-in-out;​
 + ​-moz-transition:​ all 0.2s ease-in-out 0s; /* firefox 4 (couldn'​t sort out -moz-transform vs. MozTransform,​ so, "​all"​ for now) */
 + ​-o-transition-property:​ background-color;​ /* opera 10.5 */
 + ​-o-transition-duration:​ 0.15s;
 + /* weird IE 6/7 display fixes, and/or I'm doing it wrong */
 + ​*text-indent:​0px;​
 + ​*line-height:​99em;​
 + ​*vertical-align:​ top;
 +}
 +a.sm2_button:​focus {
 + ​outline:​none;​ /* maybe evil, but don't show the slight border outline on focus. */
 +}
 +
 +a.sm2_button,​
 +a.sm2_button.sm2_paused:​hover {
 + ​background-color:#​77CC33;​
 + ​background-image:​url(/​public/​opac/​sound/​demo/​mp3-player-button/​image/​arrow-right-white.png);​
 + /* where possible, use data: and skip the HTTP request. Fancy-pants. Would use short-hand background: for above, but IE 8 doesn'​t override background-image. */
 + ​background-image:​url(data:​image/​png;​base64,​iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKCAYAAABmBXS+AAAAbklEQVQY02NgQAL//​v1jZMAF/​v//​vwuIs9HEUBUBTbj4HwIeA3EGVsVAxtn/​qOAVUGM8uknIiv4hsV8A5ZKxKfoLVvnvHwifAzLtMKwDSQLBVSBti27dJajkcSD2RJODO3wtkOOMz/​tMSJJYAxMA5dmsL0IfubQAAAAASUVORK5CYII=);​
 + ​background-image:​ none, url(/​public/​opac/​sound/​demo/​mp3-player-button/​image/​arrow-right-white-2x.png);​
 + ​background-size:​ 9px 10px;
 + ​*background-image:​url(/​public/​opac/​sound/​demo/​mp3-player-button/​image/​arrow-right-white.gif);​ /* IE 6+7 don't do DATA: URIs */
 + ​background-repeat:​no-repeat;​
 + ​background-position:​5px 50%;
 + ​*background-position:​5px 4px; /* IE 6 again */
 +}
 +
 +a.sm2_button:​hover,​
 +a.sm2_button.sm2_playing,​
 +a.sm2_button.sm2_playing:​hover {
 + ​background-color:#​eeaa33;​
 +}
 +
 +a.sm2_button.sm2_playing,​
 +a.sm2_button.sm2_playing:​hover {
 + ​-moz-transform:​rotate(90deg);​
 + ​-webkit-transform:​rotate(90deg);​
 + ​-ms-transform:​rotate(90deg);​
 +}
 +
 +a.sm2_button.sm2_paused,​
 +a.sm2_button.sm2_paused:​hover {
 + ​background-color:#​eeaa33;​
 +}
 +         
 +.panel.panel-default.results_summary
 +{
 +box-shadow: 1px 1px 3px rgba(0,​0,​0,​0.5);​}
 +
 +</​hidden>​
 +  ​
 +{{:​koha:​detail.png?​600|}}
 +
 +{{:​koha:​resultats.png?​600|}}
 +
 +
 +{{tag>​koha xslt cd jacquette player}}
 +  ​
 +  ​