Copyright :
La copie, la diffusion des photos, sur quelque support que
ce soit, est soumis à l'accord préalable de l'auteur
Et surtout, n'utilisez les photos que si vous avez la permission (implicite
ou explicite !) de la (des) personnes photographiées.
Contact : francois.lagarde@flagarde.fr
Auteur : François Lagarde
Contenu du site www.flagarde.fr/voyages :
Photos
de voyages prises par moi-même ou par des parents et amis
Appareils photos :
Avant 2003 : argentique et scan (epson V700 photo) : certains
négatifs ont beaucoup de grain et les couleurs sont difficiles à récupérer
A
partir de 2003 :
- konica KD 500Z (cadeau de Olivier) :
définition
suffisante (5Mpx)
zoom suffisant
(avec quand même barillet et besoin de lumière
positif:
un viseur optique (avec asservissement au zoom)
- pour Olivier (japon, cuba,
à venir) un KD 350Z
- puis un Canon 350 D + sigma 18-200 (equivalent : 27-300)
- puis un Canon 550 D + sigma 18-250 OS.
Traitement :
Photoshop elements, puis Lightroom
3
Mise en page :
Bricolage avec Namo web éditor, génération
de codes Html avec excel et javascript pour animer des panorama sur le
Hoggar (début 2009)
Nouvelle version avec javascript et jquery (début
2011) voir notamment Eoliennes, Madagascar, Egypte...
Les
photos (.jpg) sont dans le sous-répertoire "photos", il
doit y avoir une vignette correspondante avec le même nom dans le sous-répertoire
vignettes.
La liste des photos et
l'essentiel du reste du contenu (titres, commentaires, ordre des photos ...)
pour un voyage est dans le fichier seriesPhotos.txt
avec
3 fichiers standard d'affichage:
un page
principale (index.htm) avec présentation et liste des diverses séries
un page
visualiseur pour diaporama et animation de panorama (photoTourFlc.htm)
une
ébauche de dispositif de gestion de zoom (zoomPhoto.htm : à développer).
des
utilitaires javascript et des imagettes de commandes sont dans /lib
+ un morceau
de
Html supplémentaires ( htmlBasPage.html) qui peut pointer sur une/des
pages spéciales (ex: Mali-Dogon/journal_carte.htm)
Précisions sur le contenu de seriesPhotos.txt :
Il
précise tous les éléments à afficher; seuls quelques éléments ccomplémentaires
peuvent être visés par des liens dans htmlBasPage.html
format
Json (cf : http://www.json.org/json-fr.html)
: 'nom entité':'contenu' ; contenu = texte ou série
; série = liste séparée par virgule et encadré par [] etc ...
'planche'
: 'mono', ; les planches sont gérées dans un seul fichier index (autre
version antérieur un fichier index de planche par série)
Puis l'index
affiche les éléments suivants dans l'ordre :
'titre':'XXXXXXXX',
titre du fichier index sur la page et dans l'onglet du navigateur, attention
les accents sont affichés trés différemment : les éviter !
'texteDebIntro':'bla
bla blabla ...', :
texte apparaissant au dessous du titre
entre texteDebIntro et
texteFinIntro, on affiche la planche spéciale "_resume_"
qui est décrite dans les séries, si déclarée (cf ci-desous)
'texteFinIntro':'bla
bla blabla ...', :
texte apparaissant au dessous du titre ensuite exemple : ' <br>cliquez
ci dessous pour le détail'
ces
deux textes tolèrent très bien les accents (mais déclarés en html
: &eactute; etc...) et des sauts de ligne (<br>)
On affiche
ensuite une zone (repliées par planche ou série ( boutons, titre, commentaire),
repliées donc sans les vignettes, qui est dépliée sur clique du bouton ad hoc.
'ficHtmBasPage':'htmlBasPage.html',
: portion de code html inseré en fin de page index. On peut utiliser un autre
nom
Puis une ligne comprenant un bouton de retour haut de page plus
un lien vers une page de contact/copyright, informations.
Cette page est
directement déclarée dans le fichier index..
'series' : [{'nom':'nom_serie','titre':'titre_serie','commentaire':'commentaire_serie','photos':[
liste des photos ] }, { autre serie}, .....]
nom_serie
est un nom symbolique utilisé dans le code : pas d'accent, d'espace ni de
caractères spéciaux ... courte. Non visible par l'usager
titre_serie apparaît
dans la liste des planches (ou séries) de l'index , dans la liste déroulante
du visualiseur et dans l'onglet du navigateur.
rester
court ( <25 car ), accents tolérés mais sont affichés trés différemment
dans l'onglet et dans la liste
commentaire_serie
: apparaît dans la liste des planches (ou
séries) de l'index, tolère accents et saut de ligne <br>, taille plus
importante.
Pour chaque photo : 'src':'photos/nom_fic',
'titre':'titre_photo' ,'commentaires':'commentaire_photo'
'src':'photos/nom_fic' : Les
photos sont dans le sous-répertoire "photos",
le nom_fic est
SANS le suffixe .jpg
il
doit y avoir une vignette correspondante avec le même nom dans le sous-répertoire
vignettes.
titre_photo :
titre apparaissant dans la planche sous la vignette et dans le visualiseur :
Facultatif.
commentaire_photo :
commentaire éventuel apparaissant à côté de la photo ou sous la photo : Facultatif.
(selon algorithme dépendant des dimensions
de la photo et de l'espace de visualisation)
n'apparaît
pas pour les panoramas.
tolère
du html ex : 'commentaires':'<a href="photos/PICT0045.AVI"
target="_blank">petite vidéo</a>'
ce
commentaire est clicquable et amène sur une petite vidéo.
mais
attention au choix des quotes (pour Json) et double quotes pour le html
... ou vice-versa
Remarque sur le mécanisme d'ouverture de l'index et
la planche spéciale "_resume_"
A)
affichage par un appel sans signet (ou hash)
S'il y a une planche spéciale "_resume_" ,
elle est afiichée sans titre ni commentaire entre texteDebIntro
et texteFinIntro.
S'il n'y a pas de planche spéciale "_resume_" en
première série, il ya ouverture de la première série.
B) affichage
avec un signet (ou hash)
Il doit correspondre à un nom de série (ou planche)
qui est alors affichée .
=> Conseil :
Soit utiliser la planche spéciale "_resume_"
pour afficher 5 ou 10 vignettes de presentation et le texte texteFinIntro
de
Soit créer une planche d'introduction avec 5 ou 10 vignettes de
presentation et ne pas renseigner texteFinIntro