tfeserver : Blog de tfe

Rien d'extraordinaire ici, juste une petite astuce visant à modifier le style d'une page web dynamiquement, sans recharger l'ensemble de la page.

Contexte: une page web ayant au moins un style css du type
<link rel="stylesheet" href="style.css" type="text/css" />

Code pour retirer le style actuel:

var links=document.getElementsByTagName('link');
for (i=0;i<links.length;i++)
{
links[i].parentNode.removeChild(links[i]);
}

Ajouter un style:

var link = document.createElement('link');
link.href='/style.css';
link.type='text/css';link.rel='stylesheet';
document.getElementsByTagName('head')[0].appendChild(link);

Suite au commentaire de kapouik, vous pouvez aussi visiter la page d'exemple.

1 commentaire(s) javascript astuce

À tester:

$ apt-get moo
$ aptitude -vvv moo
$ aptitude -vvvv moo
$ aptitude -vvvvv moo
$ ...

1 commentaire(s) debian

Puisqu'une version est enfin disponible sous linux, je ne vois plus vraiment de raison de naviguer quotidiennement avec firefox.




Certes c'est encore en alpha et il manque des fonctionalitées, mais c'est quand meme autre chose...

1 commentaire(s) web chrome blog

Ça y est, c'est parti! L'aventure peut commencer.
Le site luzlan.fr est ouvert, et peut désormais accueillir les personnes désirant s'inscrire aux tournois.

Pour rappel, la Luzlan Party 2009 est un rassemblement organisé en collaboration avec la mairie de Saint-Jean de Luz, du 24 au 26 Juillet 2009.

Pour de plus amples informations, visitez le site officiel.

2 commentaire(s) luzlan

N'ayant pas trouvé de nouvelles photos de la nouvelle caserne de pompiers d'Hendaye sur Internet, j'ai décidé d'en poster quelques une sur ce Blog.

Donc voici à quoi ressemble le nouveau bâtiment :

0 commentaire(s) pompiers Hendaye

Un petit billet pour présenter un projet que l'on réalise avec quelques amis: l'association lisalan64 va monter une lanparty sur Saint Jean de Luz.
Cette lan sera gratuite et nous y organiserons des tournois de divers jeux tels que:

3 commentaire(s) luzlan party

Je fais partager ici un petit script que j'ai codé pour créer une petite barre de chargement d'un fichier en php/javascript.
Le principe est plutôt simple:

• La page appelle le fichier via xmlhttpRequest

• Le fichier que l'on appelle va se charger de temporiser la sortie, de faire de temps en temps de flush afin de nous informer de l'etat de l'avancée de l'envoie.

• Le script JS va recevoir au fur et à mesure ces données, et montrer l'état d'avancement dans la barre de chargement.

Si le fichier cible n'a pas renseigné l'entête HTTP Content-Length, le script JS avancera de 1% à chaque fragment reçu.

Il ne s'agit bien sûr que d'un exemple de script, dont vous pouvez vous inspirer au besoin. Il est basé sur la librairie javascript prototype, que vous pouvez récuperer sur le site officiel.

Le script:

function creation_barre_chargement( lien)
{
    // Creation du fond grisé
    var back= document.createElement('DIV');
    back.style.position='absolute';
    back.style.top='0px';
    back.style.left='0px';
    back.style.width='100%';
    back.style.height='100%';
    back.style.background='white';
    back.style.opacity='0.8';
    back.style.filter='alpha(opacity=80)';

    // Creation de la barre de chargement
    var div= document.createElement('DIV');
    div.style.position='absolute';
    div.id='barre_chargement';
    div.style.width='40%';
    div.style.marginLeft='30%';
    div.style.marginTop='10%';
    div.style.border="1px solid black";
    div.style.background="#d0d0d0";
    div.style.height='20px';

    // Creation de l'avancement de la barre de chargement
    var p= document.createElement('P');
    p.style.margin='0px';
    p.style.width='0px';
    p.style.padding='0px';
    p.style.borderLeft='1px solid #333';
    p.style.height='100%';
    p.style.background='green';
    p.style.fontWeight='bold';
    p.id='pourcentage_accompli';
    p.style.textAlign='right';

    // Texte de l'avancement de la barre de chargement
    var txt= document.createTextNode('0%');

    // Ajout des elements DOM
    p.appendChild(txt);
    div.appendChild(p);
    back.appendChild(div);
    document.body.appendChild(back);

    // Gestion de la récuperation du fichier
    myAjax=new Ajax.Request( lien.href, {
        method: 'get',
        onInteractive : function(response)
        {
            if(response.getHeader('Content-Length')!='')
            {
                var pourcentage=$('pourcentage_accompli').getWidth()/$('barre_chargement').getWidth()*100;
                pourcentage+=1;
            }
            else
            {
                var pourcentage= myAjax.transport.responseText.length/response.getHeader('Content-Length')*100;
           }
            if(pourcentage>100)
            {
                pourcentage=0;
            }
            $('pourcentage_accompli').style.width=pourcentage+'%';
            $('pourcentage_accompli').firstChild.nodeValue=pourcentage.toFixed(2)+'%';
        },
        onSuccess: function() {
            document.location.href='#'+lien.href;
            document.body.update(myAjax.transport.responseText);
        }
    });
}

Event.observe(window, 'load', function()
{
    $$('.loading_item').each(
        function(item)
        {
            item.onclick= function() { creation_barre_chargement(item); return false; }
        }
    );
});

Un exemple d'appel  est disponible sur cette page: barre de chargement pourcentage en javascript.
Source du fichier test.php:

$html="
blah blah blah
bah blah blah
bah blah blah
blah blah bla
blah blah bla
";

header("Content-Length:".strlen($html));

foreach(preg_split("/[\r\n]/",$html) as $v_text)
{
    print "$v_text\n";
    flush();
    sleep(1);
}

4 commentaire(s) javascript ajax loading dhtml chargement pourcentage barre

Comme vous avez du l'entendre, ce mois-ci a été plutot mouvementé pour le sud-ouest de la France.
La rivière^w^wLe fleuve a coté de chez moi, nommé "Bidasoa" a gentillement debordé, innondant les commerces et ventas.
La maison de mes parents, située au bord de la rivière a été gracieusement épargné.

Au final, cela donnait de jolies paysages:





Cela m'attriste un peu de poster les premières photos de ma région dans de si mauvaises circonstances. Promis d'ici peu, je posterais des photos de l'été basque, plein de pluie^wsoleil.

Vous pouvez retrouver toutes les photos dans la section images.

3 commentaire(s) Blog

0 commentaire(s) design web statistiques

Je cherchais depuis longtemps une manière de fermer les blocks de codes avec vim sans réelement trouver, jusqu'à ce que je ne découvre que cela s'appelle le "folding".
Cette option permets  d'avoir une vision globale du code, sans entrer dans les détails.

Sans Folding

  1 if(1==2=)
  2 {
  3     blahb lah
  4     blahb lah
  5 }

Avec Folding

  1 if(1==2=)
  2 {
  3 +--  2 líneas: blahb lah------------------------
  5 } 

Pour l'astuce donc: il faut activer le mode folding:

:set fdm=indent

Puis pour ouvrir/fermes les blocks, alterne via les touches "zM" (tout fermer), et "zR" (tout ouvrir), "zo" ouvrir le block", "zc" fermer le block.

0 commentaire(s) astuce vim editeur texte