From d283c512d54801150663778bad472d825093f925 Mon Sep 17 00:00:00 2001 From: Mattias Erming Date: Tue, 23 Sep 2014 16:05:07 -0700 Subject: [PATCH] Sortable sidebar (experimental) --- client/css/style.css | 17 +++++++++++------ client/js/shout.js | 29 +++++++++++++++++++++++++++++ package.json | 2 +- 3 files changed, 41 insertions(+), 7 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index 7f43443e..5d911d95 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -127,7 +127,7 @@ button { bottom: 52px; left: 0; overflow: hidden; - overflow-y: auto; + /*overflow-y: auto;*/ -webkit-overflow-scrolling: touch; position: absolute; top: 0; @@ -149,13 +149,14 @@ button { } #sidebar .networks { min-height: 100%; - padding: 20px 30px 40px; + padding: 20px 30px 0; } #sidebar .networks:empty { padding: 0; } -#sidebar .network + .network { - margin-top: 30px; +#sidebar .network, +#sidebar .network-placeholder { + margin-bottom: 30px; } #sidebar .empty { color: #9ca5b4; @@ -165,15 +166,19 @@ button { padding: 20px 40px; text-align: center; } -#sidebar .chan { +#sidebar .chan, +#sidebar .chan-placeholder { display: block; margin: 1px -10px; padding: 6px 10px 8px; position: relative; text-align: left; - transition: all .2s; + transition: color .2s; width: 180px; } +#sidebar .chan-placeholder { + padding-bottom: 10px; +} #sidebar .chan:first-child { color: #84ce88; font-size: 15px; diff --git a/client/js/shout.js b/client/js/shout.js index 3871aef9..7ea0c70d 100644 --- a/client/js/shout.js +++ b/client/js/shout.js @@ -147,6 +147,8 @@ $(function() { $("#footer").find(".connect").trigger("click"); } } + + sortable(); }); socket.on("join", function(data) { @@ -221,6 +223,7 @@ $(function() { .prop("disabled", false) .end(); confirmExit(); + sortable(); }); socket.on("nick", function(data) { @@ -671,6 +674,32 @@ $(function() { return date; } + function sortable() { + sidebar.sortable({ + axis: "y", + containment: "parent", + cursor: "grabbing", + items: ".network", + handle: ".lobby", + placeholder: "network-placeholder", + forcePlaceholderSize: true, + update: function() { + // .. + } + }); + sidebar.find(".network").sortable({ + axis: "y", + containment: "parent", + cursor: "grabbing", + items: ".chan:not(.lobby)", + placeholder: "chan-placeholder", + forcePlaceholderSize: true, + update: function() { + // .. + } + }); + } + document.addEventListener( "visibilitychange", function() { diff --git a/package.json b/package.json index 764fce44..60bd5d45 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "shout", "description": "A web IRC client", - "version": "0.32.5", + "version": "0.33.0", "author": "Mattias Erming", "preferGlobal": true, "bin": {