Niouzes

< Avril 2021 >
Lu Ma Me Je Ve Sa Di
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

Citation

Attention

Certains des exemples que nous fournissons ci-dessous ne sont pas complets. D'emblée, nous nous en excusons, bien sûr. Mais pourquoi diable sont-ils incomplets ?

Ils sont incomplets parce que nous y travaillons en ce moment et que plutôt que de vous faire patienter jusqu'à ce qu'ils soient tous terminés, nous avons préféré vous les livrer dans l'état où ils se trouvent pour que vous puissiez vous faire une idée de ce qu'ils illustrent.

Au fur et à mesure de notre avancement, nous ferons les mises à jour idoines. Nous espérons résorber notre retard au plus vite.

2014-08-06 à 17:05:56 par Patrick Boens

Table Of Contents

  1. Template with patterns, Swipe Simply, cahing pages for bots, … (06/08/2014)
  2. Gestion de redirections, Accept-Language, extrapolation de la langue et du pays, LSContainer et le génome, LSInput et les gènes, utilisation de LSCacheDir, création de propriétés dynamiques de LSPage dans le géorama, … (11/10/2013)
  3. Statistiques d'accès, Site Manager, prefetch, prerender, File Explorer, interactions Ajax … (17/06/2013)
  4. LSTag, LSContentsDatetime, LSContentsCountdown, LSContentsStopwatch, threshold et score, configuration vhosts Apache, génération automatique, LSVStrings.js, LSVDates.js, tracing sur XML des îles, Free User Input Zones, multiple credentials, cookie de dernière visite, LSInput et datalist (10/04/2013)
  5. Tour d'horizon des filtres (23/09/2013)
  6. Messages de service (07/01/2014)
  7. Accès aux propriétés des îles, halt.sem, cookies positionnés dans les îles, filtre 'browsertype', contenus alternatifs, expressions PHP sur les href, gestion de l'expiration, filtre de visite, ... (22/09/2013)
  8. Messages de service, ... (30/10/2012)
  9. Config Apache, LSInput, LSForm, ... (13/03/2013)
  10. LSContentsBooking, Browser Danger Rating, User Agent vides (non spécifiés), filtres sur les paramètres, LSBrowser, ... (11/06/2013)
  11. LSTag('img'), auto pages, nouveaux filtres, audio/video, ... (02/11/2013)
  12. LSGeo, LSFootnotes, LSSourceFile, LSPublication, onfail avec codes de retour HTTP (301, 302, ...), ... (27/06/2013)
  13. LSCache, microformat (lupdate), multicontent, LSContentsTagCloud, LSContentsImageGallery, HTML5 (input zones), ... (15/09/2013)
  14. Check Spamhaus, vos settings dans le géorama, LSContentsMicronews, Switch dans le géorama, LSCursor: des records dans les records, ... (04/12/2012)
  15. Campagnes de pub, TODO list (04/12/2012)
  16. Debugging de page, LSTimeline, le fichier de géorama, LSTag, Glossaire IT, Named colors, Codes langue, ... (23/03/2013)
  17. LSCursor: une revue complète de la classe (12/03/2013)
  18. LSForm, LSInput, … (28/01/2013)
  19. LSContentsBusinessCoordinates, redirection de pages, LSTwitterPost, LSContentsTwitterFollowers, LSContentsShare, calendrier, LSContentsContactForm, LSContentsReview et LSReview, droits sur une page, URLs canoniques, LSPaymentOptions et LSContentsPaymentOptions, Offres d'emploi, LSContentsImageTransition, ... (20/09/2013)
  20. Galerie avec vignettes, RSS, partage d'offres d'emploi, partage de citations, diaporama dewslider, horloge flash, footnotes, ... (01/10/2012)
  21. îles préfixées de texte standard, le paramètre title, le paramètre heading, le paramètre text, le paramètre xsl, LSRegionSubtag, Language Switchers, LSFormEnroll, LSContentsLegal, sitemap, substitution de propriétés, LSSourceFile et LSContentsSourceFile, LSContentsComments, LSContentsCharter, ... (05/11/2013)
  22. LSContentsLoginLogoff, Utilisation de && dans les conditions des îles, LSWidgetOpeningHours et LSContentsBusinessOpeningHours, inclusion de snippets, image bouton de login/logoff, LSContentsBusinessCoordinates, commentaires dans les îles, doctypes, LSImageTrans, calcul de dates, LSWidgetEmailForm, LSContentsMedia, LSContentsIFrame, onload et onunload d'une page, Page settings, ... (22/09/2013)
  23. Dates et heures de publication et/ou d'expiration, PHP expressions, Blocs XHTML avant et après une île, suite de pages, îles valables par domaine, substitutions, envoyer des fichiers au serveur, templates dynamiques, contenus distants, contenus générés en Java, LSCalculator, Gérer des signets (bookmarks), Pages conditionnelles, îles conditionnelles, désactivations, LSContentsMedia, taille du géorama, partager une page entre sites, LSXHtmlImg, île dans la section …, textes latins, Dublin Core, Utilisation de caches, corrections automatiques, In-Place Editing, LSContentsCitation (03/11/2013)

