소스 검색

Add advanced-query live update. Clean up.

Add:
    templates/index.html, static/js/index.advanced-search-form.js
        -Remove commented-out code, `testQueryStringGeneration()`, etc.; prepare
        for merging into `develop`.

    static/js/advanced-search-form.js
        -Perform a live update of the main query bar with a user's inputs in the
        advanced search form.
tags/v1.0^2
Severyn Kozak 10 년 전
부모
커밋
dbba109a31
3개의 변경된 파일32개의 추가작업 그리고 31개의 파일을 삭제
  1. +20
    -21
      static/js/index.advanced-search-form.js
  2. +12
    -5
      static/sass/index.sass
  3. +0
    -5
      templates/index.html

+ 20
- 21
static/js/index.advanced-search-form.js 파일 보기

@@ -30,9 +30,12 @@ var searchGroups = $("div#search-groups");
$("div#sidebar input[type=checkbox]").prop("checked", false);

searchGroups.children("#selected").removeAttr("id");
var searchGroup = $("<div/>", {class : "search-group", id : "selected"});
var searchGroup = $("<div/>", {
class : "search-group",
id : "selected"
});
searchGroups.append(
searchGroup.append(createSearchGroupInput("language")));
searchGroup.append(createSearchGroupInput("language")));
$("div#sidebar input[type=checkbox]#language").prop("checked", true);
});

@@ -76,6 +79,17 @@ var searchGroups = $("div#search-groups");
else
$("div.search-group#selected #" + fieldId).remove()
});

var previousAdvancedQuery = "";
var searchBar = $("form#search-bar input[name=query]");

window.setInterval(function(){
var currentQuery = assembleQuery();
if(currentQuery != previousAdvancedQuery){
previousAdvancedQuery = currentQuery;
searchBar.val(assembleQuery());
}
}, 1e3 / 15);
}());

/*
@@ -88,7 +102,8 @@ function createSearchGroupInput(fieldId){
"<div id='" + fieldId + "'>",
"<div class='name'>" + fieldId.replace(/-/g, " ") + "</div>",
"<input class='" + fieldId + "' name='" + fieldId + "'type='text'>",
"<input type='checkbox' name='regex'><span>Regex</span>",
"<input type='checkbox' name='regex'>",
"<span class='regex'>Regex</span>",
"</div>"
].join("");
}
@@ -113,7 +128,7 @@ function assembleQuery(){
groupQueries.push(groupQuery.join(" AND "));
}

console.log(groupQueries.join(" OR "));
return groupQueries.join(" OR ");
}

/*
@@ -124,25 +139,9 @@ function assembleQuery(){
*/
function genFieldQueryString(field, hasRegex){
var terms = field.value.replace(/\\/g, "\\\\").replace(/\"/g, "\\\"");
var query = field.getAttribute("name") + ":" + ((hasRegex)?"re:":"") + terms;
var query = field.getAttribute("name") + ":" + (hasRegex?"re:":"") + terms;
if(field.value.indexOf('"') >= 0){
// ['"', field.getAttribute("name"), ":", regex?"re:":"", terms, '"']
return '"' + query + '"';
}
return query;
}

(function testQueryStringGeneration(){
var sampleStrings = [
"A B",
"A \\ B",
'"A \\" B"',
'"A \\" B" C D "A B"',
];
for(var string = 0; string < sampleStrings.length; string++)
console.log([
(sampleStrings[string] + " ").slice(0, 12),
":",
" " + genFieldQueryString($("<input>").val(sampleStrings[string])[0])
].join(""));
})();

+ 12
- 5
static/sass/index.sass 파일 보기

@@ -19,7 +19,6 @@ $minSearchFieldsWidth: 490px
>li.ui-menu-item a.ui-state-focus
@include vendor(transition, background-color 0.3s ease-out)


div#search-field
@extend .t2

@@ -78,17 +77,21 @@ div#search-field
padding: 0px
float: right

&.clicked, &:hover
&:hover
img
@extend .t3

background-color: black
cursor: pointer

&.clicked
img
background-color: $baseColor1

&:focus
outline: 0

img
@extend .t3

background-color: $baseColor2
margin-top: 5px
width: 26px
@@ -247,7 +250,8 @@ div#advanced-search

>div.name
display: inline-block
width: 18%
font-size: 90%
width: 20%

>input[type=text]
display: inline-block
@@ -263,6 +267,9 @@ div#advanced-search
color: green
font-weight: bold

&:hover
cursor: checkbox

span.regex
font-size: 80%



+ 0
- 5
templates/index.html 파일 보기

@@ -90,11 +90,6 @@
</div>
</div>
</div>

<!-- Temporary. -->
<button onclick="assembleQuery()">
Assemble
</button>
</div>
</form>
</div>


불러오는 중...
취소
저장