IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Preloader Flash

Date de publication : 15/01/2006 , Date de mise à jour : 13/01/2007

Par Matthieu  (Accueil)
 

Tutorial d'utilisation et de personnalisation du Préloader Flash de swf.


I. Présentation du Préloader
II. Historique des versions
II-a. Version 0.3 - 01 Février 2007
II-b. Version 0.2 - 01 Octobre 2006
II-b. Version 0.1 - 15 Janvier 2006
III. Améliorations futures
IV. Mode d'emploi
IV-a. Installation rapide du Préloader
IV-b. Installation détaillée du Préloader
IV-c. Fonctionnalités détaillées
V. Téléchargement
VI. Remerciements
VII. Notes
VII-a. Problèmes rencontrés
VII-b. Vos contributions
VIII. Copyright


I. Présentation du Préloader

C'est un Préloader de fichier swf.
Il peut être intégré dans n'importe quel site web très facilement.

Son fonctionnement est très simple. Il suffit de configurer les variables dans le fichier index.php.

Ce preloader est entièrement compatible avec le compilateur Open Source MTASC.

Les caractéristiques du Préloader :

  • Test de la version du flashplayer, auto update du Player Flash si la version est incorrecte (le numéro de la version minimum du Player Flash est fourni par le javascript.
  • Si le Player Flash n'est pas installé, redirection sur une page proposant son téléchargement.
  • Possiblité pour le préloader de télécharger plusieurs fichiers swf, par exemple le 1er qui contient la bibliothèque des classes action script et le 2ème qui est l'application elle-même ("biblio.swf|site.swf").
  • Test de la validité des urls des fichiers swf cible. S'ils n'existent pas, un messsage d'erreur s'affiche.
  • Le Préloader se met au centre de la scène automatiquement.
  • Le Préloader affiche le pourcentage de téléchargement global des fichiers swf cible.
  • Utilisation du javascript pour l'intégration dans une page web (valide HTML and XHTML).

II. Historique des versions


II-a. Version 0.3 - 01 Février 2007

  • Optimisation du poids et du code.
  • Compatible avec le compilateur Open Source MTASC.

II-b. Version 0.2 - 01 Octobre 2006

  • Ajout de plusieurs fonctionnalités pour créer un préloader complet.

II-b. Version 0.1 - 15 Janvier 2006

  • Première version opérationnelle.
  • Réduction de la taille du swf inférieure à 10 Ko.

III. Améliorations futures

  • Amélioration de l'interface graphique avec l'ajout d'animations...
  • Ajout d'informations supplémentaires.

IV. Mode d'emploi


IV-a. Installation rapide du Préloader

  • Appel de l'animation flash dans un fichier php ou html.
Il faut insérer ces lignes de code dans votre page :
Installation du préloader dans une page web

<?php

/*--- exemple de variable ---*/
$s_var2 = "config.xml";

?>
<!--- include du flash --->
<script type="text/javascript" src="config_flash/swfobject.js"></script>

<div id="flashcontent">
	<?php
		// Le texte inscrit dans cette balise est remplacé par l'application Flash.
		// si le swf s'affiche, le contenu de la balise flashcontent ne sera pas affiché à l'écran.
		$s_msgError = "<font color=\"#000000\">Attention ! Vous avez désactivé le Javascript.<br />
		Pour que le site puisse s'afficher correctement, il est nécessaire de réactiver le Javascript dans votre navigateur.</font>";
		echo $s_msgError;
	?>

</div>

<script type="text/javascript">

/* chemin du swf, l'id de l'objet ou de l'embed tag, largeur du swf, hauteur du swf, 
version du flash player nécessaire ("6.0.65") , 
couleur de fond, [utilisation de l'installation automatique (booléen, défaut false), 
qualité du swf (par défaut High),  url de redirection après l'install auto, 
url de redirection si les utilisateur n'ont pas la version correcte du plugin, 
id pour bypasser la détection flash (par défaut detectflash)]*/
var oSWF = new SWFObject("loader.swf", "siteSWF", "900", "1000", "8", "#ffffff", true);

/* paramètre de config de l'objet javascript */
// url de redirection après l'install auto (actuellement géré en auto par le loader flash)
//oSWF.setAttribute('xiRedirectUrl', 'http://www.example.com/upgradefinished.html'); 
 // url de redirection si les utilisateur n'ont pas la version correcte du plugin flash
oSWF.setAttribute('redirectUrl', 'updateflash.php');

// ajout des variables à transmettre au flash
oSWF.addVariable("nomswf", "swf/exemple.swf");
oSWF.addVariable("version", "2");

oSWF.addVariable("var2", "<?php echo $s_var2; ?>");
oSWF.addVariable("nocache", "1");
// paramètres du flash player
//so.addParam("quality", "low");
//so.addParam("wmode", "transparent");
//so.addParam("salign", "t");   
oSWF.write("flashcontent");
// ]]>
</script>
<!--- fin include du flash --->
Le code source est commenté au maximum afin de vous faciliter la tache.
Voic un lien contenant tous les paramètres possibles pour configurer votre application flash (so.addParam("quality", "low");)
faq Liste complète des paramètres et leurs valeurs possibles


IV-b. Installation détaillée du Préloader

  • Dans le répertoire de votre choix ou à la racine de votre site, uploadez le contenu de l'archive.
  • Renseigner la variable nomswf dans le fichier index.php, donner lui le chemin du ou des swf à charger.

  • Dans l'exemple ci dessous, on souhaite seulement charger un site internet.
    Ajout du swf à charger par le loader
    
    oSWF.addVariable("nomswf", "swf/site_internet.swf");
    

    Dans l'exemple ci-dessous, on souhaite charger une bibliothèque de classe Action Script puis le site internet qui utilisera les classes précédemment chargées.
    Ajout de plusieurs swf à charger par le loader
    
    oSWF.addVariable("nomswf", "swf/bibliotheque/biblio.site.swf|swf/site_internet.swf");
    
    Vous devez avoir cette structure :
    Structure du répertoire racine
    
    	loader.swf
    	répertoire swf qui contient : site_internet.swf
    	répertoire bibliotheque qui contient : biblio.site.swf (optionnel)
    	index.php
    
La configuration du préloader pas à pas :

  • Configuration de la version du Flash Player requise pour visualiser le site.
    Dans le cas ci-dessous, on souhaite la version 8. Toutes les internautes qui viendront sur le site avec une version inférieur à 8 se verront proposer l'installation automatique de la dernière version du Flash Player (voir copies d'écran ci-dessous).
  • Version minimale requise
    
    var oSWF = new SWFObject("loader.swf", "siteSWF", "900", "1000", "8", "#ffffff", true);
    
  • Ajouter de paramètres au Player Flash.
  • Ajouter de paramètres
    
    oSWF.addParam("quality", "low");
    oSWF.addParam("wmode", "transparent");
    oSWF.addParam("salign", "t");
    

  • Transmettre des variables à l'application Flash.
  • Transmettre des variables
    
    oSWF.addVariable("variable1", "valeur1");
    oSWF.addVariable("variable2", "valeur2");
    oSWF.addVariable("variable3", "valeur3");
    
  • Transmettre des variables à l'application Flash par une url.
    Exemple : http://www.monsite.com/page.html?variable1=valeur1&variable2=valeur2
  • Transmettre des variables par une url
    
    oSWF.addVariable("variable1", getQueryParamValue("variable1"));
    oSWF.addVariable("variable2", getQueryParamValue("variable2"));
    

