begin process at 2010 02 10 02:23:53
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Divers

 > XSTYLE : STYLE ETENDU

XSTYLE : STYLE ETENDU


 Information sur la source

Note :
7,4 / 10 - par 5 personnes
7,40 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Divers Classé sous :css, style, xs Niveau :Initié Date de création :18/05/2008 Date de mise à jour :25/02/2009 22:54:42 Vu / téléchargé :3 629 / 114
Auteur : foxz

Ecrire un message privé
Site perso
Commentaire sur cette source (84)
Ajouter un commentaire et/ou une note

 Description

xs se substitue au css.
permet de
- passer des functions en tant que style.
- faire de l'héritage
- faire des styles en cascade mais énuméré




 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

18 mai 2008 22:52:48 :
ajout de xsmoz.js
10 juin 2008 18:05:51 :
xsizname() : ne scan que les name="xs" (idée Ceees) xs.xsiz : permet de sous-scanné un object (idée Ceees)
10 juin 2008 18:10:44 :
Ajout : dans xs.js xsizname : ne scan que les names="xs" xs.xsiz : permet de sous-scanner un object fthrd.js "multi-threading" sous FF (semaphore) fobj.js Poo avec possibilité d'appeler les methodes parents par un simple this.inh(...)
10 juin 2008 18:13:28 :
Ajout : dans xs.js xsizname : ne scan que les names="xs" xs.xsiz : permet de sous-scanner un object fthrd.js "multi-threading" sous FF (semaphore) fobj.js Poo avec possibilité d'appeler les méthodes parents par un simple this.inh(...)
25 février 2009 22:54:43 :
nouveau module : class.js

 Sources de la même categorie

Source avec Zip MOOTABLEAU par Miky76
Source avec Zip CALCULER VOTRE IMC par lesnouesremy
CONSOLE DOS par djebbipgm
Source avec Zip PLUGIN JQUERY ARTE: AJOUTER DU TEMPS REEL SUR VOS PAGES WEB par arthurobriot
FAIRE UN FILTRE DES VILLES par scropfi01
Toutes les sources de la catégorie Divers

 Sources en rapport avec celle ci

MODIFIER SES FEUILLES DE STYLES .CSS À LA VOLÉE AVEC JAVASCR... par Phildepantin
DÉTECTER SI CSS EST ACTIVÉ par jdmcreator
Source avec Zip Source avec une capture [MEC] MENUS EN CSS par Bul3
Source avec Zip ZOOM À COULISSE POUR AGRANDIR ET MINIMISER LE CONTENU DE PAR... par abdelaziz_info
Source avec Zip Source avec une capture TRAITEMENT IMMÉDIAT DU CSS [TIC] par bultez

Commentaires et avis

Commentaire de foxz le 18/05/2008 22:41:01

lib à inclure dans vos pages webs :
<script src="Xs.js"></script>
...
il faut mettre en fin de page
<script>
xsiz();
</script>

vous pouvez inclure dans n'importe quel balise la propriété xs
<div xs="...">

pour définir vos propres xstyles
- dans un fichier externe (format .js)
- à l'intérieur de votre fichier dans une clause <script>

pour appeler un style classique (css)
xs.le_nom_de_votre_style="!fontSize:5px";

vous pouvez faire des substitutions (c'est chiant d'écrire backgroundcolor non ?)
xs.bk="!backgroundColor"

vous pouvez maintenant faire :
xs.test="bk:5px solid black";

vous pouvez aussi faire :
xs.coucou="bk:5px solid black;le_nom_de_votre_style;...;..."

l'un des principales atouts du xs, vous pouvez faire :
xs.test=function(c,p){
... c=object
... p=paramètre
}

Nous verons plus tard pour les declarations des styles cascades

Commentaire de lakichemole le 19/05/2008 10:30:30

Un petit exemple?

Commentaire de foxz le 20/05/2008 15:15:21

Oui...