LSTag('img') avec images at random 2012-07-11

Depuis l'opus "5.0.0004"

La classe LSTag, type img, s'est enrichie d'une fonctionnalité bien pratique: la possibilité de mentionner des images affichées at random. Un petit exemple fera beaucoup mieux qu'un long discours :

<?php
$oImg               = new LSTag('img');
$oImg->AtRandom     = true;
$oImg->iWidth       = 600;
$oImg->iHeight      = 400;

for ( $i = 1;$i <= 8;$i++ )
{
    /* Mentionnons jusqu'à 8 images */
    $oImg->aPictures[] = '/images/sport' . STR_padl( $i,3,'0' ) . '.jpg';
}   /* for ( $i = 1;$i <= 8;$i++ ) */
echo '<p style="margin:5px auto;width:600px;display:block;">' . $oImg->Render() . '</p>';
?>

On voit qu'il faut donc indiquer que le tag doit être généré at random ($oImg->AtRandom = true;) et qu'il faut empiler les images possibles dans un tableau (aPictures). Dans l'exemple nous empilons jusqu'à 8 images ('/images/sport001.jpg', '/images/sport002.jpg', '/images/sport003.jpg', …).

LSTag('img') avec images en transition 2012-07-14

Depuis l'opus "5.0.0004"

Il suffisait de quelques adaptations légères pour que nous puissions offrir des transitions d'images comme celles offertes par la classe LSImageTrans, aussi les avons-nous introduites !

<?php
$oImg               = new LSTag('img');
$oImg->IsTransition = true;

// Créons 8 images de sport
// /images/sport001.jpg, /images/sport002.jpg, /images/sport003.jpg, ...
for ( $i = 1;$i <= 8;$i++ )
{
    $oImg->aPictures[] = '/images/sport' . STR_padl( $i,3,'0' ) . '.jpg';
}   /* for ( $i = 1;$i <= 8;$i++ ) */
// Demandons l'affichage de la transition d'images
echo '<p class="illu">' . $oImg->Render() . '</p>';
?>

Vae Soli! et les pages automatiques

Depuis l'opus "5.0.0004"

Ce n'est pas un feature recommandé[1] de notre framework, mais nous le trouvons bien pratique : la possibilité de disposer de pages entièrement automatiques.

Un certain nombre de pages standards devraient être créées pour tout site : la page d'aide (help.php), la page sitemap (sitemap.php) et la page des termes légaux (bien souvent oubliée par les clients) (legal.php). Au moins celles-là.

Il faut donc concevoir les pages physiques (help.php, sitemap.php et legal.php) et il faut ensuite procéder à leur définition dans le géorama.

