Implement UID method of playlist management (#182)

channel.js

@@ -728,7 +728,6 @@ Channel.prototype.sendChannelRanks = function(user) {
 
 Channel.prototype.sendPlaylist = function(user) {
     user.socket.emit("playlist", this.queue);
-    user.socket.emit("setPosition", this.position);
     user.socket.emit("setPlaylistMeta", this.plmeta);
 }
 
@@ -1002,15 +1001,25 @@ function isLive(type) {
         || type == "im";// Imgur album
 }
 
-Channel.prototype.queueAdd = function(media, idx) {
+Channel.prototype.queueAdd = function(media, after) {
-    this.queue.splice(idx, 0, media);
+    if(after === "") {
+        this.queue.splice(0, 0, media);
+    }
+    else {
+        for(var i = 0; i < this.queue.length; i++) {
+            if(this.queue[i].hash == after) {
+                this.queue.splice(i+1, 0, media);
+                break;
+            }
+        }
+    }
     this.sendAll("queue", {
         media: media.pack(),
-        pos: idx
+        after: after
     });
     this.broadcastPlaylistMeta();
     if(this.queue.length == 1) {
-        this.playNext();
+        this.jumpTo(media.hash);
     }
 }
 
@@ -1024,7 +1033,13 @@ Channel.prototype.autoTemp = function(media, user) {
 }
 
 Channel.prototype.enqueue = function(data, user, callback) {
-    var idx = data.pos == "next" ? this.position + 1 : this.queue.length;
+    var after = "";
+    if(data.pos == "next" && this.queue.length > 0 && this.position >= 0) {
+        after = this.queue[this.position].hash;
+    }
+    else if(data.pos == "end" && this.queue.length > 0) {
+        after = this.queue[this.queue.length - 1].hash;
+    }
 
     if(isLive(data.type) && !this.hasPermission(user, "playlistaddlive")) {
         user.socket.emit("queueFail", "You don't have permission to queue livestreams");
@@ -1036,7 +1051,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
         var media = this.library[data.id].dup();
         media.queueby = user ? user.name : "";
         this.autoTemp(media, user);
-        this.queueAdd(media, idx);
+        this.queueAdd(media, after);
         this.logger.log("*** Queued from cache: id=" + data.id);
         if(callback)
             callback();
@@ -1059,10 +1074,10 @@ Channel.prototype.enqueue = function(data, user, callback) {
                     }
                     media.queueby = user ? user.name : "";
                     this.autoTemp(media, user);
-                    this.queueAdd(media, idx);
+                    this.queueAdd(media, after);
                     this.cacheMedia(media);
                     if(data.type == "yp")
-                        idx++;
+                        after++;
                     if(callback)
                         callback();
                 }.bind(this));
@@ -1071,7 +1086,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                 var media = new Media(data.id, "Livestream - " + data.id, "--:--", "li");
                 media.queueby = user ? user.name : "";
                 this.autoTemp(media, user);
-                this.queueAdd(media, idx);
+                this.queueAdd(media, after);
                 if(callback)
                     callback();
                 break;
@@ -1079,7 +1094,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                 var media = new Media(data.id, "Twitch - " + data.id, "--:--", "tw");
                 media.queueby = user ? user.name : "";
                 this.autoTemp(media, user);
-                this.queueAdd(media, idx);
+                this.queueAdd(media, after);
                 if(callback)
                     callback();
                 break;
@@ -1087,7 +1102,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                 var media = new Media(data.id, "JustinTV - " + data.id, "--:--", "jt");
                 media.queueby = user ? user.name : "";
                 this.autoTemp(media, user);
-                this.queueAdd(media, idx);
+                this.queueAdd(media, after);
                 if(callback)
                     callback();
                 break;
@@ -1096,7 +1111,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                     var media = new Media(id, "Ustream - " + data.id, "--:--", "us");
                     media.queueby = user ? user.name : "";
                     this.autoTemp(media, user);
-                    this.queueAdd(media, idx);
+                    this.queueAdd(media, after);
                     if(callback)
                         callback();
                 }.bind(this));
@@ -1105,7 +1120,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                 var media = new Media(data.id, "Livestream", "--:--", "rt");
                 media.queueby = user ? user.name : "";
                 this.autoTemp(media, user);
-                this.queueAdd(media, idx);
+                this.queueAdd(media, after);
                 if(callback)
                     callback();
                 break;
@@ -1113,7 +1128,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                 var media = new Media(data.id, "JWPlayer Stream - " + data.id, "--:--", "jw");
                 media.queueby = user ? user.name : "";
                 this.autoTemp(media, user);
-                this.queueAdd(media, idx);
+                this.queueAdd(media, after);
                 if(callback)
                     callback();
                 break;
@@ -1121,7 +1136,7 @@ Channel.prototype.enqueue = function(data, user, callback) {
                 var media = new Media(data.id, "Imgur Album", "--:--", "im");
                 media.queueby = user ? user.name : "";
                 this.autoTemp(media, user);
-                this.queueAdd(media, idx);
+                this.queueAdd(media, after);
                 if(callback)
                     callback();
                 break;
@@ -1208,16 +1223,24 @@ Channel.prototype.tryQueuePlaylist = function(user, data) {
     this.enqueueList(data, user);
 }
 
-Channel.prototype.setTemp = function(idx, temp) {
+Channel.prototype.setTemp = function(hash, temp) {
-    var med = this.queue[idx];
+    var m = false;
-    med.temp = temp;
+    for(var i = 0; i < this.queue.length; i++) {
+        if(this.queue[i].hash == hash) {
+            m = this.queue[i];
+            break;
+        }
+    }
+    if(!m)
+        return;
+    m.temp = temp;
     this.sendAll("setTemp", {
-        position: idx,
+        hash: hash,
         temp: temp
     });
 
     if(!temp) {
-        this.cacheMedia(med);
+        this.cacheMedia(m);
     }
 }
 
@@ -1225,25 +1248,30 @@ Channel.prototype.trySetTemp = function(user, data) {
     if(!this.hasPermission(user, "settemp")) {
         return;
     }
-    if(typeof data.position != "number" || typeof data.temp != "boolean") {
+    if(typeof data.hash != "string" || typeof data.temp != "boolean") {
-        return;
-    }
-    if(data.position < 0 || data.position >= this.queue.length) {
         return;
     }
 
-    this.setTemp(data.position, data.temp);
+    this.setTemp(data.hash, data.temp);
 }
 
 
-Channel.prototype.dequeue = function(position, removeonly) {
+Channel.prototype.dequeue = function(hash, removeonly) {
-    if(position < 0 || position >= this.queue.length) {
+    var m = false;
+    var mpos = 0;
+    for(var i = 0; i < this.queue.length; i++) {
+        if(this.queue[i].hash == hash) {
+            mpos = i;
+            m = this.queue[i];
+            break;
+        }
+    }
+    if(!m) {
         return;
     }
-
+    this.queue.splice(mpos, 1);
-    this.queue.splice(position, 1);
     this.sendAll("delete", {
-        position: position
+        hash: hash
     });
     this.broadcastPlaylistMeta();
 
@@ -1251,14 +1279,14 @@ Channel.prototype.dequeue = function(position, removeonly) {
         return;
 
     // If you remove the currently playing video, play the next one
-    if(position == this.position) {
+    if(mpos == this.position) {
         this.position--;
         this.playNext();
         return;
     }
     // If you remove a video whose position is before the one currently
     // playing, you have to reduce the position of the one playing
-    if(position < this.position) {
+    if(mpos < this.position) {
         this.position--;
     }
 }
@@ -1268,7 +1296,7 @@ Channel.prototype.tryDequeue = function(user, data) {
         return;
      }
 
-     if(typeof data !== "number")
+     if(typeof data !== "string")
          return;
 
      this.dequeue(data);
@@ -1288,7 +1316,7 @@ Channel.prototype.tryUncache = function(user, data) {
 
 Channel.prototype.playNext = function() {
     var pos = this.position + 1 >= this.queue.length ? 0 : this.position + 1;
-    this.jumpTo(pos);
+    this.jumpTo(this.queue[pos].hash);
 }
 
 Channel.prototype.tryPlayNext = function(user) {
@@ -1299,11 +1327,20 @@ Channel.prototype.tryPlayNext = function(user) {
      this.playNext();
 }
 
-Channel.prototype.jumpTo = function(pos) {
+Channel.prototype.jumpTo = function(hash) {
-    if(pos >= this.queue.length || pos < 0) {
+    var m = false;
-        return;
+    var mpos = 0;
+    for(var i = 0; i < this.queue.length; i++) {
+        if(this.queue[i].hash == hash) {
+            m = this.queue[i];
+            mpos = i;
+            break;
+        }
     }
 
+    if(!m)
+        return;
+
     // Reset voteskip
     this.voteskip = false;
     this.broadcastVoteskipUpdate();
@@ -1311,27 +1348,23 @@ Channel.prototype.jumpTo = function(pos) {
     this.broadcastDrinks();
 
     var old = this.position;
-    if(this.media && this.media.temp && old != pos) {
+    if(this.media && this.media.temp) {
-        this.dequeue(old, true);
+        this.dequeue(this.media.hash, true);
-        if(pos > old && pos > 0) {
+        if(mpos > old && mpos > 0) {
-            pos--;
+            mpos--;
         }
     }
-    if(pos >= this.queue.length || pos < 0) {
-        return;
-    }
     if(this.media) {
         delete this.media["currentTime"];
         delete this.media["paused"];
     }
-    this.position = pos;
+    this.position = mpos;
     var oid = this.media ? this.media.id : "";
-    this.media = this.queue[this.position];
+    this.media = m;
     this.media.currentTime = -1;
     this.media.paused = false;
 
     this.sendAll("changeMedia", this.media.fullupdate());
-    this.sendAll("setPosition", this.position);
 
     // If it's not a livestream, enable autolead
     if(this.leader == null && !isLive(this.media.type)) {
@@ -1347,7 +1380,7 @@ Channel.prototype.tryJumpTo = function(user, data) {
          return;
     }
 
-    if(typeof data !== "number") {
+    if(typeof data !== "string") {
         return;
     }
 
@@ -1383,7 +1416,6 @@ Channel.prototype.shufflequeue = function() {
     }
     this.queue = n;
     this.sendAll("playlist", this.queue);
-    this.sendAll("setPosition", this.position);
     this.sendAll("setPlaylistMeta", this.plmeta);
 }
 
@@ -1422,50 +1454,68 @@ Channel.prototype.tryUpdate = function(user, data) {
 }
 
 Channel.prototype.move = function(data, user) {
-    if(data.from < 0 || data.from >= this.queue.length) {
+    var mfrom = false;
-        return;
+    var fromidx = false;
-    }
+    var mafter = false;
-    if(data.to < 0 || data.to > this.queue.length) {
+    var toidx = false;
-        return;
+    // Find the two elements
+    for(var i = 0; i < this.queue.length; i++) {
+        if(this.queue[i].hash == data.from) {
+            mfrom = this.queue[i];
+            fromidx = i;
+            if(data.after === "" || mafter)
+                break;
+        }
+        else if(this.queue[i].hash == data.after) {
+            mafter = this.queue[i];
+            toidx = i+1;
+            if(mfrom)
+                break;
+        }
     }
 
-    var media = this.queue[data.from];
+    this.queue.splice(fromidx, 1);
-    var to = data.to > data.from ? data.to + 1 : data.to;
+    if(data.after === "") {
-    var from =  data.to > data.from ? data.from      : data.from + 1;
+        this.queue.splice(0, 0, mfrom);
+    }
+    else {
+        var to = toidx;
+        if(fromidx < toidx)
+            toidx--;
+        this.queue.splice(toidx, 0, mfrom);
+    }
     var moveby = user && user.name ? user.name : null;
     if(typeof data.moveby !== "undefined")
         moveby = data.moveby;
 
-    this.queue.splice(to, 0, media);
-    this.queue.splice(from, 1);
     this.sendAll("moveVideo", {
         from: data.from,
-        to: data.to,
+        after: data.after,
         moveby: moveby
     });
 
     // Account for moving things around the active video
-    if(data.from < this.position && data.to >= this.position) {
+    if(fromidx < this.position && toidx >= this.position) {
         this.position--;
     }
-    else if(data.from > this.position && data.to < this.position) {
+    else if(fromidx > this.position && toidx <= this.position) {
         this.position++
     }
-    else if(data.from == this.position) {
+    else if(fromidx == this.position) {
-        this.position = data.to;
+        this.position = toidx;
     }
+
 }
 
 Channel.prototype.tryMove = function(user, data) {
     if(!this.hasPermission(user, "playlistmove")) {
-         return;
+        return;
     }
 
-     if(typeof data.from !== "number" || typeof data.to !== "number") {
+    if(typeof data.from !== "string" || typeof data.after !== "string")
-         return;
+        return;
-     }
 
-     this.move(data, user);
+    this.move(data, user);
 }
 
 /* REGION Polls */

media.js

@@ -9,6 +9,8 @@ The above copyright notice and this permission notice shall be included in all c
 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */
 
+var hashlib = require("node_hash");
+
 // Helper function for formatting a time value in seconds
 // to the format hh:mm:ss
 function formatTime(sec) {
@@ -41,6 +43,10 @@ function formatTime(sec) {
 
 exports.formatTime = formatTime;
 
+function mediaHash(id) {
+    return hashlib.sha1(id + Date.now());
+}
+
 // Represents a media entry
 var Media = function(id, title, seconds, type) {
     this.id = id;
@@ -53,12 +59,14 @@ var Media = function(id, title, seconds, type) {
     this.type = type;
     this.queueby = "";
     this.temp = false;
+    this.hash = mediaHash(id);
 }
 
 Media.prototype.dup = function() {
     var m = new Media(this.id, this.title, this.seconds, this.type);
     m.queueby = this.queueby;
     m.temp = this.temp;
+    m.hash = this.hash;
     return m;
 }
 
@@ -72,7 +80,8 @@ Media.prototype.pack = function() {
         duration: this.duration,
         type: this.type,
         queueby: this.queueby,
-        temp: this.temp
+        temp: this.temp,
+        hash: this.hash,
     };
 }
 
@@ -88,7 +97,8 @@ Media.prototype.fullupdate = function() {
         currentTime: this.currentTime,
         paused: this.paused,
         queueby: this.queueby,
-        temp: this.temp
+        temp: this.temp,
+        hash: this.hash
     };
 }
 

www/assets/js/callbacks.js

@@ -649,25 +649,25 @@ Callbacks = {
     },
 
     queue: function(data) {
-        // Wait until pending movements are completed
-        if(PL_MOVING || PL_ADDING || PL_DELETING) {
-            setTimeout(function() {
-                Callbacks.queue(data);
-            }, 100);
-            return;
-        }
         var li = makeQueueEntry(data.media, true);
         li.hide();
-        var idx = data.pos;
         var q = $("#queue");
         li.attr("title", data.media.queueby
                             ? ("Added by: " + data.media.queueby)
                             : "Added by: Unknown");
-        if(idx < q.children().length - 1)
+        if(data.after == "") {
-            li.insertBefore(q.children()[idx])
+            li.prependTo(q);
-        else
+            li.show("blind");
-            li.appendTo(q);
+            return;
-        li.show("blind");
+        }
+        var qli = q.find("li");
+        for(var i = 0; i < qli.length; i++) {
+            if($(qli[i]).data("hash") == data.after) {
+                li.insertAfter(qli[i]);
+                li.show("blind");
+                return;
+            }
+        }
     },
 
     queueFail: function(data) {
@@ -680,89 +680,79 @@ Callbacks = {
     },
 
     setTemp: function(data) {
-        var li = $("#queue").children()[data.position];
+        var li = false;
-        li = $(li);
+        var qli = $("#queue li");
+        for(var i = 0; i < qli.length; i++) {
+            if($(qli[i]).data("hash") == data.hash) {
+                li = $(qli[i]);
+                break;
+            }
+        }
+        if(!li)
+            return;
         if(data.temp)
             li.addClass("queue_temp");
         else
             li.removeClass("queue_temp");
         var btn = li.find(".qbtn-tmp");
-        btn.data("temp", data.temp);
+        if(btn.length > 0) {
-        if(data.temp) {
+            btn.data("temp", data.temp);
-            btn.html(btn.html().replace("Make Temporary",
+            if(data.temp) {
-                                        "Make Permanent"));
+                btn.html(btn.html().replace("Make Temporary",
-        }
+                                            "Make Permanent"));
-        else {
+            }
-            btn.html(btn.html().replace("Make Permanent",
+            else {
-                                        "Make Temporary"));
+                btn.html(btn.html().replace("Make Permanent",
+                                            "Make Temporary"));
+            }
         }
     },
 
     "delete": function(data) {
-        // Wait until any pending manipulation is finished
+        var li = false;
-        if(PL_MOVING || PL_ADDING || PL_DELETING) {
+        var qli = $("#queue li");
-            setTimeout(function() {
+        for(var i = 0; i < qli.length; i++) {
-                Callbacks["delete"](data);
+            if($(qli[i]).data("hash") == data.hash) {
-            }, 100);
+                li = $(qli[i]);
-            return;
+                break;
+            }
         }
-        var li = $("#queue").children()[data.position];
+        if(!li)
-        $(li).remove();
+            return;
+        li.hide("blind", function() {
+            li.remove();
+        });
     },
 
     moveVideo: function(data) {
-        // Wait until any pending manipulation is finished
-        if(PL_MOVING || PL_ADDING || PL_DELETING) {
-            setTimeout(function() {
-                Callbacks.moveVideo(position);
-            }, 100);
-            return;
-        }
-        if(data.from < POSITION && data.to >= POSITION)
-            POSITION--;
-        else if(data.from > POSITION && data.to <= POSITION)
-            POSITION++;
-        else if(data.from == POSITION)
-            POSITION = data.to;
         if(data.moveby != CLIENT.name)
-            playlistMove(data.from, data.to);
+            playlistMove(data.from, data.after);
-    },
-
-    setPosition: function(position) {
-        // Wait until any pending manipulation is finished
-        if(PL_MOVING || PL_ADDING || PL_DELETING) {
-            setTimeout(function() {
-                Callbacks.setPosition(position);
-            }, 100);
-            return;
-        }
-        $("#queue li").each(function() {
-            $(this).removeClass("queue_active");
-        });
-        if(position < 0)
-            return;
-        POSITION = position;
-        var linew = $("#queue").children()[POSITION];
-        // jQuery UI's sortable thingy kinda fucks this up initially
-        // Wait until it's done
-        if(!$(linew).hasClass("queue_entry")) {
-            setTimeout(function() {
-                Callbacks.setPosition(position);
-            }, 100);
-            return;
-        }
-        $(linew).addClass("queue_active");
-
-        $("#queue").scrollTop(0);
-        var scroll = $(linew).position().top - $("#queue").position().top;
-        $("#queue").scrollTop(scroll);
-
-        if(CHANNEL.opts.allow_voteskip)
-            $("#voteskip").attr("disabled", false);
     },
 
     changeMedia: function(data) {
+        MEDIA = data;
+        var qli = $("#queue li");
+        var li = false;
+        $("#queue li").removeClass("queue_active");
+        for(var i = 0; i < qli.length; i++) {
+            if($(qli[i]).data("hash") == MEDIA.hash) {
+                $(qli[i]).addClass("queue_active");
+                li = $(qli[i]);
+                break;
+            }
+        }
+
+        if(li) {
+            $("#queue").scrollTop(0);
+            var scroll = li.position().top - $("#queue").position().top;
+            $("#queue").scrollTop(scroll);
+        }
+
+        if(CHANNEL.opts.allow_voteskip)
+            $("#voteskip").attr("disabled", false);
+
         $("#currenttitle").text("Currently Playing: " + data.title);
+
         if(data.type != "sc" && PLAYER.type == "sc")
             // [](/goddamnitmango)
             fixSoundcloudShit();
@@ -858,7 +848,6 @@ Callbacks = {
         for(var i = 0; i < data.options.length; i++) {
             (function(i) {
             var callback = function() {
-                    console.log("vote", i);
                     socket.emit("vote", {
                         option: i
                     });
@@ -990,7 +979,6 @@ Callbacks = {
     }
 }
 setupCallbacks = function() {
-    console.log(socket);
     for(var key in Callbacks) {
         (function(key) {
         socket.on(key, function(data) {

www/assets/js/data.js

@@ -39,7 +39,7 @@ if($("#ytapiplayer").length > 0) {
     var VWIDTH = $("#ytapiplayer").parent().css("width").replace("px", "");
     var VHEIGHT = ""+parseInt(parseInt(VWIDTH) * 9 / 16);
 }
-var POSITION = -1;
+var MEDIA = { hash: "" };
 var PL_MOVING = false;
 var PL_ADDING = false;
 var PL_DELETING = false;
@@ -63,8 +63,8 @@ var KICKED = false;
 var NAME = readCookie("cytube_uname");
 var SESSION = readCookie("cytube_session");
 var LEADTMR = false;
-var PL_FROM = 0;
+var PL_FROM = "";
-var PL_TO = 0;
+var PL_AFTER = "";
 var FILTER_FROM = 0;
 var FILTER_TO = 0;
 

www/assets/js/ui.js

@@ -203,16 +203,18 @@ $("#userpl_save").click(function() {
 
 $("#queue").sortable({
     start: function(ev, ui) {
-        PL_FROM = ui.item.prevAll().length;
+        PL_FROM = ui.item.data("hash");
     },
     update: function(ev, ui) {
-        PL_TO = ui.item.prevAll().length;
+        var prev = ui.item.prevAll();
-        if(PL_TO != PL_FROM) {
+        if(prev.length == 0)
-            socket.emit("moveMedia", {
+            PL_AFTER = "";
-                from: PL_FROM,
+        else
-                to: PL_TO
+            PL_AFTER = $(prev[0]).data("hash");
-            });
+        socket.emit("moveMedia", {
-        }
+            from: PL_FROM,
+            after: PL_AFTER
+        });
     }
 });
 $("#queue").disableSelection();

www/assets/js/util.js

@@ -208,6 +208,7 @@ function makeQueueEntry(video, addbtns) {
     var li = $("<li/>");
     li.addClass("queue_entry");
     li.data("media", video);
+    li.data("hash", video.hash);
     if(video.thumb) {
         $("<img/>").attr("src", video.thumb.url)
             .css("float", "left")
@@ -238,8 +239,7 @@ function addQueueButtons(li) {
         $("<button/>").addClass("btn btn-mini qbtn-play")
             .html("<i class='icon-play'></i>Play")
             .click(function() {
-                var i = $("#queue").children().index(li);
+                socket.emit("jumpTo", li.data("hash"));
-                socket.emit("jumpTo", i);
             })
             .appendTo(menu);
     }
@@ -248,10 +248,9 @@ function addQueueButtons(li) {
         $("<button/>").addClass("btn btn-mini qbtn-next")
             .html("<i class='icon-share-alt'></i>Queue Next")
             .click(function() {
-                var i = $("#queue").children().index(li);
                 socket.emit("moveMedia", {
-                    from: i,
+                    from: li.data("hash"),
-                    to: i < POSITION ? POSITION : POSITION + 1,
+                    after: MEDIA.hash,
                     moveby: null
                 });
             })
@@ -263,10 +262,9 @@ function addQueueButtons(li) {
         $("<button/>").addClass("btn btn-mini qbtn-tmp")
             .html("<i class='icon-flag'></i>" + tempstr)
             .click(function() {
-                var i = $("#queue").children().index(li);
                 var temp = li.find(".qbtn-tmp").data("temp");
                 socket.emit("setTemp", {
-                    position: i,
+                    hash: li.data("hash"),
                     temp: !temp
                 });
             })
@@ -277,8 +275,7 @@ function addQueueButtons(li) {
         $("<button/>").addClass("btn btn-mini qbtn-delete")
             .html("<i class='icon-trash'></i>Delete")
             .click(function() {
-                var i = $("#queue").children().index(li);
+                socket.emit("delete", li.data("hash"));
-                socket.emit("delete", i);
             })
             .appendTo(menu);
     }
@@ -947,24 +944,39 @@ function addLibraryButtons(li, id, type) {
 
 /* queue stuff */
 
-function playlistMove(from, to) {
+function playlistMove(from, after) {
-    if(from < 0 || to < 0)
+    var lifrom = false;
-        return false;
+    var liafter = false;
     var q = $("#queue");
-    if(from >= q.children().length)
+    var qli = $("#queue li");
-        return false;
+    for(var i = 0; i < qli.length; i++) {
-
+        if($(qli[i]).data("hash") == from) {
-    MOVING = true;
+            lifrom = $(qli[i]);
-    var old = $(q.children()[from]);
+            if(after === "" || liafter)
-    old.hide("blind", function() {
+                break;
-        old.detach();
+        }
-        if(to >= q.children().length)
+        else if($(qli[i]).data("hash") == after) {
-            old.appendTo(q);
+            liafter = qli[i];
-        else
+            if(lifrom)
-            old.insertBefore(q.children()[to]);
+                break;
-        old.show("blind");
+        }
-        MOVING = false;
+    }
-    });
+    if(!lifrom)
+        return;
+    if(after === "") {
+        lifrom.hide("blind", function() {
+            lifrom.detach();
+            lifrom.prependTo(q);
+            lifrom.show("blind");
+        });
+    }
+    else {
+        lifrom.hide("blind", function() {
+            lifrom.detach();
+            lifrom.insertAfter(liafter);
+            lifrom.show("blind");
+        });
+    }
 }
 
 function parseMediaLink(url) {