...
<script>
xs.decml=function(c,p){
c.innerHTML=c.innerHTML.replace(/[$]|[§]/ig,"@");
c.innerHTML=c.innerHTML.replace(/[+]|[#]/ig,".");
}
xs.ml=function(c,p){
var r=c.innerHTML;
c.innerHTML="<a href='emailto:"+r+"'>"+r; // merci de verifier cette ligne
};

xs.email="decml;ml;b";

</script>
...
<span xs="email">totor$tata+fr</span> // anti grab email bot
....
<script>
xsiz();
</script>

affichera totor@tata.fr en gras avec un <a href> adéquate.

attention : il n'y a pas (encore) d'optimisation des xstyles
xs.test1="bk:red;bk:blue;bk:yellow";
vous obtiendrez bien un backgroundcolor jaune.
mais chaque style aura été executé (=perte de temps)

Commentaire de ralecul le 21/05/2008 17:28:42

Salut,

C'est vraiment une source qui sort de l'ordinaire !
Pouvoir passer des fonctions en tant que style c'est assez sympa.

Je vois par contre des limitations importantes :
(à vérifier, je n'ai pas regarder tout le code qui est d'ailleurs assez illisible (a,b,d comme nom de variable c'est pas top))

Si tu ajoutes des éléments dans la page après l'appel à xsiz(); que se passe-t-il ?
Je pense qu'ils ne sont pas stylés, à moins d'appeler de nouveau xsiz().
Dans ce cas, as-tu pensé à l'appel multiple à xsiz() (notamment pour les fonctions passées en tant que style) ?

Ya un autre truc que je trouve bizarre :
window["$"]=function(n){return document.getElementById(n);};
Pourquoi as-tu décidé de déclarer cette fonction de cette façon ?
C'est tout à fait correct mais je m'interroge juste sur la raison de l'écrire de cette façon.

@+

Commentaire de lakichemole le 21/05/2008 18:19:27 1/10

Bon impossible de faire marcher l'exemple je me suis retapé toute l'indentation rajouter les ";", j'ai même rajouter des accolades à un "if" donc en attendant un vrai exemple sous forme de page html complète je met une mauvaise note.
Et quand je vois ça:
var f=m.substr(1,99).split("_");
                if(!e[f[0]])
                {
                    e[f[0]]=new Array;
                    e[f[0]][0]=1;
                }
                e[f[0]][f[1]]=p[m];
ça me pique les yeux!

Commentaire de foxz le 21/05/2008 22:16:41

RALECUL :
ahah drôle le pseudo...

il FAUT mettre <script>xsiz()</script> à la ***FIN*** de la page.
cette fonction scan TOUT le DOM.
dans l'avenir pe je vais faire executer xsiz() par le onload du body

windows['$']=function etc...
c'est une astuce que j'ai piqué chez prototypes.org
ca évite d'écrire document.getElementById(...)

sous firefox les balises avec un ID ne sont pas reconnu par javascript de manière implicite (contrairement à IE)
$('balise').innerHTML+="coucou" = document.getElementById('balise').innerHTML+="coucou"

LAKICHEMOLE :
Etonnant que tu n'arrive pas à faire fonctionner l'exemple...
sous FF ca marche farpetement (joint ce meme exemple avec les dorures)

ahah ! intéressant l'exemple du code que tu cite. je donnerais l'explication de son utilité plus tard.

mon but n'est pas d'écrire du code claire (si, si) mais d'écrire du code court.
1/ parce que c'est moins chiant à écrire
2/ ca se télécharge plus vite
3/ ca se hash/parse plus vite par spidermonkey (ca pete hein ?)
4/ la lib a été fait pour être utilisé pas pour être "comprises"

voici l'exemple complet :

<html>
<head>
<script src="Js/Xs.js"></script>
</head>
<body>

voici mon email : <span xs="email">tata$totor+fr</span>

<script>

xs.decml=function(c,p){
c.innerHTML=c.innerHTML.replace(/[$]|[§]/ig,"@");
c.innerHTML=c.innerHTML.replace(/[+]|[#]/ig,".");
}
xs.ml=function(c,p){
var r=c.innerHTML;
c.innerHTML="<a href='mailto:"+r+"'>"+r;
};
xs.email="decml;ml;b";

</script>

<script>xsiz();</script>

</body>
</html>


ps : LAKICHEMOLE : perso je n'aime pas la manière dont tu indente.
pour avoir debuggé bcp de ligne c++ je te garanti que c'est bcp plus lisible si tu met ton accolade ouverte { sur la meme ligne  : if(...){

Commentaire de ralecul le 21/05/2008 23:11:16

Ouais j'en avais ras-le-cul, tous les autres pseudos que j'utilise étaient pris !


Bon sinon, merci pour ta réponse mais je suis pas un nOOb !

Pour la fonction $ tu aurais pu écrire :
function $(id) {
return document.getElementById(id);
}

et non :
window["$"]=function(n){return document.getElementById(n);};

Je me demandais juste quelles étaient tes motivations pour avoir choisi cette deuxième forme.

La réelle critique (que tu as visiblement pas comprise) de ton système est la suivante :
Tu scannes le DOM à la recherche d'élément ayant un attribut "xs" si c'est le cas tu fait ta moulinette dessus et tu ajoutes un style.
(C'est juste une déduction à partir de la façon d'utiliser ton code, je ne l'ai pas regardé en détail).
Donc si tu décides de faire un appel Ajax et d'ajouter du contenu à ta page : (remplir le innerHTML d'un div avec du contenu stylé par exemple), que se passe t-il ?
A mon avis : rien ! Le contenu ajouté ne sera pas stylé, il faudrait faire un appel supplémentaire à xsiz().
D'où ma question : as-tu pensé à l'appel multiple à cette fonction ?
En particulier pour le passage de fonctions en tant que style.

Juste pour la forme : le gain de temps que tu indiques pour parser le code JS est très relatif (de l'ordre de la ms).
La réelle différence est que ton code est impossible à maintenir pour une personne tierce.
Si tu veut garder un coder "optimisé" il existe d'autres solutions.
Tu peut faire une version lisible pour un humain avec des commentaires et des vrais noms de variables.
Et ensuite faire une version compressé plus rapide à télécharger à l'aide de : http://dean.edwards.name/packer/
Il existe pleins d'autres truc dans ce style qui font de l'obfuscation et de la compression.

PS : pour l'indentation j'utilise la même que LAKICHEMOLE et pour moi elle est plus lisible, tu sais c'est juste une question de gout...

Commentaire de foxz le 21/05/2008 23:50:59

voici une fonction intéressante du xs qui a priori n'existe pas en css2.
J'appel ca les cascades énumérées

comme si vous pouviez ecrire ca sous css :
.thin td#1{...} // style pour le 1er TD
      td#2{...} // style pour le 2eme TD etc
puis utiliser la class "thin" dans une balise table.

avec xs c'est un plus plus compliqué et moins sexy.
mais si vous avez une autre idée...

en xs on peut declaré un style sous forme object direct :
xs.test1:{xs:"bk:black"}   // ca equivaux à xs.test1="bk:black"
bien sur le but n'est pas de faire ce genre d'idiotie :-)

voici comment on declare des cascades énumérées
xs.test1={
...
${sous balise}_{index}:"..."
...
}

par exemple
xs.test1={
$TR_1:"bk:red",
$TR_2:"bk:white"
}

(LAKICHEMOLE : c'est ici qu'interviennent les fameuses lignes)

appliqué à un tbody ca alternera des lignes red et white.

si vous voulez maintenant styliser les TD

xs.test2={
$TR_1:{
  $TD_1:"fc:red",
  $TD_2:"fc:blue"
}
}

vous aurez une alternance de cellule avec une couleur d'ecriture (fc) red et blue

!!! ATTENTION !!!
contrairement au css, les cascades énumérées ne fonctionnent que sur les sous balises DIRECT
le style test2 appliquer à la balise table ne donnera rien car la sous balises direct est tbody

attention : sous FF il faut ABSOLUMENT mettre les noms des balises en maj.
$TD_0 plante ! commmercez à 1

voici un exemple fonctionnant sous FF

<html>
<head>
<script src="Js/Xs.js"></script>
</head>
<body>

<table>
<tbody xs="cascade">
<tr><td>1.1<td>2.1<td>3.1
<tr><td>1.2<td>2.2<td>3.2
<tr><td>1.3<td>2.3<td>3.3
<tr><td>1.4<td>2.4<td>3.4
</table>

<script>

xs.cscd1={
$TR_1:{
xs:"bk:yellow",
},
$TR_2:{
xs:"bk:white",
}
}

xs.cscd2={
$TR_1:{
$TD_1:"fc:red",
$TD_2:"fc:blue",
$TD_3:"fc:green"
}
}

xs.cascade="cscd1;cscd2"

</script>

<script>xsiz();</script>
</body>
</html>

Commentaire de foxz le 22/05/2008 00:15:01

RALECUL:
1/ Désolé, je ne connais pas ton skill en js :-))
2/ Je n'ai simplement pas pensé que l'on pouvait ecrire : function $()... :-))

3/ ajax : effectivement... mais on peut appeler la fonction
xs.xstlz(object)
pour scanné tout le DOM descendant de l'object

4/ gain de temps : euh c'etait de l'ironie...
disons que c surtout chiant d'écrire des noms à ralonge.
à l'origine le code était écrit pour mon utilisation personnel...

autre fonction d'xs... on peut stylisé aussi les evenements onmouse* etc...
on peut aussi "localisé" des styles

Commentaire de lakichemole le 22/05/2008 10:35:53

L'exemple marche, j'avais copier le code au lieu de prend les fichiers source.
Le principe me plais sauf qu'il faut parser toute la page et sur une grosse page je sais pas se que ça pourrais donner je pense que faire la même chose coté serveur (php, JSp, ASPX) serait mieux.
C'est dommage que tu n'ais pas pris la peine de soigner un peux mieu la forme (je sais "c'est chiant :) ) mais tu verra que même toi plus tard ça te sera bénéfique de faire des chose compréhensible ( tu boss dans l'informatique??).
D'ailleurs ce site insiste plus sur la forme que sur le fond en général.
Mais l'intention est bonne et je suis sûr que tu feras un effort pour ta prochaine source!! :)

Commentaire de foxz le 22/05/2008 12:28:17

LAKICHEMOLE :
pour la rapidité : spidermonkey est VRAIMENT véloce !
à tester !

le but du css (et d'xs) est justement de ne pas coder les styles en dur.
au contraire ca permet de customiser un max.
j'en suis pas encore à parser du XML mais c une piste à creuser (JE N'AIME PAS LE XML)

Je ne sais pas si tu as remarqué mais la mode d'aujourd'hui c'est de faire faire le max de truc par le client (ca soulage le server pour avoir de la dispo cpu pour bf2)

pour info : je suis responsable projet dans un SSII principalement en delphi et c++.
+10ans et 2 enfants d'expérience, 2 types sous mes ordres.
Js c'est pour mes loisirs.

j'ecris cette lib depuis 2 ou 3 ans (version 5 !!!) de facon discontinue.
je l'agrémente d'autre lib plus ou moins audacieuses
par ex : des styles pour rendre un tableau triable
(le tri des tableaux s'effectue de manière non blocante...)
si tu aime le code abscons je posterais mes lib fthrd et fobj.
respectivement pour faire du "thread" et de l'héritage (du vrai) en js.
aucun commentaire, les tokens en 3 lettres max :-)))
comme tu dis : ca pique les yeux. mais ca wizzzz !

Commentaire de foxz le 22/05/2008 12:40:57

pour styliser un evenement comme onmouseout par ex.

xs.foo={
_onmouseout:function(){...}
}

conjuger à une cascade ca donne un truc interessant.

xs.foo={
$TR_1:{
  $TD_1:{
  _onmouseover:function(){xs.do(this,"bk:red")},
  _onmouseout:function(){xs.do(this,"bk:blue")}
  }
}
}

cela hookera les evenements onmouseover et out de chaque cellule d'un tableau.

je verifie un truc pour les styles localisé et j'ecris le tuto.

Commentaire de foxz le 22/05/2008 12:45:08

on peut aussi ecrire directement :

xs.foo={
$TR_1:{
  $TD_1:{
  _onmouseover:"bk:red",
  _onmouseout:"bk:blue"
  }
}
}

Commentaire de lakichemole le 22/05/2008 17:36:39

Tout à fait d'accord la mode et de faire devenir les client légé d'hier en client semi lourd aujourd'hui.
Mais la mode du web c'est aussi la mode c'est la programmation par block/composant et avec un maximum de configuration par xml.
Le but étant de rendre plus facile la maintenance. L'époque des langage inaccessible et ultrapropriétaire. Aucune gros boite d'info ne veut que si un gars se casse personne ne puisse réutiliser se qu'il a fait!
Et surtout pour faire "wiizer" les appli on utilise des obfuscateurs (comme la si bien dit RALECUL).(Moi même j'en utilisais quand je développais sur téléphone mobile).
Après vu que c'est perso je comprend bien que tu veux pas te prendre la tête (moi perso je prend mon pied à faire des truc jolie).
C'est pas très vendeur je trouve seul ceux qui vont te faire confiance et utiliser ton apli tel quel voudrons l'utiliser.
De plus le js coté client est surtout utiliser pour gérer des évènement client ou dialoguer avec le serveur pas pour faire des traitement en plus de rendu de page, nos page mettent du temps à se charger non pas car le proc du serveur est pas assez puissant (10%  d'util max) mais plutot à cause des requête.
Enfin je suis persuadé que spidermonkey il wiizzz encore plus si on met des ";" à la fin de chaque instruction!
Enfin tout ça c'est mon humble avis!

Commentaire de foxz le 22/05/2008 22:11:30

perso je ne support pas le XML, j'trouve ca moche... j'y peux rien.
je prefere le json et de loin !

quand tu as des pages hébergés chez un mutualisateur (style ovh ou free)
t'es bien contant de justement pas à avoir à sollicité du cpu server DU TOUT !

dans l'avenir
je pense que même certaine requête seront exécuté en locale.
par exemple, l'ensemble d'un catalogue sera dl par XHR (en json ?)
puis des moulinettes tournerons pour mettre tout ca en place.
les filtres, les tri etc seront effectué en locale.

j'écris pas mal de lib dans cette optique.

sm ne demande pas d'avoir un ; apres un }.
c plus compréhensible d'écrire a=a+1 que a++
il faut verifier la norme pour voir.

Commentaire de lakichemole le 23/05/2008 09:09:25

Chacun son truc :)

Commentaire de foxz le 23/05/2008 10:02:46

c'est fou ce que l'on deviens philosophe :-))

