1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Migration of searchfields, searchresults and searchpage to ES6 modules

This commit is contained in:
Cameron 2020-07-16 10:28:08 +01:00
parent fd853a180a
commit 89fcda5f05
4 changed files with 109 additions and 83 deletions

View file

@ -126,6 +126,8 @@
"src/components/playmenu.js",
"src/components/sanatizefilename.js",
"src/components/scrollManager.js",
"src/components/search/searchfields.js",
"src/components/search/searchresults.js",
"src/components/settingshelper.js",
"src/components/subtitlesettings/subtitlesettings.js",
"src/components/subtitlesettings/subtitleappearancehelper.js",
@ -137,6 +139,7 @@
"src/controllers/dashboard/logs.js",
"src/controllers/user/subtitles.js",
"src/controllers/dashboard/plugins/repositories.js",
"src/controllers/searchpage.js",
"src/elements/emby-tabs/emby-tabs.js",
"src/elements/emby-scroller/emby-scroller.js",
"src/elements/emby-radio/emby-radio.js",

View file

@ -1,10 +1,20 @@
define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPicker', 'emby-input', 'flexStyles', 'material-icons', 'css!./searchfields'], function (layoutManager, globalize, require, events, browser, AlphaPicker) {
'use strict';
import layoutManager from 'layoutManager';
import globalize from 'globalize';
import require from 'require';
import events from 'events';
import browser from 'browser';
import AlphaPicker from 'alphaPicker';
import 'emby-input';
import 'flexStyles';
import 'material-icons';
import 'css!./searchfields';
/* eslint-disable indent*/
function onSearchTimeout() {
var instance = this;
var value = instance.nextSearchValue;
const instance = this;
let value = instance.nextSearchValue;
value = (value || '').trim();
events.trigger(instance, 'search', [value]);
@ -22,14 +32,14 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick
function onAlphaValueClicked(e) {
var value = e.detail.value;
var searchFieldsInstance = this;
const value = e.detail.value;
const searchFieldsInstance = this;
var txtSearch = searchFieldsInstance.options.element.querySelector('.searchfields-txtSearch');
const txtSearch = searchFieldsInstance.options.element.querySelector('.searchfields-txtSearch');
if (value === 'backspace') {
var val = txtSearch.value;
const val = txtSearch.value;
txtSearch.value = val.length ? val.substring(0, val.length - 1) : '';
} else {
@ -53,8 +63,8 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick
function onSearchInput(e) {
var value = e.target.value;
var searchFieldsInstance = this;
const value = e.target.value;
const searchFieldsInstance = this;
triggerSearch(searchFieldsInstance, value);
}
@ -62,7 +72,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick
require(['text!./searchfields.template.html'], function (template) {
var html = globalize.translateDocument(template, 'core');
let html = globalize.translateDocument(template, 'core');
if (browser.tizen || browser.orsay) {
html = html.replace('<input ', '<input readonly ');
@ -72,10 +82,10 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick
elem.classList.add('searchFields');
var txtSearch = elem.querySelector('.searchfields-txtSearch');
const txtSearch = elem.querySelector('.searchfields-txtSearch');
if (layoutManager.tv) {
var alphaPickerElement = elem.querySelector('.alphaPicker');
const alphaPickerElement = elem.querySelector('.alphaPicker');
elem.querySelector('.alphaPicker').classList.remove('hide');
initAlphaPicker(alphaPickerElement, instance);
@ -87,38 +97,39 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick
});
}
function SearchFields(options) {
class SearchFields {
constructor(options) {
this.options = options;
embed(options.element, this, options);
}
SearchFields.prototype.focus = function () {
focus() {
this.options.element.querySelector('.searchfields-txtSearch').focus();
};
}
destroy() {
SearchFields.prototype.destroy = function () {
var options = this.options;
const options = this.options;
if (options) {
options.element.classList.remove('searchFields');
}
this.options = null;
var alphaPicker = this.alphaPicker;
const alphaPicker = this.alphaPicker;
if (alphaPicker) {
alphaPicker.destroy();
}
this.alphaPicker = null;
var searchTimeout = this.searchTimeout;
const searchTimeout = this.searchTimeout;
if (searchTimeout) {
clearTimeout(searchTimeout);
}
this.searchTimeout = null;
this.nextSearchValue = null;
};
}
}
return SearchFields;
});
export default SearchFields;
/* eslint-enable indent */

View file

@ -1,9 +1,19 @@
define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', 'cardBuilder', 'appRouter', 'emby-scroller', 'emby-itemscontainer', 'emby-button'], function (layoutManager, globalize, require, events, connectionManager, cardBuilder, appRouter) {
'use strict';
import layoutManager from 'layoutManager';
import globalize from 'globalize';
import require from 'require';
import events from 'events';
import connectionManager from 'connectionManager';
import cardBuilder from 'cardBuilder';
import appRouter from 'appRouter';
import 'emby-scroller';
import 'emby-itemscontainer';
import 'emby-button';
/* eslint-disable indent */
function loadSuggestions(instance, context, apiClient) {
var options = {
const options = {
SortBy: 'IsFavoriteOrLiked,Random',
IncludeItemTypes: 'Movie,Series,MusicArtist',
@ -21,18 +31,18 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
result.Items = [];
}
var html = result.Items.map(function (i) {
const html = result.Items.map(function (i) {
var href = appRouter.getRouteUrl(i);
const href = appRouter.getRouteUrl(i);
var itemHtml = '<div><a is="emby-linkbutton" class="button-link" style="display:inline-block;padding:.5em 1em;" href="' + href + '">';
let itemHtml = '<div><a is="emby-linkbutton" class="button-link" style="display:inline-block;padding:.5em 1em;" href="' + href + '">';
itemHtml += i.Name;
itemHtml += '</a></div>';
return itemHtml;
}).join('');
var searchSuggestions = context.querySelector('.searchSuggestions');
const searchSuggestions = context.querySelector('.searchSuggestions');
searchSuggestions.querySelector('.searchSuggestionsList').innerHTML = html;
if (result.Items.length) {
@ -49,9 +59,9 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
});
}
var allowSearch = true;
let allowSearch = true;
var queryIncludeItemTypes = query.IncludeItemTypes;
const queryIncludeItemTypes = query.IncludeItemTypes;
if (instance.options.collectionType === 'tvshows') {
if (query.IncludeArtists) {
@ -127,7 +137,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
query.EnableTotalRecordCount = false;
query.ImageTypeLimit = 1;
var methodName = 'getItems';
let methodName = 'getItems';
if (!query.IncludeMedia) {
if (query.IncludePeople) {
@ -566,9 +576,9 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
section = context.querySelector(section);
var items = result.Items || result.SearchHints;
const items = result.Items || result.SearchHints;
var itemsContainer = section.querySelector('.itemsContainer');
const itemsContainer = section.querySelector('.itemsContainer');
cardBuilder.buildCards(items, Object.assign({
@ -588,7 +598,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
}
function replaceAll(originalString, strReplace, strWith) {
var reg = new RegExp(strReplace, 'ig');
const reg = new RegExp(strReplace, 'ig');
return originalString.replace(reg, strWith);
}
@ -601,7 +611,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
template = replaceAll(template, 'itemsContainer scrollSlider', 'itemsContainer scrollSlider vertical-wrap');
}
var html = globalize.translateDocument(template, 'core');
const html = globalize.translateDocument(template, 'core');
elem.innerHTML = html;
@ -610,28 +620,29 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager',
});
}
function SearchResults(options) {
class SearchResults {
constructor(options) {
this.options = options;
embed(options.element, this, options);
}
search(value) {
SearchResults.prototype.search = function (value) {
var apiClient = connectionManager.getApiClient(this.options.serverId);
const apiClient = connectionManager.getApiClient(this.options.serverId);
search(this, apiClient, this.options.element, value);
};
}
destroy() {
SearchResults.prototype.destroy = function () {
var options = this.options;
const options = this.options;
if (options) {
options.element.classList.remove('searchFields');
}
this.options = null;
};
}
}
return SearchResults;
});
export default SearchResults;
/*eslint-enable indent*/

View file

@ -1,12 +1,14 @@
define(['focusManager', 'searchFields', 'searchResults', 'events'], function (focusManager, SearchFields, SearchResults, events) {
'use strict';
import focusManager from 'focusManager';
import SearchFields from 'searchFields';
import SearchResults from 'searchResults';
import events from 'events';
return function (view, params) {
export default function (view, params) {
function onSearch(e, value) {
self.searchResults.search(value);
}
var self = this;
const self = this;
view.addEventListener('viewshow', function () {
if (!self.searchFields) {
self.searchFields = new SearchFields({
@ -32,5 +34,4 @@ define(['focusManager', 'searchFields', 'searchResults', 'events'], function (fo
self.searchResults = null;
}
});
};
});
}