Staces.js

En construction

• s

  Paramètres : string [, boolean = false]
  Retourne : html element / array[html elements]

  Sélectionne le.s élément.s HTML.
  Le boolean force le format en tableau.

  s('p.exemple');
// p

s('p.exemple', true);
// [p]

s('p.exemple').s('a');
// [a, a]
  • simple
  • half
  • full

• sGetId

  Retourne : string

  Retourne l'id de l'élément HTML en chaîne de caractère.

  s('p#exemple').sGetId();
sGetId('p#exemple');
// exemple
  • simple
  • half
  • full

• sGetClass

  Retourne : string

  Retourne les classes de l'élément HTML en chaîne de caractère.

  s('p.exemple').sGetClass();
sGetClass('p.exemple');
// exemple
  • simple
  • half
  • full

• sGenerateAlphabets

  Paramètres : [boolean = false]
  Retourne : array / string

  Retourne un tableau de toutes les lettres de l'alphabets.
  Le boolean permet de retourner une chaîne de caractère de toutes les lettres de l'alphabet.

  • simple
  • half
  • full

• sNumerics

  Paramètres : [boolean = false]
  Retourne : array / string

  Retourne un tableau de tous les chiffres.
  Le boolean permet de retourner une chaîne de caractère de tous les chiffres.

  • simple
  • half
  • full

• sSymbols

  Paramètres : [boolean = false]
  Retourne : array / string

  Retourne un tableau de tous les symboles.
  Le boolean permet de retourner une chaîne de caractère de tous les symboles.

  • simple
  • half
  • full

• getRegPhone

  Retourne : regex

  Retourne une expression régulière (RegEx) d'un format de numéro de téléphone.

  • simple
  • half
  • full

• getRegMail

  Retourne : regex

  Retourne une expression régulière (RegEx) d'un format de adresse mail.

  • simple
  • half
  • full

• getRegWebsite

  Retourne : regex

  Retourne une expression régulière (RegEx) d'un format de site internet.

  • simple
  • half
  • full

• sLog

  Paramètres : string
  

  Affiche un message dans la console.

  sLog('Coucou');
// Coucou
  • simple
  • half
  • full

• isEmpty

  Retourne : boolean

  Vérifie si la chaîne de caractère ou tableau est vide.

  var array = [];
array.isEmpty();
// true

var array = ["pomme", "banane"];
array.isEmpty();
// false
  • simple
  • half
  • full

• isRange

  Paramètres : [number = 0 [, number = 1]]
  Retourne : number

  Vérifie si le nombre est entre les deux nombres entrés en paramètre. Retourne le nombre corrigé.

  var n = 5;
n.isRange(0, 10);
// 5

n.isRange();
// 1
  • simple
  • half
  • full

• isIntoGalleryRange

  Paramètres : array
  Retourne : number

  Vérifie si le nombre est entre zéro et la taille maximale de la galerie. Retourne le nombre corrigé.

  var gallery = ["pomme", "banane", "fraise"];
var n = 1;
n.isIntoGalleryRange(gallery);
// 1

n = n + 5;
n.isIntoGalleryRange(gallery);
// 0 => Revient au début de la galerie.
  • simple
  • half
  • full

• isFloat

  Paramètres : number
  Retourne : boolean

  Vérifie si le nombre est un numérau décimal.

  var n = 1;
isFloat(n);
// false

var n = 1.45;
isFloat(n);
// true
  • simple
  • half
  • full

• isJson

  Retourne : boolean

  Vérifie si la chaîne de caractère est un JSON.

  var json = {"name": "Cedric"};
json.isJson();
// true

var string = "Cedric";
string.isJson();
// false
  • simple
  • half
  • full

• hasProp

  Paramètres : string
  Retourne : boolean

  Vérifie si l'objet possède la propriété spécifié en paramètre.

  var json = {"name": "Cedric"};
json.hasProp("name");
// true

json.hasProp("age");
// false
  • simple
  • half
  • full

• isNotNull

  Retourne : boolean

  Vérifie si l'élément HTML n'est pas null ou si le tableau n'est pas vide.

  var element = null;
element.isNotNull();
// false


  • simple
  • half
  • full

• isPhone

  Retourne : boolean

  Vérifie si le numéro de téléphone en chaîne de caractère est conforme par rapport au RegEx encodé [getRegPhone()].

  • simple
  • half
  • full

• isMail

  Retourne : boolean

  Vérifie si l'adresse mail en chaîne de caractère est conforme par rapport au RegEx encodé [getRegMail()].

  • simple
  • half
  • full

• isWebsite

  Retourne : boolean

  Vérifie si le site internet en chaîne de caractère est conforme par rapport au RegEx encodé [getRegWebsite()].

  • simple
  • half
  • full

• isMobile

  Retourne : boolean

  Vérifie si le navigateur utilisé par l'internaute est un téléphone.

  • simple
  • half
  • full

