vitalif
/
likeopera-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Full keyboard list navigation

master
Vitaliy Filippov 2016-06-22 21:23:50 +03:00
parent 75065941f3
commit 46ab9bf386
2 changed files with 77 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
mail.css
View File

@ -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

111
mail.js
View File

@ -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()