diff --git a/mail.css b/mail.css index 0a5b9ba..5056ea5 100644 --- a/mail.css +++ b/mail.css @@ -587,6 +587,12 @@ div top: 0; bottom: 0; cursor: default; + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .tab-panel .tab-bar diff --git a/mail.js b/mail.js index be4598b..325e876 100644 --- a/mail.js +++ b/mail.js @@ -765,6 +765,8 @@ var ComposeWindow = React.createClass({ }, attachKeyDown: function(ev) { + if (!this.state.attachments.length) + return; if (ev.keyCode == 46) // delete { for (var i = this.state.attachments.length-1; i >= 0; i--) @@ -773,32 +775,75 @@ var ComposeWindow = React.createClass({ this.setState({ attachments: this.state.attachments }); ev.stopPropagation(); } - else if (ev.keyCode == 40 || ev.keyCode == 38) // down, up + else if (ev.keyCode == 38 || ev.keyCode == 40 || ev.keyCode == 33 || ev.keyCode == 34) // up, down, pgup, pgdown { - var sel = null, dir = (ev.keyCode == 40 ? 1 : -1); - for (var i = 0; i < this.state.attachments.length; i++) + var sel = this.curSel, dir; + if (ev.keyCode < 35) + dir = (ev.keyCode == 34 ? 1 : -1) * Math.round(this.refs.scroll.offsetHeight / this.refs.a0.offsetHeight); + else + dir = (ev.keyCode == 40 ? 1 : -1); + if (sel !== null) { - if (this.state.attachments[i].selected) + var nsel = sel+dir; + if (nsel < 0) + nsel = 0; + if (nsel >= this.state.attachments.length) + nsel = this.state.attachments.length-1; + if (sel != nsel) { - sel = i; - break; + if (ev.shiftKey) + this.selectTo(nsel); + else + this.selectOne(nsel); + var item = this.refs['a'+nsel]; + if (item.offsetTop + item.offsetHeight > this.refs.scroll.scrollTop + this.refs.scroll.offsetHeight) + this.refs.scroll.scrollTop = item.offsetTop + item.offsetHeight - this.refs.scroll.offsetHeight; + else if (item.offsetTop < this.refs.scroll.scrollTop+this.refs.title.offsetHeight) + this.refs.scroll.scrollTop = item.offsetTop-this.refs.title.offsetHeight; + ev.stopPropagation(); + ev.preventDefault(); // prevent scroll } } - if (sel !== null && (sel+dir) >= 0 && (sel+dir) < this.state.attachments.length) - { - sel += dir; - for (var i = 0; i < this.state.attachments.length; i++) - this.state.attachments[i].selected = (i == sel); - this.setState({ attachments: this.state.attachments }); - var item = this.refs['a'+sel]; - if (item.offsetTop + item.offsetHeight > this.refs.scroll.scrollTop + this.refs.scroll.offsetHeight) - this.refs.scroll.scrollTop = item.offsetTop + item.offsetHeight - this.refs.scroll.offsetHeight; - else if (item.offsetTop < this.refs.scroll.scrollTop+this.refs.title.offsetHeight) - this.refs.scroll.scrollTop = item.offsetTop-this.refs.title.offsetHeight; - ev.stopPropagation(); - ev.preventDefault(); // prevent scroll - } } + else if (ev.keyCode == 36) // home + { + if (ev.shiftKey) + this.selectTo(0); + else + this.selectOne(0); + } + else if (ev.keyCode == 35) // end + { + if (ev.shiftKey) + this.selectTo(this.state.attachments.length-1); + else + this.selectOne(this.state.attachments.length-1); + } + }, + selectTo: function(ns) + { + if (this.lastSel === undefined) + return this.selectOne(ns); + if (ns < this.lastSel) + { + for (var i = 0; i < this.state.attachments.length; i++) + this.state.attachments[i].selected = i >= ns && i <= this.lastSel; + } + else if (ns > this.lastSel) + { + for (var i = 0; i < this.state.attachments.length; i++) + this.state.attachments[i].selected = i >= this.lastSel && i <= ns; + } + this.setState({ attachments: this.state.attachments }); + this.curSel = ns; + }, + selectOne: function(ns) + { + for (var i = 0; i < this.state.attachments.length; i++) + this.state.attachments[i].selected = (i == ns); + this.setState({ attachments: this.state.attachments }); + this.lastSel = ns; + this.curSel = ns; }, selectAttachment: function(ev) { @@ -808,31 +853,17 @@ var ComposeWindow = React.createClass({ if (t) { var ns = parseInt(t.getAttribute('data-i')); - if (ev.shiftKey && this.lastSel) - { - if (ns < this.lastSel) - { - for (var i = 0; i < this.state.attachments.length; i++) - this.state.attachments[i].selected = i >= ns && i <= this.lastSel; - } - else if (ns > this.lastSel) - { - for (var i = 0; i < this.state.attachments.length; i++) - this.state.attachments[i].selected = i >= this.lastSel && i <= ns; - } - } + if (ev.shiftKey) + this.selectTo(ns); else if (ev.ctrlKey) { this.state.attachments[ns].selected = true; - this.lastSel = ns; + this.curSel = ns; + this.lastSel = this.lastSel === undefined ? ns : this.lastSel; + this.setState({ attachments: this.state.attachments }); } else - { - this.lastSel = ns; - for (var i = 0; i < this.state.attachments.length; i++) - this.state.attachments[i].selected = (i == ns); - } - this.setState({ attachments: this.state.attachments }); + this.selectOne(ns); } }, render: function()