#2 mejora player de musica

parent dbd58edd
header h2 {
color: #f09f8b;
text-align: center;
}
/* HTML5 Audio player with playlist styles */
/* https://github.com/codovate/MINImusic-Player */
.example,
.example2,
.example3 {
margin: 30px auto 0;
}
.player {
background: #25aade;
height: 220px;
position: relative;
width: 100%;
z-index: 2;
}
.title,
.artist {
font-family: verdana;
left: 135px;
position: absolute;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
.title {
color: #ffffff;
font-size: 14px;
font-weight: bold;
top: 20px;
}
.artist {
color: #eeeeee;
font-size: 12px;
top: 43px;
}
.pl {
background: url(../img/control/playlist.png) no-repeat;
cursor: pointer;
height: 40px;
left: 330px;
position: absolute;
top: 20px;
width: 39px;
}
.pl:hover {
top: 21px;
}
.cover {
border-radius: 3px 3px;
height: 85px;
left: 20px;
position: absolute;
top: 30px;
width: 85px;
}
.controls {
cursor: pointer;
left: 0px;
position: absolute;
top: 65px;
left: 122px;
}
.controls .play,
.controls .pause {
width: 40px;
height: 40px;
margin: 5px 5px 5px 5px;
}
.controls .play,
.controls .pause,
.controls .rew,
.controls .fwd,
.controls .stop {
text-indent: -10000px;
border: none;
float: left;
}
.controls .rew,
.controls .fwd,
.controls .stop {
width: 40px;
height: 40px;
margin: 5px 5px 5px 5px;
}
.controls .play {
background: url(../img/control/play.svg) no-repeat;
background-size: 40px 40px;
}
.controls .pause {
background: url(../img/control/pause.svg) no-repeat;
background-size: 40px 40px;
display: none;
}
.controls .rew {
background: url(../img/control/rewind.svg) no-repeat;
background-size: 40px 40px;
}
.controls .fwd {
background: url(../img/control/next.svg) no-repeat;
background-size: 40px 40px;
}
.controls .stop {
background: url(../img/control/stop.svg) no-repeat;
background-size: 40px 40px;
}
.hidden {
display: none;
}
.controls .visible {
display: block;
}
.volume {
height: 11px;
left: 30px;
position: absolute;
top: 142px;
width:80%;
}
.mute .volume-btn {
background: url(../img/control/volume-off.svg) no-repeat;
background-size: 20px 20px;
}
.volume-btn {
background: url(../img/control/volume-up.svg) no-repeat;
background-size: 20px 20px;
height: 20px;
width: 20px;
float: left;
position: relative;
top: -4px;
margin-right: 15px;
}
.volume-adjust {
height: 11px;
position: relative;
width: 50%;
background: #fff;
float: left;
}
.volume-adjust > div > div {
height: 11px;
background: #151b48;
}
.progressbar {
background-color: #fff;
cursor: pointer;
z-index: 1;
right: 6.875em; /* 110 */
height: 15px;
left: 0px;
position: absolute;
width: 90%;
top: 170px;
margin: 0px 5%;
}
.novolume .progressbar {
right: 4.375em; /* 70 */
}
.progressbar div {
width: 0%;
height: 15px;
position: absolute;
left: 0;
top: 0;
}
.bar-loaded {
background-color: #f1f1f1;
z-index: 1;
}
.bar-played {
background: #151b48;
z-index: 2;
}
.timeHolder {
color: #ffffff;
font-size: 14px;
font-weight: bold;
bottom: 10px;
position: absolute;
margin: 0px 5%;
width: 90%;
}
.time-current,
.time-duration,
.time-separator {
color: #ffffff;
font-size: 14px;
font-weight: bold;
float: left;
}
.volume .ui-slider-handle {
background: url("../images/spr.png") no-repeat scroll -201px -188px
rgba(0, 0, 0, 0);
height: 13px;
width: 13px;
}
.playlist {
display: none;
background-color: #fff;
list-style-type: none;
margin: -10px 0 0 2px;
padding-bottom: 10px;
padding-top: 15px;
position: relative;
width: 95%;
z-index: 1;
margin: 0px auto;
}
.playlist li,
.playlist div {
color: #151b48;
cursor: pointer;
margin: 0 0 5px 15px;
}
.playlist li > a,
.playlist div > a {
color: #151b48;
text-decoration: none;
}
.playlist li.active,
.playlist div.active {
font-weight: bold;
}
/* .slick-dots {
bottom: 5px !important;
}
.slick-dots li button:before {
font-size: 8px !important;
} */
header h2 {
color: #f09f8b;
text-align: center;
}
/* HTML5 Audio player with playlist styles */
/* https://github.com/codovate/MINImusic-Player */
.example,
.example2,
.example3 {
margin: 30px auto 0;
}
.player {
background: #25aade;
height: 160px;
position: fixed;
width: 100%;
z-index: 9999;
bottom: 0 !important;
left: 0 !important;
}
.title,
.artist {
font-family: verdana;
left: 135px;
position: absolute;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
.title {
color: #ffffff;
font-size: 14px;
font-weight: bold;
top: 10px;
}
.artist {
color: #eeeeee;
font-size: 12px;
top: 32px;
}
.pl {
background: url(../img/control/playlist.png) no-repeat;
cursor: pointer;
height: 40px;
left: 330px;
position: absolute;
top: 20px;
width: 39px;
}
.pl:hover {
top: 21px;
}
.cover {
border-radius: 3px 3px;
height: 85px;
left: 20px;
position: absolute;
top: 10px;
width: 85px;
}
.controls {
cursor: pointer;
left: 0px;
position: absolute;
top: 50px;
left: 130px;
}
.controls .play,
.controls .pause {
width: 40px;
height: 40px;
margin: 5px 5px 5px 5px;
}
.controls .play,
.controls .pause,
.controls .rew,
.controls .fwd,
.controls .stop {
text-indent: -10000px;
border: none;
float: left;
}
.controls .rew,
.controls .fwd,
.controls .stop {
width: 40px;
height: 40px;
margin: 5px 5px 5px 5px;
}
.controls .play {
background: url(../img/control/play.svg) no-repeat;
background-size: 40px 40px;
}
.controls .pause {
background: url(../img/control/pause.svg) no-repeat;
background-size: 40px 40px;
display: none;
}
.controls .rew {
background: url(../img/control/rewind.svg) no-repeat;
background-size: 40px 40px;
}
.controls .fwd {
background: url(../img/control/next.svg) no-repeat;
background-size: 40px 40px;
}
.controls .stop {
background: url(../img/control/stop.svg) no-repeat;
background-size: 40px 40px;
}
.hidden {
display: none;
}
.controls .visible {
display: block;
}
.volume {
display: none !important;
height: 11px;
left: 30px;
position: absolute;
top: 142px;
width:80%;
}
.mute .volume-btn {
background: url(../img/control/volume-off.svg) no-repeat;
background-size: 20px 20px;
}
.volume-btn {
background: url(../img/control/volume-up.svg) no-repeat;
background-size: 20px 20px;
height: 20px;
width: 20px;
float: left;
position: relative;
top: -4px;
margin-right: 15px;
}
.volume-adjust {
height: 11px;
position: relative;
width: 50%;
background: #fff;
float: left;
}
.volume-adjust > div > div {
height: 11px;
background: #151b48;
}
.progressbar {
background-color: #fff;
cursor: pointer;
z-index: 1;
right: 6.875em; /* 110 */
height: 15px;
left: 0px;
position: absolute;
width: 90%;
top: 108px;
margin: 0px 5%;
}
.novolume .progressbar {
right: 4.375em; /* 70 */
}
.progressbar div {
width: 0%;
height: 15px;
position: absolute;
left: 0;
top: 0;
}
.bar-loaded {
background-color: #f1f1f1;
z-index: 1;
}
.bar-played {
background: #151b48;
z-index: 2;
}
.timeHolder {
color: #ffffff;
font-size: 14px;
font-weight: bold;
top: 126px;
position: absolute;
margin: 0px 5%;
width: 90%;
}
.time-current,
.time-duration,
.time-separator {
color: #ffffff;
font-size: 14px;
font-weight: bold;
float: left;
}
.volume .ui-slider-handle {
background: url("../images/spr.png") no-repeat scroll -201px -188px
rgba(0, 0, 0, 0);
height: 13px;
width: 13px;
}
.playlist {
display:none;
background-color: #fff;
list-style-type: none;
margin: -10px 0 0 2px;
padding-bottom: 10px;
padding-top: 15px;
position: absolute;
width: 100%;
z-index: 1;
margin: 0px auto;
}
.playlist li,
.playlist div {
color: #151b48;
cursor: pointer;
margin: 0 0 5px 15px;
}
.playlist li > a,
.playlist div > a {
color: #151b48;
text-decoration: none;
}
.playlist li.active,
.playlist div.active {
font-weight: bold;
}
/* .slick-dots {
bottom: 5px !important;
}
.slick-dots li button:before {
font-size: 8px !important;
} */
......@@ -37,7 +37,7 @@ class SuscripcionController extends AbstractController {
if ($msisdnEntrante != $msisdnSesion || !Utiles::isMsisdn($msisdnEntrante)) {
$log->debug("el msisdn entrante no cumple con el formato o es distinto al obtenido de la sesion...");
$url = $this->container->get('router')->generate('front_index', array('msisdn' => $msisdnSesion, 'listas' => $listasFiltradas));
$url = $this->container->get('router')->generate('front_index', array('msisdn' => $msisdnSesion, 'listas' => $listas));
$statusCode = 302;
return new RedirectResponse($url, $statusCode);
......
......@@ -45,7 +45,7 @@
<a href="{% if isChrome == false %}http://newbackendcontenidos.gearlabs.cl/{{cancion.getCanPathArchivo()}}{% else %}http://newbackendcontenidos.gearlabs.cl/{{cancion.getCanPathArchivoAlt()}}{% endif %}">{{cancion.getIdOriginal().getCon().getConNombre()}}</a></li>
{% endfor %}
</ul>
<script type="text/javascript" src="../../frontend/js/script-musicPlayer.js"></script>
<script type="text/javascript" src="{{asset('frontend/js/script-musicPlayer.js')}}"></script>
</div>
<table class="table table-striped discos-destacados-top">
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment