Affichage des articles dont le libellé est Tutoriel. Afficher tous les articles
Affichage des articles dont le libellé est Tutoriel. Afficher tous les articles

vendredi 24 septembre 2010

Coloration syntaxique Apache 1.3 dans Notepad++

Notepad++ est un éditeur de texte libre et gratuit très léger et performant : il s'ouvre quasiment instantanément même sur des machines modestes et fournit de nombreuses fonctionnalités comme la gestion des onglets, la réouverture automatique des fichiers, l'affichage simultané de deux fenêtres de texte, les macros, la coloration syntaxique pour de nombreux langages, la surveillance de la modification des fichiers ouvert dans Notepad++ par d'autre logiciels, une implémentation shell permettant d'ouvrir n'importe quel fichier à partir du menu contextuel (click droit) de l'explorateur, la possibilité de faire des rechercher/remplacer dans des répertoire complet et toute leur arborescence, avec ou sans regex, avec ou sans mode étendu (\n, \r , etc.)...

Bref, un outil indispensable à tout informaticien, car même ceux qui, comme moi affectionnent le confort de lourds IDE tel que Netbean ou Visual Studio, il est toujours intéressant d'avoir une alternative à un logiciel qui vous fera patienter 30 seconde lors de son lancement pour faire une modification qui en prendra 2.

Voici comment obtenir une coloration syntaxique pour les fichiers de configuration Apache 1.3 qui n'est pas nativement implémenté dans Notepad++ 5.6.8.

Bien qu'optimisé pour Apache 1.3, cette coloration syntaxique rend aussi plus confortable les fichiers de configurations d'Apache 2

Pour commencer :

Dans Notpad++ :

  • Ouvrir le panneau "Langage utilisateur",
  • cliquer sur le bouton "Nouveau..." et remplir "httpd.conf 1.3" dans le champ "Name :" de la fenêtre "Create New Language..." puis appuyer sur le bouton "OK",
  • s'assurer que la liste déroulante "Langage" est bien sur "httpd.conf 1.3".

Astuce : En ce qui concerne la police, il faut toujours mettre une police à pas fixe pour le code. Par défaut, la police "Fixedsys" est utilisé ici.

Info : Pour les commentaires, la police "Verdana" à été choisie pour faciliter la lisibilité.

Dans l'onglet "Bloc & défaut"

Dans "Style par défaut", choisir un gris foncé comme couleur de premier plan et la police "Fixedsys" dans "Famille".

Dans "Définition de bloc ouvrant" et "Définition de bloc fermant" choisir du bleu comme couleur de premier plans et la police "Fixedsys" dans "Famille"

Remplir le champ texte de "Définition de bloc ouvrant" avec :

<Limit <LimitExcept <Location <LocationMatch <VirtualHost <IfDefine <IfModule <Files <FilesMatch <Directory <DirectoryMatch <location

Remplir le champ texte de "Définition de bloc fermant" avec :

</Limit </LimitExcept </Location </LocationMatch </VirtualHost </IfDefine </IfModule </Files </FilesMatch </Directory </DirectoryMatch </location

Dans l'onglet "Mots clés"

"1er Groupe" :

  • Couleur de premier plan bleu foncé,
  • police "Fixedsys" dans "Famille",
  • cocher "Souligné",

Remplir le champ texte avec :

