From eb389d99d256388eb575dc6da2868accd5d1c242 Mon Sep 17 00:00:00 2001 From: Naomi Aro Date: Wed, 14 Mar 2012 17:50:48 +0100 Subject: [PATCH] CC-3434 : Playlist Builder fast deleting --- airtime_mvc/public/css/images/loader.gif | Bin 0 -> 10973 bytes airtime_mvc/public/css/playlist_builder.css | 10 ++ airtime_mvc/public/js/airtime/library/spl.js | 95 +++++++++++++------ 3 files changed, 75 insertions(+), 30 deletions(-) create mode 100644 airtime_mvc/public/css/images/loader.gif diff --git a/airtime_mvc/public/css/images/loader.gif b/airtime_mvc/public/css/images/loader.gif new file mode 100644 index 0000000000000000000000000000000000000000..799d7f1aa407665e6ecf046f0d64de68a098225b GIT binary patch literal 10973 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 SR{(K*0O=rr`e~zp?f(w}zXGBF literal 0 HcmV?d00001 diff --git a/airtime_mvc/public/css/playlist_builder.css b/airtime_mvc/public/css/playlist_builder.css index 4f08a3976..ed4eeb68b 100644 --- a/airtime_mvc/public/css/playlist_builder.css +++ b/airtime_mvc/public/css/playlist_builder.css @@ -456,4 +456,14 @@ div.helper li { li.spl_empty { height: 56px; +} + +.pl-overlay { + z-index:100; + opacity: 0.7; +} + +.pl-loading { + z-index:101; + background: transparent url(images/loader.gif) no-repeat 0 0; } \ No newline at end of file diff --git a/airtime_mvc/public/js/airtime/library/spl.js b/airtime_mvc/public/js/airtime/library/spl.js index 90e8d603f..8d6ccfc92 100644 --- a/airtime_mvc/public/js/airtime/library/spl.js +++ b/airtime_mvc/public/js/airtime/library/spl.js @@ -5,6 +5,7 @@ var AIRTIME = (function(AIRTIME){ AIRTIME.playlist = {}; + var mod = AIRTIME.playlist; function isTimeValid(time) { @@ -287,7 +288,7 @@ var AIRTIME = (function(AIRTIME){ } function setPlaylistContent(json) { - + $('#spl_name > a') .empty() .append(json.name); @@ -302,7 +303,6 @@ var AIRTIME = (function(AIRTIME){ .append(json.html); setModified(json.modified); - redrawLib(); } @@ -634,49 +634,84 @@ var AIRTIME = (function(AIRTIME){ }); }; - mod.fnAddItems = function(aItems, iAfter, sAddType) { - var lastMod = getModified(); + function playlistRequest(sUrl, oData) { + var lastMod = getModified(), + plContent = $("#side_playlist"), + offset = plContent.offset(), + plHeight = plContent.height(), + plWidth = plContent.width(), + overlay, + loading; - $.post("/playlist/add-items", - {format: "json", "ids": aItems, "afterItem": iAfter, "type": sAddType, "modified": lastMod}, - function(json){ + oData["modified"] = lastMod; + oData["format"] = "json"; + + + overlay = $("
", { + "class": "pl-overlay ui-widget-content", + "css": { + "position": "absolute", + "top": offset.top, + "left": offset.left, + "height": plHeight + 16, + "width": plWidth + 16 + } + }).click(function(){ + return false; + }); + + loading = $("
", { + "class": "pl-loading", + "css": { + "position": "absolute", + "top": offset.top + plHeight/2 - 120, + "left": offset.left + plWidth/2 - 120, + "height": 128, + "width": 128 + } + }); + + $("body") + .append(overlay) + .append(loading); + + $.post( + sUrl, + oData, + function(json){ + if (json.error !== undefined) { playlistError(json); } else { setPlaylistContent(json); } - }); + + loading.remove(); + overlay.remove(); + } + ); + } + + mod.fnAddItems = function(aItems, iAfter, sAddType) { + var sUrl = "/playlist/add-items"; + oData = {"ids": aItems, "afterItem": iAfter, "type": sAddType}; + + playlistRequest(sUrl, oData); }; mod.fnMoveItems = function(aIds, iAfter) { - var lastMod = getModified(); + var sUrl = "/playlist/move-items", + oData = {"ids": aIds, "afterItem": iAfter}; - $.post("/playlist/move-items", - {format: "json", "ids": aIds, "afterItem": iAfter, "modified": lastMod}, - function(json){ - if (json.error !== undefined) { - playlistError(json); - } - else { - setPlaylistContent(json); - } - }); + playlistRequest(sUrl, oData); }; mod.fnDeleteItems = function(aItems) { - var lastMod = getModified(); + var sUrl = "/playlist/delete-items", + oData = {"ids": aItems}; - $.post("/playlist/delete-items", - {format: "json", "ids": aItems, "modified": lastMod}, - function(json){ - if (json.error !== undefined) { - playlistError(json); - } - else { - setPlaylistContent(json); - } - }); + playlistRequest(sUrl, oData); }; mod.init = function() {