Désormais, lorsque Vae Soli! rencontre le besoin d'une telle page ET que cette page n'est pas définie dans le géorama, alors Vae Soli! applique une définition standard de ces pages sur base des îles LSContentsCharter, LSContentsSitemap et LSContentsLegal.

Cela permet, dès les premiers pas de construction d'un site, de bénéficier directement de ces pages sans les avoir vraiment définies. Par contre, nous vous suggérons vivement de ne pas aller en production avec cela : définissez vous-mêmes vos pages dans le géorama !

Le filtre de publication connectTime

Depuis l'opus "5.0.0004"

Les filtres de publication sont une fonctionnalité très ancienne en Vae Soli!. C'est un mécanisme qui a fait son apparition dès que nous avons commencé à créer des sites pour les revendeurs exclusifs de Mobistar. À cette époque il nous fallait effectivement reprendre des contenus de promotions du site central (le site de Mobistar) et les répercuter sur les sites des dealers.

Mais les promotions étaient valables de date à date. Il a donc fallu inventer les filtres "date de publication" (pubdate) et "date d'expiration" (expiry). Voilà pour une petite remontée dans l'historique de la fonctionnalité.

Depuis, nous n'avons cessé d'ajouter de nouveaux filtres. Par exemple, nous avons ajouté le filtre port (une page, un archipel, une île ne seraient alors disponibles QUE SSI le port correspond bien … ce qui est un moyen efficace de tester des pages nouvelles dédiées à un public très ciblé), le filtre referer qui filtre sur le referer de la page (la page d'où on vient), le filtre member qui teste si le visiteur appartient à un groupe donné, etc.

Au total, c'est ainsi une dizaine de filtres qui existent. Nous venons d'ajouter le filtre connectTime qui permet de s'assurer qu'une personne est connectée depuis un certain temps (au moins, ou au plus). C'est évidemment une fonctionnalité qui intéresse les sites extrêmement dynamiques. Voici une île XHTML qui fait usage de cette nouvelle possibilité.

<Island id="contest" active="yes" xhtml="yes" connectTime="600">
    <p>Any visitor that stays more than 10 minutes on our site can
       take part to our <a href="/contest.php">contest</a>.</p>
</Island>

L'attribut connectTime peut être exprimé de 4 manières différentes indiquant ainsi le type d'opération souhaité :+600, +=600, -600 ou -=600 ou 600 indique le nombre de secondes.

  • - : le temps de connexion doit être inférieur à celui indiqué
  • -= : le temps de connexion doit être inférieur ou égal à celui indiqué
  • + : le temps de connexion doit être supérieur à celui indiqué
  • += : le temps de connexion doit être supérieur ou égal à celui indiqué (opération par défaut)

Si vous n'avez pas indiqué un type d'opération (+, +=, - ou -=, alors c'est comme si vous aviez indiqué += (opération par défaut).

Nous avons été obligés d'en passer par - et + en lieu et place de < et > pour éviter les conflits de tagging XML.

Le filtre de publication loginTime

Depuis l'opus "5.0.0004"

Ce qui est vrai avec le temps de connexion (connectTime) est également vrai avec le temps de login (loginTime). Nous appliquons strictement la même syntaxe. Voici un exemple qui parlera de lui-même :

<Island id="contest" active="yes" xhtml="yes" loginTime="600">
    <p>A member that stays more than 10 minutes on our site can
       take part to our <a href="/contest.php">contest</a>.</p>
</Island>

Depuis l'opus "5.0.0005"

En HTML5 un certain nombre de tags revêtent une signification différente. Ainsi, le <small>…</small> qui indique une moindre importance au texte qu'il entoure par rapport à d'autres contenus. Il est convenu d'utiliser cette balise <small>…</small> pour entourer les conditions légales, les termes et conditions, les conditions générales de vente, etc.

C'est la raison pour laquelle nous avons modifié la classe LSContentsLegal pour tenir compte de cet élément – en HTML5, nous le répétons !

Si le DOCTYPE de votre page est positionné sur html5, il ne faut rien faire : Vae Soli! s'occupe d'ajouter une balise <small>…</small> pour entourer votre texte légal.

Si ce comportement n'était PAS souhaité (vous pouvez avoir de bonnes raisons d'empêcher ledit comportement) alors il faut ajouter un paramètre dans la définition de l'île comme vous l'indique l'exemple qui suit :

<Archipelago id="body" active="yes" category="body">
    <Island id="legal" active="yes" class="LSContentsLegal">
        <param name="pre-block"><![CDATA[/islands/cgv_{page->lang}.php]]></param>
        <param name="small"><![CDATA[false]]></param>
    </Island>
</Archipelago>

Des îles avec table des matières automatique

Depuis l'opus "5.0.0005"

Il est possible de faire générer à Vae Soli! une table des matière automatique pour vos îles de contenus. Il suffit d'utiliser le paramètre autotoc d'une île. Ce paramètre ne doit pas être confondu avec le paramètre toc.

En effet, le paramètre toc est utile dans le cas de la construction d'une île avec de multiples sources de storage (storage 1, storage 2, storage 3, etc.) et avec pagination de ce contenu (paginate = true). Dans ce cas précis, ce qu'on souhaite c'est avoir une table des matières pour sauter rapidement d'un contenu à l'autre.

Par contre, le paramètre autotoc lui, agit sur UN des contenus. Si l'île n'a qu'un seul storage, alors on propose une table des matière sur CE contenu. Si l'île possède plusieurs contenus, alors le paramètre autotoc agit sur le contenu courant.

Comment cela marche ? On indique simplement quel heading nous intéresse et seuls les headings correspondants possédant en outre un id sont insérés dans la table des matières. Voici un exemple :

<Island id="contents" active="yes" class="LSContents" lupdate="auto">
    <param name="paginate"><![CDATA[true]]></param>
    <param name="toc"><![CDATA[true]]></param>
    <param name="autotoc"><![CDATA[h2]]></param>
    <param name="page"><![CDATA[0]]></param>
    <param name="storage"><![CDATA[%iles%/{auto}-13.php (* Latest additions, ... [*ref=latest*] *);
                                   %iles%/{auto}-12.php (* LSGeo, LSFootnotes, LSSourceFile, LSPublication, ... [*ref=lsgeo*] *);
                                   %iles%/{auto}-11.php (* LSCache, microformat (lupdate), ... [*ref=lscache*] *);
                                   %iles%/{auto}-10.php (* Le contenu un peu moins récent *);
                                   %iles%/{auto}-9.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-8.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-7.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-6.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-5.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-4.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-3.php  (* Consultez les exemples de Vae Soli! *);
                                   %iles%/{auto}-2.php  (* Le contenu ancien *);
                                   %iles%/{auto}-1.php  (* Le contenu le plus ancien - ce qui existe depuis longtemps *)]]></param>
</Island>

L'exemple précédent nous dit (parties rouges) que nous avons plusieurs contenus et que nous souhaitons que le contenu multiple soit paginé en autant de contenus distincts

La partie bleue nous indique que nous souhaitons une table des matières pour tout le contenu paginé (comprenons une table des matières des chapitres)

La partie verte (autotoc) nous dit que nous souhaitons bénéficier d'une table des matières automatiques pour chaque contenu paginé (comprenons une table des matières des paragraphes de chaque chapitre).

autocomplete : sur formulaire et zone d'input

Depuis l'opus "5.0.0005"

Nous venons de terminer le support de l'attribut autocomplete sur les zones d'édition (input). Le même travail est à réaliser sur les formulaires. Ce travail est prévu avant de rendre publique la version 5.0.0005 de Vae Soli!. Dès ce moment, nous fournirons des exemples de ce type du support.

Les tags <audio>…</audio> et <video>…</video> 2013-01-18

Depuis l'opus "5.0.0005"

<audio>…</audio>

Nous avons terminé l'implémentation du tag <audio>…</audio>. Notre code supporte tous les mécanismes de fallback imaginés pour le HTML5. Il supporte également les attributs suivants :

  • autoplay
  • controls
  • loop
  • preload

Voici un exemple[2]  :

$oTag               = new LSTag('audio');           // On crée un tag 'audio'
$oTag->aSrc[]       = '/islands/labounty.ogg';      // On lui donne une source
$oTag->aSrc[]       = '/islands/labounty.mp3';      // On lui ajoute une autre source
$oTag->szPreload    = 'auto';                       // On dit qu'il faut prébuffériser la source
$oTag->Autoplay     = true;                         // Dès qu'affichage ... jouer
$oTag->Loop         = true;                         // ... en boucle
$oTag->Controls     = true;                         // Avec des contrôles
echo $oTag->Render();                               // Rendu du HTML5

<audio controls autoplay loop preload="auto">
<source src="/islands/labounty.ogg" />
<source src="/islands/labounty.mp3" />
</audio>

Un petit mot sur les formats. Bien que ce soit le format MP3 qui se soit imposé de manière évidente, il se fait que ce format est protégé par brevet. L'industrie des navigateurs a dès lors préféré se tourner vers un autre type de format : le format .ogg. Vous trouverez ci-dessous une matrice de support, format / navigateur.

Format / Navigateur (as of 7/05/2013 07:43:21)
Format Opera Chrome Firefox Safari IE 9
.mp3 No Yes No Yes Yes
.ogg Yes Yes Yes No No
.wav Yes Yes Yes Yes No

Comme indiqué sur le site d'Opera, vous pouvez utiliser des convertisseurs gratuits pour passer au format .ogg comme par exemple Free Rip ou Audio MP3 converter pour Mac.

<video>…</video>

Le tag <video>…</video> se comporte quasiment de manière identique au tag <audio>…</audio>. En fait, dès le moment où notre code de génération pour le tag <audio>…</audio> était fait, celui du tag <video>…</video> était fait aussi : c'est le même !

$oTag               = new LSTag('video');           // On crée un tag 'video'
$oTag->aSrc[]       = '/media/rep-dom.webm';        // On lui donne une source
$oTag->Autoplay     = true;                         // Démarrer automatiquement
$oTag->Loop         = true;                         // ... en boucle
$oTag->Controls     = true;                         // Avec des contrôles
echo $oTag->Render();                               // Rendu du HTML5
Format / Navigateur (as of 7/05/2013 07:43:21)
Format Opera Chrome Firefox Safari IE 9
.mp4 No Yes No Yes Yes
.webm Yes Yes Yes No No
.ogg Yes Yes Yes No No

Indication d'une classe CSS sur les îles 2012-07-23

Ce feature existe dans Vae Soli! depuis une éternité. Il n'a fait l'objet que de très rares applications et d'aucune documentation. Il s'agit simplement d'utiliser un paramètre standard des îles pour mentionner une classe CSS qui sera appliquée à la division entourant l'île.

<Archipelago id="content" active="yes" category="Q-body">
    <Island id="booking" active="yes" class="LSContentsBooking">
        <param name="storage"><![CDATA[/court-booking/courts.xml]]></param>
        <param name="CSSClass"><![CDATA[booking]]></param>

        <param name="with-quantity"     >false</param>
        <param name="with-attendance"   >false</param>
        <param name="with-terms"        >true</param>

        <param name="resource-type"     ><![CDATA[court]]></param>

        <param name="start-hour"        >11</param>
        <param name="end-hour"          >22</param>
        <param name="minutes-per-slot"  >15</param>

    </Island>
    <Island id="body" active="yes" class="LSContents">
        <param name="storage"><![CDATA[%islands%/{page->id}-{island->id}-{page->lang}.php]]></param>
    </Island>
</Archipelago>

Debug d'une île 2012-07-23

Ici aussi on visite une fonctionnalité des îles de Vae Soli! qui existe depuis bien longtemps et dont nous avons négligé la documentation, à savoir de pouvoir disposer d'une île en mode de debogage ce qui permet de disposer d'informations supplémentaires (le plus souvent à ne pas avoir en situation de production).

Il suffit de mettre le paramètre debug à true dans l'île et le tour est joué.

<Island id="booking" active="yes" class="LSContentsBooking">
    <param name="storage"><![CDATA[/court-booking/bookings.xml]]></param>
    <param name="resource-file"><![CDATA[/court-booking/courts.xml]]></param>
    
    <param name="CSSClass"><![CDATA[booking]]></param>

    <param name="with-quantity"     >false</param>
    <param name="with-attendance"   >false</param>
    <param name="with-terms"        >true</param>

    <param name="multiselect"       >false</param>
    <param name="mandatory-mark"    ><![CDATA[ (*)]]></param>
    <param name="resource-type"     ><![CDATA[court]]></param>

    <param name="start-hour"        >11</param>
    <param name="end-hour"          >22</param>
    <param name="minutes-per-slot"  >30</param>

    <param name="debug"             >true</param>

    <param name="foreword-label"    ><![CDATA[{booking-foreword}]]></param>
    <param name="resource-label"    ><![CDATA[{resource}]]></param>
    <param name="resource-tooltip"  ><![CDATA[{resource-tooltip}]]></param>
    <param name="attendance-label"  ><![CDATA[{attendance}]]></param>
    <param name="attendance-tooltip"><![CDATA[{attendance-tooltip}]]></param>
    <param name="zipcity-label"     ><![CDATA[{zip-and-city}]]></param>
    <param name="objective-label"   ><![CDATA[{objective}]]></param>
    <param name="objective-tooltip" ><![CDATA[{objective-tooltip}]]></param>
</Island>

Qu'obtiendrez-vous alors ? Vous obtiendrez les infos de debugging que notr équipe de développement a cru bon d'ajouter dans le code qui compose l'île. Souvent, ce n'est pas si mal que cela mais parfois vous n'obtiendrez rien.

Si vous ne souhaitez disposer de ce debugging que si vous travaillez sur le PC local, voici comment faire :

<Island id="booking" active="yes" class="LSContentsBooking">
    <param name="storage"><![CDATA[/court-booking/bookings.xml]]></param>
    <param name="resource-file"><![CDATA[/court-booking/courts.xml]]></param>
    
    <param name="CSSClass"><![CDATA[booking]]></param>

    <param name="with-quantity"     >false</param>
    <param name="with-attendance"   >false</param>
    <param name="with-terms"        >true</param>

    <param name="multiselect"       >false</param>
    <param name="mandatory-mark"    ><![CDATA[ (*)]]></param>
    <param name="resource-type"     ><![CDATA[court]]></param>

    <param name="start-hour"        >11</param>
    <param name="end-hour"          >22</param>
    <param name="minutes-per-slot"  >30</param>

    <param name="debug"             ip="127.0.0.1">true</param>

    <param name="foreword-label"    ><![CDATA[{booking-foreword}]]></param>
    <param name="resource-label"    ><![CDATA[{resource}]]></param>
    <param name="resource-tooltip"  ><![CDATA[{resource-tooltip}]]></param>
    <param name="attendance-label"  ><![CDATA[{attendance}]]></param>
    <param name="attendance-tooltip"><![CDATA[{attendance-tooltip}]]></param>
    <param name="zipcity-label"     ><![CDATA[{zip-and-city}]]></param>
    <param name="objective-label"   ><![CDATA[{objective}]]></param>
    <param name="objective-tooltip" ><![CDATA[{objective-tooltip}]]></param>
</Island>

Notes de bas de page

[1] … Nous ne recommandons pas cette manière de procéder pour un site de production. Par contre, pour la phase de construction d'un site, ce nouveau feature peut être une aide appréciable.

[2] … Nous attendons l'autorisation de Bill Labounty pour vous donner à entendre, grâce à notre support du tag <audio>…</audio> l'un des morceaux emblématiques de la FM californienne.

Précédent Suivant