AcceptFilter AcceptMutex AccessConfig AccessFileName Action AddAlt AddAltByEncoding AddAltByType AddCharset AddDefaultCharset AddDescription AddEncoding AddHandler AddIcon AddIconByEncoding AddIconByType AddLanguage AddModule AddModuleInfo AddType AgentLog Alias AliasMatch AllowCONNECT AllowOverride Anonymous Anonymous_Authoritative Anonymous_LogEmail Anonymous_MustGiveEmail Anonymous_NoUserID Anonymous_VerifyEmail AuthAuthoritative AuthDBAuthoritative AuthDBGroupFile AuthDBMAuthoritative AuthDBMGroupFile AuthDBMGroupFile AuthDBUserFile AuthDBMUserFile AuthDigestFile AuthGroupFile AuthName AuthType AuthUserFile BindAddress BrowserMatch BrowserMatchNoCase BS2000Account CacheDefaultExpire CacheDirLength CacheDirLevels CacheForceCompletion CacheGcInterval CacheLastModifiedFactor CacheMaxExpire CacheRoot CacheSize CheckSpelling ClearModuleList ContentDigest CookieExpires CookieTracking CoreDumpDirectory CustomLog DefaultIcon DefaultLanguage DefaultType DirectoryIndex DocumentRoot EBCDICConvert EBCDICConvertByType EBCDICKludge ErrorDocument ErrorLog Example ExpiresActive ExpiresByType ExpiresDefault ExtendedStatus FancyIndexing ForceType ForensicLog Group Header HeaderName HostNameLookups IdentityCheck ImapBase ImapDefault ImapMenu Include IndexIgnore IndexOptions IndexOrderDefault ISAPIReadAheadBuffer ISAPILogNotSupported ISAPIAppendLogToErrors ISAPIAppendLogToQuery KeepAlive KeepAliveTimeout LanguagePriority LimitRequestBody LimitRequestFields LimitRequestFieldsize LimitRequestLine Listen ListenBacklog LoadFile LoadModule LockFile LogFormat LogLevel MaxClients MaxKeepAliveRequests MaxRequestsPerChild MaxSpareServers MetaDir MetaFiles MetaSuffix MimeMagicFile MinSpareServers MMapFile NameVirtualHost NoCache Options order PassEnv PidFile Port ProxyBlock ProxyDomain ProxyPass ProxyPassReverse ProxyReceiveBufferSize ProxyRemote ProxyRequests ProxyVia ReadmeName Redirect RedirectMatch RedirectPermanent RedirectTemp RefererIgnore RefererLog RemoveEncoding RemoveHandler RemoveType require ResourceConfig RewriteBase RewriteCond RewriteEngine RewriteLock RewriteLog RewriteLogLevel RewriteMap RewriteOptions RewriteRule RLimitCPU RLimitMEM RLimitNPROC Satisfy ScoreBoardFile Script ScriptAlias ScriptAliasMatch ScriptInterpreterSource ScriptLog ScriptLogBuffer ScriptLogLength SendBufferSize ServerAdmin ServerAlias ServerName ServerPath ServerRoot ServerSignature ServerTokens ServerType SetEnv SetEnvIf SetEnvIfNoCase SetHandler StartServers ThreadsPerChild TimeOut TransferLog TypesConfig UnsetEnv UseCanonicalName User UserDir VirtualDocumentRoot VirtualDocumentRootIP VirtualScriptAlias VirtualScriptAliasIP XBitHack Timeout Allow Deny Order HostnameLookups MIMEMagicFile CookieLog SSLEngine SSLCertificateFile SSLCertificateKeyFile SSLLog SSLLogLevel SSLRandomSeed SSLMutex SSLSessionCacheTimeout SSLSessionCache SSLPassPhraseDialog

"2è Groupe" :

  • Couleur de premier plan bleu-vert,
  • police "Fixedsys" dans "Famille".

Remplir le champ texte avec :

CacheNegotiatedDocs SSLRequireSSL

"3è Groupe" :

  • Couleur de premier plan bleu clair,
  • police "Fixedsys" dans "Famille".

Remplir le champ texte avec :

Off On None on off none error warn info trace debug builtin deny,allow allow,deny Mutual-failure all valid-user Basic All Indexes Includes FollowSymLinks ExecCGI MultiViews

"4è Groupe" :

  • Couleur de premier plan bleu-vert foncé,
  • police "Fixedsys" dans "Famille",
  • cocher "Souligné",

Remplir le champ texte avec :

from user group startup connect

Dans l'onglet "Commentaire & Nombre" :

"Commentaire sur une ligne" :

  • Couleur de premier plan vert,
  • police "Verdana" dans "Famille",
  • cocher "Traiter comme un symbole",
  • remplir le champ texte avec le caractère : "#" (dièse).

