diff --git a/Gruntfile.js b/Gruntfile.js index 70ca8f5..8c5cc58 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -68,11 +68,11 @@ module.exports = function(grunt) { watch: { scripts: { files: "src/**/*.js", - tasks: "uglify", + tasks: "uglify" }, sass: { files: "src/**/*.scss", - tasks: "sass", + tasks: "sass" }, css: { files: "src/*.css", diff --git a/popup.html b/popup.html index 00ba320..14f7d1b 100644 --- a/popup.html +++ b/popup.html @@ -10,6 +10,7 @@ +
diff --git a/src/javascript/popup.js b/src/javascript/popup.js index 27b6924..94d7607 100644 --- a/src/javascript/popup.js +++ b/src/javascript/popup.js @@ -1,6 +1,8 @@ var $button = document.querySelector("#search"); //var $tipsContainer = document.querySelector("#tips"); var $input = document.querySelector("#query-word"); +var $historyList = document.querySelector("#query-history"); +var queryHistory=[]; var $queryResultContainer = document.querySelector("#query-result"); if (-1 !== window.navigator.platform.toLowerCase().indexOf("mac")) { @@ -49,6 +51,21 @@ var buildResult = function(response) { for (i = 0, len = voiceCollection.length; i < len; i++) { buildVoice(voiceCollection[i]); } + + //若有结果,无重复地写入历史记录 + if(resultObj.haveTranslation && resultObj.haveWebTranslation) { + for (i = 0,len=queryHistory.length; i < len; i++) { + if ($input.value == queryHistory[i]) { + break; + } + } + if(i==len){ + //只保留最近的6条记录 + if (queryHistory.unshift($input.value) > 6) { + queryHistory.pop(); + } + } + } } else { if (resultObj.errorCode == 20) { $queryResultContainer.innerHTML = "

这段文字太长,词典君无能为力了(┬_┬)

试试短一点的吧~

"; @@ -378,9 +395,67 @@ toggleKey.onchange = function (event) { // updateSetting("duration", event.target.value); // }) -//在popup页内 Enter键 查询选中部分 +/** + * popup页 快捷键绑定 + */ document.addEventListener('keyup',function(e){ - if(document.activeElement.tagName=="BODY" && e.which==13){ - queryInPopup(window.getSelection().toString()); + if(document.activeElement.tagName=="BODY" && e.which==13){ //Enter 查询选中部分 如果没有选中部分,$input请求焦点 + var selection=window.getSelection().toString(); + if(selection.length>0) { + $historyList.innerHTML = ""; + queryInPopup(selection); + }else{ + $input.focus(); + } + }else if(e.which==18){ //Alt+Enter $input清空内容并请求焦点 + $input.value = ''; + $input.focus(); + } +}); + +/** + * 简单的历史记录功能 + * 焦点在输入框时,按上下箭头显示历史列表供选择,按其他键移除列表 + * 目前只保存本次会话的历史 + */ +$input.addEventListener('keyup',function(e){ + if(queryHistory.length>0) { + if (e.which == 38 || e.which == 40) { + e.preventDefault(); + e.stopPropagation(); + if ($historyList.children.length==0) { + for (var i = 0; i < queryHistory.length; i++) { + $historyList.appendChild(document.createElement("LI").appendChild(document.createTextNode(queryHistory[i])).parentNode); + } + return; + } + var cur=$historyList.querySelector(".cur"); + if (e.which == 38) { + if (cur == null) { + cur = $historyList.firstElementChild; + cur.className = "cur"; + } + cur.className = ""; + cur = cur.previousElementSibling; + if (cur == null) { + cur = $historyList.lastElementChild; + } + cur.className = "cur"; + } else { + if (cur == null) { + cur = $historyList.lastElementChild; + cur.className = "cur"; + } + cur.className = ""; + cur = cur.nextElementSibling; + if (cur == null) { + cur = $historyList.firstElementChild; + } + cur.className = "cur"; + } + queryInPopup(cur.innerHTML); + } else { + $historyList.innerHTML = ""; + } } }); \ No newline at end of file diff --git a/src/style.css b/src/style.css index a556b7e..8d763ad 100644 --- a/src/style.css +++ b/src/style.css @@ -169,7 +169,16 @@ ul { font-family: "YDdict-Icon"; } - +#query-history{ + margin-left:20px; +} +#query-history li{ + border: inset transparent; + color: #999; +} +#query-history li.cur{ + border-color:#faf8ef; +} /*Result Block*/ .result-container {