Commentaire de lakichemole le 23/05/2008 10:34:27

lol ok à ce moment là je sort ma phrase fétiche qui rythme ma vie:
"La vie n'est qu'une question de priorité" :)

Commentaire de Annadrill le 23/05/2008 22:26:35

Très intéressant comme source!
un tuto ?

Commentaire de foxz le 24/05/2008 05:26:53

tuto... euh, il y a quelque exemple plus haut.
pense tu que je devrais en rajouter avec les sources ?
dis moi ce que tu ne comprend pas je t'expliquerais :-)))

ps
5:25 nan... c pas à l'heure à laquel je me reveil :-))

Commentaire de Annadrill le 24/05/2008 16:03:47

Hi, c'est surtout au niveau de la création des fonction que je pèche un peu,
si t'aurai un ou deux exemple, et j'ai pas compris à quoi sert le fichier XsMoz et Utils, mais une fois que je saurai tout ca, je sens qu'on pourra bien s'amuser...

Commentaire de foxz le 24/05/2008 23:51:51

pour cree une fonction :

xs.nom_de_la_fonction=function(c,p){...}
"c" etant l'object et "p" etant les parametres.

par exemple :

xs.truc=function(c,p){...}
...
<div xs="truc:coucou">
...
xsiz();

Donc lors de l'execution des xs : truc sera appelé avec c=<div ....> et p="coucou"




