Added Search Term highlighting and Clear Search Box
This commit is contained in:
parent
c08cf616dd
commit
c60456e113
|
@ -178,6 +178,16 @@ longDefinition p {
|
|||
margin: 3px 0 8px;
|
||||
}
|
||||
|
||||
searchTerm {
|
||||
display: inline;
|
||||
color: #ff0000;
|
||||
background: #ffff00;
|
||||
padding: 1px;
|
||||
text-decoration: underline;
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.management {
|
||||
display: block;
|
||||
right: 5px;
|
||||
|
|
|
@ -65,7 +65,10 @@
|
|||
<div id="searchArea" style="display:block;">
|
||||
<label style="margin-top:10px;">
|
||||
<span>Search</span>
|
||||
<input type="text" id="searchBox" onclick="this.select();" onchange="ShowDictionary()" style="display:block;" />
|
||||
<div style="display:block;">
|
||||
<input type="text" id="searchBox" onclick="this.select();" onchange="ShowDictionary()" style="display:inline;" />
|
||||
<span style="display:inline;cursor:pointer;font-size:10px;font-weight:bold;" onclick="document.getElementById('searchBox').value='';ShowDictionary();">Clear Search</span>
|
||||
</div>
|
||||
<div id="searchOptions" style="font-size:12px;">
|
||||
<label style="display:inline;margin:0;">Word <input type="checkbox" id="searchOptionWord" checked="checked" onchange="ShowDictionary()" /></label>
|
||||
<label style="display:inline;margin:0;">Equivalent <input type="checkbox" id="searchOptionSimple" checked="checked" onchange="ShowDictionary()" /></label>
|
||||
|
|
|
@ -267,8 +267,11 @@ function ToggleDescription() {
|
|||
|
||||
function DictionaryEntry(itemIndex) {
|
||||
var entryText = "<entry>";
|
||||
|
||||
var searchTerm = htmlEntities(document.getElementById("searchBox").value);
|
||||
var searchRegEx = new RegExp(searchTerm, "g");
|
||||
|
||||
entryText += "<word>" + currentDictionary.words[itemIndex].name + "</word>";
|
||||
entryText += "<word>" + ((searchTerm != "") ? currentDictionary.words[itemIndex].name.replace(searchRegEx, "<searchTerm>" + searchTerm + "</searchterm>") : currentDictionary.words[itemIndex].name) + "</word>";
|
||||
|
||||
if (currentDictionary.words[itemIndex].partOfSpeech != "") {
|
||||
entryText += " <partofspeech>" + currentDictionary.words[itemIndex].partOfSpeech + "</partofspeech>";
|
||||
|
@ -277,11 +280,11 @@ function DictionaryEntry(itemIndex) {
|
|||
entryText += "<br>";
|
||||
|
||||
if (currentDictionary.words[itemIndex].simpleDefinition != "") {
|
||||
entryText += "<simpledefinition>" + currentDictionary.words[itemIndex].simpleDefinition + "</simpledefinition>";
|
||||
entryText += "<simpledefinition>" + ((searchTerm != "") ? currentDictionary.words[itemIndex].simpleDefinition.replace(searchRegEx, "<searchTerm>" + searchTerm + "</searchterm>") : currentDictionary.words[itemIndex].simpleDefinition) + "</simpledefinition>";
|
||||
}
|
||||
|
||||
if (currentDictionary.words[itemIndex].longDefinition != "") {
|
||||
entryText += "<longdefinition>" + markdown.toHTML(htmlEntitiesParse(currentDictionary.words[itemIndex].longDefinition)) + "</longdefinition>";
|
||||
entryText += "<longdefinition>" + ((searchTerm != "") ? markdown.toHTML(htmlEntitiesParse(currentDictionary.words[itemIndex].longDefinition)).replace(searchRegEx, "<searchTerm>" + searchTerm + "</searchterm>") : markdown.toHTML(htmlEntitiesParse(currentDictionary.words[itemIndex].longDefinition))) + "</longdefinition>";
|
||||
}
|
||||
|
||||
if (!currentDictionary.settings.isComplete) {
|
||||
|
|
Loading…
Reference in New Issue