Générateur de grilles d'accords

Soyez le premier à donner votre avis sur cette source.

Vue 16 765 fois - Téléchargée 326 fois

Description

C'est un petit script tout simple avec un formulaire pour générer des grilles d'accords, ce qui devrait intéresser les musiciens!
Pour la partie php je me suis inspiré de portions de codes puisées ailleurs car je suis un gros débutant...
J'ai mis au point un language pour l'écriture des grilles, ça pourra vous paraître compliqué, mais en réalité c'est assez facile, faites-vous la main.
Vous avez une démo ici :
http://zionoiz.free.fr/rep/gen.php

C'est sans bdd, il suffit de transférer le dossier chez vous... Merci pour vos éventuels coms, conseils, améliorations de mon script; et si vous faites des grilles montrez ce que ça donne.

Ps: Important! créez un fichier css pour définir l'affichage du générateur!

Source / Exemple :


Les deux fichiers php nécessaire:

1. gen.php (cette page contient le formulaire)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr"><head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		
		<title>Reprises, Générateur de grille</title><link href="img/favicon.png" rel="SHORTCUT ICON">
		<link href="style.css" rel="stylesheet" type="text/css"></head>
<body>
		<h1>
			<a name="top"></a> Générateur
			de grille</h1>
		<h2> Réalisé par Stef (
			<a href="http://zionoiz.free.fr">http://zionoiz.free.fr</a>
			)</h2>
		<br>
		<img style="width: 375px; height: 126px;" alt="Accueil Zionoiz" title="zionoiz" src="http://zionoiz.free.fr/img/zionoiz1.png">
		<h3>Mode d'emploi :</h3>
		<span style="font-weight: bold;"> Remplissez le formulaire en suivant pas-à-pas les 5 étapes !
			<br>
