Start OVC application
This commit is contained in:
parent
ad51d9da73
commit
23774475af
2 changed files with 467 additions and 0 deletions
187
htdocs/applications/OVC/app.js
Normal file
187
htdocs/applications/OVC/app.js
Normal file
|
|
@ -0,0 +1,187 @@
|
||||||
|
var nbParPage = 50;
|
||||||
|
var OVC_delay = false;
|
||||||
|
|
||||||
|
//List of current waiting videos
|
||||||
|
var OVC_listAT = false;
|
||||||
|
//List of current downloading videos
|
||||||
|
var OVC_listEC = false;
|
||||||
|
//List of current available songs
|
||||||
|
var OVC_listAV = false;
|
||||||
|
|
||||||
|
var OVC_matchesURL = /^http:\/\/(www.)?(youtube).com\/watch\?v=([a-zA-Z0-9_]+)/i;
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Pages
|
||||||
|
*/
|
||||||
|
function OVC_add()
|
||||||
|
{
|
||||||
|
if (OVC_delay)
|
||||||
|
clearTimeout(OVC_delay);
|
||||||
|
|
||||||
|
$('contenu').innerHTML = "";
|
||||||
|
var titre = document.createElement("h2");
|
||||||
|
titre.innerHTML = "Ajout d'une vidéo à convertir";
|
||||||
|
$('contenu').appendChild(titre);
|
||||||
|
|
||||||
|
OVC_addScreen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
function OVC_addScreen(modif)
|
||||||
|
{
|
||||||
|
formulaire = document.createElement("form");
|
||||||
|
formulaire.id = "add"
|
||||||
|
formulaire.onsubmit = function(){ checkAndAdd(modif); return false; }
|
||||||
|
lab_link = document.createElement("label");
|
||||||
|
lab_link.innerHTML = "Lien :";
|
||||||
|
lab_link.setAttribute("for", "link");
|
||||||
|
inp_link = document.createElement("input");
|
||||||
|
if(modif)
|
||||||
|
inp_link.value = OVC_listEC[modif-1][1];
|
||||||
|
inp_link.type = "text";
|
||||||
|
inp_link.size = "34";
|
||||||
|
inp_link.maxLength = "250";
|
||||||
|
inp_link.id = "link";
|
||||||
|
|
||||||
|
lab_form = document.createElement("label");
|
||||||
|
lab_form.innerHTML = "Convertir en :";
|
||||||
|
lab_form.setAttribute("for", "format");
|
||||||
|
sel_form = document.createElement("select");
|
||||||
|
sel_form.id = "format";
|
||||||
|
sel_form_1 = document.createElement("option");
|
||||||
|
sel_form_1.value = "1";
|
||||||
|
sel_form_1.innerHTML = "Musique MP3";
|
||||||
|
sel_form_2 = document.createElement("option");
|
||||||
|
sel_form_2.value = "2";
|
||||||
|
sel_form_2.innerHTML = "Musique OGG";
|
||||||
|
sel_form_3 = document.createElement("option");
|
||||||
|
sel_form_3.value = "3";
|
||||||
|
sel_form_3.innerHTML = "Musique AAC";
|
||||||
|
sel_form_4 = document.createElement("option");
|
||||||
|
sel_form_4.value = "4";
|
||||||
|
sel_form_4.innerHTML = "Vidéo MPEG";
|
||||||
|
sel_form_5 = document.createElement("option");
|
||||||
|
sel_form_5.value = "5";
|
||||||
|
sel_form_5.innerHTML = "Vidéo MP4";
|
||||||
|
sel_form_6 = document.createElement("option");
|
||||||
|
sel_form_6.value = "6";
|
||||||
|
sel_form_6.innerHTML = "Vidéo FLV";
|
||||||
|
|
||||||
|
inp_submit = document.createElement("input");
|
||||||
|
inp_submit.type = "submit";
|
||||||
|
inp_submit.id = "submit";
|
||||||
|
if (modif)
|
||||||
|
inp_submit.value = "Modifier";
|
||||||
|
else
|
||||||
|
inp_submit.value = "Ajouter";
|
||||||
|
inp_submit.style.marginLeft = "165px";
|
||||||
|
|
||||||
|
formulaire.appendChild(lab_link);
|
||||||
|
formulaire.appendChild(inp_link);
|
||||||
|
formulaire.appendChild(document.createElement("br"));
|
||||||
|
formulaire.appendChild(lab_form);
|
||||||
|
sel_form.appendChild(sel_form_1);
|
||||||
|
sel_form.appendChild(sel_form_2);
|
||||||
|
sel_form.appendChild(sel_form_3);
|
||||||
|
sel_form.appendChild(sel_form_4);
|
||||||
|
sel_form.appendChild(sel_form_5);
|
||||||
|
sel_form.appendChild(sel_form_6);
|
||||||
|
formulaire.appendChild(sel_form);
|
||||||
|
formulaire.appendChild(document.createElement("br"));
|
||||||
|
if(modif)
|
||||||
|
sel_quan.value = GSPC_liste[modif-1][4];
|
||||||
|
formulaire.appendChild(document.createElement("br"));
|
||||||
|
formulaire.appendChild(inp_submit);
|
||||||
|
if (modif)
|
||||||
|
{
|
||||||
|
inp_del = document.createElement("input");
|
||||||
|
inp_del.type = "button";
|
||||||
|
inp_del.value = "Supprimer";
|
||||||
|
inp_del.onclick = function() { GSPC_del(modif); };
|
||||||
|
inp_del.style.marginLeft = "15px";
|
||||||
|
formulaire.appendChild(inp_del);
|
||||||
|
}
|
||||||
|
$('contenu').appendChild(formulaire);
|
||||||
|
$('link').focus();
|
||||||
|
|
||||||
|
confirmation = document.createElement("h3");
|
||||||
|
confirmation.style.color = "orange";
|
||||||
|
confirmation.id = "confirm";
|
||||||
|
$('contenu').appendChild(confirmation);
|
||||||
|
}
|
||||||
|
|
||||||
|
function OVC_lists()
|
||||||
|
{
|
||||||
|
if (OVC_delay)
|
||||||
|
clearTimeout(OVC_delay);
|
||||||
|
|
||||||
|
window.scrollTo(0,0);
|
||||||
|
|
||||||
|
$('contenu').innerHTML = "";
|
||||||
|
var titre = document.createElement("h2");
|
||||||
|
titre.innerHTML = "Vidéos en cours de téléchargement";
|
||||||
|
$('contenu').appendChild(titre);
|
||||||
|
|
||||||
|
OVC_liste = false;
|
||||||
|
|
||||||
|
OVC_viewlisteEC();
|
||||||
|
|
||||||
|
var titre = document.createElement("h2");
|
||||||
|
titre.innerHTML = "Vidéos en attente";
|
||||||
|
$('contenu').appendChild(titre);
|
||||||
|
|
||||||
|
OVC_viewlisteAT();
|
||||||
|
}
|
||||||
|
|
||||||
|
function GSPC_viewliste()
|
||||||
|
{
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Internal functions
|
||||||
|
*/
|
||||||
|
function checkAndAdd(modif)
|
||||||
|
{
|
||||||
|
if(modif)
|
||||||
|
modif = "&id=" + OVC_listAT[modif-1][0];
|
||||||
|
else
|
||||||
|
modif = "";
|
||||||
|
|
||||||
|
if (!OVC_matchesURL.test($('link').value))
|
||||||
|
{
|
||||||
|
$('link').className = "erreur";
|
||||||
|
alert('Le lien que vous avez indiqué n\'est pas valide !');
|
||||||
|
$('link').focus();
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
var compile = OVC_matchesURL.exec($('link').value);
|
||||||
|
alert('Yeah !\n\t- Service : ' + compile[2] + "\n\t- ID : " + compile[3]);
|
||||||
|
|
||||||
|
$('link').disabled = true;
|
||||||
|
$('format').disabled = true;
|
||||||
|
$('submit').disabled = true;
|
||||||
|
|
||||||
|
new Ajax.Request(
|
||||||
|
'ajax.php?d=action&a=OVC' + modif,
|
||||||
|
{
|
||||||
|
method: 'post',
|
||||||
|
parameters: {service: compile[2], id: compile[3], format: $('format').value},
|
||||||
|
onSuccess: function(transport, json)
|
||||||
|
{
|
||||||
|
if (json.statut != 1)
|
||||||
|
{
|
||||||
|
firstLoad();
|
||||||
|
alert("Vous avez été déconnecté. La vidéo n'a pas été ajoutée à la liste.");
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
OVC_loadList();
|
||||||
|
OVC_lists();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onFailure: function() { printEtat(3); }
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
280
htdocs/applications/OVC/style.css
Normal file
280
htdocs/applications/OVC/style.css
Normal file
|
|
@ -0,0 +1,280 @@
|
||||||
|
html {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: -webkit-gradient(
|
||||||
|
linear,
|
||||||
|
left top,
|
||||||
|
left bottom,
|
||||||
|
color-stop(0.31, #9effea),
|
||||||
|
color-stop(0.66, #e4fff9),
|
||||||
|
color-stop(1.00, #9effea)
|
||||||
|
);
|
||||||
|
background: -moz-linear-gradient(
|
||||||
|
center bottom,
|
||||||
|
#9effea 31%,
|
||||||
|
#e4fff9 66%,
|
||||||
|
#9effea 100%
|
||||||
|
);
|
||||||
|
|
||||||
|
font-family: serif;
|
||||||
|
min-height: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:link, a:visited {
|
||||||
|
text-decoration: none;
|
||||||
|
color:#000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
margin-left: 250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#OVC_menu a:link, #OVC_menu a:visited, .pagination a:link, .pagination a:visited {
|
||||||
|
text-decoration: none;
|
||||||
|
color:#FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
#OVC_menu a:hover, .pagination a:hover, a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.news {
|
||||||
|
background: -webkit-gradient(
|
||||||
|
linear,
|
||||||
|
left top,
|
||||||
|
right bottom,
|
||||||
|
color-stop(0.31, #93dfb4),
|
||||||
|
color-stop(0.66, #c5dfce)
|
||||||
|
);
|
||||||
|
background: -moz-linear-gradient(
|
||||||
|
right bottom,
|
||||||
|
#93dfb4 31%,
|
||||||
|
#c5dfce 66%
|
||||||
|
);
|
||||||
|
|
||||||
|
border: 2px solid #52dd90;
|
||||||
|
border-radius: 17px;
|
||||||
|
box-shadow: 3px 4px 5px #446644;
|
||||||
|
|
||||||
|
height: 127px;
|
||||||
|
margin: auto;
|
||||||
|
padding: 20px;
|
||||||
|
text-align: left;
|
||||||
|
width: 75%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vp {
|
||||||
|
color: orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
#OVC_menu {
|
||||||
|
background: -webkit-gradient(
|
||||||
|
linear,
|
||||||
|
left top,
|
||||||
|
left bottom,
|
||||||
|
color-stop(0.31, #52dd90),
|
||||||
|
color-stop(0.90, #a3ddc4)
|
||||||
|
);
|
||||||
|
background: -moz-linear-gradient(
|
||||||
|
center bottom,
|
||||||
|
#52dd90 31%,
|
||||||
|
#a3ddc4 90%
|
||||||
|
);
|
||||||
|
|
||||||
|
border-right: 2px dotted white;
|
||||||
|
color:#FFFFFF;
|
||||||
|
font-weight: bold;
|
||||||
|
height: 100%;
|
||||||
|
left: 0px;
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
-webkit-padding-start: 0;
|
||||||
|
position: fixed;
|
||||||
|
text-align: center;
|
||||||
|
top: 0px;
|
||||||
|
width: 250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#OVC_menu h2 {
|
||||||
|
margin-left: 69px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#OVC_menu li {
|
||||||
|
margin-bottom: 40px;
|
||||||
|
text-align: center;
|
||||||
|
width: 250px;
|
||||||
|
}
|
||||||
|
#OVC_menu li[onclick] {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
#OVC_menu li[onclick]:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
span#nompc img {
|
||||||
|
margin-top: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div#contenu {
|
||||||
|
margin-left: 250px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
form#add {
|
||||||
|
background: -webkit-gradient(
|
||||||
|
linear,
|
||||||
|
left top,
|
||||||
|
right bottom,
|
||||||
|
color-stop(0.31, #c9b5e8),
|
||||||
|
color-stop(0.95, #e4daf4)
|
||||||
|
);
|
||||||
|
background: -moz-linear-gradient(
|
||||||
|
center bottom,
|
||||||
|
#c9b5e8 31%,
|
||||||
|
#e4daf4 95%
|
||||||
|
);
|
||||||
|
|
||||||
|
border: 1px solid #8A77A1;
|
||||||
|
border-radius: 25px;
|
||||||
|
box-shadow: 2px 2px 5px #333355;
|
||||||
|
height: 123px;
|
||||||
|
margin: auto;
|
||||||
|
padding: 13px;
|
||||||
|
text-align: left;
|
||||||
|
width: 456px;
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
float: left;
|
||||||
|
display: block;
|
||||||
|
font-weight: bold;
|
||||||
|
margin: 10px 7px 10px 0;
|
||||||
|
text-align: right;
|
||||||
|
width: 150px;
|
||||||
|
}
|
||||||
|
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: #00EAF5;
|
||||||
|
border: #009AA5 solid 1px;
|
||||||
|
border-radius: 3px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
input:hover, input:focus, select:hover, select:focus {
|
||||||
|
background: #95cdff;
|
||||||
|
}
|
||||||
|
|
||||||
|
input#nompc {
|
||||||
|
font-variant: small-caps;
|
||||||
|
}
|
||||||
|
input#lignepc {
|
||||||
|
text-transform:uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
input.erreur, select.erreur {
|
||||||
|
background: #CC0000;
|
||||||
|
border: #A59A00 solid 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
border: 1px solid black;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 3px 3px 5px #666666;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.table .body div {
|
||||||
|
transition: background 500ms;
|
||||||
|
-moz-transition: background 500ms;
|
||||||
|
-webkit-transition: background 500ms;
|
||||||
|
-o-transition: background 500ms;
|
||||||
|
}
|
||||||
|
.table .body div.elt0 {
|
||||||
|
background: #5c93a0;
|
||||||
|
}
|
||||||
|
.table .body div.elt1 {
|
||||||
|
background: #5c96a5;
|
||||||
|
}
|
||||||
|
.table .body div:hover {
|
||||||
|
background: #73B14b;
|
||||||
|
}
|
||||||
|
.table.cols2 div span {
|
||||||
|
display: inline-block;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
.table.cols3 div span {
|
||||||
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
|
}
|
||||||
|
.table.cols3 div span+span+span {
|
||||||
|
width: 10%;
|
||||||
|
}
|
||||||
|
.table.cols3 div.body span {
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.table.cols3 div.body span+span {
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
.table.cols3 div.body span+span+span {
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.table div.lign {
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table .head {
|
||||||
|
background: #1070c9;
|
||||||
|
border-bottom: 1px solid black;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
font-weight: bolder;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.table .foot { border-radius: 0 0 10px 10px; }
|
||||||
|
|
||||||
|
.table#stats {
|
||||||
|
width: 42%;
|
||||||
|
}
|
||||||
|
.table#list {
|
||||||
|
width: 83%;
|
||||||
|
}
|
||||||
|
.table#list .head {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.table .body div {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
background: #1070c9;
|
||||||
|
border: 1px solid black;
|
||||||
|
color: white;
|
||||||
|
margin: auto;
|
||||||
|
width: 442px;
|
||||||
|
}
|
||||||
|
.pagination.top {
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.pagination.bottom {
|
||||||
|
border-top: none;
|
||||||
|
border-radius: 0 0 10px 10px;
|
||||||
|
box-shadow: 0px 2px 7px #666666;
|
||||||
|
}
|
||||||
|
.pagination a {
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0 5px;
|
||||||
|
}
|
||||||
Reference in a new issue