Adding basic music control

src/main/java/net/Broken/RestApi/Data/CommandPostData.java

@@ -0,0 +1,7 @@
+package net.Broken.RestApi.Data;
+
+
+public class CommandPostData {
+    public String command;
+    public String data;
+}

src/main/java/net/Broken/RestApi/Data/CommandResponseData.java

@@ -0,0 +1,14 @@
+package net.Broken.RestApi.Data;
+
+import com.fasterxml.jackson.annotation.JsonInclude;
+
+@JsonInclude(JsonInclude.Include.NON_NULL)
+public class CommandResponseData {
+    public String Commande;
+    public String Message;
+
+    public CommandResponseData(String commande, String message) {
+        Commande = commande;
+        Message = message;
+    }
+}

src/main/java/net/Broken/RestApi/MusicWebController.java

@@ -5,12 +5,21 @@ import com.sedmelluq.discord.lavaplayer.track.AudioTrack;
 import com.sedmelluq.discord.lavaplayer.track.AudioTrackInfo;
 import net.Broken.Commandes.Music;
 import net.Broken.MainBot;
+import net.Broken.RestApi.Data.CommandPostData;
+import net.Broken.RestApi.Data.CommandResponseData;
 import net.Broken.RestApi.Data.CurrentMusicData;
 import net.Broken.RestApi.Data.PlaylistData;
 import net.Broken.audio.NotConectedException;
 import net.Broken.audio.NullMusicManager;
+import net.dv8tion.jda.core.events.message.MessageReceivedEvent;
+import org.apache.logging.log4j.LogManager;
+import org.apache.logging.log4j.Logger;
+import org.json.JSONObject;
+import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMethod;
 import org.springframework.web.bind.annotation.RestController;
 
 import java.util.List;
@@ -18,6 +27,8 @@ import java.util.List;
 @RestController
 @RequestMapping("/api/music/")
 public class MusicWebController {
+    Logger logger = LogManager.getLogger();
+
     @RequestMapping("/currentMusicInfo")
     public CurrentMusicData test(){
         Music musicCommande = (Music) MainBot.commandes.get("music");
@@ -45,4 +56,46 @@ public class MusicWebController {
             return new PlaylistData(list);
         }
     }
+
+    @RequestMapping(value = "/command", method = RequestMethod.POST)
+    public ResponseEntity<CommandResponseData> command(@RequestBody CommandPostData data){
+
+        if(data.command != null){
+            logger.info("receive command: " + data.command);
+            Music musicCommande = (Music) MainBot.commandes.get("music");
+            switch (data.command){
+                case "PLAY":
+                    try {
+                        musicCommande.getAudioManager().getMusicManager().scheduler.resume();
+                        return new ResponseEntity<>(new CommandResponseData(data.command,"Accepted"), HttpStatus.OK);
+                    } catch (NullMusicManager | NotConectedException nullMusicManager) {
+                        return new ResponseEntity<>(new CommandResponseData(data.command,"Not connected to vocal!"), HttpStatus.NOT_ACCEPTABLE);
+                    }
+
+                case "PAUSE":
+                    try {
+                        musicCommande.getAudioManager().getMusicManager().scheduler.pause();
+                        return new ResponseEntity<>(new CommandResponseData(data.command,"Accepted"), HttpStatus.OK);
+                    } catch (NullMusicManager | NotConectedException nullMusicManager) {
+                        return new ResponseEntity<>(new CommandResponseData(data.command,"Not connected to vocal!"), HttpStatus.NOT_ACCEPTABLE);
+                    }
+
+                case "NEXT":
+                    try {
+                        musicCommande.getAudioManager().getMusicManager().scheduler.nextTrack();
+                        return new ResponseEntity<>(new CommandResponseData(data.command,"Accepted"), HttpStatus.OK);
+                    } catch (NullMusicManager | NotConectedException nullMusicManager) {
+                        return new ResponseEntity<>(new CommandResponseData(data.command,"Not connected to vocal!"), HttpStatus.NOT_ACCEPTABLE);
+                    }
+
+                case "STOP":
+                    musicCommande.getAudioManager().stop((MessageReceivedEvent) null);
+                    return new ResponseEntity<>(new CommandResponseData(data.command,"Accepted"), HttpStatus.OK);
+
+            }
+        }
+        else
+            logger.info("Null");
+        return new ResponseEntity<>(new CommandResponseData(null, null), HttpStatus.NO_CONTENT);
+    }
 }

src/main/java/net/Broken/audio/AudioM.java

@@ -223,9 +223,10 @@ public class AudioM {
 
 
     public void stop (MessageReceivedEvent event) {
-        GuildMusicManager musicManager = getGuildAudioPlayer(event.getGuild());
         musicManager.scheduler.stop();
         playedChanel = null;
+
+        if (event != null) {
             event.getGuild().getAudioManager().closeAudioConnection();
             Message message = event.getTextChannel().sendMessage(EmbedMessageUtils.getMusicOk("Arret de la musique!")).complete();
             List<Message> messages = new ArrayList<Message>(){{
@@ -234,6 +235,7 @@ public class AudioM {
             }};
             new MessageTimeOut(messages, MainBot.messageTimeOut).start();
         }
+    }
 
     public void stop (GuildVoiceLeaveEvent event) {
 

src/main/resources/log4j2.xml

@@ -17,7 +17,7 @@
         </RollingFile>
     </Appenders>
     <Loggers>
-        <Root level="info">
+        <Root level="debug">
             <AppenderRef ref="RollingFile" level="info" />
             <AppenderRef ref="Console" level="info"/>
             <AppenderRef ref="RollingFile" level="info"/>

src/main/resources/static/index.html

@@ -52,8 +52,8 @@
             </div>
             <div class="row center">
                 <div class="col s2 offset-s3 center">
-                    <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_skip">
+                    <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_stop">
-                        <i class="material-icons medium">skip_previous</i>
+                        <i class="material-icons medium">stop</i>
                     </a>
                 </div>
                 <div class="col s2 center">
@@ -68,12 +68,8 @@
                 </div>
             </div>
             <div class="row center">
-                <div class="col s2 center offset-s4">
+
-                    <a class="btn blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_stop">
+                <div class="col offset-s5 s2 center">
-                        <i class="material-icons">stop</i>
-                    </a>
-                </div>
-                <div class="col s2 center">
                     <a class="btn blue-grey darken-4 z-depth-3 waves-effect waves-light modal-trigger" href="#modal1" id="btn_info">
                         <i class="material-icons">info</i>
                     </a>

src/main/resources/static/js/init.js

@@ -1,5 +1,6 @@
 var savedPlaylist;
 var error = false;
+var state;
 
 $(document).ready(function() {
     setInterval("getCurentMusic()",1000);
@@ -13,20 +14,32 @@ $(document).ready(function() {
     });
     var height = $( window ).height();
 
+    $('#btn_play').click(function () {
+        switch (state){
+            case "PLAYING":
+                sendCommand("PAUSE")
+                break;
+
+            case "PAUSE":
+                sendCommand("PLAY")
+                break;
+        }
+        
+    })
+
+    $('#btn_next').click(function () {
+        sendCommand("NEXT");
+    })
+    $('#btn_stop').click(function () {
+        sendCommand("STOP");
+    })
+
 })
 
 
-function updateModal(data){
-    $('#modal_title').text("Title: "+ data.info.title);
-    $('#modal_author').text("Author: "+ data.info.author);
-    $('#modal_lenght').text("Duration: "+ msToTime(data.info.length));
-    $('#modal_url').text("URL: "+ data.info.uri);
 
 
 
-}
-
-
 
 function getCurentMusic() {
     $.get("api/music/currentMusicInfo", function (data) {
@@ -34,6 +47,7 @@ function getCurentMusic() {
 
         // alert( "second success" );
         // console.log(data);
+        state = data.state;
         switch (data.state) {
             case "STOP":
                 $('#music_text').text("No Music");
@@ -85,12 +99,11 @@ function getCurentMusic() {
     })
 }
 
-
 function getPlayList() {
     $.get("api/music/getPlaylist", function (data) {
     }).done(function (data) {
         data = data.list;
-        if(data.length != 0){
+        if(data != null && data.length != 0){
             var noUpdate = comparePlaylist(data, savedPlaylist);
 
             if(!noUpdate){
@@ -114,6 +127,9 @@ function getPlayList() {
                 });
             }
         }
+        else
+            $('#playlist_list').empty();
+
 
 
 
@@ -121,22 +137,52 @@ function getPlayList() {
 
 }
 
+function updateModal(data){
+    $('#modal_title').text("Title: "+ data.info.title);
+    $('#modal_author').text("Author: "+ data.info.author);
+    $('#modal_lenght').text("Duration: "+ msToTime(data.info.length));
+    $('#modal_url').text("URL: "+ data.info.uri);
+
 
-function msToTime(duration) {
-    var milliseconds = parseInt((duration%1000)/100)
-        , seconds = parseInt((duration/1000)%60)
-        , minutes = parseInt((duration/(1000*60))%60)
-        , hours = parseInt((duration/(1000*60*60))%24);
 
-    hours = (hours < 10) ? "0" + hours : hours;
-    minutes = (minutes < 10) ? "0" + minutes : minutes;
-    seconds = (seconds < 10) ? "0" + seconds : seconds;
-    if(hours > 0 )
-        return hours + ":" + minutes + ":" + seconds;
-    else
-        return minutes + ":" + seconds;
 }
 
+function updateControl(data){
+    $('#music_text').text(data.info.title);
+    var percent = (data.currentPos / data.info.length) * 100;
+    // console.log(percent)
+    if (!$('#btn_info').hasClass("indeterminate")) {
+        $('#btn_info').addClass("determinate").removeClass("indeterminate");
+    }
+    $('#music_progress').width(percent + "%");
+
+
+    if ($('#btn_stop').hasClass("disabled")) {
+        $('#btn_stop').removeClass("disabled");
+    }
+    if ($('#btn_info').hasClass("disabled")) {
+        $('#btn_info').removeClass("disabled");
+    }
+
+    $('#music_img').attr("src","http://img.youtube.com/vi/"+data.info.identifier+"/hqdefault.jpg");
+    updateModal(data);
+}
+
+function sendCommand(commandStr){
+    $.ajax({
+        type: "POST",
+        dataType: 'json',
+        contentType: 'application/json',
+        url: "/api/music/command",
+        data:  JSON.stringify({ command: commandStr}),
+        success: function (data) {
+            console.log(data);
+        }
+
+    }).fail(function (data) {
+        console.log(data);
+    });
+}
 
 function comparePlaylist(list1, list2){
     if(list1 == null || list2 == null){
@@ -160,23 +206,19 @@ function comparePlaylist(list1, list2){
     return true;
 }
 
-function updateControl(data){
+function msToTime(duration) {
-    $('#music_text').text(data.info.title);
+    var milliseconds = parseInt((duration%1000)/100)
-    var percent = (data.currentPos / data.info.length) * 100;
+        , seconds = parseInt((duration/1000)%60)
-    // console.log(percent)
+        , minutes = parseInt((duration/(1000*60))%60)
-    if (!$('#btn_info').hasClass("indeterminate")) {
+        , hours = parseInt((duration/(1000*60*60))%24);
-        $('#btn_info').addClass("determinate").removeClass("indeterminate");
+
+    hours = (hours < 10) ? "0" + hours : hours;
+    minutes = (minutes < 10) ? "0" + minutes : minutes;
+    seconds = (seconds < 10) ? "0" + seconds : seconds;
+    if(hours > 0 )
+        return hours + ":" + minutes + ":" + seconds;
+    else
+        return minutes + ":" + seconds;
 }
-    $('#music_progress').width(percent + "%");
 
 
-    if ($('#btn_stop').hasClass("disabled")) {
-        $('#btn_stop').removeClass("disabled");
-    }
-    if ($('#btn_info').hasClass("disabled")) {
-        $('#btn_info').removeClass("disabled");
-    }
-
-    $('#music_img').attr("src","http://img.youtube.com/vi/"+data.info.identifier+"/hqdefault.jpg");
-    updateModal(data);
-}

src/main/resources/templates/music.html

@@ -15,7 +15,7 @@
 
 <nav class="blue-grey darken-4 z-depth-3" role="navigation">
     <div class="nav-wrapper container">
-        <a id="logo-container" href="#" class="brand-logo"><i class="material-icons large">people</i></a>
+        <a id="logo-container" href="#" class="brand-logo">Discrod IMERIR Social Club</a>
         <ul class="right hide-on-med-and-down">
 
             <li>
@@ -31,62 +31,89 @@
                 <a href="#" data-target="slide-out" class="sidenav-trigger">Home</a>
             </li>
             <li>
-                <a href="#" data-activates="slide-out" class="button-collapse"><i class="material-icons">ac_unit</i></a>
+                <a href="#" data-activates="slide-out" class="button-collapse-1">Playlist</a>
             </li>
         </ul>
-        <a href="#" data-activates="nav-mobile" class="button-collapse"><i class="material-icons">menu</i></a>
+        <a href="#" data-activates="nav-mobile" class="button-collapse-1 button-collapse"><i class="material-icons">menu</i></a>
     </div>
 </nav>
 
 <div class="section no-pad-bot main" id="index-banner">
-    <div class="container">
+    <div class="row">
+        <div class="col s8">
             <div class="row center" >
-            <img class="responsive-img z-depth-3" style="max-width: 30%" src="https://s3-storage.textopus.nl/wp-content/uploads/2014/06/21163734/The-Test-Fun-for-Friends-iPhone-iPad.png"/>
+                <img class="responsive-img z-depth-3" id="music_img" style="max-width: 30%" src=""/>
             </div>
-        <h4 class="center">Test- By test</h4>
+            <h4 class="center" id="music_text"></h4>
             <div class="row center">
                 <div class="progress col s6 offset-s3 z-depth-3">
-                <div class="determinate" style="width: 70%"></div>
+                    <div class="determinate" id="music_progress" style="width: 0%"></div>
                 </div>
             </div>
             <div class="row center">
                 <div class="col s2 offset-s3 center">
-                <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light">
+                    <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_stop">
-                    <i class="material-icons medium">skip_previous</i>
+                        <i class="material-icons medium">stop</i>
                     </a>
                 </div>
                 <div class="col s2 center">
-                <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light">
+                    <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_play">
                         <i class="material-icons medium">play_arrow</i>
                     </a>
                 </div>
                 <div class="col s2 center">
-                <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" >
+                    <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_next">
                         <i class="material-icons">skip_next</i>
                     </a>
                 </div>
             </div>
             <div class="row center">
-            <div class="col s2 center offset-s4">
+
-                <a class="btn blue-grey darken-4 z-depth-3 waves-effect waves-light">
+                <div class="col offset-s5 s2 center">
-                    <i class="material-icons">stop</i>
+                    <a class="btn blue-grey darken-4 z-depth-3 waves-effect waves-light modal-trigger" href="#modal1" id="btn_info">
-                </a>
-            </div>
-            <div class="col s2 center">
-                <a class="btn blue-grey darken-4 z-depth-3 waves-effect waves-light">
                         <i class="material-icons">info</i>
                     </a>
                 </div>
             </div>
-
         </div>
-    <ul id="slide-out" class="side-nav fixed z-depth-3">
+        <div class="col s4" >
+            <ul id="playlist_list" class="collapsible popout" data-collapsible="accordion" style="margin: 0px">
 
             </ul>
+        </div>
 
 
     </div>
 
+    <!-- Playlist -->
+
+
+    <!-- Modal Structure -->
+    <div id="modal1" class="modal bottom-sheet">
+        <div class="modal-content">
+            <ul class="collection">
+                <li class="collection-item " id="modal_title"></li>
+                <li class="collection-item " id="modal_author"></li>
+                <li class="collection-item " id="modal_lenght"></li>
+                <li class="collection-item " id="modal_url"></li>
+            </ul>
+        </div>
+
+    </div>
+
+
+</div>
+<li id="playlist_template" style="visibility: hidden">
+    <div class="collapsible-header"><i class="material-icons">drag_handle</i>@title</div>
+    <div class="collapsible-body">
+        <ul class="collection">
+            <li class="collection-item">Author: @author</li>
+            <li class="collection-item">Duration: @lenght</li>
+            <li class="collection-item">URL: <a>@url</a></li>
+        </ul>
+    </div>
+</li>
+
 <!--  Scripts-->
 <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
 <script src="js/materialize.js"></script>