Version 0.3: replace Prototype by JQuery and use bootstrap

This commit is contained in:
nemunaire 2013-12-30 12:26:30 +01:00
commit ad51d9da73
39 changed files with 19615 additions and 8436 deletions

View file

@ -0,0 +1,8 @@
function Album(elt)
{
this.id = elt.getAttribute("id");
this.type = parseInt(elt.getAttribute("type"));
this.titre = elt.getAttribute("titre");
if (elt.hasAttribute("couleur"))
this.color = elt.getAttribute("couleur");
}

File diff suppressed because it is too large Load diff

View file

@ -13,7 +13,7 @@ $nom = gpc('auteur', 'post');
$bdd = new BDD();
$bdd->escape($nom);
$chanteurs = $bdd->query("SELECT chanteur FROM gsm WHERE chanteur LIKE '$nom%' GROUP BY chanteur;");
$chanteurs = $bdd->query("SELECT artiste FROM gsm_titres WHERE artiste LIKE '$nom%' GROUP BY artiste;");
$bdd->deconnexion();
if (!empty($chanteurs) && !empty($nom))
@ -21,7 +21,7 @@ if (!empty($chanteurs) && !empty($nom))
print "<ul>\n";
foreach ($chanteurs as $chanteur)
{
print ' <li>'.$chanteur["chanteur"]."</li>\n";
print ' <li>'.$chanteur["artiste"]."</li>\n";
}
print "</ul>";
}

View file

@ -0,0 +1,45 @@
function Chanson(elt)
{
this.albums = new Array();
if (elt)
{
this.id = elt.getAttribute("id");
this.titre = elt.getAttribute("titre");
this.artiste = elt.getAttribute("artiste");
for (var albm in elt.getElementsByTagName("inalbum"))
{
if (albm.isInt())
this.albums.push(elt.getElementsByTagName("inalbum")[albm].getAttribute("id"));
}
}
}
Chanson.prototype.inAlbum = function(idAlbum, types)
{
for (var i = 0; i < this.albums.length; i++)
{
if (
(typeof(idAlbum) == 'undefined' || this.albums[i] == idAlbum) &&
(typeof(types) == 'undefined' || types.in_array(GSM_liste_CDs[this.albums[i]].type))
)
return true;
}
return false;
}
Chanson.prototype.search = function(titre, artiste, album, types)
{
if (
(titre == '' || this.titre.toLowerCase().indexOf(titre.toLowerCase()) >= 0) &&
(artiste == '' || this.artiste.toLowerCase().indexOf(artiste.toLowerCase()) >= 0)
)
{
for (var i = 0; i < this.albums.length; i++)
{
if (album == '' || GSM_liste_CDs[this.albums[i]].titre.toLowerCase().indexOf(album.toLowerCase()) >= 0)
return (types.length == 0 || types.in_array(GSM_liste_CDs[this.albums[i]].type));
}
}
return false;
}

View file

@ -2,10 +2,10 @@
{
border: solid 1px black;
display: table-cell;
height: 11.5cm;
height: 12cm;
text-align: center;
vertical-align: middle;
width: 11.5cm;
width: 12cm;
}
.front .title, .front .cd
@ -24,9 +24,10 @@
.back
{
border: solid 1px black;
color: black;
display: table;
height: 11.1cm;
width: 14.4cm;
height: 11.8cm;
width: 15.3cm;
}
.back .title
@ -43,10 +44,10 @@
.back .left, .back .right
{
display: block;
height: 11.1cm;
height: 11.8cm;
text-align: left;
vertical-align: top;
width: 0.7cm;
width: 0.8cm;
}
.back .left
{
@ -71,6 +72,7 @@
{
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
transform: rotate(-90deg);
text-align: center;
width: 11.1cm;
}
@ -78,6 +80,7 @@
{
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
transform: rotate(90deg);
text-align: center;
width: 11cm;
}
@ -95,5 +98,5 @@
.back .author
{
float: right;
width: 50%;
width: 45%;
}

View file

@ -6,11 +6,8 @@ body
width: 18cm;
}
h1 {
display: none;
}
#GSM_menu {
display: none;
#bt-menu, h1, menu {
display: none;
}
.back .center
@ -18,7 +15,3 @@ h1 {
overflow:hidden;
height: 11.1cm;
}
.back .center ol
{
-webkit-margin-before: 0.5em;
}

View file

