Ola Galera eu estou com um projeto e até agora ta tudo certo, tenho um player em html, ou melhor uma pagina com botões que levam aos players de video, um através de ifreme e o outro através do svid que é um player jwplayer imbutido no html, eu gostaria de saber como faço para o busca o link do video através de um banco de dados, atualmente ele esta puxando o link de uma pasta chamado CallStream cujo tem um arquivo index.html dentro com um codigo codificado para Hex (Ascii) , ah como posso jogar isso num painel administrativo, fazendo assim ele criar esse index edita o link do iframe e do svid que estara no banco de dados.
segue o codigo codificado >>
5b7b22686569676874223a22323730222c227769647468223a22363430222c2275726c223a226171756920766169206f206c696e6b20646f20766964656f2e6d7034222c2274797065223a226d7034222c226c6162656c223a22227d5d
Segue o codigo decodicado >>
[{"height":"270","width":"640","url":"aqui vai o link do video .mp4","type":"mp4","label":""}]
Segue o codigo da pagina com os botões >>
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>titulo do site</title>
<meta name="robots" content="noindex">
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE">
<meta http-equiv="PRAGMA" content="NO-CACHE">
<link rel="stylesheet" href="../../theme/pure-min.css">
<link href="../../theme/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js?nocache"></script>
<script type="text/javascript" src="../../theme/jwplayer/jwplayer.js?nocache"></script>
<script type="text/javascript" src="../../theme/jwplayer/jwplayer.html5.js?nocache"></script>
<script type="text/javascript">jwplayer.key="N8zhkmYvvRwOhz4aTGkySoEri4x+9pQwR7GHIQ==";</script>
<script type="text/javascript" src="../../theme/gkplugins/jwplayer.js?nocache"></script>
<script type="text/javascript" src="../../theme/gkplugins/gkpluginsAPI.js?nocache"></script>
<script type="text/javascript" src="./FunctionsJS/?nocache"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-58575007-1', 'auto');
ga('send', 'pageview');
ga('create', 'UA-65302633-5', {'name':'googleanalytics'});
ga('googleanalytics.send', 'pageview');
</script>
<script type="text/javascript" src=""></script> <script type="text/javascript">
$(window).load(function(){
setButtons();
});
$(window).resize(function(){
setButtons();
});
function setButtons(){
$(".flutua").css("position", "absolute");
var dif = $(".panel_boot").outerHeight();
var hElem = $(".flutua").height();
var wElem = $(".flutua").width();
var hJan = $(window).height();
var wJan = $(window).width();
x = parseInt((wJan - wElem)/2);
y = parseInt((hJan - hElem) - dif );
$(".flutua").css("left", x);
$(".flutua").css("top", y);
}
Jw6Imagem = 'http://imagem de fundo do player'; rEmbedID = '1';
$(document).ready(function(){
$(".embed").on('click', '#Servidores', function () {
setButtons();
var $input = $( this );
var SvID = $input.attr( "svid" );
if(SvID == 1){
window.SvID = SvID;
$('#player').css('display','none');
CPlayStream('22E0E85B8924B81DF0461A5B075887700071715AFCB18887E5CF45BEE216EE16', '');
$('#Svplayer').css('display','block');
}
if(SvID == 2){
$('#player').css('display','none');
addiframe('Link do Iframe');
if(UseAdOpen) Now();
$('#Svplayer').css('display','block');
}
});
function addiframe(URL){
var ifHTML= '<div class="CloseButton" id="CloseSv" style="display: block;"></div><iframe src="'+URL+'" width="100%" height="100%" scrolling="no" frameborder="0" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen=""></iframe>';
$('#SvplayerID').html(ifHTML);
}
$(".Svplayer").on('click', '#CloseSv', function () {
$('#Svplayer').css('display','none');
$('#player').css('display','block');
$('#Svplayer').html('<div id="SvplayerID" style=" width: 100%; height: 100%;"><div id="flashplayer" class="" style="position: absolute; width: 100%; height: 100%;"></div></div>');
setButtons();
});
setInterval(setButtons(), 100);
});
function changserver(){
DownLeg = '';
$('#Svplayer').css('display','none');
$('#player').css('display','block');
$('#Svplayer').html('<div id="SvplayerID" style=" width: 100%; height: 100%;"><div id="flashplayer" class="" style="position: absolute; width: 100%; height: 100%;"></div></div>');
$('#NotFoundVideo').css('display','none');
setButtons();
}
</script>
<script src="22/theme/jwpsrv.js"></script><script src="sharing.js"></script><style type="text/css">
<!--
a:hover {
color: #999999;
}
h5 {
font-size: 0.83em;
}
h6 {
font-size: 0.67em;
}
body,td,th {
color: #FFF;
}
-->
</style></head>
<body>
<style>
body{
background-image: url(http://imagem de fundo); overflow: hidden;
font: normal 12px/20px Arial,Helvetica,sans-serif;
background-color: #000;
margin: 0px;
height: 100%;
width: 100%;
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
</style>
<div id="Svplayer" class="Svplayer" style="position: absolute; width: 100%; height: 100%;bottom: -1.5px;background-color: #000;border-width: 1px; border-style: solid; border-color: #000; display: none;">
<div id="SvplayerID" style=" width: 100%; height: 100%;"><div id="flashplayer" class="" style="position: absolute; width: 100%; height: 100%;"></div></div>
</div>
<div id="player" align="center" class="panel">
<div class="flutua">
<div class="botaodiferente">
<a href="" alt="Power Rangers Xtreme" title="Power Rangers Xtreme" target="_blank"><div class="prxtreme-logo"></div></a>
ESCOLHA UM SERVIDOR PARA ASSISTIR</div>
<div style="margin:0 1em 1em;" class="embed">
<button id="Servidores" svid="1" class="button-xlarge pure-button">EP 01 Dublado Beta</button>
<button id="Servidores" svid="2" class="button-xlarge pure-button">EP 01 Dublado Uol</button>
</div>
</div>
<div class="panel_boot" style="font-size:10px;">
<span style="color: #1FDFDF;"><strong>O Player acima contém tecnologia HD (Hight Definition) melhor qualidade Blu-Ray da internet.</strong></span><br>
<span style="color: #1FDFDF;"><strong>Não somos responsáveis pelos arquivos, nem garantimos sua funcionalidade, apenas indexamos no nosso site.</strong></span><br>
</div>
</div>
<div id="showload" style="display:none;">
<a class="close" href="javascript:void(0)" onClick="CloseDownload();"><img src="../../theme/fnHqKYp.png" style="width: 19px;"></a><span id="texload"><a href="" class="downelem" download="filme" style="padding-top: 10px;">Baixar Episódio</a></span></div>
<div id="LoadingVideo" style="display:none">
<style>
#LoadingVideoDiv {
font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
color: #fff;
height: 200px;
z-index: 2;
width: 100%;
text-align: center;
top: 30%;
margin: .83em 0;
position: absolute;
}
</style>
</div>
<div id="NotFoundVideo" style="display: none;">
<style>
canvas {
z-index: 1;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
font-family: 'Merriweather', serif;
}
.container {
z-index: 1;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100vh;
background: -webkit-radial-gradient(center, ellipse, hsla(0, 0%, 0%, 0) 0%, hsla(0, 0%, 0%, 0) 19%, hsla(0, 0%, 0%, 0.9) 100%);
background: radial-gradient(ellipse at center, hsla(0, 0%, 0%, 0) 0%, hsla(0, 0%, 0%, 0) 19%, hsla(0, 0%, 0%, 0.9) 100%);
background-color: #EDEAF9;
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#e6000000', GradientType=1);
}
.container div {
position: absolute;
left: 0;
top: -20%;
width: 100%;
height: 20%;
background-color: hsla(0, 0%, 0%, .09);
box-shadow: 0 0 10px hsla(0, 0%, 0%, .2);
-webkit-animation: waves 12s linear infinite;
animation: waves 12s linear infinite;
}
.container div:nth-child(1) {
-webkit-animation-delay: 0;
animation-delay: 0;
}
.container div:nth-child(2) {
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
.container div:nth-child(3) {
-webkit-animation-delay: 8s;
animation-delay: 8s;
}
@-webkit-keyframes waves {
0% {
top: -20%;
}
100% {
top: 100%;
}
}
@keyframes waves {
0% {
top: -20%;
}
100% {
top: 100%;
}
}
h1s {
z-index: 3;
position: absolute;
font: bold 20vw 'Merriweather', serif;
left: 50%;
top: 50%;
margin-top: -10vh;
width: 100%;
margin-left: -50%;
text-align: center;
color: transparent;
text-shadow: 0 0 30px hsla(0, 0%, 0%, .5);
-webkit-animation: flicks .8s linear infinite;
animation: flicks .8s linear infinite;
}
h2s {
z-index: 2;
position: absolute;
font: bold 3.5vw 'Merriweather', serif;
top: 30%;
width: 100%;
text-align: center;
color: hsla(0, 96%, 30%, 0.59);
text-shadow: 0 0 10px hsla(2, 100%, 26%, 0.99);
/*
color: transparent;
text-shadow: 0 0 12px hsla(0, 0%, 0%, .5);
-webkit-animation: flicks 1.5s linear infinite;
animation: flicks 1.5s linear infinite;
*/
}
span0 {
font-size: 7.5vw;
color: hsla(0, 8%, 33%, 0.1);
text-shadow: 0 0 10px hsla(2, 100%, 26%, 0.99);
/*
text-shadow: 0 0 24px hsla(0, 0%, 0%, 1);
-webkit-animation: spanflicks 1s linear infinite;
animation: spanflicks 1s linear infinite;
*/
}
h3s {
z-index: 2;
position: absolute;
font: bold 3vw 'Merriweather', serif;
top: 60%;
width: 100%;
text-align: center;
color: hsla(0, 0%, 0%, .5);
text-shadow: 0 0 40px hsla(0, 0%, 0%, .8);
/*
color: transparent;
text-shadow: 0 0 12px hsla(0, 0%, 0%, .4);
-webkit-animation: flicks 1s linear infinite;
animation: flicks 1s linear infinite;
*/
}
@-webkit-keyframes flicks {
0% {
text-shadow: 0 0 30px hsla(0, 0%, 0%, .5);
}
33% {
color: hsla(0, 0%, 0%, .4);
text-shadow: 0 0 10px hsla(0, 0%, 0%, .4);
}
66% {
color: transparent;
text-shadow: 0 0 20px hsla(0, 0%, 0%, .2);
}
100% {
color: hsla(0, 0%, 0%, .5);
text-shadow: 0 0 40px hsla(0, 0%, 0%, .8);
}
}
@keyframes flicks {
0% {
text-shadow: 0 0 30px hsla(0, 0%, 0%, .5);
}
33% {
color: hsla(0, 0%, 0%, .4);
text-shadow: 0 0 10px hsla(0, 0%, 0%, .4);
}
66% {
color: transparent;
text-shadow: 0 0 20px hsla(0, 0%, 0%, .2);
}
100% {
color: hsla(0, 0%, 0%, .5);
text-shadow: 0 0 40px hsla(0, 0%, 0%, .8);
}
}
@-webkit-keyframes spanflicks {
0% {
text-shadow: 0 0 30px hsla(0, 0%, 0%, .5);
}
33% {
color: hsla(0, 0%, 0%, .4);
text-shadow: 0 0 10px hsla(2, 95%, 15%, .5);
}
66% {
color: transparent;
text-shadow: 0 0 20px hsla(2, 95%, 15%, .2);
}
100% {
color: hsla(0, 0%, 0%, .5);
text-shadow: 0 0 40px hsla(2, 95%, 15%, .1);
}
}
@keyframes spanflicks {
0% {
text-shadow: 0 0 30px hsla(0, 0%, 0%, .5);
}
33% {
color: hsla(0, 0%, 0%, .4);
text-shadow: 0 0 10px hsla(2, 95%, 15%, .5);
}
66% {
color: transparent;
text-shadow: 0 0 20px hsla(2, 95%, 15%, .2);
}
100% {
color: hsla(0, 0%, 0%, .5);
text-shadow: 0 0 40px hsla(2, 95%, 15%, .1);
}
}
</style>
<h2s>Ops! Este Arquivo Não Foi Encontrado! Use os servidores alternativos!</h2s>
<h3s>Retornando ao menu de seleção em 10 segundos</h3s>
<div class="container">
<div></div>
<div></div>
<div></div>
</div>
<canvas id="canv"></canvas>
</div>
<SCRIPT LANGUAGE="JavaScript">
<!-- Disable
function disableselect(e){
return false
}
function reEnable(){
return true
}
//if IE4+
document.onselectstart=new Function ("return false")
document.oncontextmenu=new Function ("return false")
//if NS6
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
//-->
</script>
</body></html>