Add multiserver on web UI

src/main/java/net/Broken/Commands/Test.java

@@ -13,7 +13,7 @@ import java.io.IOException;
 public class ytTest implements Commande {
     @Override
     public void action(String[] args, MessageReceivedEvent event) {
-        event.getJDA().getPresence().setPresence(RichPresence.listening("Noting"),false);
+        event.getJDA().getPresence().setPresence(RichPresence.playing("test").asRichPresence(),false);
     }
 
     @Override

src/main/resources/log4j2.xml

@@ -25,7 +25,7 @@
         </File>
     </Appenders>
     <Loggers>
-        <Logger name="net.Broken" level="trace" additivity="false">
+        <Logger name="net.Broken" level="debug" additivity="false">
             <AppenderRef ref="Console"/>
             <AppenderRef ref="current"/>
             <AppenderRef ref="RollingFile"/>

src/main/resources/static/js/music.js

@@ -12,9 +12,12 @@ var btn_flush;
 var btn_add;
 var switchAutoFlow;
 var loadingFlag = false;
+var guild;
 
 $(document).ready(function() {
+    if(Cookies.get('guild') != undefined) {
 
+        guild = Cookies.get('guild')
         btn_play = $('#btn_play');
         btn_stop = $('#btn_stop');
         btn_next = $('#btn_next');
@@ -57,11 +60,11 @@ $(document).ready(function() {
         });
 
         listeners();
-
+    }
 });
 
 function getCurentMusic() {
-    $.get("api/music/currentMusicInfo", function (data) {
+    $.get("api/music/currentMusicInfo?guild=" + guild, function (data) {
     }).done(function (data) {
 
         state = data.state;
@@ -176,7 +179,7 @@ function getCurentMusic() {
 }
 
 function getPlayList() {
-    $.get("api/music/getPlaylist", function (data) {
+    $.get("api/music/getPlaylist?guild=" + guild, function (data) {
     }).done(function (data) {
         data = data.list;
         if(data != null && data.length != 0){
@@ -237,7 +240,7 @@ function getPlayList() {
 }
 
 function getChannels(){
-    $.get("api/music/getChanel", function (data) {
+    $.get("api/music/getChanel?guild=" + guild, function (data) {
     }).done(function (data) {
         console.log(data);
         $('#channelForm').empty();
@@ -319,7 +322,7 @@ function sendCommand(command){
         type: "POST",
         dataType: 'json',
         contentType: 'application/json',
-        url: "/api/music/command",
+        url: "/api/music/command?guild=" + guild,
         data:  JSON.stringify(command),
         success: function (data) {
             console.log(data);

src/main/resources/static/js/navabar.js

@@ -7,6 +7,7 @@ var btn_submit;
 var btn_disconnect;
 var nav_name;
 
+
 $(document).ready(function() {
     $('.button-navbar-mobile').sideNav({
         menuWidth: 400, // Default is 300
@@ -15,12 +16,16 @@ $(document).ready(function() {
         draggable: true // Choose whether you can drag to open on touch screens,
     });
 
+    $('#modal_guild').modal({
+        dismissible: false // Modal can be dismissed by clicking outside of the modal
+    });
+
 
     nav_bar_account_link = $("#nav-bar-account");
     input_name = $("#user_input");
     input_psw = $("#password_input");
     btn_submit = $("#btn-submit-connect");
-    btn_disconnect = $("#nav-disconnect");
+    btn_disconnect = $(".nav-disconnect");
     nav_name = $("#nav-name");
 
     if(Cookies.get('token') === undefined){
@@ -61,6 +66,9 @@ function connected(){
         }
     );
     nav_name.text(Cookies.get('name'));
+    if(Cookies.get('guild') === undefined){
+        getGuild()
+    }
 }
 
 function disconnected() {
@@ -132,7 +140,57 @@ function navListeners() {
     btn_disconnect.click(function () {
        Cookies.remove('token');
        Cookies.remove('name');
+       Cookies.remove('guild');
        location.reload();
     });
 
+    $('#guild_form').change(function () {
+        if ($('#btn_ok_guild').hasClass("disabled")) {
+            $('#btn_ok_guild').removeClass("disabled");
+        }
+    });
+
+    $('#btn_ok_guild').click(function () {
+        guild = $('input[name=guildRadio]:checked').val();
+        Cookies.set('guild', guild, { expires: 31 });
+        location.reload();
+
+    });
+
+    $('.nav-change-guild').click(function () {
+        Cookies.remove('guild');
+        location.reload();
+    })
+}
+
+function getGuild(){
+    $.get("api/userManagement/getGuilds", function (data) {
+    }).done(function (data) {
+        console.log(data);
+        $('#guild_form').empty();
+
+        if(data.length === 1){
+            Cookies.set('guild', data.id, { expires: 31 });
+            return;
+        }
+        data.forEach(function(element){
+            var template = $('#radioTemplateGuild').clone();
+            template.removeAttr("id");
+            template.removeAttr("style");
+            var content = template.html();
+            content = content.replace("@name", element.name);
+            content = content.replace(/@id/g, element.id);
+            template.html(content);
+
+            $('#guild_form').append(template);
+        });
+        $('#modal_guild').modal('open');
+
+    }).fail(function (data) {
+        if(!error){
+            alert("Com error, please refresh.");
+            error = true;
+        }
+
+    });
 }

src/main/resources/templates/header.html

@@ -29,12 +29,25 @@
         </ul>
 
         <ul id="nav-mobile" class="side-nav">
-            <li class="active">
+            <li class="center" th:classappend="(${page} == 'home')? 'active' : ''">
                 <a class="waves-effect waves-light sidenav-trigger" href="/" data-target="slide-out">Home</a>
             </li>
-            <li>
+            <li class="center" th:classappend="(${page} == 'music')? 'active' : ''">
-                <a class="waves-effect waves-light sidenav-trigger" href="/music" data-target="slide-out" >Music Control</a>
+                <a class="waves-effect waves-light" href="/music">Music Control</a>
             </li>
+
+            <li><div class="divider"></div></li>
+            <li><a class="center nav-change-guild">Change Guild</a></li>
+            <li>
+                <a class="center tooltipped" data-position="left" data-delay="50" data-tooltip="Under Development!">My Account</a>
+            </li>
+            <li>
+                <a class="center tooltipped" data-position="left" data-delay="50" data-tooltip="Under Development!">My Playlists</a>
+            </li>
+            <li class="divider"></li>
+
+            <li><a class="center red-text nav-disconnect" style="font-weight: bold">Disconnect</a></li>
+
         </ul>
         <a href="#" data-activates="nav-mobile" class="button-navbar-mobile button-collapse"><i class="material-icons">menu</i></a>
     </div>
@@ -43,9 +56,10 @@
     <!-- Dropdown connected -->
     <ul id="dropdown_connected" class="dropdown-content ">
         <li>
-            <a class="center blue-grey-text text-darken-4" id="nav-name" style="text-decoration: underline; font-weight: bold"></a>
+            <a class="center blue-grey-text text-darken-4 tooltipped" data-position="left" data-delay="50" data-tooltip="It's you !" id="nav-name" style="font-weight: bold"></a>
         </li>
         <li class="divider"></li>
+        <li><a class="center nav-change-guild" >Change Guild</a></li>
         <li>
             <a class="center tooltipped" data-position="left" data-delay="50" data-tooltip="Under Development!">My Account</a>
         </li>
@@ -53,7 +67,8 @@
             <a class="center tooltipped" data-position="left" data-delay="50" data-tooltip="Under Development!">My Playlists</a>
         </li>
         <li class="divider"></li>
-        <li><a class="center red-text" id="nav-disconnect" style="font-weight: bold">Disconnect</a></li>
+
+        <li><a class="center red-text nav-disconnect" style="font-weight: bold">Disconnect</a></li>
     </ul>
 
 
@@ -100,6 +115,32 @@
     </div>
 
 
+
+
+    <!--________________________________________-->
+    <!--            Guild modal                 -->
+    <!--________________________________________-->
+
+    <div id="modal_guild" class="modal">
+        <div class="modal-content" style="padding-bottom: 0px">
+            <div class="row" style="margin-bottom: 0px">
+                <h3 class="col s12 center">Guild Selection</h3>
+                <div class="col offset-s4 s4 center">
+                    <form id="guild_form" action="#" class="">
+                    </form>
+                </div>
+            </div>
+        </div>
+        <div class="modal-footer">
+            <a href="#!" id="btn_ok_guild" class="modal-action modal-close waves-effect waves-green btn-flat disabled">Ok</a>
+        </div>
+    </div>
+
+    <p id="radioTemplateGuild" class="" style="visibility: hidden; display: none ">
+        <input name="guildRadio" class="with-gap" type="radio" value="@id" id="@id"/>
+        <label for="@id">@name</label>
+    </p>
+
     <!--__________________________________________________________-->
     <!--                                                          -->
     <!--                           END                            -->

src/main/resources/templates/index.html

@@ -3,15 +3,15 @@
 <head>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
-    <title>Music Control - Discord Bot</title>
+    <title>Discord Bot</title>
     <link rel="icon"
           type="image/x-icon"
           href="/favicon.png"/>
 
     <!-- CSS  -->
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
-    <link href="/css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
+    <link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
-    <link href="/css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
+    <link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
 </head>
 
 <body class="blue-grey lighten-5" >
@@ -22,7 +22,9 @@
 
 
 </div>
-
+<script>
+    var needLogin = true;
+</script>
 <!--  Scripts-->
 <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
 <script th:src="@{/js/materialize.js}"></script>

src/main/resources/templates/music.html

@@ -201,7 +201,9 @@
         </div>
     </div>
     <div class="modal-footer">
+        <a href="/"  class="modal-action modal-close waves-effect waves-red btn-flat ">Cancel</a>
         <a href="#!" id="btn_ok_channel" class="modal-action modal-close waves-effect waves-green btn-flat disabled">Connect</a>
+
     </div>
 </div>