Une fois que vous aurez cliqué sur le bouton "Générer la grille" une
page s'ouvrira avec votre grille toute belle et mise en forme ... <br> Enfin, pour sauvegarder votre grille, allez dans le menu Fichier de votre navigateur, puis choisissez "Enregistrer sous..." .
		</span><br style="font-weight: bold;">
		<span style="font-weight: bold;"> (L'extension par défaut de votre fichier sera .htm, vous pouvez en choisir une autre !)
			<br>
		</span>
		<h2>
			<span style="color: rgb(255, 0, 0);">
				<span style="text-decoration: underline;"> Important
				</span> :
			</span>
			<span style="font-weight: bold;">
				<span style="color: rgb(255, 0, 0);">
				</span>
			</span></h2>
		<span style="font-weight: bold;"> - n'utilisez pas les caractères " et '
			<br> - une fois votre grille générée prenez soin de l'enregistrer car aucune donnée ne sera sauvegardée !
			<br>
			<br> Let's move ...
		</span>
		<span style="font-style: italic;"> (aucun champ n'est obligatoire)
		</span>
		<span style="font-weight: bold;">
		</span>
		<form name="Grille Editor" action="affich.php" method="post" enctype="multipart/form-data">
			<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2">
				<tbody>
					<tr>
						<td style="border: 1px dotted rgb(0, 0, 0); width: 100px; text-align: center; background-color: rgb(234, 245, 255); vertical-align: middle;">
							<h1>1.</h1></td>
						<td style="border: 1px solid rgb(0, 0, 0); text-align: left; vertical-align: top;">
							<span style="font-weight: bold;"> Titre :
							</span>
							<input name="titre_grille"> &nbsp;
							<span style="font-weight: bold;"> - &nbsp; Page :
							</span>
							<input name="page" value="1 / 1">
							<br> &nbsp;
							<br>
							<span style="font-weight: bold;"> Auteur
							</span> :
							<input name="auteur"> &nbsp;
							<span style="font-weight: bold;"> - &nbsp;Date :
							</span>
							<input name="date" value="26 / 12 / 2000">
							<br>
							<br>
							<span style="font-weight: bold;"> Lien web :
							</span>
							<input name="web" value="http://">
							<br>
							<br>
							<span style="font-weight: bold;"> Paramètres :
							</span>
							<input name="param_tempo" value="4 / 4"> &nbsp; - &nbsp;&nbsp;
							<input name="param_beat" value="100 bpm"> &nbsp; - &nbsp;
							<input name="param_tona" value="Do majeur "></td>
						<td style="border: 1px dotted rgb(0, 0, 0); width: 200px; text-align: justify; vertical-align: top; background-color: rgb(255, 255, 204);">
							<span style="font-weight: bold;"> Infos de base ...
							</span></td>
					</tr>
					<tr>
						<td style="border: 1px dotted rgb(0, 0, 0); width: 100px; text-align: center; background-color: rgb(234, 245, 255); vertical-align: middle;">
							<h1>2.</h1></td>
						<td style="border: 1px solid rgb(0, 0, 0); text-align: left; vertical-align: top;">
							<span style="font-weight: bold;"> Développement de la grille :
							</span>
							<br>
<textarea cols="76" rows="20" name="grille">Nom de la partie - ID
|| { X } { X } { Y } { Z } | { X } { X } { Y } { Z } | { X } { X } { Y } { Z } | { X } { X } { Y } { Z } ||
Annotations: ...

Nom de la partie - ID || { X } { X } { Y } { Z } | { X } { X } { Y } { Z } | { X } { X } { Y } { Z } | { X } { X } { Y } { Z } || Annotations: ...
Nom de la partie - ID || { X } { X } { Y } { Z } | { X } { X } { Y } { Z } | { X } { X } { Y } { Z } | { X } { X } { Y } { Z } || Annotations: ...
</textarea></td> <td style="border: 1px dotted rgb(0, 0, 0); width: 200px; text-align: justify; vertical-align: top; background-color: rgb(255, 255, 204);"> <span style="font-weight: bold;"> Le language des grilles : </span> <br> <br> <a href="#aide">Voir l'aide !</a> <br> <br> <span style="font-weight: bold;"> En bref: </span> <br> <br> " <span style="font-style: italic;"> Nom de la partie </span> ", ça peut être "Couplet", Refrain", "Part A", etc... <br> " <span style="font-style: italic;"> ID </span> ", pour repérer précisment une partie dans le morceau; commencez par 1.0, puis incrémenter chaque nouvelle partie: 1.1, 1.2, 1.3, etc. <br> " <span style="font-style: italic;"> Annotations </span> ", pour préciser ou quoi que ce soit concernant la partie. <br> " <span style="font-style: italic;"> ***** </span> ", séparateur de partie. <br></td> </tr> <tr> <td style="border: 1px dotted rgb(0, 0, 0); width: 100px; text-align: center; background-color: rgb(234, 245, 255); vertical-align: middle;"> <h1>3.</h1></td> <td style="border: 1px solid rgb(0, 0, 0); text-align: left; vertical-align: top;"> <span style="font-weight: bold;"> Séquentiel : </span> (optionnel) <br> <textarea cols="76" rows="5" name="sequentiel"></textarea></td> <td style="border: 1px dotted rgb(0, 0, 0); width: 200px; text-align: justify; vertical-align: top; background-color: rgb(255, 255, 204);"> <span style="font-weight: bold;"> Pour afficher le déroulement de votre morceau de façon séquentielle ... </span></td> </tr> <tr> <td style="border: 1px dotted rgb(0, 0, 0); width: 100px; text-align: center; background-color: rgb(234, 245, 255); vertical-align: middle;"> <h1>4.</h1></td> <td style="border: 1px solid rgb(0, 0, 0); text-align: left; vertical-align: top;"> <span style="font-weight: bold;"> Notes : </span> (optionnel) <br> <textarea cols="76" rows="5" name="notes"></textarea></td> <td style="border: 1px dotted rgb(0, 0, 0); width: 200px; vertical-align: top; background-color: rgb(255, 255, 204); text-align: left;"> <span style="font-weight: bold;"> Précisions, détails, explications, conseils, etc... </span></td> </tr> <tr> <td style="border: 1px dotted rgb(0, 0, 0); width: 100px; text-align: center; background-color: rgb(234, 245, 255); vertical-align: middle;"> <h1>5.</h1></td> <td style="border: 1px solid rgb(0, 0, 0); text-align: left; vertical-align: top;"> <span style="font-weight: bold;"> Validation du formulaire : </span> <br> <br> <button value="grille_gen" name="valider"> Générer la grille </button></td> <td style="border: 1px dotted rgb(0, 0, 0); width: 200px; text-align: justify; vertical-align: top; background-color: rgb(255, 255, 204);"> <span style="font-weight: bold;"> Ayé, on y est ! </span></td> </tr> </tbody> </table> </form> <h2> <a name="aide"></a> Aide à l'écriture des grilles, le language !</h2> <h3>Général :</h3> || ........................ || = ouverture et fermeture de partie <br> ||: ....................... :|| = répéter partie 1 fois <br> ||x: ....................... :x|| = répéter partie x fois <br> ||: ....................... |1] ... :|| > |2] ... :|| > |3] ... || = sortie multiple <br> | = séparateur de mesure <br> {...} séparateur de temps (quand plusieurs temps sont identiques écrivez une fois { X } plus le nombre de fois où l'accord <br> est joué ex. || { Bm7 }3 { A7 } | ... || <br> ***** = séparateur de partie <br> ( x.y _ x.z = 2 -> ... <- x.y _ x.z = 2 ) = boucles, pour répéter un groupe de parties <br> @1( x.y _ x.z = 2 -> ... <- x.y _ x.z = 2 )@1 = identifiants de boucles <br> <br> <span style="font-weight: bold;"> Exemples: </span> <br> <table style="text-align: left; width: 60%;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="border: 1px solid rgb(0, 0, 0); vertical-align: top; width: 300px;"> @1( 1.5 _ 1.6 = 4 -><br>Part. A - 1.5<br>|| { X }4&nbsp; | { Y }4 ||<br>Annotations: ...<br>*****<br>Part. B - 1.6<br>|| { X }2 { Y }2 |&nbsp; { Z }4&nbsp; ||<br>Annotations: ...<br>*****<br><- 1.5 _ 1.6 = 4 )@1</td> <td style="border: 1px dotted rgb(0, 0, 0); background-color: rgb(184, 204, 180); text-align: left; vertical-align: top;"><span style="color: rgb(102, 0, 204);">Explications</span> :<br><br>dans cette exemple une boucle est créée sur les parties 1.5 et 1.6, et cette boucle (@1) est joué 4 fois...<br>Pour d'autres boucles dans le morceau créez d'autres identifiants : @2, @3, etc.</td> </tr> </tbody> </table> &nbsp; <br> ```````````````````````````````````````````````` <br> <h3> <a name="jeu"></a> Indications de jeu :</h3> <span style="font-style: italic;"> Internes (dans une mesure ou un groupe de mesures): </span> <br> + = répéter la mesure précédente <br> +x = répéter la mesure précédente x fois <br> ++ = répéter les deux mesures précédentes <br> ++x = répéter les deux mesures précédentes x fois <br> <h> <h>X Y Z</h> = plan rythmique (du style à la hanazir...) <br> <n>....</n> = nappes <br> <z>x y z</z> = jouer notes indiquées uniquement (pas l'accord) <br> <r>....</r> = riddim (rythmique reggae) <br> *x/x* = modification métrique (ex. : *2/4*) </h> <br> <br> <span style="font-style: italic;"> Externes (pour toute une partie): </span> <br> [H] ... /H , [N] ... /N , [Z] ... /Z , [R]... /R <br> *x/x* = modification métrique (ex. : *2/4*) <br> <br> <span style="font-weight: bold;"> Exemples: </span> <br> <table style="text-align: left; width: 60%;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="border: 1px solid rgb(0, 0, 0); vertical-align: top; width: 300px;">|| { G7 }4 &nbsp;| +3 ||<br><br>|| { G7 }4 &nbsp;| { C7 }4 | ++6 &nbsp; ||<br><br><br>|| <n> { F7M }4 &nbsp;| { Dm7 }4 &nbsp;</n> | ...<br><br>[R]<br>Part. B - 1.6<br>|| { X }2 { Y } 2 |&nbsp; { Z }4&nbsp; ||<br>Annotations: ...<br>*****<br>/R<br><br>Part. B - 1.6<br>|| *3/4* { X }2 { Y } 1 |&nbsp; { Z }3&nbsp; |....<br>Annotations: ...<br>*****<br><br>Part. B - 1.6<br>*5/4*<br>|| { X }3 { Y } 2 |&nbsp; { Z }5&nbsp; ||<br>Annotations: ...<br>*****</td> <td style="border: 1px dotted rgb(0, 0, 0); background-color: rgb(184, 204, 180); vertical-align: top;">Ceci donne 4 mesures de G7<br><br>Répéter les 2 mesures 6 fois (ce qui fait un total de 8 mesures !).<br><br>Ces deux mesures ont la balise "nappes"<br><br>Toutes cette partie est sous la balise (R]<br><br><br><br><br><br><br>L'entrée de cette indication signifie que cette mesure et toutes les suivantes seront en 3 / 4 (jusqu'à&nbsp;une nouvelle indication, ex. *4/4*)<br><br>Toute la partie 1.6 est en 5/4 (si vous revenez en 4/4 sur la partie suivante il faudra le préciser de la même manière, sinon c'est qu'on continue en 5/4...</td> </tr> </tbody> </table> <br> ```````````````````````````````````````````````` <br> <h3>Chiffrage des accords :</h3> X = accord majeur <br> Xm = accord mineur <br> X7 = accord majeur + 7ème mineure <br> Xm7 = accord mineur + 7ème mineure <br> X7M = accord majeur + 7ème majeure <br> X9 = accord majeur + 7ème mineure + 9ème <br> X7M9 = accord majeur + 7ème majeure + 9ème <br> Xm9 = accord mineur + 7ème mineure + 9ème <br> X6 = accord majeur + 6ème (sixte) majeure <br> Xm6 =accord mineur + 6ème majeure <br> Xm5b= acccord mineur + 5ème (quinte) bémole <br> Xm5b7= acccord mineur + 5ème (quinte) bémole + 7ème mineure<br> X5# = accord majeur + 5ème dièse <br> X4 = accord de quarte suspendu <br> X2 = accord majeur + seconde <br> <br> <span style="font-weight: bold;"> Exemples: </span> <br> <table style="text-align: left; width: 60%;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="border: 1px solid rgb(0, 0, 0); vertical-align: top; width: 300px;">...</td> <td style="border: 1px dotted rgb(0, 0, 0); background-color: rgb(184, 204, 180); vertical-align: top;">....</td> </tr> </tbody> </table> <br> ```````````````````````````````````````````````` <br> <h3>Durée des accords et silence: (si nécesaire)</h3> <span style="font-style: italic;"> -> Valable aussi pour les notes jouées seules (cf dans " <a href="#jeu">Indications de jeu</a> ": </span> <z style="font-style: italic;"> xyz </z> <span style="font-style: italic;"> ) ! </span> <br> <br> *X = piqué <br> &nbsp;~X = 4 temps (ronde) <br> °X = 2 temps (blanche) <br> !°X = blanche pointée <br>.X = 1 temps (noire) <br> !X = noire pointée <br> ;X = 1/2 temps (croche) <br> !;X = croche pointée <br> ;;X = 1/4 temps (double croche) <br> 3°( X Y Z ) = triolet de blanches <br> 3.( X Y Z ) = triolet de noires <br> 3;( X Y Z ) = triolet de croches <br> 5;(X Y X Y Z ) = quintolet de croches (naaaan, là j'déconne, c'est juste pour voir si vous suivez :) ) <br> X_ | _X = liés entre mesures ou entre temps ( ex. : °X_ | _;X -- ex. : { ;;X ;;Y ;Z_ } { _°Z } ) <br> <br> -~ = silence 4 temps <br> -° = silence 2 temps <br> -!° = silence blanche pointée <br> -. = silence 1 temps <br> -!. = silence noire pointée <br> -; = silence 1/2 temps <br> -!; = silence croche pointée <br> -;; = silence 1/4 temps <br> <br> <span style="font-weight: bold;"> Exemples: </span> <br> <table style="text-align: left; width: 60%;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="border: 1px solid rgb(0, 0, 0); vertical-align: top; width: 300px;">...</td> <td style="border: 1px dotted rgb(0, 0, 0); background-color: rgb(184, 204, 180); vertical-align: top;">...</td> </tr> </tbody> </table><br> <br> ```````````````````````````````````````````````` <br> <br> Remonter au <a href="#aide">début de l'aide</a>, en <a href="#top">haut de page</a>, me <a href="mailto:zionoiz@free.fr">contacter</a> </body></html> 2. affich.php (pour générer la page avec la grille) <?php $titre_grille = $_POST['titre_grille'] ; $page = $_POST['page'] ; $auteur = $_POST['auteur'] ; $date = $_POST['date'] ; $web = $_POST['web'] ; $param_tempo = $_POST['param_tempo'] ; $param_beat = $_POST['param_beat'] ; $param_tona = $_POST['param_tona'] ; $grille = $_POST['grille'] ; $grille = nl2br($grille); $sequentiel = $_POST['sequentiel'] ; $notes = $_POST['notes'] ; echo( "<b>Titre : </b>".$titre_grille." - \n" ) ; echo( "<b>Page : </b>".$page."<br /><br />\n" ) ; echo( "<b>Auteur : </b>".$auteur." - \n" ) ; echo( "<b>Date : </b>".$date."<br /><br />\n" ) ; echo( "<b>Lien web : </b>".$web."<br /><br />\n" ) ; echo( "<b>Paramètres : </b>".$param_tempo." - ".$param_beat." - ".$param_tona."<br />\n" ) ; echo ( "_______________________________________<br /><br />\n" ) ; echo( "".$grille."<br />\n" ) ; echo ( "_______________________________________<br /><br />\n" ) ; echo( "<b>Séquentiel : <br /></b>".$sequentiel."<br /><br />\n" ) ; echo ( "_______________________________________<br /><br />\n" ) ; echo( "<b>Notes : <br /></b>".$notes."<br /><br />\n" ) ; echo ( "_______________________________________<br /><br />\n" ) ; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> Reprises, Générateur de grille </title> <link href="img/favicon.png" rel="SHORTCUT ICON" /> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> </body> </html>

Conclusion :


A vous de dire ce que vous en pensez... Merci

Codes Sources

A voir également

Ajouter un commentaire Commentaires
Messages postés
10840
Date d'inscription
lundi 24 février 2003
Statut
Modérateur
Dernière intervention
2 mars 2010
23
Hello,

echo, tout comme print d'ailleurs, accepte les parenthèses. C'est simplement historique.
Néanmoins, en effet, ça ne facilite pas la lecture.

A ce qui a déjà été dit, j'ajouterai que ton en-tête html indique que ta page est en xhtml, mais que tu ne respectes pas la syntaxe xhtml : tous les éléments doivent être fermés :

=>

=>
Et que tu utilises des éléments dépréciés :
=>
Un élément <form> n'a pas d'attribut "name".
Un formulaire se met en forme via des <fieldset>, des <label>, des ...pas des tableaux, normalement. Or là, tu peux très bien te passer des tableaux.

Tu devrais aussi créer une css et sortir tous tes les attributs style que tu as mis : ce serait bien plus simple à modifier, et cela allègerait grandement ton code.

Le bon côté des choses, c'est que ton code est original :-)
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
39
moi ce qui me choque (mis a part l'utilite du php ici... qui se resume a proposer un "enregistrer") c'est plus les lignes :

# echo( "Titre : ".$titre_grille." - \n" ) ;
# echo( "Page : ".$page."

\n" ) ;
# echo( "Auteur : ".$auteur." - \n" ) ;
# echo( "Date : ".$date."

\n" ) ;
# echo( "Lien web : ".$web."

\n" ) ;

l'utilisation des echo ici est etrange : tu l'utilises comme si c'etait une fonction (avec des parentheses) or c'est pas une fonction... ensuite, tu utilises les "..." pour delemiter une chaine qui ne contient pas de variable, je m'explique :

toi tu fais :
$variable="toto";
echo "la valeur est ".$toto;

tu pourrais faire :
echo "la valeur est $toto";

ou mieux : (plus rapide a l'execution et plus lisible):
echo 'la valeur est '.$toto;
Messages postés
1
Date d'inscription
lundi 25 septembre 2006
Statut
Membre
Dernière intervention
3 février 2008

Quand un gros débutat comme moi poste timidement son code c'est bien pour entendre ce genre de réponse, merci pour vos conseils et ne vous excusez pas, je suis là pour apprendre...
Messages postés
39
Date d'inscription
samedi 7 janvier 2006
Statut
Membre
Dernière intervention
13 janvier 2009

J'suis tout a fait d'accord avec CODEFALSE, ton php n'est pas spécialement utile.
tu aurrai pu utiliser la librairie GD afin de dessiner de véritable partition avec different type de note dessus.
l'idée de basse est bonne mais il faut encor l'améliorer
++
Messages postés
1123
Date d'inscription
mardi 8 janvier 2002
Statut
Modérateur
Dernière intervention
21 avril 2009
1
Attention !
# $titre_grille = $_POST['titre_grille'] ;
# $page = $_POST['page'] ;
# $auteur = $_POST['auteur'] ;
# $date = $_POST['date'] ;
# ...

Tu ne vérifie pas les données provenant de l'utilisateur, du coup ton système est faillible aux attaques de type xss. Protège les avec des fonctins du type htmlentities et compagnie.

De plus ton code ne fait rien de plus que proposer un formulaire et récuperer les valeurs pour les afficher ensuite. Tu ne fait aucun traitement derriere.

Ne le prends pas mal, mais ton script, au niveau php, ne sert à rien :/

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.