juni/junisaber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

allow search clear

Browse Source
This commit is contained in:
Kevin Ngo
2018-10-29 23:22:47 -07:00
parent 2f7b479e4c
commit 94d1c53933
3 changed files with 43 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/search.js
View File

@@ -10,7 +10,7 @@ var algolia = client.initIndex('supersaber');
*/
AFRAME.registerComponent('search', {
init: function () {
this.eventDetail = {results: []};
this.eventDetail = {query: '', results: []};
this.popularHits = null;
this.queryObject = {hitsPerPage: 100, query: ''};
@@ -20,9 +20,7 @@ AFRAME.registerComponent('search', {
// Less hits on normal searches.
this.queryObject.hitsPerPage = 30;
this.el.sceneEl.addEventListener('genreclear', () => {
this.search('');
});
this.el.sceneEl.addEventListener('searchclear', () => { this.search(''); });
},
superkeyboardchange: bindEvent(function (evt) {
@@ -33,10 +31,12 @@ AFRAME.registerComponent('search', {
// Use cached for popular hits.
if (!query && this.popularHits) {
this.eventDetail.results = this.popularHits;
this.eventDetail.query = '';
this.el.sceneEl.emit('searchresults', this.eventDetail);
return;
}
this.eventDetail.query = query;
this.queryObject.query = query;
algolia.search(this.queryObject, (err, content) => {
// Cache popular hits.

2
src/state/index.js
View File

@@ -93,6 +93,7 @@ AFRAME.registerState({
hasError: false,
hasNext: false,
hasPrev: false,
query: '',
results: [],
songNameTexts: '', // All names in search results merged together.
songSubNameTexts: '' // All sub names in search results merged together.
@@ -322,6 +323,7 @@ AFRAME.registerState({
var i;
state.search.hasError = false;
state.search.page = 0;
state.search.query = payload.query;
state.search.results = payload.results;
for (i = 0; i < payload.results.length; i++) {
let result = payload.results[i];

64
src/templates/menu.html
View File

@@ -251,10 +251,10 @@
</a-entity>
<a-entity
id="genreText"
id="searchQuery"
mixin="font"
bind__text-uppercase="value: genre"
bind__visible="!!genre"
bind__text-uppercase="value: genre || search.query"
bind__visible="!!genre || !!search.query && !isSearching"
text="align: center; color: #FAFAFA; wrapCount: 20"
position="0 0.8 0.01"></a-entity>
@@ -319,25 +319,26 @@
animation__mouseleave2="property: scale; to: 1 1 1; from: 1.1 1.1 1.1; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150">
</a-mixin>
<a-entity id="genreButton"
mixin="bigMenuButton"
bind-toggle__raycastable="menuActive && !genreMenuOpen && !isSearching && !genre"
bind__visible="menuActive && !genreMenuOpen && !isSearching && !genre"
position="-0.55 0.2 -1.9"
proxy-event="event: click; to: a-scene; as: genremenuopen">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: BROWSE GENRES" position="0 -0.07 0.01"></a-entity>
<a-entity id="genreButtons" position="-0.55 0.2 -1.9">
<a-entity id="genreButton"
mixin="bigMenuButton"
bind-toggle__raycastable="menuActive && !genreMenuOpen && !isSearching && !genre"
bind__visible="menuActive && !genreMenuOpen && !isSearching && !genre"
proxy-event="event: click; to: a-scene; as: genremenuopen">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: BROWSE GENRES" position="0 -0.07 0.01"></a-entity>
</a-entity>
<a-entity id="clearGenreButton"
mixin="bigMenuButton"
bind-toggle__raycastable="!!genre"
bind__visible="!!genre"
proxy-event="event: click; to: a-scene; as: searchclear">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: CLEAR GENRE" position="0 -0.07 0.01"></a-entity>
</a-entity>
</a-entity>
<a-entity id="clearGenreButton"
mixin="bigMenuButton"
bind-toggle__raycastable="!!genre"
bind__visible="!!genre"
position="-0.55 0.2 -1.9"
proxy-event="event: click; to: a-scene; as: genreclear">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: CLEAR GENRE" position="0 -0.07 0.01"></a-entity>
</a-entity>
<a-entity id="backButton"
<a-entity
id="backButton"
mixin="bigMenuButton"
bind-toggle__raycastable="genreMenuOpen"
bind__visible="genreMenuOpen"
@@ -346,11 +347,20 @@
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: BACK" position="0 -0.07 0.01"></a-entity>
</a-entity>
<a-entity id="searchButton"
mixin="bigMenuButton"
position="0.55 0.2 -1.9"
bind-toggle__raycastable="menuActive && !genreMenuOpen && !isSearching"
bind__visible="menuActive && !genreMenuOpen && !isSearching"
proxy-event="event: click; to: a-scene; as: keyboardopen">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: SEARCH SONGS" position="0 -0.07 0.01"></a-entity>
<a-entity id="searchButtons" position="0.55 0.2 -1.9">
<a-entity id="searchButton"
mixin="bigMenuButton"
bind-toggle__raycastable="menuActive && !genreMenuOpen && !isSearching && !search.query"
bind__visible="menuActive && !genreMenuOpen && !isSearching && !search.query"
proxy-event="event: click; to: a-scene; as: keyboardopen">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: SEARCH SONGS" position="0 -0.07 0.01"></a-entity>
</a-entity>
<a-entity id="searchClearButton"
mixin="bigMenuButton"
bind-toggle__raycastable="menuActive && !!search.query && !isSearching"
bind__visible="menuActive && !!search.query && !isSearching"
proxy-event="event: click; to: a-scene; as: searchclear">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: CLEAR SEARCH" position="0 -0.07 0.01"></a-entity>
</a-entity>
</a-entity>