p.html 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  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" size="58" 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}}">{{.Name}}</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="{{.Name}}">
  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 current_id = '{{$first.Yid}}';
  51. var ids = [{{range .Songs}}'{{.Yid}}',{{end}}];
  52. </script>
  53. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  54. <script src="/static/script.js"></script>
  55. <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">
  56. <param name="movie" value="http://www.youtube.com/v/{{$first.Yid}}?version=3&amp;enablejsapi=1">
  57. <param name="allowScriptAccess" value="always">
  58. <embed src="http://www.youtube.com/v/{{$first.Yid}}?version=3&amp;enablejsapi=1" allowScriptAccess="always">
  59. </object>
  60. </body>
  61. </html>