xsmoz.js declare des xstyles compatible FF

------
bdr: pour declarer un border

brd:size (par defaut 1px),type (par defaut solid),color (par defaut black)

ex:
bdr:,,red    donnera un border:1px solid red


------
pa: pour declarer une position absolue les parametres doivent etre comme
pa:x,y,largeur,longeur
par ex: pa:0,0,10,10

------
al: style en cours de developpement
permettra d'aligner un DIV sur un autre DIV

------
bkop: declare un background transparent les parametres doivent etre comme
bkop:color,opacité%
ex : bkop:red,80

normalement changé l'opacité d'un <div> (ou autre) rend egalement le contenu transparent.
bkop: ne rend QUE le background transparent. le contenue lui ne le sera pas

ma solution miracle est simplement de "cloner" le div et de mettre le clone en Z inférieur.
deplacer le <div> ne deplacera pas le clone. mais je bosserais pour amelioré tout ca.

------
op: declare l'opacité parametre op:opacité%
le but de cette function est uniquement d'uniformisé la declaration d'un op entre IE et FF
par ex
op:80
------


sous FF et opera (merci de verifer sous IE)

<div style="position:absolute;left:0;top:0;width:100;height:100;border:10px solid black;background-Color:blue">
test css
</div>
<div style="position:absolute;left:0;top:0;width:100;height:100;border:1px solid black;background-Color:blue">
test css
</div>

