App.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <template>
  2. <div>
  3. <router-view></router-view>
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. replace: false,
  9. data() {
  10. return {
  11. home: {
  12. visible: true
  13. },
  14. station: {
  15. visible: false
  16. },
  17. register: {
  18. email: "",
  19. username: "",
  20. password: ""
  21. },
  22. login: {
  23. email: "",
  24. password: ""
  25. },
  26. loggedIn: true,
  27. groups: [
  28. {
  29. id: "lu08gw56571r4497wrk9",
  30. name: "Official Rooms",
  31. rooms: [
  32. { id: "73qvw65746acvo8yqfr", thumbnail: "https://lh6.googleusercontent.com/-ghASz3s6yL4/AAAAAAAAAAI/AAAAAAAAALc/tFblPp2myu0/s0-c-k-no-ns/photo.jpg", name: "Country", description: "Johnny Cash - I Walk The Line", users: 10 },
  33. { id: "enxcysmhn1k7ld56ogvi", thumbnail: "http://66.media.tumblr.com/1734069af425e491fae7deae0a19869f/tumblr_o0i0xmIYrF1v421f2o1_1280.jpg", name: "Pop", description: "Sia - Cheap Thrills", users: 14 },
  34. { id: "kqa99gbva7lij05dn29", thumbnail: "http://www.youredm.com/wp-content/uploads/2014/09/taking-you-higher.jpg", name: "Chill", description: "MrSuicideSheep - Taking you higher", users: 13 },
  35. { id: "w19hu791iiub6wmjf9a4i", thumbnail: "http://edmsauce.wpengine.netdna-cdn.com/wp-content/uploads/2012/12/Deadmau5-album-title-goes-here.jpg", name: "EDM", description: "Deadmau5 - There Might Be Coffee", users: 13 }
  36. ]
  37. },
  38. {
  39. id: "g2b8v03xaedj8ht1emi",
  40. name: "Trending Rooms",
  41. rooms: [
  42. { id: "73qvw65746acvo8yqfr", thumbnail: "https://lh6.googleusercontent.com/-ghASz3s6yL4/AAAAAAAAAAI/AAAAAAAAALc/tFblPp2myu0/s0-c-k-no-ns/photo.jpg", name: "Country", description: "Johnny Cash - I Walk The Line", users: 10 },
  43. { id: "enxcysmhn1k7ld56ogvi", thumbnail: "http://66.media.tumblr.com/1734069af425e491fae7deae0a19869f/tumblr_o0i0xmIYrF1v421f2o1_1280.jpg", name: "Pop", description: "Sia - Cheap Thrills", users: 14 },
  44. { id: "kqa99gbva7lij05dn29", thumbnail: "http://www.youredm.com/wp-content/uploads/2014/09/taking-you-higher.jpg", name: "Chill", description: "MrSuicideSheep - Taking you higher", users: 13 },
  45. { id: "w19hu791iiub6wmjf9a4i", thumbnail: "http://edmsauce.wpengine.netdna-cdn.com/wp-content/uploads/2012/12/Deadmau5-album-title-goes-here.jpg", name: "EDM", description: "Deadmau5 - There Might Be Coffee", users: 13 }
  46. ]
  47. }
  48. ]
  49. }
  50. },
  51. methods: {
  52. logout() {
  53. $.ajax({
  54. method: "GET",
  55. url: "/users/logout",
  56. dataType: "json",
  57. complete: function (msg) {
  58. alert("Logged in!");
  59. location.reload();
  60. }
  61. });
  62. }
  63. },
  64. ready: function () {
  65. this.socket = io();
  66. this.socket.on("ready", function(status) {
  67. this.loggedIn = status;
  68. });
  69. },
  70. events: {
  71. 'register': function() {
  72. console.log('registered');
  73. $.ajax({
  74. method: "POST",
  75. url: "/users/register",
  76. data: JSON.stringify({
  77. email: this.register.email,
  78. username: this.register.username,
  79. password: this.register.password,
  80. recaptcha: grecaptcha.getResponse()
  81. }),
  82. contentType: "application/json; charset=utf-8",
  83. dataType: "json",
  84. success: function (msg) {
  85. if (msg) console.log(msg);
  86. alert("Registered!");
  87. //do something
  88. },
  89. error: function (err) {
  90. if (err) console.log(err);
  91. alert("Not registered!");
  92. //do something else
  93. }
  94. });
  95. },
  96. 'login': function() {
  97. console.log('login');
  98. $.ajax({
  99. method: "POST",
  100. url: "/users/login",
  101. data: JSON.stringify({
  102. email: this.login.email,
  103. password: this.login.password
  104. }),
  105. contentType: "application/json; charset=utf-8",
  106. dataType: "json",
  107. success: function (msg) {
  108. if (msg) console.log(msg);
  109. alert("Logged in!");
  110. //do something
  111. },
  112. error: function (err) {
  113. if (err) console.log(err);
  114. alert("Not logged in!");
  115. //do something else
  116. }
  117. });
  118. }
  119. }
  120. }
  121. </script>