|
De même qu’il est possible d’afficher le code source d’une page HTML dans un navigateur Web, les utilisateurs peuvent afficher le code source d’une application AIR HTML. Le kit de développement d’Adobe® AIR® comprend le fichier JavaScript AIRSourceViewer.js, que vous pouvez intégrer à l’application pour permettre aux utilisateurs finaux de consulter facilement le code source.
Chargement, configuration et ouverture de Source Viewer
Le code de Source Viewer figure dans un fichier JavaScript, AIRSourceViewer.js, qui réside dans le répertoire frameworks du kit SDK AIR. Pour intégrer Source Viewer à l’application, copiez le fichier AIRSourceViewer.js dans le répertoire de projet de l’application et chargez-le par le biais d’une balise script dans le fichier HTML principal de l’application :
<script type="text/javascript" src="AIRSourceViewer.js"></script>
Le fichier AIRSourceViewer.js définit la classe SourceViewer, à laquelle vous pouvez accéder à partir du code JavaScript en appelant
air.SourceViewer
.
La classe SourceViewer définit trois méthodes :
getDefault()
,
setup()
et
viewSource()
.
|
Méthode
|
Description
|
|
getDefault()
|
Méthode statique. Renvoie une occurrence de SourceViewer, qui vous permet d’appeler les autres méthodes.
|
|
setup()
|
Applique des paramètres de configuration à Source Viewer. Pour plus d’informations, voir
Configuration de Source Viewer
.
|
|
viewSource()
|
Ouvre une nouvelle fenêtre dans laquelle l’utilisateur peut rechercher et ouvrir les fichiers sources de l’application hôte.
|
Remarque :
le code utilisant Source Viewer doit se trouver dans le sandbox de sécurité de l’application (dans un fichier résidant dans le répertoire de l’application).
Le code JavaScript suivant, par exemple, instancie un objet SourceViewer et ouvre la fenêtre Source Viewer, qui répertorie tous les fichiers sources :
var viewer = air.SourceViewer.getDefault();
viewer.viewSource();
Configuration de Source Viewer
La méthode
config()
applique certains paramètres à Source Viewer. Elle gère un seul paramètre :
configObject
. L’objet
configObject
possède les propriétés suivantes qui définissent les paramètres de configuration de Source Viewer :
default
,
exclude
,
initialPosition
,
modal
,
typesToRemove
et
typesToAdd
.
default
Chaîne spécifiant le chemin relatif du fichier initial à afficher dans Source Viewer.
Le code JavaScript suivant, par exemple ouvre la fenêtre Source Viewer et y affiche initialement le fichier index.html :
var viewer = air.SourceViewer.getDefault();
var configObj = {};
configObj.default = "index.html";
viewer.viewSource(configObj);
exclude
Tableau de chaînes spécifiant les fichiers et répertoires à exclure de la liste de Source Viewer. Les chemins sont relatifs au répertoire de l’application. Les caractères génériques ne sont pas pris en charge.
Le code JavaScript suivant, par exemple, ouvre la fenêtre Source Viewer, qui répertorie tous les fichiers sources, à l’exception du fichier AIRSourceViewer.js et des fichiers résidant dans les sous-répertoires Images et Sounds :
var viewer = air.SourceViewer.getDefault();
var configObj = {};
configObj.exclude = ["AIRSourceViewer.js", "Images" "Sounds"];
viewer.viewSource(configObj);
initialPosition
Tableau comprenant deux nombres, qui spécifient les coordonnées x et y initiales de la fenêtre Source Viewer.
Le code JavaScript suivant, par exemple, ouvre cette fenêtre aux coordonnées d’écran [40, 60] (X = 40, Y = 60) :
var viewer = air.SourceViewer.getDefault();
var configObj = {};
configObj.initialPosition = [40, 60];
viewer.viewSource(configObj);
modal
Valeur booléenne spécifiant si la fenêtre Source Viewer doit être modale (true) ou non (false). Cette fenêtre est modale par défaut.
Le code JavaScript suivant, par exemple, ouvre la fenêtre Source Viewer de telle sorte que l’utilisateur puisse interagir avec elle et avec les fenêtres de toute application :
var viewer = air.SourceViewer.getDefault();
var configObj = {};
configObj.modal = false;
viewer.viewSource(configObj);
typesToAdd
Tableau de chaînes spécifiant les types de fichier à ajouter à la liste de Source Viewer, en plus des types inclus par défaut.
Ces types de fichier correspondent à :
-
Fichiers texte : TXT, XML, MXML, HTM, HTML, JS, AS, CSS, INI, BAT, PROPERTIES, CONFIG
-
Fichiers image : JPG, JPEG, PNG, GIF
Si vous n’entrez pas de valeur, tous les types par défaut sont inclus (à l’exception de ceux spécifiés par la propriété
typesToExclude
).
Le code JavaScript suivant, par exemple, ouvre la fenêtre Source Viewer et inclut les fichiers VCF et VCARD :
var viewer = air.SourceViewer.getDefault();
var configObj = {};
configObj.typesToAdd = ["text.vcf", "text.vcard"];
viewer.viewSource(configObj);
Pour chaque type de fichier inclus, vous devez spécifier « text » (pour les types de fichier texte) ou « image » (pour les types de fichier image).
typesToExclude
Tableau de chaînes spécifiant les types de fichier à exclure de Source Viewer.
Ces types de fichier correspondent à :
-
Fichiers texte : TXT, XML, MXML, HTM, HTML, JS, AS, CSS, INI, BAT, PROPERTIES, CONFIG
-
Fichiers image : JPG, JPEG, PNG, GIF
Le code JavaScript suivant, par exemple, ouvre la fenêtre Source Viewer sans répertorier les fichiers GIF ou XML :
var viewer = air.SourceViewer.getDefault();
var configObj = {};
configObj.typesToExclude = ["image.gif", "text.xml"];
viewer.viewSource(configObj);
Pour chaque type de fichier répertorié, vous devez spécifier « text » (pour les types de fichier
texte
) ou «
image
» (pour les types de fichier image).
Ouverture de Source Viewer
Il est souhaitable d’inclure un élément d’interface utilisateur (lien, bouton, option de menu, par exemple) qui, lorsque l’utilisateur le sélectionne, appelle Source Viewer. L’application simple ci-dessous, par exemple, ouvre Source Viewer lorsque l’utilisateur clique sur un lien :
<html>
<head>
<title>Source Viewer Sample</title>
<script type="text/javascript" src="AIRSourceViewer.js"></script>
<script type="text/javascript">
function showSources(){
var viewer = air.SourceViewer.getDefault();
viewer.viewSource()
}
</script>
</head>
<body>
<p>Click to view the source files.</p>
<input type="button"
onclick="showSources()"
value="View Source" />
</body>
</html>
Interface utilisateur de Source Viewer
Lorsque l’application appelle la méthode
viewSource()
d’un objet SourceViewer, l’application AIR ouvre une fenêtre Source Viewer. Cette fenêtre comprend une liste de fichiers et répertoires sources (à gauche) et une zone d’affichage contenant le code source du fichier sélectionné (à droite) :
Les répertoires sont placés entre crochets. L’utilisateur peut cliquer sur un répertoire pour développer ou masquer son contenu.
Source Viewer peut afficher la source des fichiers texte portant une extension reconnue (HTML, JS, TXT, XML, etc.), ainsi que des fichiers image dotés d’une extension graphique reconnue (JPG, JPEG, PNG et GIF). Si l’utilisateur sélectionne un fichier dont l’extension est inconnue, un message d’erreur indiquant qu’il est impossible d’extraire le contenu d’un fichier de ce type s’affiche.
Les fichiers sources exclus par le biais de la méthode
setup()
ne sont pas répertoriés (voir
Chargement, configuration et ouverture de Source Viewer
).
|
|
|