les 2 div ne se recouvrent pas (à cause du border)

en xs
<div xs="pa:0,0,100,100;bdr:10px"></div>
<div xs="pa:0,0,100,100;bdr"></div>
les 2 div se recouvrent.

pour moi le positionnement ne doit pas tenir compte du border.
donc le fonction "pa" et "bdr" on été modifier à cet effet.

-----
j'utilise qq fonction de la lib utils.js dans les xs.
val(v) retourne la valeur numerique d'une chaine
comme parseInt sauf que val return 0 si la chaine ne contient pas de valeur num

j'expliquerais les autres fonctions plus tard...

Commentaire de Annadrill le 25/05/2008 11:17:19

Super, déjà merci pour cette réponse, je reviendrai pour les prochaines fonctions;-)

Commentaire de Annadrill le 25/05/2008 11:43:21 9/10

rien que pour le coté inventif et pour faire pancher la balance, je mets une note

Commentaire de foxz le 25/05/2008 14:14:37

annadrill : euh. le but c'est que tu invente tes propres fonctions :-)))
par exemple, je bosse sur un xs qui permet de rendre un tableau triable (de maniere non bloquante : c'est à que le tri n'empêche pas de scroller ou de remplir un input etc)

on peut voir un exemple sur http://foxz.free.fr/tritable.html
(je bosse actuellement dessus donc si ca plante c normal :-))

Commentaire de Annadrill le 25/05/2008 18:50:26

je faisais juste réf à ta phrase :
j'expliquerais les autres fonctions plus tard...

Commentaire de foxz le 27/05/2008 12:53:56

Ah ok.

dans XS il y a aussi des fonctions (par defaut)

_____
xs.js = declaration en object pour js (FF) c'est l'equivalent d'un ID et d'une declaration explicite.

____
xs.mg = declaration de marge avec repetition des arguments
xs="mg:5" donne une declaration de marge telque padding 5px 5px 5px 5px
xs="mg:1,5" donne une declaration de marge telque padding 1px 5px 1px 5px

____
xs.css = declaration d'un classname

____
voici les alias :

xs.bk="!backgroundColor";
xs.vs="!visibility:show";
xs.vh="!visibility:hidden";
xs.u="!textdecoration:underline"
xs.b="!fontWeight:bold"
xs.fs="!fontSize";
xs.z="!zIndex";
xs.fc="!color";
xs.of="!overflow:auto";
xs.ctr="!textAlign:center";
xs.rgt="!textAlign:right";
xs.lft="!textAlign:left";
xs.w="!width";
xs.h="!height";

xs="fs:5px" donnera un style fontSize:5px
c'est juste moins chiant à ecrire.

etc

Commentaire de lakichemole le 27/05/2008 14:07:25

C'est marrant car tu vois avec un code claire et un obfuscateur (pour que ça "wiizz") tu n'aurais pas eu besoin de tous ces renseignements/aide et les gens auraient compris d'eux même ils aurait eu envie de participer a ton code de le faire vivre... bref les conceptes du web 2.0!

Commentaire de Annadrill le 27/05/2008 14:38:01

[...]

Merci bien,
et vive l'évolution

Commentaire de lakichemole le 27/05/2008 14:41:42

Je parlais a FOXZ hein?!

Commentaire de Annadrill le 27/05/2008 15:21:47

surement mais je répond quand même hihi

Commentaire de foxz le 27/05/2008 23:55:53

Lakichemole : ??? il y a confusion sur la signification du mot "wizzz".
et je ne "obfusce" pas mon code.
je m'interesse au fond + qu'a la forme (comme en poesie)
XS aura la vie qu'il aura dans l'etat dans lequel il est.
libre à toi (et aux autres) de s'arreter à la forme...

Commentaire de lakichemole le 28/05/2008 09:32:17

Bien évidement que je m'arrête à la forme et c'est bien dommage car le fond paraissait bon!
Car pour aller au fond des chose j'ai besoin de bien comprendre se que je fait et que se soit claire je ne vais pas utiliser un code que je ne maitrise pas mais libre aux autre de l'utiliser!

Commentaire de foxz le 29/05/2008 01:50:38

cqfd

Commentaire de foxz le 29/05/2008 03:22:56

Bon à la fois ne code n'est pas vraiment difficile à comprendre...

Commentaire de foxz le 03/06/2008 05:50:52

xs.triable est sur le point d'etre fini.
j'ouvre un source à part ou je l'ajout au source ici ?
sachant que 2 autres libs assez complex font leurs apparitions.

Commentaire de Annadrill le 03/06/2008 09:56:20

Je me dis que tu peux l'ajouter ici, mais peut importe ce que tu fais, je dois rester au courant... ;-))

Commentaire de MrYo le 03/06/2008 16:26:23 10/10

