diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css index 1f5132ae..8421c5ab 100644 --- a/copyparty/web/browser.css +++ b/copyparty/web/browser.css @@ -48,12 +48,30 @@ body { padding: 1em 1.3em; border-width: .4em 0; transform: translateX(100%); - transition: all .3s cubic-bezier(.2, 1.2, .5, 1);; + transition: all .3s cubic-bezier(.2, 1.2, .5, 1); + text-shadow: 1px 1px 0 #000; + color: #fff; } #toast.vis { right: 1.3em; transform: unset; } +#toast.inf { + background: #07a; + border-color: #0be; +} +#toast.ok { + background: #4a0; + border-color: #8e4; +} +#toast.warn { + background: #a70; + border-color: #fc0; +} +#toast.err { + background: #b00; + border-color: #f00; +} #tt.b { padding: 0 2em; border-radius: .5em; @@ -1009,11 +1027,13 @@ html.light { background: #eee; text-shadow: none; } -html.light #tt, -html.light #toast { +html.light #tt { background: #fff; border-color: #888 #000 #777 #000; - box-shadow: 0 .3em 1em rgba(0,0,0,0.4); +} +html.light #tt, +html.light #toast { + box-shadow: 0 .3em 1em rgba(0,0,0,0.4); } html.light #tt code { background: #060; diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js index 0e672381..9e517fab 100644 --- a/copyparty/web/browser.js +++ b/copyparty/web/browser.js @@ -1523,11 +1523,11 @@ var fileman = (function () { vp = vps.shift(); if (!vp) { - toast.show('delete OK', 2000); + toast.ok(2000, 'delete OK'); treectl.goto(get_evpath()); return; } - toast.show('deleting ' + (vps.length + 1) + ' items

' + vp, 2000); + toast.inf(2000, 'deleting ' + (vps.length + 1) + ' items

' + vp); xhr.open('GET', vp + '?delete', true); xhr.onreadystatechange = delete_cb; @@ -1539,7 +1539,7 @@ var fileman = (function () { if (this.status !== 200) { var msg = this.responseText; - toast.show('delete failed:
' + msg, 2000); + toast.err(2000, 'delete failed:
' + msg); return; } deleter(); @@ -1564,7 +1564,7 @@ var fileman = (function () { cl.add(inv ? 'c2' : 'c1'); } - toast.show('cut ' + sel.length + ' items', 1000); + toast.inf(1000, 'cut ' + sel.length + ' items'); jwrite('fman_clip', vps); r.tx(); }; @@ -1597,6 +1597,9 @@ var fileman = (function () { if (exists.length) alert('these ' + exists.length + ' items cannot be pasted here (names already exist):\n\n' + exists.join('\n')); + if (!req.length) + return; + if (!confirm('paste these ' + req.length + ' items here?\n\n' + req.join('\n'))) return; @@ -1605,11 +1608,11 @@ var fileman = (function () { vp = req.shift(); if (!vp) { - toast.show('paste OK', 2000); + toast.ok(2000, 'paste OK'); treectl.goto(get_evpath()); return; } - toast.show('pasting ' + (req.length + 1) + ' items

' + vp, 2000); + toast.inf(2000, 'pasting ' + (req.length + 1) + ' items

' + vp); var dst = get_evpath() + vp.split('/').slice(-1)[0]; @@ -1623,7 +1626,7 @@ var fileman = (function () { if (this.status !== 200) { var msg = this.responseText; - toast.show('paste failed:
' + msg, 2000); + toast.err(2000, 'paste failed:
' + msg); return; } paster(); diff --git a/copyparty/web/util.js b/copyparty/web/util.js index e8800c79..84cef05c 100644 --- a/copyparty/web/util.js +++ b/copyparty/web/util.js @@ -654,11 +654,24 @@ var toast = (function () { clmod(obj, 'vis'); }; - r.show = function (txt, ms) { + r.show = function (cl, ms, txt) { clearTimeout(te); te = setTimeout(r.hide, ms); obj.innerHTML = txt; - clmod(obj, 'vis', 1000); + obj.className = cl + ' vis'; + }; + + r.ok = function (ms, txt) { + r.show('ok', ms, txt); + }; + r.inf = function (ms, txt) { + r.show('inf', ms, txt); + }; + r.warn = function (ms, txt) { + r.show('warn', ms, txt); + }; + r.err = function (ms, txt) { + r.show('err', ms, txt); }; return r;