"Nombre" :

  • Couleur de premier plan rouge.

Dans l'onglet "Opérateurs" :

  • Passer le caractère ">" de la liste des "Symboles disponibles" à la liste des "Opérateurs activés",
  • prendre le même bleu que pour les blocs en couleur de premier plan,
  • police "Fixedsys" dans "Famille",
  • cocher "Enable escape character :" et rentrer le caractère : "\" (back-slash).

"Délimiteur 1" :

  • "Borne ouvrante :" : """ (double guillemet),
  • "Borne fermante :" : """ (double guillemet),
  • Couleur de premier plan mauve,
  • police "Fixedsys" dans "Famille".

Ressources :

Nomenclature

Voici le contexte dans lequel à été testé la réalisation des étapes ci-dessus :

  • Ordinateur (Asus EeePc 1000H) 
    • Intel Atom 1,6 GHz,
    • 2 Gio RAM,
    • Windows Vista 32 bits.
  • Logiciel utilisé 
    • Notepad++ 5.6.8 version française.
  • Fichier de test utilisé 
    • "httpd.conf" par défaut de la version Apache 1.3 implémenté dans OpenBSD 4.5.

Droit d'auteur / propriété intellectuelle :

Cet article et son contenu sont régis par les conditions suivantes :

Tout contenu tiers est régi par les conditions des ayants droits.

Tout autre contenu ou ressource est soumis à l'acceptation du contrat Creative Commons by-nc-nd.

En cas de non acceptation de tout ou partie des conditions (incluant celles des contenus tiers), le contenu de cet article reste la propriété morale et patrimoniale de son auteur, et tout usage non autorisé par écrit est explicitement proscrit.

mardi 21 septembre 2010

Une photo panoramique 360° Flash avec une boule de Noël

Voici comment réaliser un panoramique 360° avec une seul photo, une boule de Noël, Photoshop et Flash CS4.

L'exemple présenté au long de cet article est délibérément de mauvaise qualité afin d'éviter toute identification de lieux, de biens ou de personnes.

Panoramique 360° Flash réalisé avec une boule de Noël

Etape 1 : La photo

Prendre une boule de Noël miroir dans le meilleur état possible (non tinté de préférence) et la suspendre par un fil au centre de la pièce.

Astuce : Plus elle sera grosse, meilleur sera la qualité du résultat.

Astuce : La meilleur hauteur semble être à un tiers de la hauteur plafond sol en partant du plafond pour avoir un maximum de détail sur la pièce. Expérimenter différentes hauteurs le cas échéants.

Prendre en photos la boule de Noël en respectant les consignes suivantes :

  1. Positionner l'objectif exactement en dessous de la boule de Noël,
  2. Prendre la photo le plus près possible de la boule de Noël,
  3. Garder une netteté maximum de la boule de Noël et de ses reflets,
  4. La boule de Noël ne doit pas être coupé, et se trouver intégralement sur la photo.

Astuce : Un objectif avec un mode macro est préférable. De plus, il peut être nécessaire de tester différentes tailles de boules en fonction du rapprochement que permet l'objectif.

Figure 1 : Photos d'une boule de Noël de piètre qualité (petite, abîmé, bleu...) réalisé avec un capteur CMOS 5 mégas pixels bas de gamme intégré à un téléphone portable.
Figure 1 : Photos d'une boule de Noël de piètre qualité (petite, abîmé, bleu...) réalisé avec un capteur CMOS 5 mégas pixels bas de gamme intégré à un téléphone portable.

Etape 2 : Retouche

A l'aide d'un logiciel de retouche d'image recadrer la photo en carré de telle sorte que la boule s’inscrive parfaitement dedans (c.f. Figure 2).

Figure 2 : La boule de Noël recadrée.
Figure 2 : La boule de Noël recadrée.

Par la suite effectuer une contraction de l'image vers de centre (c.f. Figure 3) :

  • A l'aide de Photoshop :
    • Menu "Filtre" > "Déformation" > "Contraction..."
    • Valeur : "100%"