• isMobileAndTablet

  Retourne : boolean

  Vérifie si le navigateur utilisé par l'internaute est un téléphone ou une tablette.

  • simple
  • half
  • full

• sHasId

  Paramètres : string
  Retourne : boolean

  Vérifie si l'élément HTML possède l'ID spécifié en paramètre.

  • simple
  • half
  • full

• sHasClass

  Paramètres : string
  Retourne : boolean

  Vérifie si l'élément HTML possède la classe spécifié en paramètre.

  • simple
  • half
  • full

• sAddClass

  Paramètres : string
  

  Ajoute une ou plusieurs classes aux éléments HTML, seulement s'ils ne la/les possèdent pas. Chaque classe en paramètre doive être séparée d'un espace.

  // p#exemple.moche
s("p#exemple").sAddClass("moi moche mechant");
// p#exemple.moche.moi.mechant
  • simple
  • half
  • full

• sRemoveClass

  Paramètres : string
  

  Supprime une ou plusieurs classes aux éléments HTML, seulement s'ils ne la/les possèdent pas. Chaque classe en paramètre doive être séparée d'un espace.

  // p#exemple.moche.mechant
s("p#exemple").sRemoveClass("moi moche mechant");
// p#exemple
  • simple
  • half
  • full

• sReplaceClass

  Paramètres : string, string
  

  Remplace une classe aux éléments HTML, s'il ne possède pas la classe à remplacé, la fonction ajoutera simplement la nouvelle.

  // p#exemple.moi.moche
s("p#exemple").sReplaceClass("moche", "mechant");
// p#exemple.moi.mechant
  • simple
  • half
  • full

• sToggleClass

  Paramètres : string
  

  Ajoute ou supprime une classe aux éléments HTML, cela dépend s'il possède ou non la classe en question.

  // p#exemple.moi
s("p#exemple").sToggleClass("moi");
// p#exemple
  • simple
  • half
  • full

• sAttr

  Paramètres : string [, string = ""]
  Retourne : string

  Retourne la valeur de l'attribut des éléments HTML si le deuxième paramètre n'est pas entré, sinon il modifie sa valeur et retourne la valeur finale.

  // p[data-attr="Saturne"]
s("p").sAttr("data-attr");
// Saturne

s("p").sAttr("data-attr", "Jupiter");
// Jupiter


  • simple
  • half
  • full

• sChild

  Paramètres : [string = ""]
  Retourne : array

  Retourne un tableau d'élément HTML directement enfant de votre autre élément HTML. Si vous spécifiez un nom de classe en paramètre, le tableau sera composé uniquement des enfants directs possédant cette classe.

  // div > p.moi + p + p.moi
s("div").sChild("moi");
// [p.moi, p.moi]
  • simple
  • half
  • full

• sHasChild

  Retourne : boolean

  Retourne vrai ou faux si l'élément HTML possède un ou plusieurs enfants.

  // div > p + p
s("div").sHasChild();
// true
  • simple
  • half
  • full

• sGetChild

  Paramètres : number [, string = ""]
  Retourne : HTML Element

  Retourne un élément HTML enfant direct et qui se trouve à l'index indiqué en paramètre. Si vous ajoutez une classe dans le deuxième paramètre, il retournera l'enfant uniquement s'il possède la classe en question.

  // div > p + p.moi
s("div").sGetChild(1, "moi");
// p.moi
  • simple
  • half
  • full

• sEvent

  Paramètres : action , callback [, options = false]
  

  Ajoute un écouteur d'événement à un ou plusieurs éléments HTML.

  s("div").sEvent("click", function(){});
sEvent("load", function(){});
s("input").sEvent("change", function(){});
  • simple
  • half
  • full

• sLoad

  Paramètres : callback [, options = false]
  

  Ajoute l'écouteur d'événement chargement au document.

  sLoad(function(){});
  • simple
  • half
  • full

• sRemoveEvent

  Paramètres : action , callback [, options = false]
  

  Supprimer l'écouteur d'événement à un ou plusieurs éléments HTML.

  s("div").sRemoveEvent("click", function(){});
s("body").sRemoveEvent("load", function(){});
  • simple
  • half
  • full

• sClick

  Paramètres : callback [, options = false]
  

  Ajoute l'écouteur d'événement clique à un ou plusieurs éléments HTML.

  s("div").sClick(function(){});
  • simple
  • half
  • full

• sCss

  Paramètres : attribute [, value = null]
  

  Retourne la valeur d'une règle CSS si la valeur est null, sinon ajoute un règle CSS à un ou plusieurs élément HTML.

  s("p").sCss("color");
// #000
s("p").sCss("color", "#fff");
// #fff
  • simple
  • half
  • full

