lundi 21 juillet 2014

Imabox Uploader (Capture, modification et hébergement d'images)

[DESCRIPTION]

Cet utilitaire permet de capturer une zone de votre écran à l'aide de votre curseur de souris ou de raccourcis clavier.
Vos captures ainsi que vos images peuvent être éditées grâce à votre logiciel d'édition favoris, redimensionnées puis enfin hébergés chez l'hébergeur imabox.
Un historique de vos fichiers hébergés vous donnera accès aux liens http afin de les réutiliser plus tard (s'ils existent toujours selon le service de l'hébergeur).

Les points forts:
- Historique d'hébergement : récupérer vos images précédemment hébergées grâce à leurs Url.
- File d'attente d'hébergement : idéale pour rédiger des tutoriaux.
- Gestionnaire de compte Imabox : Gérer votre espace depuis l'application.
- Paramétrage de vos raccourcis clavier : capturer la fenêtre active ou l'écran.


[SCREENSHOTS]

Fenêtre principal : File d'attente d'hébergement


Historique : Récupération de vos images hébergées (membre ou anonyme)



Options : Hébergement, images, etc...







A propos : Informations, remerciements et support


 [FONCTIONNALITES]

- héberger des fichiers : bmp, jpg, gif, png au clic droit
- définir une zone puis la capturer
- ajouter des fichiers dans la liste par glissé-déposé
- capture d'écran depuis le raccourci clavier lorsque le logiciel est réduit dans la zone de notifications
- retrait de fichiers dans la file d'attente d'hébergement
- copie des liens dans le presse-papier
- visualisation de l'image en miniature
- redimensionnement des images de la liste avant hébergement
- affichage en temps réel de l'hébergement de chaque fichier
- possibilité de consulter les fichiers hébergés depuis l'historique
- filtre de l'historique depuis l'entête des colonnes
- possibilité de télécharger à nouveau les fichiers hébergés
- réduire l'application dans la zone de notifications
- menu dans la zone de notifications
- gestion de votre espace membre imabox (vos images hébergées)
- détection en temps réel de la connexion Internet.


[PREREQUIS]

- Système d'exploitation Windows Vista, Windows 7 et Windows 8
- Le DotNet Framework 4 minimum
- Ne nécessite pas d'installation

[REMERCIEMENTS]

mercredi 16 juillet 2014

Tuto : Créer un contrôle Textbox n'autorisant que certains caractères (Regex ou expressions régulières)

 Créer un contrôle TextBox n'autorisant que certains caractères (Regex ou expressions régulières)

Il devient parfois difficilement maintenable de toujours placer du code dans les gestionnaires d’événement du formulaire principal d'une application. 
Dans le cas particulier ou nous souhaiterions interdire la saisie de certains caractères dans une TextBox (dans notre exemple : LTextBox2) il nous faudrait alors utiliser les 2 gestionnaires d’événement suivants :

    Private Sub LTextBox2_KeyPress(sender As Object, e As KeyPressEventArgs) Handles LTextBox2.KeyPress
 
        If Not Char.IsControl(e.KeyChar) AndAlso Not IsNumeric(e.KeyChar) AndAlso e.KeyChar <> "." AndAlso e.KeyChar <> " " Then
            e.Handled = True
            MessageBox.Show("Valeur numérique uniquement !")
        End If
 
    End Sub
 
    Private Sub LTextBox2_TextChanged(sender As Object, e As EventArgs) Handles LTextBox2.TextChanged
 
        For Each c As Char In LTextBox2.Text.ToCharArray
            If Not IsNumeric(c) AndAlso c <> "." AndAlso c <> " " Then
                LTextBox2.Text = LTextBox2.Text.Replace(c, String.Empty)
                MessageBox.Show("Valeur numérique uniquement !")
            End If
        Next
 
    End Sub

Cet exemple extrait de ce billet autorise uniquement la saisie de caractères alphanumériques !
On se rends vite compte que l'implémentation de plusieurs TextBox deviendrait très difficilement maintenable !

En m'inspirant de cet exemple j'ai développé (en toute modestie) un petit contrôle hérité qui permet de vérifier lors de la saisie si les caractères entrés par l'utilisateur sont correctes selon le pattern Regex que le développeur aura placé dans la propriété adequate du contrôle "TextBoxEx".

Le contrôle TextBoxEx :

Imports System
Imports System.ComponentModel
Imports System.Data
Imports System.Drawing
Imports System.Text
Imports System.Windows.Forms
Imports System.Text.RegularExpressions
 
Partial Public Class TextBoxEx
    Inherits TextBox
 
#Region " Declarations "
    Private m_errorProvider As ErrorProvider = Nothing
    Private m_useRegularExpressionRegex As Regex = Nothing
#End Region
 
#Region " Properties "
    Private _UseRegularExpressionPattern As String
    Public Property UseRegularExpressionPattern() As String
        Get
            Return _UseRegularExpressionPattern
        End Get
        Set(ByVal value As String)
            If value IsNot Nothing Then m_useRegularExpressionRegex = New Regex(value, RegexOptions.Compiled)
            _UseRegularExpressionPattern = value
        End Set
    End Property
 
    Public Property UseRegularExpression As Boolean
    Public Property UseRegularExpressionErrorMessage As String
#End Region
 
#Region " Constructor "
    Public Sub New()
        m_errorProvider = New ErrorProvider
    End Sub
#End Region
 
#Region " Methods "
 
    Protected Overrides Sub OnValidating(e As CancelEventArgs)
        'OnValidating est déclenché lorsqu'on clique sur un autre contrôle dans la zone cliente du formulaire
        MyBase.OnValidating(e)
        SetErrorProvider()
    End Sub
 
    Protected Overrides Sub OnTextChanged(e As EventArgs)
        'OnTextChanged est déclenché lorsqu'un caractère est saisi dans la textbox.
        MyBase.OnTextChanged(e)
        SetErrorProvider()
    End Sub
 
    Private Sub SetErrorProvider()
        If UseRegularExpression And UseRegularExpressionPattern IsNot Nothing Then
            'On appelle la Fonction qui permet de vérifier l'exactitude des caractères saisis dans la textbox 
            If ValidateControl() = False Then
                'Me.Text = String.Empty
                If Not Me.Text.Length = 0 Then
                    Me.Text = Me.Text.Substring(0, Me.Text.Length - 1)
                    Me.Select(Me.Text.Length, 0)
                End If
                'ErrorProvider affiche une infobulle rouge à droite de la textbox.
                m_errorProvider.SetError(Me, UseRegularExpressionErrorMessage)
            Else
                'La saisie est valide donc rien n'est affiché dans ErrorProvider
                m_errorProvider.SetError(Me, String.Empty)
            End If
        End If
    End Sub
 
    Private Function ValidateControl() As Boolean
        ' Si le pattern est bon alors on vérifie que le texte tapé correspond au pattern 
        Return m_useRegularExpressionRegex.IsMatch(Me.Text)
    End Function
#End Region
 
End Class

Comment utiliser ce contrôle hérité :

  1. Ajouter une nouvelle classe dans votre projet nommée "TextboxEx"
  2. Sélectionnez le code plus haut et collez-le dans votre classe "TextBoxEx" (écrasez le contenu !)
  3. Régénérez votre projet
  4. Passez en mode "Concepteur de vues" 
  5. Dans votre boite à outils sélectionnez le contrôle "TextBoxEx" puis faites-le glisser sur votre formulaire : 

  6. Enfin sélectionnez votre TexBox puis paramétrez les propriétés :
    - "UseRegularExpressionPattern" avec le pattern : ^[0-9\b]+$ (ou le pattern RegEx que vous voulez)
    - "UseRegularExpression" à True
    - "UseRegularExpressionErrorMessage" avec la valeur Vous devez saisir uniquement des chiffres !
    ..... comme suit : 

    7. Voilà en image le résultat lorsque l'utilisateur tape un caractère alphabétique et non alphanumérique comme le préconise le pattern RegEx au dessus : 
                                                                                                                                                                               




mardi 1 juillet 2014

Tuto : Créer 1 Bitbucket et le gérer avec Source Tree Git Client

CREER UN BITBUCKET
ET  LE GERER AVEC
SOURCE TREE GIT CLIENT

Pdf disponible ici : http://wallace87000.upd.fr/CREER_UN_BITBUCKET_ET_LE_GERER_AVEC_SOURCE_TREE_GIT_CLIENT.pdf

1- Introduction

Ras le bol d’héberger vos projets un peu partout sur la toile (Mega, FTP perso, MediaFire, FileFactory…etc..) et de devoir mettre à jour les liens de téléchargements à chaque mise à jour ! Lorsqu’on se lance dans des projets de développement de grande envergure, il devient alors nécessaire de recourir à un gestionnaire de sources comme Bitbucket.
Après avoir mis en avant les avantages du gestionnaire de sources Bitbucket, je vais vous guider pour le mettre en place en quelques étapes qui viseront dans un premier temps à créer un compte Bitbucket puis le paramétrer, installer le client Git nommé « Source Tree » et enfin harmoniser le tout pour profiter pleinement de la gestion de vos projets.


2- Pourquoi le gestionnaire de sources Bitbucket

Voici en quelques lignes ce qui caractérise principalement ce gestionnaire de sources :

       - création/gestion des dépôts privés et publics (dépôt = projet)
       - partage de projets avec d’autres personnes (l’open source à l’état pur)
       - travail collaboratif avec d’autres développeurs
       - accepter ou rejeter des « Pull Requests » (soumissions d’ajouts de fonctionnalités, de correctifs, …etc…) d’autres développeurs ayant bifurqués (Forker) votre/vos projet(s)
       - modification en ligne ou depuis le client Git « Source Tree » de votre code source (complet ou indexé)
       - navigation dans vos projets grace à l’historique de commits (modifications)
       - gestion de versionning et des branches du projet
       - …….etc……

Il est surtout primordial d’avoir l’assurance qu’un projet est toujours disponible depuis Internet et de pouvoir revenir sur des versions antérieures à n’importe quel moment !
Le principal avantage a tirer de cet outil (Bitbucket) par rapport à son concurrent (GitHub) tient essentiellement dans la possibilité d’héberger autant de dépôts privées que vous voulez si le nombre de collaborateurs ne dépasse pas 5 !

Plus d’infos icihttps://www.atlassian.com/fr/software/bitbucket/overview


3- Mon compte Bitbucket

a. Création du compte

Ouvrez cette page et inscrivez-vous : https://bitbucket.org/account/signup

b. Paramétrer son compte

Accédez aux paramétrages du compte en cliquant en haut à droite sur votre avatar puis « Manage Account »  afin d’accéder à ceci :



- Le menu latéral de gauche vous permettra de paramétrer en profondeur votre compte
IMPORTANT : Vous pouvez passer le langage d’interface de votre compte en Français et remplacer votre avatar par défaut en cliquant sur « Change Avatar ».

- Le menu en haut à gauche donne accès principalement :
      o Dashboard : vue d’ensemble (projets privés et publics), demande d’ajouts, signalement de bugs
      o Repositories : Créer un dépôt, importer un dépôt
      o Create : créer directement un dépôt


4- Source Tree Git Client

a. Installer le client

      o Téléchargez l’application depuis le site : http://www.sourcetreeapp.com/
      o Installez-le puis lorsqu’il vous sera demandé, cliquez sur le 1er choix :

               • Lorsqu’il  vous sera demandé, cliquez sur le dernier choix :

               • L’installation est terminée et la fenêtre de configuration du client apparait.

b. Configurer le client

      o A la fin de l’installation du client vous arrivez sur cette fenêtre :


      o Configurez le client comme suit :
               Saisissez votre nom complet et votre adresse mail qui seront utilisés par défaut lorsque vous soumettrez une modification (commit)
               Cochez la case d’acceptation du CLUFF
               Cliquez sur « suivant »
                       • A la nouvelle fenêtre qui s’affiche laissez coché par défaut (Use Putty) puis cliquez sur « suivant »
                       • Une nouvelle fenêtre s’affiche « charger une clé SSH ? », cliquez sur « No »
                       • Enfin remplissez les champs à l’aide de vos identifiants de connexion de compte Bitbucket :


                       • Votre client est maintenant paramétré et il ressemble à cela:

c. Créer un nouveau dépôt

IMPORTANT : Il est important de savoir que la création d’un nouveau dépôt vise à créer une arborescence de votre futur projet sur votre compte Bitbucket.

Il est donc possible de créer un nouveau dépôt de 2 manières :

      o Nouveau dépôt depuis le logiciel Source Tree :

               • Créez un répertoire nommé BITBUCKET (dans mon exemple « D:\BITBUCKET »). Ce répertoire accueillera tous vos projets BitBucket. Dans le langage GIT on appelle ca « la copie de travail » ou « Working Copy » pour les puritains. C’est depuis ce répertoire que partiront toutes vos modifications ou « commits » de vos projets vers l’hébergeur Bitbucket (ou projets hébergés).
               • Créez un autre répertoire portant le nom de votre projet (dans mon exemple « D:\BITBUCKET\DotNetPatcher »)
               • Cliquez sur le bouton :

               • Dans la nouvelle fenêtre sui s’affiche, cliquez sur le bouton (projets hébergés) :
               • Cette nouvelle fenêtre contenant vos projets hébergés apparait, cliquez sur le bouton « Créer un nouveau dépôt … » :


               • Renseignez la nouvelle fenêtre comme suit  à l’aide de votre nom de projet puis cliquez sur le bouton « Create Repository » :


               • Cliquez sur le bouton « OK »

IMPORTANT : Par défaut la création d’un dépôt est marquée en tant que « Non visible publiquement » ou « Private Repository » ! A vous de prévoir ultérieurement la disponibilité publique de votre projet.

Vous constaterez que votre dépôt vide a été créé sur votre compte bitbucket et il est accessible et visible uniquement par vous depuis cette url : https://bitbucket.org/3dotdev/dotnetpatcher

      o Nouveau dépôt depuis votre compte Bitbucket
               Cliquez sur le bouton :
               Remplissez les champs puis validez en cliquant sur « Créer un dépôt » :


d. Clôner un dépôt

IMPORTANT : Il est important de savoir que le clonage d’un dépôt vise à créer une arborescence ou « copie de travail » de votre futur projet sur votre PC (en local).

Il est désormais possible de cloner votre dépôt de 2 façons :
      o Clôner depuis l’URL « https://bitbucket.org/3dotdev/dotnetpatcher », générée précédamment  lors de la création d’un nouveau dépôt :

               Cliquez sur le bouton « Clôner dans Source Tree » :


A NOTER : Pour permettre la création de l’arborecence de la copie de travail sur votre PC vous devrez autoriser le site Bitbucket à prendre la main sur votre ordinateur. Suivez les autres étapes pour clôner votre dépôt ou passez à la méthode décrite ci-après.

      o Clôner depuis Source Tree directement en procédant comme suit :
               Cliquez sur le bouton :
               Dans la nouvelle fenêtre qui s’affiche, cliquez sur le bouton (projets hébergés)
               Sélectionnez votre nouveau dépôt créé précédemment (dans mon exemple : DotNetPatcher) :


                       • Sélectionnez ensuite votre répertoire de travail créé précédemment, dans mon exemple« D:\BITBUCKET\DotNetPatcher ».
Votre fenêtre ressemble à ceci :


                       • Cliquez sur le bouton :
                       • Vous obtenez ce contenu dans Source Tree :



e. Ajouter un projet dans votre dépôt local

La notion de dépôt fait référence au projet hébergé (sur votre compte Bitbucket) et le clônage fait référence à la copie de travail (en local).
Avant de procéder à l’hébergement de votre projet sur Bitbucket, vous devez ajouter votre projet créé sous Visual Studio dans votre copie locale en procédant de cette manière :

      o copiez le contenu de votre projet depuis le répertoire par défaut  de Visual Studio « D:\Documents\Visual Studio 2012\Projects\DotNetPatcher » vers  le répertoire de travail : « D:\BITBUCKET\DotNetPatcher ».
Le contenu de la fenêtre Source Tree se mets automatiquement à jour car votre répertoire de travail a subit des modifications :


A NOTER : Dans la partie « Changements de la copie de travail » vous pouvez remarquer les fichiers qui ont été ajoutés.


f. Ajouter votre projet dans le dépôt hébergé

Cette étape nécessite obligatoirement d’avoir procéder à la création, le clonage, et la copie de votre projet en local

      o Au même niveau que le titre « Changements de la copie de travail », cliquez sur le bouton :
 afin d’ajouter tous les fichiers dans la partie « Changements indexés » juste au dessus.
Vous obtenez ceci :


      o Validez vos modifications en cliquant sur le bouton « Valider » (commit). Vous obtenez cette fenêtre, veillez à renseigner le champ « message de validation » permettant de décrire votre commit et à cocher la case « envoyer immédiatement les validations vers origin » comme ceci :


      o Cliquez sur le bouton « Valider » et attendez la fin de l’opération d’hébergement de votre projet
      o Observez vos commits en cliquant sur « Branches/master » dans le menu latéral de gauche :

 IMPORTANT : Pour committer votre projet sur votre espace hébergé :

      o Ouvrez votre projet situé dans le répertoire de la copie de travail (D:\BITBUCKET\DotNetPatcher) avec Visual Studio. Codez, déboggez…etc….  puis enregistrez
      o Revenez dans Source Tree et cliquez sur le bouton :
   afin d’ajouter les fichiers dans la catégorie des « changements indexés »
      o En somme répétez toute l’étape « f ».
      o Lorsque votre projet sera terminé, n’oubliez pas d’éditer le fichier « Readme » en ligne :


Plus d’infos ici https://bitbucket.org/tutorials/markdowndemo


g. Accéder aux paramètres de votre projet depuis votre compte Bitbucket

      o Accédez à l’url de votre projet : https://bitbucket.org/3dotdev/dotnetpatcher
      o Naviguez dans le menu latéral de gauche et cliquez sur l’icône :
  puis changer le logo de votre projet, le langage de programmation, …etc…et pensez à enregistrer les modifications :



IMPORTANT : Vous pouvez également supprimer votre dépôt depuis cette même fenêtre !


Si vous avez des questions quant à l’édition de votre code source en ligne et à la récupération des modifications depuis votre espace hébergé ou toutes autres choses…n’hésitez pas.

A+