WIiii c genial comme truc !!!

encore ! encore !

jm'inscrit rien que pour suivre le truc.

Commentaire de foxz le 03/06/2008 17:35:57

Annadrill : j'ai peur que ca alourdisse encore + le forum :-)
bon, de toute manière j'ai un plantage assez chiant (je ne le comprend pas en gros :-))
sur xs.triable

Mryo : c'est à dire ?

Mon pote CeeeS vas nous rejoindre sur le forum (pour que tout le monde en profite) car il a de bonne idee...

Commentaire de CeeeS le 03/06/2008 22:12:04 8/10

voui, voui...
donc mon idee est de passer par getElementsByName pour accelerer les XS.
ca donnerait un truc comme

<div name="xs" xs="...">

ainsi on ne scan pas tout le DOM.

bon, je me colle le beta test de xs.triable...
je suis pas sur que le "fthrd" soit vraiment utile.
il faudrait ainsi pouvoir multi-trier

lakichemole: Meuh ! :-)

syl

Commentaire de foxz le 04/06/2008 00:54:06

Ceees : Bonne idée.
je fais un fork xsizname

multi-tri : est-ce vraiment utile ?
fthrd : à tester sous IE...

Bonne Nouvelle : xs.triable est retabli...
je propose de faire une release sans multi-tri et de le poster ici.

Commentaire de MrYo le 05/06/2008 15:19:14

ca fai koi triable.html sur ton site ?

Commentaire de lakichemole le 05/06/2008 15:39:05

Utilisé la balise name implique qu'on ne l'utilise pas dans le site c'est moins lourd c'est sur mais c'est super contraignant, celui qui a déjà un site de fait va galérer si il utilise la balise name :/

Commentaire de foxz le 06/06/2008 07:52:37

Mryo : tritable.html est une demo de xs.triable.
<table><tbody><th xs="triable">1<th>2 etc...
le xstyle triable rajout un "marker" si on clique sur le marqueur le tableau se trie.
je ferais une explication plus exhaustive plus tard.

Lakichemole : oui, ca peut etre chiant pour l'utilisation des forms...
xsiz() scannera tout le DOM
xsizname() scannera que les names "xs"
modif ce we

Commentaire de CeeeS le 08/06/2008 01:53:29

et en passant par getElementsByClassName ???

Commentaire de foxz le 10/06/2008 07:27:05

ca ne marche pas encore sous FF 2.04.
je ne sais pas sous IE.

Commentaire de CeeeS le 10/06/2008 13:08:23

pe faire un mixte avec une balise xs special pour sous-scanne :
<div name="xs" xs="...;xsiz;..."></div>

Commentaire de foxz le 10/06/2008 18:00:56

Bonne idée.

Commentaire de foxz le 10/06/2008 18:17:28

avec un peu de difficulté...
j'ai remis les sources a jour et j'ai rajouté des libs supplémentaire.

Commentaire de CeeeS le 11/06/2008 18:14:38

Dans la famille tordu je voudrais fobj.js

Commentaire de MrYo le 15/06/2008 21:01:18

Zetes mort ?

Commentaire de foxz le 17/06/2008 10:41:00

On bosse en silence..

Commentaire de CeeeS le 18/06/2008 20:06:39

Le projet est en sommeil pour le moment.
On bosse un peu sur jslibs.

Commentaire de Annadrill le 19/06/2008 22:41:16

Hello,
ce serait super s'il était possible d'ajouter des explications et exemples directement dans les sources.
sinon c'est gandiose.

salut

Commentaire de foxz le 19/06/2008 23:08:26

Je pense plutôt faire une demo dans un HTML à part.
Il y a deja pas mal d'explication plus haut...
bon, je suis charette en ce moment...

Commentaire de lakichemole le 20/06/2008 09:14:48

Mais non pourquoi des explication ça sert a rien, le but c'est que ça wizz et qu'on le développe dans son coin tout seul vive le closed source!

Commentaire de Annadrill le 20/06/2008 16:47:44

LAKICHEMOLE: on est pas tous des pros, alors cela fait plaisir lorsqu'on a un peu d'aide pour avancer... ;-)

FOXZ: j'attends la démo alors, merci

Commentaire de lakichemole le 20/06/2008 16:49:49

Oui désolé je me suis emballé

Commentaire de Annadrill le 20/06/2008 17:26:59

Je comprends ;-)

Commentaire de foxz le 20/06/2008 21:24:12

lakichemole: il y a aucun volonté de ma part de cacher quoi que ce soit du fonctionnement.
mmmrrhhh... bon je révérai à commenter le code à l'occasion de la prochaine refonte

annadrill : as-tu essaye de joueur un peu avec ?
pour la demo : faudra etre patient les vacances approchent...

Commentaire de CeeeS le 21/06/2008 15:07:49

je sens notre lakichemole un peu amere.

Commentaire de foxz le 21/06/2008 17:47:11

Beh c'est difficile d'être constructif

Commentaire de CeeeS le 21/06/2008 23:09:08

La par exemple ;-)

Commentaire de foxz le 10/12/2008 13:12:27

Je bosse sur un projet concurrent à XS.
Il s'agit d'un builder entièrement en js qui permet d'editer les pages directement (sous FF).
A priori XS restera en l'etat.

