Server : Apache System : Linux ks5.tuic.fr 6.1.0-18-amd64 #1 SMP PREEMPT_DYNAMIC Debian 6.1.76-1 (2024-02-01) x86_64 User : pragmatice ( 1003) PHP Version : 8.2.24 Disable Function : NONE Directory : /home/pragmatice/public_html/tests/pragmalbum/app/ |
<!DOCTYPE html> <html lang="fr"> <head> <title>Des histoires et des voix</title> <meta name="description" content="" /> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, minimal-ui"> <link rel="icon" type="image/ico" href="images/favicon.ico" /> <!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /><![endif]--> <link rel="stylesheet" href="css/bootstrap.css"> <link rel="stylesheet" href="lineicons/WebFont/font-css/LineIcons.css"> <link rel="stylesheet" href="css/pragmalbum.css"> <script src="js/jquery.min.js" type="text/javascript"></script> <script src="js/bootstrap.bundle.min.js" type="text/javascript"></script> <script src="js/clipboard.min.js" type="text/javascript"></script> <script src="js/jquery.qrcode.min.js" type="text/javascript"></script> <script src="js/jquery.page.js" type="text/javascript"></script> <script src="js/color-picker.min.js" type="text/javascript"></script> <script src="js/pragmalbum.js" type="text/javascript"></script> <script src="js/data_albums.js" type="text/javascript"></script> </head> <body> <div class="ecran_tous ecran_accueil"> <div class="container"> <div> <img src="images/logo_dhedv_128.png" style="float:left;" /> <h1>Des albums et des voix</h1> <div style="clear:both;"></div> </div> <div class="row zone_sommaire"> <!-- <h4 data-col="" class="col-12">Collection 1</h4> <div data-titre="" class="col-12 col-sm-6 col-md-6 col-lg-4 col-xl-3 p-1"> <div class="bloc ombre_autour_5"> <img class="rounded-circle" src="albums/album_test/image-page-0.jpg" /> <div ><span>le titre de l'album</span></div> </div> </div> --> </div> </div> </div> <div class="ecran_tous ecran_album" style="display:none;"> <div id="navig" class="haut"> <img id="bt_prev" class="bts_navig bt_scale_2" src="images/bt_prev.png" style="float:left;" /> <img id="bt_aff_texte" class="bts_option bt_scale_2" src="images/bt_texte_oui.png" title="Cacher le texte" style="float:left;" /> <img id="bt_aff_image" class="bts_option bt_scale_2" src="images/bt_image_oui.png" title="Cacher l'image" style="float:left;" /> <img id="bt_next" class="bts_navig bt_scale_2" src="images/bt_next.png" style="float:right;" /> <img id="bt_play" class="bts_navig bt_scale_2" src="images/bt_play.png" style="float:right; display:none;" title="Démarrer le défilement automatique" /> <img id="bt_pause" class="bts_navig bt_scale_2" src="images/bt_pause.png" style="float:right; display:none;" title="Arrêter le défilement automatique" /> <img id="bt_retour" class="bts_navig bt_scale_2" src="images/bt_retour.png" style="float:right; display:none;" title="Retourner au début de l'album" /> <img id="bt_config_album" class="bts_option bt_scale_2" title="Quitter ou configurer l'album" src="images/bt_fermer_32.png" style="float:right;" /> <div id="bt_num_page" class="bt_scale_2" title="Afficher une page au hasard..."><span>0</span></div> <div id="son_page" style="margin:0px 150px; height:50px; display:flex; align-items: center;"> <audio style="width:100%; height:32px;" controls><source src="images/categoriri.mp3" type="audio/mpeg"></source></audio> </div> </div> <div id="zone_album" class="haut"> <div id="pave_album"> <div id="lespages"> <div> <div class="page_album page page_0" data-jquery-page-name="0"> <img class="image_album" src="images/img_400-300-0.jpg" /> <div class="zone_texte"> <div class="letexte"> <p>erg ergegegerge gerg PAGE 0 e euihrf ozifh zpiogfezoifgzjmgoiejhg mseoirh msogij smerg reg</p> <p>erg ergegegerge gerg egeg e euirhfzugfzheuihzoiugzhjog ezigjzeoigjze oeigjreogiejr geogjerogie jg e e</p> <p>erg ergegegerge gerg egeg e</p> </div> </div> </div> </div> </div> </div> </div> </div> <!-- Modale param_album--> <div class="modal fade" id="modale_config_album" role="dialog"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-haut"> <button class="btn btn-danger bt_acces_accueil" style="float:left;"><i class="lni lni-home"></i> Accueil</button> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <div><span title="Auteur Catégorie" style="cursor:help;" class="titre_album"></span></div> </div> <div class="modal-body"> <div> <h4>Sommaire des pages</h4> <div><div class="sommaire_pages_vignettes"></div><div style="clear:both;"></div></div> </div> <div> <h4>Apparence</h4> <div class="row"> <div class='col-sm-4'> <h6>Fond d'écran</h6> <input class="form-control" style="width:120px;" id="choix_couleur_fond" type="text" /> </div> <div class='col-sm-4'> <h6>Barre de navigation</h6> <button class="btn btn-success bts_pos_barre_navig">haut</button> <button class="btn btn-light bts_pos_barre_navig">bas</button> </div> <div class='col-sm-4'> <h6>Lecteur audio</h6> <button class="btn btn-success bts_lecteur_audio">oui</button> <button class="btn btn-light bts_lecteur_audio">non</button> </div> </div> </div> <div> <h4>Enchaînement des pages</h4> <div class="row"> <div class='col-sm-6'> <h6>Transition</h6> <div class="bts_trans_page"> <img class="bt_scale_2 on" data-trans="0" title="Défilement horizontal" src="images/bt_trans_0.png" /> <img class="bt_scale_2" data-trans="1" title="Défilement vertical" src="images/bt_trans_1.png" /> <img class="bt_scale_2" data-trans="2" title="Pivotage (flip)" src="images/bt_trans_2.png" /> <img class="bt_scale_2" data-trans="3" title="Fondu enchaîné" src="images/bt_trans_3.png" /> <img class="bt_scale_2" data-trans="4" title="Aucune" src="images/bt_trans_4.png" /> </div> </div> <div class='col-sm-6'> <h6>Page suivante et son</h6> <div class="form-inline"> <button class="btn btn-success bts_modalite_enchainement" data-ench="muet" title="Il faut cliquer sur le bouton de lecture pour écouter le son.">muet</button> <button class="btn btn-light bts_modalite_enchainement" data-ench="son" title="Le son est écouté à l'ouverture de la page.">son</button> <button class="btn btn-light bts_modalite_enchainement" data-ench="auto" title="La page suivante apparaît automatiquement (et le son est écouté) après le délai défini, ou le cas échéant deux secondes après la fin du son en cours.">auto</button> <input type="number" value="5" min="2" class="form-control choix_delai_chgt_page" oninput="majDelaiChgtPage()" title="Temps d'affichage (en secondes) de la page en mode auto si l'écoute du son est terminée" /></div> </div> </div> </div> <div> <h4>Texte</h4> <div class="row"> <div class='col-sm-6'> <h6>Taille de police</h6> <div class="bts_police_taille"> <img class="bt_scale_2 on" title="80%" src="images/bt_police_t_0.png" /> <img class="bt_scale_2 " title="100%" src="images/bt_police_t_1.png" /> <img class="bt_scale_2 " title="120%" src="images/bt_police_t_2.png" /> <img class="bt_scale_2 " title="150%" src="images/bt_police_t_3.png" /> <img class="bt_scale_2 " title="200%" src="images/bt_police_t_4.png" /> </div> </div> <div class='col-sm-6'> <h6>Famille de police</h6> <div class="bts_police_famille"> <img class="bt_scale_2 on" data-pol="" title="Segoe UI" src="images/bt_police_f_segoe.png" /> <img class="bt_scale_2" data-pol="police_arial" title="Arial" src="images/bt_police_f_arial.png" /> <img class="bt_scale_2" data-pol="police_comic" title="Comic" src="images/bt_police_f_comic.png" /> <img class="bt_scale_2" data-pol="police_cursif" title="Cursif" src="images/bt_police_f_cursif.png" /> <img class="bt_scale_2" data-pol="police_monaco" title="Monaco" src="images/bt_police_f_monaco.png" /> <img class="bt_scale_2" data-pol="police_opendyslexic" title="Opendyslexic" src="images/bt_police_f_opendyslexic.png" /> <img class="bt_scale_2" data-pol="police_times" title="Times" src="images/bt_police_f_times.png" /> </div> </div> </div> </div> </div> </div> </div> </div> </body> </html>