#1 Cambios en diseño y correcciones menores

templates/frontend/paginas/reproductor.html.twig

 {% extends 'frontend/base.html.twig' %}
 {% block title %}Reproductor{% endblock %}
 {% block stylesheets %}
-<link href="{{asset('frontend/css/styles-player.css')}}" rel="stylesheet">
+    <link href="{{asset('frontend/css/styles-player.css')}}" rel="stylesheet">
 {% endblock %}
 {% block body %}
     <header class="masthead-rock-listado text-center text-white">
 
-    <div class="container">
-      <!-- Actual search box -->
-      <!-- <div class="form-group has-search">
-        <span class="form-control-feedback"><img src="img/destacados/lupa-busqueda.svg" width="28" class="mr-3 img-fluid" alt="..."></span>
-        <input type="text" class="buscador-top form-control" placeholder="Busca por artista, álbum o canción">
-      </div>
-    </div> -->
-
-    <!-- header con mensaje -->
-
-    <div class="container subheader-info">
-      <div class="row">
-          <div class="col-12">
-            <p class="titulo-genero">
-            {{ lista.lisNombre }}
-          </p>
-          </div>
-
-        </div>
-      </div>
-
-    <!-- cierre con mensaje -->
-
-    <div class="masthead-content">
-
-    <div class="row borde-superior borde-inferior pt 10">
-
-    <!-- audio player -->
-
-    <script type="text/javascript" src="{{asset('frontend/js/jquery-1.7.2.min.js')}}"></script>
-    <script type="text/javascript" src="{{asset('frontend/js/musicplayer.js')}}"></script>
-
-    <div class="example container">
-          <ul class="playlist">
-            {% for cancion in cancionesLista %}
-              <li  id="can-{{cancion.getIdOriginal()}}" class="cover" data-cover="" data-artist="{{cancion.getIdOriginal().getCon().getAlb().getAlbNombre()}}"><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>
-      </div>
-
-     <table class="table table-striped discos-destacados-top">
-       <tbody>
-       {% set i = 1 %}
-       {% for cancion in cancionesLista %}
-         <tr id="can-visible-{{cancion.getIdOriginal()}}" onclick="reproducirCancion(event,{{cancion-getIdOriginal()}})">
-           <th scope="col" class="fila-class-top"><img src="http://newbackendcontenidos.gearlabs.cl/{{cancion.getCanPathImagenAlbum()}}" width="80px" height="80px"></th>
-           <td scope="col" class="fila-class-top">
-             <h5 class="dest-top">{{ "%02d"|format(i) }}&nbsp;{{cancion.getIdOriginal().getCon().getConNombre()}}</h5>
-            <span class="disco-top">{{cancion.getIdOriginal().getCon().getAlb().getAlbNombre()}}</span>
-          </td>
-         <!--  <td class="flecha"> <img src="frontend/img/destacados/icono-play.svg" width="28" class="mr-3 img-fluid" alt="..."> </td> -->
-         </tr>   
-         {% set i = i + 1 %}      
-         {% endfor %} 
-       </tbody>
-     </table>
-    </div>
-
-
-</div>
-  </header>
-    
+        <div class="container">
+            <!-- Actual search box -->
+            <!-- <div class="form-group has-search">
+              <span class="form-control-feedback"><img src="img/destacados/lupa-busqueda.svg" width="28" class="mr-3 img-fluid" alt="..."></span>
+              <input type="text" class="buscador-top form-control" placeholder="Busca por artista, álbum o canción">
+            </div>
+          </div> -->
+
+            <!-- header con mensaje -->
+
+            <div class="container subheader-info">
+                <div class="row">
+                    <div class="col-12">
+                        <p class="titulo-genero">
+                            {{ lista.lisNombre }}
+                        </p>
+                    </div>
+
+                </div>
+            </div>
+
+            <!-- cierre con mensaje -->
+
+            <div class="masthead-content">
+
+                <div class="row borde-superior borde-inferior pt 10">
+
+                    <!-- audio player -->
+
+                    <script type="text/javascript" src="{{asset('frontend/js/jquery-1.7.2.min.js')}}"></script>
+                    <script type="text/javascript" src="{{asset('frontend/js/musicplayer.js')}}"></script>
+
+                    <div id="test" class="example container">
+                        <ul class="playlist">
+                            {% for cancion in cancionesLista %}
+                                <li class="cover" id="can-{{cancion.getIdOriginal().getCon().getConId()}}" data-cover="http://newbackendcontenidos.gearlabs.cl/{{cancion.getCanPathImagenAlbum()}}" data-artist="{{cancion.getIdOriginal().getCon().getAlb().getAlbNombre()}}">
+                                    <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>
+                    </div>
+
+                    <table class="table table-striped discos-destacados-top">
+                        <tbody>
+                            {% set i = 1 %}
+                            {% for cancion in cancionesLista %}
+                                <tr id="can-visible-{{cancion.getIdOriginal().getCon().getConId()}}">
+                                    <th scope="col" class="fila-class-top"><img src="http://newbackendcontenidos.gearlabs.cl/{{cancion.getCanPathImagenAlbum()}}" width="80px" height="80px"></th>
+                                    <td scope="col" class="fila-class-top">
+                                        <h5 class="dest-top">{{ "%02d"|format(i) }}&nbsp;{{cancion.getIdOriginal().getCon().getConNombre()}}</h5>
+                                        <span class="disco-top">{{cancion.getIdOriginal().getCon().getAlb().getAlbNombre()}}</span>
+                                    </td>
+                                    <td class="flecha"><img src="{{asset('frontend/img/destacados/icono-play.svg')}}" width="28" class="mr-3 img-fluid" onclick="reproducirCancion(event,{{cancion.getIdOriginal().getCon().getConId()}} )" alt="reproducir"></td>
+                                </tr>   
+                                {% set i = i + 1 %}      
+                            {% endfor %} 
+                        </tbody>
+                    </table>
+                </div>
+
+
+            </div>
+    </header>
+
 {% endblock %}
 {% block javascripts %}
 
-<script>
-    
-    function reproducirCancion(event, id){
-        event.preventDefault();
-        $('#can-'+id+' span').trigger('click'); 
-    }
-    
-</script>    
+    <script>
+
+        function reproducirCancion(event, id) {
+            event.preventDefault();
+            console.log("clickeando");
+            $('#can-' + id).trigger('click');
+        }
+
+
+       
+
+    </script>    
 
 {% endblock %}