merci à free qui m'a effacé mon espace web sans raison

Commentaire de Annadrill le 11/12/2008 09:37:22

oui oui, mdr, bon pas depuis un petit moment parce que les fêtes c'est surtout sinonyme de boulot.... mais je m'y remettrai ;-)

salut

Commentaire de foxz le 11/12/2008 11:51:01

Ce qui est amusant c'est que je suis en train d'utiliser XS pour un projet professionnel...
donc je l'améliore au fil...

Commentaire de lakichemole le 11/12/2008 15:00:48

Marche pas sous IE6 à priori ? Voilà mon code de page (index.html dans le même dossier que les .js, pas de problème sous FF):
<html>
<body>

<script src="Xs.js"></script>

<script>
xs.decml=function(c,p){
c.innerHTML=c.innerHTML.replace(/[$]|[§]/ig,"@");
c.innerHTML=c.innerHTML.replace(/[+]|[#]/ig,".");
}
xs.ml=function(c,p){
var r=c.innerHTML;
c.innerHTML="<a href='emailto:"+r+"'>"+r; // merci de verifier cette ligne
};

xs.email="decml;ml;b";

</script>
<span xs="email">totor$tata+fr</span>

<script>
xsiz();
</script>

</body>
</html>

Commentaire de gigamaster le 27/01/2009 12:38:49 9/10

Très intéressant ^^

Commentaire de foxz le 28/01/2009 00:02:33

Merci pour la note :-))
... j'ai fixé le bug sous IE... nouvelle version d'ici peu...


Commentaire de foxz le 25/02/2009 01:44:17

class.js va remplacer fobj.js
fthrd.js est en reecriture
et ceees a chopper une rhinomozillate :-)

Commentaire de gigamaster le 25/02/2009 17:32:31

Merci! J'attends avec impatience de pouvoir tester ces nouvelles possibilités avec le CMS XOOPS Cube Legacy ^^

Commentaire de Kimjoa le 26/02/2009 01:18:39

salut foxz j'ai testé class.js et j'ai kelke remarque.

tu as dut oublier de 'binder' les appels au fonction , pour ça j'ai ajouter
var ovr=function(){
   ...
   inh.instance=this;  
   ...
}
et

function inh(){inh.current.apply(inh.instance,arguments);}

sinon y'a un problème avec l'appel des constructeurs , en effets le mot constructor est réservé en js , du coups quand on boucle sur un prototype on retrouve pas se mot, pour ça j ai rajouté dans t'as boucle d'arguments:

klass.prototype.constructor=_papa.prototype.constructor;

conernant le polymorphisme j'ai créé cette fonction simple

function instanceOf(source,cible){
  var superclass=typeof source=='function'?
   source.prototype.constructor.superclass
  :source.constructor.superclass;
  for(var i=0,length=superclass.length;i<length;i++){
     if(superclass[i]==cible || instanceOf(superclass[i],cible))
        return true;
  }
  return false;
}

et a la fin de $class klass.prototype.constructor.superclass=Array.prototype.slice.call(arguments,1);

voilà , bon du coup je sais plus lequel choisir comme script d'heritage :) , sinon j'ai fait un autre script mais plus orienté vers l'héritage d'instance, ->
http://www.javascriptfr.com/codes/KERNEL-JS-HERITAGE-MULTIPLE-POLYMORPHISME_48948.aspx si tu y a pas déjà été ;)

a++

Commentaire de foxz le 26/02/2009 15:49:09

d'une maniere generale on n'override jamais un constructor en cas de multiclass...
donc il faut appeler les constructor de maniere directe :

var u=$class(
{
constructor:function(){t.prototype.constructor(param);
}, t);

en c++ les constructor multiclass sont appeler automatiquement SI il ne possede pas de parametre...
mais comme on ne peux pas le savoir en JS...

je jete un coup d'oeil sur ton url la :-))

choix : choisie celle que tu trouve le plus élégante.

Giganews : j'ai la vague impression que tu fais de la pub.
je te signale au 6op... si tu etais de bonne foi je te prie de me pardonner...

Commentaire de foxz le 26/02/2009 16:00:41

http://www.javascriptfr.com/codes/KERNEL-JS-HERITAGE-MULTIPLE-POLYMORPHISME_48948.aspx...

euh... je me suis inspiré de cette lib pour faire mon class.js
d'ailleur je mentionne son nom dans le source...

A vrai dire je pensais que tu (kimjoa) etais l'autre de cette lib :-))

Commentaire de gigamaster le 26/02/2009 17:11:26

@FOXZ

Hummm... Je peux comprendre ta peur de l'inconnu ^^

Le seul souci de faire savoir où serait utilisé ta
contribution pose problème..

Pourtant le partage de savoirs, les contributions
dans son temps libre sont bien le propre de l'esprit
open source. Et sans faire davantage de pub, il n'y
en a pas, c'est un des environnements des plus "clean"

Dit le proverbe :
"L'enfer est pavimenté de bonnes intentions"
Et personne ne sait où conduit le chemin.
Un simple clique aurait suffit a vérifier.

Merci tout de même du partage (^^)

Commentaire de lakichemole le 26/02/2009 18:01:02

"pavimenté" je connaissais pas :) Je connaissais pas le CMS XOOPS il a l'air pas mal :) Et je pense que la pub pour de l'open source ne peut pas faire de mal?

