p.html 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Audio Axis</title>
  6. <link href='http://fonts.googleapis.com/css?family=Cantarell' rel='stylesheet'>
  7. <link href="/static/base.css" rel="stylesheet">
  8. </head>
  9. <body>
  10. <header>
  11. <img src="/static/audioaxis-white.png" alt="Audio Axis" class="aa">
  12. <form onsubmit="return search(this.song.value)">
  13. <label for="user">Username:</label>
  14. <input type="text" id="user" value="anonymous" size="16">
  15. <br>
  16. <label for="song">Add a song:</label>
  17. <input type="text" id="song" autocomplete="off">
  18. <input type="submit" value="Search">
  19. </form>
  20. <div id="results" onblur="$(this).slideUp()"><ul>
  21. </ul></div>
  22. </header>
  23. <article>
  24. {{range .Songs}}
  25. <section class="song">
  26. <div class="info">
  27. <a href="http://www.youtube.com/watch?v={{.Yid}}">{{.Title}}</a>
  28. </div>
  29. <div class="user">
  30. {{.User}}
  31. </div>
  32. <div class="remove">×</div>
  33. <br class="clear">
  34. <div class="thumb">
  35. <img src="http://i.ytimg.com/vi/{{.Yid}}/1.jpg" alt="{{.Yid}}">
  36. </div>
  37. <canvas id="{{.Yid}}" width="700" height="20"></canvas>
  38. <br>
  39. <img src="/static/player_play.png" alt="Play" onclick="play('{{.Yid}}')" id="play_{{.Yid}}">
  40. <img src="/static/player_pause.png" alt="Pause" onclick="pause('{{.Yid}}')" id="pause_{{.Yid}}">
  41. <img src="/static/player_stop.png" alt="Stop" onclick="stop('{{.Yid}}')">
  42. <br class="clear">
  43. </section>
  44. {{else}}
  45. No songs found
  46. {{end}}
  47. </article>
  48. {{$first := index .Songs 0}}
  49. <script>
  50. var pid = '{{.Id}}';
  51. var current_id = '{{$first.Yid}}';
  52. var ids = [{{range .Songs}}'{{.Yid}}',{{end}}];
  53. </script>
  54. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  55. <script src="/static/script.js"></script>
  56. <object data="http://www.youtube.com/v/{{$first.Yid}}?version=3&amp;enablejsapi=1" id="player" width="1" height="1" type="application/x-shockwave-flash">
  57. <param name="movie" value="http://www.youtube.com/v/{{$first.Yid}}?version=3&amp;enablejsapi=1">
  58. <param name="allowScriptAccess" value="always">
  59. <embed src="http://www.youtube.com/v/{{$first.Yid}}?version=3&amp;enablejsapi=1" allowScriptAccess="always">
  60. </object>
  61. </body>
  62. </html>