CE BLOG N'EST PLUS MIS A JOUR !
POUR DES INFORMATIONS RECENTES VEUILLEZ VOUS RENDRE ICI
Bienvenue sur le blog d'un développeur web : Actualités du monde informatique et scientifique, morceaux de programmations et diverses informations intéréssantes.

Stockage de données dans le cloud (SugarSync, DropBox, SkyDrive, BitCasa)

Posté par : Neg le : 2012-05-22 19:21:25



Depuis ce début d'années j'ai essayé (et cumulé) plusieurs services de stockage / synchronisation de données (dossiers et fichiers) dans le cloud. Je fais donc ici un petit retour d'expérience sur les différences entre ces services, leurs avantages et inconvénients. A noter que je ne parlerais que de leurs utilisation Windows, pas sous un autre OS, ni de leurs applications mobile n'ayant rien testé de plus. Je ne parlerais aussi que des version de base (et gratuites) de ces services.

Leurs point communs sont qu'ils propose un service web pour naviguer/visualiser/télécharger ses données misent en ligne.
Ainsi que des liens (public ou privé) pour partager/échanger ses fichiers avec d'autres personnes.


Le plus connu de ces services et sans doute DropBox
Il propose :
- 2 Go de stockage (possibilité d'augmenter jusqu'à 18 Go en invitant des amis.)
- Synchronisation automatique de ses données à partir d'un répertoire fixe (dropbox)
Ce deuxième point et pour moi un défaut, en effet on est obligé de déplacer nos fichiers/répertoire que l'on veux avoir dans le cloud. On ne peut donc pas garder l'arborescence de son ordinateur de base, ce qui en fait un service utile pour mettre en ligne des fichiers à récupérer lors de déplacements mais pas très pratique pour sauvegarder ses données importantes au fur à mesure de leurs utilisations.

Le 2ème service que je vais présenter et aussi celui qui s'en rapproche le plus. c'est celui de Microsoft skyDrive
Il utilise vote compte live / MSN, vous en avez donc peut être déjà un sans le savoir. son avantage et que pour les anciens compte (donc msn / hotmail) il propose de passer gratuitement à
- 25 Go de stockage
Ce qui vous permettra d'enregistrer pas mal de documents (photos / musique) au cas ou votre ordinateur crashe un jour, vous pourrez les récupérer. Par contre, comme dropBox ces fichiers/dossiers sont à placé dans un répertoire unique (skydrive) ce qui n'est pas des plus pratique.