• sScrollSmooth

  Paramètres : [duration = 1000, stopDistance = 100]
  

  Au clique d'un ou plusieurs élément HTML, la page défilera jusque l'élément HTML spécifié dans l'attribut href ou data-href
  La durée représente la vitesse du défilement et la distance représente la distance entre le haut de la page et le haut de l'élément HTML.

  s("a[href='#ancre']").sScrollSmooth();
s("p[data-href='#ancre']").sScrollSmooth();
  • simple
  • half
  • full

• sAnimOpacity

  Paramètres : {from = 0, to = 1, speed = 1}, callback
  

  Change progressivement l'opacité d'un ou plusieurs éléments HTML. Une fois terminé, la fonction callback est appelée.

  s("img").sAnimOpacity({ from: 0, to: .75 }, function(){});
  • half
  • full

• sValueToPercentage

  Paramètres : [max = 100, min = 0]
  Retourne : number

  Converti un nombre en pourcentage en fonction du chiffre maximum et minimum entré.

  var n = 10;
n.sValueToPercentage(20);
// 50
n.sValueToPercentage(40);
// 25
  • half
  • full

• sPercentageToValue

  Paramètres : [max = 100, min = 0]
  Retourne : number

  Converti un pourcentage en un nombre en fonction du chiffre maximum et minimum entré.

  var p = 50;
p.sPercentageToValue(20);
// 10
p.sPercentageToValue(40);
// 20
  • half
  • full

• sReduceWithPercentage

  Paramètres : percentage
  Retourne : number

  Réduction en pourcentage d'un nombre.

  var n = 30;
n.sReduceWithPercentage(50);
// 15
n.sReduceWithPercentage(10);
// 27
  • half
  • full

• sGetScreenCordinates

  Retourne : JSON Object

  Retourne la position x et y de l'élément HTML.

  s("p#exemple").sGetScreenCordinates();
// { x: 10, y: 580 }

  • half
  • full

• sAutoTyped

  Paramètres : { strings, speed = 10, waiting = 20 }
  

  Affiche la liste de texte envoyé en paramètre [strings] successivement dans le contenu de l'élément HTML. En prenant compte du temps d'attente et de la vitesse d'affichage aussi spécifié en paramètre.

  s("p#exemple").sAutoTyped(
{
strings: ["Bonjour", "Au revoir", "Bonne nuit"]
}
);
  • full

• Timer

  Paramètres : callback, [time = 1000]
  

  Fonction qui crée une boucle artificielle. Peut être stoppé, démarré ou réinitialisé. Le temps est compté en milliseconde.

  var timer = new Timer(function(){ console.log('Coucou !'); }, 1000);
// "Coucou !" // Affiché toutes les secondes.
  • simple
  • half
  • full

• sInsert

  Paramètres : position, string
  

  Insère un texte en format HTML dans un autre élément HTML en fonction de la position donnée.
  "before", "after", "inbefore", "inafter"

  s("p#exemple").sInsert("inbefore", "span Pamplemousse span")
// p#exemple > span{Pamplemousse}
  • half
  • full

• sCopyToClipboard

  Paramètres : string
  

  Copie dans le presse-papier le texte passer en paramètre ou en parent.

  "Je suis héro".sCopyToClipboard();
sCopyToClipboard("Je suis héro");
  • half
  • full

• sRandom

  Paramètres : [min = 0, max = 1]
  Retourne : number

  Retourne un nombre entre le nombre minimum et maximum entrés en paramètre.

  sRandom(0, 25);
// 14
  • half
  • full

• sModel

  Paramètres : HTML Elements
  

  Dès que vous tapez une lettre dans le champs texte, il affiche son contenu dans les éléments HTML spécifiés en paramètre.

  s("input[type='text']").sModel(s("p.exemple"));
// input[value='coucou']
// p.exemple{coucou}
// p.exemple{coucou}
  • full

• sFilter

  Paramètres : {string, INPUT HTML ELEMENT, boolean = false}, callback = {}
  

  Lorsque vous tapez un texte dans le champs texte, il affichera ou masquera les éléments qui ne sont pas pris en compte par le dit texte. Le boolean permet de ne pas prendre en compte les symboles tapés ou le contraire. Une fois le filtre appliqué, la fonction 'callback' est lancée.

  s("input[type='text']").sFilter(
{
classString: ".exemple",
model: s(".autre-exemple"),
withoutSymbols: true
},
function(){}
);

  • full

• sender

  Paramètres : {string, string = "", method = "POST"}, callback
  

  Appel un autre fichier, l'exécute et renvoie le résultat via le callback.

  sender(
{
action: "/mon-exemple.txt",
params: "txt=Paul",
method: "POST"
},
function(response){
sLog(response);
}
);
// Je m'appel Paul
  • simple
  • half
  • full

• sRedirection

  Paramètres : string
  

  Redirige vers l'url ou fichier spécifié en paramètre.

  sRedirection("./portfolio/paysage");
// Redirige l'utilisateur vers la page paysage qui se trouve dans le dossier portfolio.
  • simple
  • half
  • full