Figure 3 : La fenêtre de paramètres "Contraction" de Photoshop.
Figure 3 : La fenêtre de paramètres "Contraction" de Photoshop.

Continuer avec une conversion polaire en rectangle (c.f. Figure 4) :

  • A l'aide de Photoshop :
    • Menu "Filtre" > "Déformation" > "Coordonnées polaires..."
    • Radio button "Polaire en rectangulaire"
Figure 4 : La fenêtre de paramètres "Coordonnées polaires" de Photoshop.
Figure 4 : La fenêtre de paramètres "Coordonnées polaires" de Photoshop.

Finir avec une rotation de l'image à 180°, puis l'enregistrer en temps que "img.jpg".

Figure 5 : Le résultat final "img.jpg".
Figure 5 : Le résultat final "img.jpg".

Astuce : En divisant par deux la hauteur de l'image sans en changer la largeur, le visuel sera plus probant à l'œuil. Cependant, il est préférable de conserver le fichier en l'état pour la suite des opérations.

Etape 3 : Le viewer

Suivez l'excellent tutoriel de Grafikart pour la création d'un viewer panoramique Flash à l'aide de Papervision3D :

Tutoriel vidéo Flash : Papervision, panorama 360° - Grafikart


Tutoriel vidéo : Papervision, panorama 360°
envoyé par Grafikart. - Regardez plus de vidéo vie pratique.

Attention : Il est important de noter l'encadré stipulant que le contenu des tutoriels de Grafikart ainsi que toutes les ressources fournies le sont en Creative Commons by-nc-nd. L'auteur interdit donc explicitement l'usage des ressources qu'il fournit (code sources, etc...) sur un site à visé commerciale (nc) ainsi la personnalisation du code pour l'adapter à ses propres besoins (nd).

il suffi d'utiliser l'image précédemment généré ("img.jpg") avec le viewer pour observer le résultat final.

Astuce : Il est possible de jouer avec la hauteur du visuel et de l'image qu'il contiens ainsi que l'angle limite en hauteur pour obtenir un résultat plus probant en se dispensant de l'étape de contraction de l'image vers le centre (c.f. Figure 6).

Figure 6 : Test de modification du fichier "img.jpg".
Figure 6 : Test de modification du fichier "img.jpg".

Etape 4 : Réflexion

Tout ceci ne consiste qu'en une suite d'essais rapide, comme pistes de réflexions. Il est donc nécessaire de pousser l'étude du sujet au delà de ce simple survol pour avoir un résultat plus pertinent.

L'idéal serait de pouvoir prendre la photo de dessus, mais il faudrait trouver une solution pour que le preneur de vue et/ou le dispositif ne masque pas trop le champs. Il est cependant certain que de meilleur résultats serait obtenu avec un miroir "sphéroïde" légèrement oblong, car il permettrait de descendre la prise de vue à hauteur d'yeux pour un résultat plus réaliste.

De prochains articles seront peut-êtres écrit sur le sujet, notamment sur la question du viewer, dont la création d'une version original en licence libre est à l'ordre du jour.

Etape 5 : Sources d'inspirations / Aller plus loin

Nomenclature

Voici le contexte dans lequel à été testé la réalisation des étapes ci-dessus :

  • APN 
    • HTC Hero.
  • Ordinateur 
    • Core I7,
    • 8 Gio RAM,
    • Windows Seven 64 bits.
  • Logiciels utilisés 
    • Photoshop CS4 64 bits version française,
    • Flash CS4 version française

Droit d'auteur / propriété intellectuelle :

Cet article et son contenu sont régis par les conditions suivantes :

Tout contenu tiers est régi par les conditions des ayants droits.

Tout autre contenu ou ressource est soumis à l'acceptation du contrat Creative Commons by-nc-nd.

En cas de non acceptation de tout ou partie des conditions (incluant celles des contenus tiers), le contenu de cet article reste la propriété morale et patrimoniale de son auteur, et tout usage non autorisé par écrit est explicitement proscrit.