Le service évitant ce principal défaut est SugarSync
Il propose pour sa part
- 5 Go de stockage (possibilité d'augmenter jusqu’à 32 Go en invitant des amis.)
- Synchronisation libre de n'importe quel répertoire.
C'est le meilleur d'aprés moi, en effet il vous suffit d'installer l'application d'indiquer les dossiers que vous voulez synchroniser, par la suite tout s'effectue de façon transparente. Je vous le conseille.

Vient ensuite BitCasa qui ne joue pas vraiment dans la même cours.
Le service en beta fonctionne pour l'instant sur invitation ou en s'inscrivant sur une liste d'attente.
Il propose gratuitement (10¤ par mois prévus par la suite.)
- stockage ILLIMITÉ
par contre, pas exactement de synchronisation, vous choisissez les dossier a uploader, une fois que c'est fait votre dossier se transforme en une sorte de stockage externe (raccourcis) vos fichiers sont donc directement récupérer en ligne. Bien sur vous pouvez a tout moment "déconnecter" un dossier pour l'avoir dans son état initial sur votre ordinateur.
Utile donc pour de la sauvegarde de taille importante (bien qu'en version beta) contrairement aux autres services.

En cumulant plusieurs de ses services vos données importantes devraient être disponibles rapidement de n'importe-ou et à l’abri d'une perte inopiné !

lien direct : http://numa-bord.com/old/leblog/chezneg-leblog.php?id_art=262&titre=Stockage-de-données-dans-le-cloud-(SugarSync,-DropBox,-SkyDrive,-BitCasa)
tags : Informatique (68), cloud (1), données (1), services (1), synchronisation (1), dropbox (1), sugarsync (1), bitcasa (1), skydrive (1),


J'aime, 9 personnes aiment çaCommentaire(s)(0)

PHP : Recuperer les balises images d'un document (une page) HTML

Posté par : Neg le : 2012-01-31 22:07:12



Comment faire pour extraire les images utilisés dans un document HTML ? On peut vouloir faire ça pour plusieurs raisons, afficher l’aperçu d'une page web via la première image que l'on trouve dedans par exemple.

Pour cela, quelque fonctions PHP et l'utilisation d'une expression régulière (qui n'est pas de moi dans le code qui suit) pour extraire le contenus "href" des balises image trouvés sont nécessaires.

Je propose ci-dessous un code commenté permettant de le faire, il fonctionne correctement pour une utilisation générale, pour les cas spéciaux je vous laisse le perfectionner.

Le code est exactement celui de cette page de démonstration qui affiche le chemin de l'image (tel que récupéré dans le "href" des balise images) ainsi que l'image traitées. L'url de la page sur laquelle on veut travailler et à passé via un formulaire simple.


<?php
if (isset($_GET["url"])) {
    //on veut recuperer le chemin, et la page
    //on sépare donc les parties delimité par des /
    $chemin_ex = explode("/", $_GET["url"]);
    //on recupere le nombre de parties séparés
    $nb = count($chemin_ex);
    //si nb<=3 il n'yavait pas de séparateur / autre que dans http://
    if ($nb <= 3) {
        //le chemin est donc l'url complète.
        $chemin = $_GET["url"];
        $page = '';
    } else {
        //le chemin correspond à l'url complete moins /dernier element, la page au dernier element
        $page = $chemin_ex[$nb - 1];
        $chemin_ex[$nb - 1] = '';
        $chemin = implode("/", $chemin_ex);
    }
    //on récupère le html de la page que l'on veut avec file_get_contents()
    $html = file_get_contents($chemin . $page);
    //l'expression régulière permettant de trouver les balise images
    $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/Ui', $html, $matches);
    //pour chacuns des element trouvés
    for ($i = 0; $i < $output; $i++) {
        //on affiche le contenus de la balise src.
        echo $matches[1][$i] . '';
        //et on affiche l'image correspondante.
        //si ca commence pat http on affiche directement
        if (substr($matches[1][$i], 0, 7) == 'http://' || substr($matches[1][$i], 0, 8) == 'https://') {
            echo '<img src="' . $matches[1][$i] . '">';
        } else {
            //si l'image commence par / on doit supprimer le premier repertoire du chemin
            if (substr($matches[1][$i], 0, 1) == '/') {
                $image_tab = explode('/', $matches[1][$i]);
                $image_tab[0]='';
                $image_tab[1]='';
                $image=implode("/", $image_tab);
            } else {
                //sinon on la garde telle quelle et on rajoute le chemin general du site recherché
                $image=$matches[1][$i];
            }
            echo '<img src="' . $chemin . $image . '">';
        }
    }
} else {
    //par defaut remplir le formulaire avec l'url du blog
    $_GET["url"] = 'http://www.chezneg.fr/leblog/chezneg-leblog.php';
}
?>

<form method="get">
    <label>URL dont je veux afficher les images : </label><input type="text" name="url" value="<?php echo $_GET["url"] ?>"/>
    <input type="submit" value="OK" />
</form>
 

lien direct : http://numa-bord.com/old/leblog/chezneg-leblog.php?id_art=261&titre=PHP-:-Recuperer-les-balises-images-d'un-document-(une-page)-HTML
tags : Informatique (68), php (21), image (3), code (1),


J'aime, 9 personnes aiment çaCommentaire(s)(0)

PHP : faire un lecteur RSS grâce à simplexml_load_file

Posté par : Neg le : 2011-10-17 11:51:29



Depuis la version 5 de php, parser un fichier xml est très simple grâçe à la fonction simplexml_load_file() qui s'occupe de tout. On peut ainsi facilement afficher une liste de liens vers le site que l'on veut pour peu qu'il possède un flux RSS.

le (très) court code ci dessous : (le résultat ici)


//on charge le flux dont on passe l'adresse en paramètre de la fonction simplexml_load_file
$monflux = simplexml_load_file('http://cool-videos.fr/coolvideos.xml');
On peut ensuite naviguer dedans (en connaissant sa structure)
foreach ($monflux->channel->item as $item)
{
on affiche le lien et le titre de chaque éléments item
echo '‹a target="_blank" href="'.$item->link.'"›'.$item->title.'‹/a›';
}


il est aussi possible d’utiliser le language XPath pour naviguer dans le fichier XML, et obtenir le même résultat de cette façon :


$monflux = simplexml_load_file('http://cool-videos.fr/coolvideos.xml');
// xpath('//item') va récupérer tous les éléments item ou qu'ils soient
foreach($monflux->xpath('//item') as $item)
{
$content.='‹a target="_blank" href="'.$item->link.'"›'.$item->title.'‹/a›';
}


lien direct : http://numa-bord.com/old/leblog/chezneg-leblog.php?id_art=260&titre=PHP-:-faire-un-lecteur-RSS-grâce-à-simplexml_load_file
tags : Informatique (68), rss (3), php (21), XML (4),


J'aime, 5 personnes aiment çaCommentaire(s)(0)

Editer un fichier de constantes php via un formulaire.

Posté par : Neg le : 2011-07-17 16:47:47



Prenons un cas concret d'un site multi-langues, ou les textes pour chacune des langues sont gérés par un fichier de constantes. Exemple : lang_fr.php, lang_uk.php... contenant :

lang_fr.php


//GENERAL
define('ERREUR_GENERALE','Une erreur est survenue ! ');
define('BONJOUR' , 'Bonjour');
define('DECONNEXION' , 'Déconnexion');
define('URL_INVALIDE', 'url invalide !');
define('PAGE_INACCESSIBLE', 'page inaccessible!');
define('PROFIL_INACCESSIBLE', 'profil inaccessible!');
...


Nos fichiers correspondant pour les autres langues contiennent exactement la même chose, c'est-à-dire qu'ils ne sont pas encore traduit. Comment mettre en place un système d'administration permettant de les traduire ? Cela permettra ainsi à une personne extérieur (le traducteur) de gérer ces modification sans avoir à allez directement dans le code du fichier php, et sans voir le nom des constantes qui ne le concerne pas.

Ce que nous allons faire consiste donc à lire notre fichier de constantes, faire les traitements pour ne récupérer que le texte des constantes, et par la même occasion les commentaires qui permettrons de se repérer. Ensuite nous affichons un formulaire pour chacune des lignes et un bouton "submit" permettant de les modifier. Voici les 2 fonctions permettant de mettre ce système en place. Commentés comme il se doit.

Tout d'abord la fonction lisant notre fichier (dont le nom sera passé en paramètre), et pour chacune des lignes, créant le formulaire de modification :


function formTraduction($langue='lang_fr')
{
$content='';
//on ouvre le fichier
$monfichier = fopen($langue.'.php', 'r+');
$i=0;
//Pour chacune des ligne parcourus
while($ligne = fgets($monfichier))
{
//suppression des espaces inutiles au cas ou
$ligne=trim($ligne);
//si la ligne n'est pas l'ouverture/fermeture des balises php, ou vide :
if($ligne!='<?php' && $ligne!='?>' && $ligne!='')
{
//on vérifie les 2 premiers caractères
$debut=substr($ligne, 0, 2);
if($debut=='//')
{
//si c'est un commentaire on l'affiche sous forme de titre
$ligne=str_replace('//', '', $ligne);
$content.='<h2>'.$ligne.'</h2>';
}
else
{
//sinon on traite notre ligne par quelque petits bricolages pour ne récupérer que le contenu texte de la constante et pas son nom
$tabligne=explode(',', $ligne, 2);
$tabligne[1]=trim($tabligne[1]);
$tabligne[1]=substr($tabligne[1], 1);
$tabligne[1]=substr($tabligne[1], 0, -3);
$tabligne[1]=stripslashes($tabligne[1]);

//on stoque aussi le nom de la constante

$tabligne[0]=trim($tabligne[0]);
$tabligne[0]=substr($tabligne[0], 8);
$tabligne[0]=trim($tabligne[0]);
$tabligne[0]=substr($tabligne[0], 0, -1);
//on met en place le formulaire permettant de modifier la ligne, ils nous faut garder en champs caché le numéro de la ligne ainsi que le nom de la constante et bien sur celui du fichier
$content.='<form class="trad" action="" method="post">';
$content.='<input type="text" name="texte" value="'.$tabligne[1].'">';
$content.='<input type="hidden" name="langue" value="'.$langue.'">';
$content.='<input type="hidden" name="ligne" value="'.$i.'"&>';
$content.='<input type="hidden" name="nom" value="'.$tabligne[0].'">';
$content.='<input type="submit" name="edittext" value="Ok"&>';
$content.='</form>';
}
}
$i++;
}
//on ferme le fichier
fclose($monfichier);
return $content;
}


maintenant que nos formulaire sont prêt, voici la fonction permettant de le traiter, pour cela nous allons créez un fichier temporaire, copiant chaque ligne de l'autre fichier. Excepté celle que l'on veux modifier. On supprime ensuite l'ancien fichier pour le remplacer par le temporaire que l'on renomme. Le code :


//on attend les données posté par notre formulaire mis en place ci-dessus.
function editLangue($data)
{
extract($data);
$monfichier = fopen($langue.'.php', 'r+');
$monfichier_temp = fopen(temp_'.$langue.'.php', 'a+');
$i=0;
while($parcours = fgets($monfichier))
{
if($i==($ligne))
{
$texte=str_replace("\n", "", $texte);
//si on est sur notre ligne à modifier, on reconstruit la ligne avec le "define" le nom de la constante et son texte.
$newligne="define('".$nom."' , '".$texte."');"."\n";
fputs($monfichier_temp, $newligne);
}
else
{
//sinon on copie simplement la même ligne dans le nouveau fichier
fputs($monfichier_temp, $parcours);
}
$i++;
}
fclose($monfichier);
fclose($monfichier_temp);
unlink($langue.'.php');
rename(temp_'.$langue.'.php', $langue.'.php');
}


voila, avec ces 2 fonctions, il suffit de faire quelque chose de ce type pour pouvoir traduite la langue via une administration basique :


if(isset($_POST["edittext"]))
{
editLangue($_POST);
}
//on appelle la fonction avec le nom du fichier voulu en paramètre
echo formTraduction('lang_fr');


c'est fonctionnel, mais je ne sais pas si les explications sont bien claires... En espérant une nouvelle fois que ça pourra aider certaines personnes.

avec un peu d'astuce et de mise en page on arrive à un aperçu de ce type :

lien direct : http://numa-bord.com/old/leblog/chezneg-leblog.php?id_art=257&titre=Editer-un-fichier-de-constantes-php-via-un-formulaire.
tags : Informatique (68), php (21), editer (1), fichier (1), constante (1), traduction (1), administration (1),


J'aime, 5 personnes aiment çaCommentaire(s)(0)

Processing.js la librairie javascript qui va remplacer Flash

Posté par : Neg le : 2010-12-08 21:22:52



J'ai fais la découverte le mois dernier de la librairie javascript Processing.js. Elle permet ce créer dans la balise canvas (html 5) des animations interactives. D'ou le titre de cet article, cette "library" va sans doute porter à terme un coup au plugin Flash d'Adobe. Les possibilités ne sont pas tout à fait les mêmes mais elle peut se substituer à lui dans beaucoup de cas.

Pour la petite histoire c'est un portage du langage de programmation "Processing" qui était lui en Java (java != javascript). elle est parue dans sa version 1.0 le mois dernier. Pour accéder aux résultats qu'elle permet de réaliser il vous faut un navigateur récent; supportant la balise canvas, (IE9 est compatible).

la librairie est téléchargeable ici elle fait 272 Ko, c'est un peu lourd, mais c'est logique pour de la création graphique. Elle possède une superbe documentation, de très jolis exemple de réalisations. Ainsi qu'un site spécialisé ou l'on peut retrouver des créations et leurs codes sources. Tout pour percer !

A partir de ces aides je vous ai concocté un exemple simple (et partiellement pompé de modèles sur hascanvas.com avec explication du code, voici ma démo (survolez, cliquez) :



comment réaliser cet effet (des plus inutile certes !) :

//on inclus notre librairie
<script type="text/javascript" src="processing.js">
</script>
//on place notre balise canvas, contenant l'appel au fichier d'annimation
<canvas data-processing-sources="monfichier.js"></canvas>

//le code du fichier étant :
declaration des variables principales

float effacement=15;
float i=0;
//ici on définis la teinte du fond d'ecran de base àléatoirement
int fond1=random(0,255);
int fond2=random(0,255);
int fond3=random(0,255);
//quand on clique on change la couleur du fond d'écran aléatoirement
void mousePressed(){
fond1=random(0,255);
fond2=random(0,255);
fond3=random(0,255);
background(fond1,fond2,fond3);
}
//fonction initialisant notre balise canvas
void setup(){
nombre d'images par seconde
frameRate(40);
largeur/hauteur du canvas
size(620,600);
on applique la couleur de fond
background(fond1,fond2,fond3);
}
fonctions appelé à chaque rafraichissement
void draw(){
i+=1;
une fois sur 5
if(i==5)
{
effet d'effacement, on applique la couleur de fond avec une légère opacité
fill(fond1,fond2,fond3, effacement);
sur tout le canvas
rect(0, 0, width, height);
i=0;
on choisie une couleur au hasard
fill(random(0,255),random(0,255),random(0,255),255);
2 points aléatoire dans le canvas
rand1=random(0,width);
rand2=random(0,height);
et on crée un triangle partant de ces point aves ses 2 autres points
triangle(rand1, rand2, rand1+random(20,80), rand2+random(20,80), rand1+random(20,80), rand2+random(20,80));
}
on prend une taille de bordure aléatoire
strokeWeight(random(1,4));
ainsi que sa couleur
stroke(random(0,255),random(0,255),random(0,255),random(0,255));
couleur aléatoire pour le remplissage
fill(random(0,255),random(0,255),random(0,255),255);
une taille aléatoire
end=random(10,50);
et on crée une ellipse aux coordonnées de la souris de couleur et taille aléatoire définis précédemment.
ellipse(mouseX,mouseY,end,end);
}


pouet pouet ! trululu.

les possibilités sont immenses, j'en reparlerais sans doute si le temps me le permet.

lien direct : http://numa-bord.com/old/leblog/chezneg-leblog.php?id_art=253&titre=Processing.js-la-librairie-javascript-qui-va-remplacer-Flash
tags : Informatique (68), javascript (9), processingjs (1),


J'aime, 5 personnes aiment çaCommentaire(s)(2)

Page Suivante

propulsé par Neg