@ -1,5 +1,5 @@
html {
height: 100%;
height: 100%;
}
body {
@ -19,27 +19,26 @@ body {
);
font-family: serif;
margin-bottom: 10px;
min-height: 80%;
min-height: 80%;
}
a:link, a:visited {
text-decoration: none;
color:#000000;
text-decoration: none;
color:#000000;
}
h1 {
text-align: center;
margin-left: 250px;
text-align: center;
margin-left: 250px;
}
.pagination a:link, .pagination a:visited {
text-decoration: none;
color:#FFFFFF;
text-decoration: none;
color:#FFFFFF;
}
.pagination a:hover, a:hover {
text-decoration: underline;
text-decoration: underline;
}
.news {
@ -60,9 +59,9 @@ h1 {
border-radius: 17px;
box-shadow: 3px 4px 5px #444466;
height: 127px;
height: 140px;
margin: auto;
padding: 20px;
padding: 0 20px;
text-align: left;
width: 75%;
}
@ -71,7 +70,7 @@ h1 {
color: orange;
}
#GSM_menu {
menu {
background: -webkit-gradient(
linear,
left top,
@ -92,36 +91,35 @@ h1 {
left: 0px;
list-style: none;
margin: 0;
-webkit-padding-start: 0;
padding: 0;
position: fixed;
text-align: center;
top: 0px;
width: 250px;
}
#GSM_menu h2 {
menu h2 {
margin-left: 69px;
}
#GSM_menu li {
menu > li {
margin-bottom: 40px;
text-align: center;
width: 250px;
}
#GSM_menu li[onclick] {
menu > li ul {
margin-left: 20px;
}
menu > li li {
margin-top: 5px;
}
menu li[onclick] {
cursor: pointer;
}
#GSM_menu li[onclick]:hover {
menu li[onclick]:hover {
text-decoration: underline;
}
label {
font-weight: bold;
}
label:hover {
text-decoration: underline;
}
form {
background: -webkit-gradient(
linear,
@ -138,101 +136,40 @@ form {
border: 1px solid #ff9b42;
border-radius: 25px;
box-shadow: 2px 2px 5px #553333;
}
form#addAlbms {
margin: auto;
padding: 13px;
text-align: left;
width: 345px;
}
form#addAlbms div {
text-align: center;
}
form#addAlbms div#testColor {
background-color: black;
border: solid 1px black;
display: inline-block;
height: 1em;
margin-left: 5px;
margin-bottom: -4px;
width: 2em;
}
form#ajout {
height: 182px;
margin: 10px auto;
padding: 13px;
text-align: left;
width: 642px;
}
form#ajout input[type=text] {
width: 444px;
}
form#ajout select {
margin-right: 10px;
}
form#ajout label {
float: left;
display: block;
font-weight: bold;
margin: 10px 7px 10px 0;
text-align: right;
width: 110px;
}
form#ajout label:hover {
text-decoration: underline;
}
input[type=text], select {
margin: 10px 0;
transition: background 0.75s;
-moz-transition: background 0.75s;
-webkit-transition: background 0.75s;
-o-transition: background 0.75s;
}
input, select {
background: #FF6600;
border: #CA2A20 solid 1px;
border-radius: 3px;
margin-top: 5px;
}
input:hover, input:focus, select:hover, select:focus {
background: #CC6600;
}
input.erreur, select.erreur {
background: #CC0000;
form#addAlbum {
padding: 14px;
width: 456px;
}
div#GSM_menu {
background: url(backmenu.png);
color:#FFFFFF;
top: 0px;
font-weight: bold;
height: 1200px;
padding-top: 30px;
position: fixed;
text-align: center;
left: 0px;
width: 250px;
background: url(backmenu.png);
color:#FFFFFF;
top: 0px;
font-weight: bold;
height: 1200px;
padding-top: 30px;
position: fixed;
text-align: center;
left: 0px;
width: 250px;
}
div#GSM_menu h2 {
margin-bottom: 40px;
margin-bottom: 40px;
}
div#contenu {
margin-left: 250px;
text-align: center;
margin-left: 250px;
text-align: center;
}
.table {
border: 1px solid black;
border-radius: 10px;
box-shadow: 3px 3px 5px #666666;
margin: auto;
margin: auto;
}
.table .body div {
transition: background 500ms;
@ -241,32 +178,32 @@ div#contenu {
-o-transition: background 500ms;
}
.table .body div.elt0 {
background: #ec7d60;
background: #ec7d60;
}
.table .body div.elt1 {
background: #f68063;
background: #f68063;
}
.table .body div:hover {
background: #fa8022;
background: #fa8022;
}
.table.cols2 div span {
display: inline-block;
display: inline-block;
width: 40%;
}
.table.cols3 div span {
display: inline-block;
display: inline-block;
width: 40%;
}
.table.cols3 div span+span+span {
width: 20%;
}
.table div.lign {
display: inline-block;
display: inline-block;
width: 100%;
}
.table .head {
background: #f26340;
background: #f26340;
border-bottom: 1px solid black;
border-radius: 10px 10px 0 0;
font-weight: bolder;
@ -278,21 +215,21 @@ div#contenu {
.table.stats {
float: left;
margin: 0 1%;
margin: 0 1%;
width: 31%;
}
.table#list {
width: 83%;
}
.table#list .head {
cursor: pointer;
cursor: pointer;
}
.table .body div {
cursor: pointer;
cursor: pointer;
}
.pagination {
background: #f26340;
background: #f26340;
border: 1px solid black;
color: white;
margin: auto;
@ -308,13 +245,13 @@ div#contenu {
box-shadow: 0px 2px 7px #666666;
}
.pagination a {
cursor: pointer;
padding: 0 5px;
cursor: pointer;
padding: 0 5px;
}
.front, .back
{
background: white;
background: white;
}
.back .center
{
@ -322,10 +259,11 @@ div#contenu {
}
.back ol li:hover
{
background-color: teal;
background-color: teal;
}
div.autocomplete {
margin-top: 20px;
margin-left: 6px;
}
div.autocomplete
{
margin-top: 20px;
margin-left: 6px;
}