Commentaire de Kimjoa le 26/02/2009 19:34:36

oui , foxz , c'est bien moi l'auteur ;) , des 2 ...

je savais pas pour les constructeurs ...

a++

Commentaire de gigamaster le 26/02/2009 20:16:21

@lakichemole

pavé = pavimento = italiano ^^'

Merci

Commentaire de foxz le 26/02/2009 20:38:01

giganews : toutes mes excuses... le net est rempli de pollueur...
ton message m'a semblé decalé... j'ai donc pensé à de la pub, pour la pub. (genre : je pretexte l'utilisation de la lib pour mettre le projet xoops, mais en fait je n'utilise pas du tout la lib...)

lakichemole : la pub ne me gene pas en soit, je vend du rhino à tout vas (zut encore une fois) ce qui me gene c'est la pollution...

kimjoa : si tu veux on reflechi à une lib commune...

Commentaire de Kimjoa le 26/02/2009 21:53:44

ok foxz, je suis en train de faire ma librairie ki s'intitulera id.js , pour interface dynamique , le module dynamic est preske fini je le sortirait demain ou dans 2 jours, pour ce qui est d'interface j'ai encore pas mal de taff. Si ça intéresse , je peux te passer les sources, enfin pas tout de suite car faut que je refasse la base. En faite si j'ai fait class.js et kernel.js c'était pour cette librairie .
J'ai posté deux module d'interface http://www.javascriptfr.com/codes/INTERFACE-BUTTON-2EME-ELEMENT-LIBRAIRIE-INTERFACE_49014.aspx  et http://javascriptfr.com/codes/INTERFACE-CAPSULE-BOITES-ARRONDIS-1ER-ELEMENTS-BIBLIOTHEQUE-INTERFACE_48968.aspx , si tu veux voire à peux près le fonctionnement,  mais vais le refaire aussi :).

Si tu as un projet autre que l'on pourrais faire ensemble , je suis ouvert à toute proposition ...

a++

Commentaire de Kimjoa le 26/02/2009 22:03:59

les testes pas sous linux , y'a un problème avec les nom de dossier, je sais pas pk ,mais il aime pas les fichier nommé Interface et kernel ... bizarre .

Commentaire de foxz le 26/02/2009 22:21:56

je ne bosse plus trop web en ce moment (en pro)
pour ton projet d'interface button (je n'ai pas encore regarder de pres) mais je pense que le projet xstyl est assez bien adapter...
tu pourrais par exemple cree un style :

xs.arrondi="....";
...
<div xs="arrondi"></div>
...

bon... mais je pense qu'on devrait continuer par email ;-)

Commentaire de foxz le 26/02/2009 22:35:48

nux tiens compte de min/maj dans les nom de fichier...

Commentaire de Kimjoa le 26/02/2009 23:35:17

ok merci!

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Changer de feuille de style CSS pour netscape [ par ericepbc ] Bonjour,Mon site tourne sous Ie mais sous netscape certains tableaux ne se positionnent pas au bon endroit.La position des tableaux est définie en abs iframe et css [ par kaskran ] Est ce que l'on peut inserer ( et donc utiliser) une feuille de style dans une IFrame ????car la j'ai un soucis explorer ne veut pas l'utiliser mon st Feuille de style [ par crazycode ] bonjour à tous !!J'ai un probleme avec mes CSS.j'ai fais un tableau et j'ai utiliser des CSS pour faire des cadre. Tout va bien mais quand je veux imp Changer le style css [ par djagger ] Salut !J'ai cr&#233;&#233; un menu en javascript avec une feuille de style pour les menus, sous-menus etc ...en gros :&lt;table&gt;&lt;tr&gt;&nbsp;&nb feuille de style en Css et formulaires. Comment ça marche? exemples si possible.. merci. [ par maxpat ] Bonjour &#224; tous, Travaillant sous Nvu, j'ai cr&#233;&#233; une feuille de style en Css. Comment faire un formulaire avec une feuille de style? Me CSS dans une iframe [ par le_binr ] Bonjour,Je suis en train de créer un site internet dynamique avec un petit wysiwyg permettant de mieu gérer le texte pour un novice.Grâce à la command Javascript, CSS - style switcher avec les cadres [ par lataupe78 ] Mes hommages, ç'est mon 1er post et ç'est une question assez tarabiscotée:Je débute et je suis en train de créer mon site perso sous IE en html,CSS et Feuille de style [ par Jossdoit ] Bonjour,Je developpe actuellement un site web et j'utilise du CSS. Je trouve ca bien sympas mais je voulais savoir si il etait possible d'utiliser le Changement de style CSS [ par Antronarch ] bonjour, J'ai un petit soucis avec une feuille de style et mon php. Le probleme est simple, dans mon haut.php qui contient tout le code du début de p Chnager une classe CSS [ par MadMax1024 ] Bonjour à tous,Ma question sera simple du moins je l'espère.Je suis en train de créer un site Web dans lequel j'ai crée une feuille de style CSS.Celle


Nos sponsors


Sondage...

Comparez les prix


iPod touch 8Go - 2ème génération
Entre 189€ et 224€

Visiter le guide achat

CalendriCode

Février 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728

Consulter la suite du CalendriCode
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,827 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)