IV-c. Fonctionnalités détaillées

  • L'internaute ne possède aucun Plugin Flash sur son navigateur.
    Redirection automatique sur une page spécifiée lui proposant d'installer le Player Flash.
  • Transmettre des variables par une url
    
    oSWF.setAttribute('redirectUrl', 'erreurs/updateflash.php');
    
    Proposition d'installation du Flash Player
    Proposition d'installation du Flash Player
    Installation chez Adobe Macromédia
    Installation chez Adobe Macromédia
  • La version du Player Flash de l'internaute est inférieurse à celle désirée sur votre site.
    Proposition de mise à jour automatique du Player Flash avec la dernière version disponible en fonction de l'OS et du navigateur.
  • Version du Flash Player insuffisante
    Version du Flash Player insuffisante
  • Connexion sur le site Adobe Macromedia pour récupérer la dernière version du Player Flash disponible.
  • Connexion sur le site Adobe Macromedia
    Connexion sur le site Adobe Macromedia
  • Demande de confirmation de la mise à jour du Player.
  • Demande de confirmation
    Demande de confirmation
  • L'internaute peut refuser l'installation automatique, dans ce cas il est possible d'afficher une pop-up avec un message personnlisable.
  • Refus de l'installation automatique
    Refus de l'installation automatique
  • L'internaute confirme la procédure de mise à jour automatique.
    Téléchargement et installation de la dernière version du Player Flash de manière totalement transparente.
  • Mise à jour automatique du Flash Player
    Mise à jour automatique du Flash Player
    Mise à jour automatique du Flash Player
    Mise à jour automatique du Flash Player
  • A la fin de l'installation, le Preloader Flash ferme automatiquement le navigateur et le réouvre sur le même site qui vous as permis d'effectuer la mise à jour de votre Player Flash.

V. Téléchargement

Télécharger les sources du Préloader


VI. Remerciements

Je tiens à remercier tout particulièrement :

  • Le site du développeur de SWFObject (deconcept).
  • Et tous ceux qui m'ont aidé dans la réalisation/conception du Préloader.

VII. Notes


VII-a. Problèmes rencontrés

Pour toutes questions d'ordre technique, vous pouvez consulter le Forum Flash de Developpez.com.


VII-b. Vos contributions

Si vous avez amélioré le code source et le design graphique du Préloader, n'hésitez pas à me contacter pour tout intégrer dans les sources disponibles au téléchargement.


VIII. Copyright

/**
  * Copyright the original author or authors.
  *
  * Licensed under the MOZILLA PUBLIC LICENSE, Version 1.1 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
  *
  * http://www.mozilla.org/MPL/MPL-1.1.html
  *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  *
  *
  * The Initial Developer of the Original Code is
  * DELOISON Matthieu -- www.delfiweb.com.
  * Portions created by the Initial Developer are Copyright (C) 2006-2007
  * the Initial Developer. All Rights Reserved.
  *
  * Contributor(s) :
  *
  */





Valid XHTML 1.1!Valid CSS!

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 01/01/2006 Matthieu DELOISON. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.