milas/jellyfish-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Escape HTML

Browse source
This commit is contained in:
Dmitry Lyzo 2022-01-30 00:27:26 +03:00
parent 08cbc5aa8f
commit 59adbc348a
60 changed files with 245 additions and 192 deletions
Download patch file Download diff file Expand all files Collapse all files

9
package-lock.json generated
View file

@ -2568,6 +2568,12 @@
"@types/node": "*" "@types/node": "*"
} }
}, },
"@types/escape-html": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@types/escape-html/-/escape-html-1.0.1.tgz",
"integrity": "sha512-4mI1FuUUZiuT95fSVqvZxp/ssQK9zsa86S43h9x3zPOSU9BBJ+BfDkXwuaU7BfsD+e7U0/cUUfJFk3iW2M4okA==",
"dev": true
},
"@types/eslint": { "@types/eslint": {
"version": "8.4.1", "version": "8.4.1",
"resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.4.1.tgz", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.4.1.tgz",
@ -5299,8 +5305,7 @@
"escape-html": { "escape-html": {
"version": "1.0.3", "version": "1.0.3",
"resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
"integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=", "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
"dev": true
}, },
"escape-string-regexp": { "escape-string-regexp": {
"version": "1.0.5", "version": "1.0.5",

2
package.json
View file

@ -15,6 +15,7 @@
"@babel/preset-react": "7.16.7", "@babel/preset-react": "7.16.7",
"@babel/preset-typescript": "7.16.7", "@babel/preset-typescript": "7.16.7",
"@thornbill/jellyfin-sdk": "0.4.1", "@thornbill/jellyfin-sdk": "0.4.1",
"@types/escape-html": "1.0.1",
"@types/lodash-es": "4.17.6", "@types/lodash-es": "4.17.6",
"@types/react": "17.0.39", "@types/react": "17.0.39",
"@types/react-dom": "17.0.12", "@types/react-dom": "17.0.12",
@ -75,6 +76,7 @@
"date-fns": "2.28.0", "date-fns": "2.28.0",
"dompurify": "2.3.4", "dompurify": "2.3.4",
"epubjs": "0.3.90", "epubjs": "0.3.90",
"escape-html": "1.0.3",
"fast-text-encoding": "1.0.3", "fast-text-encoding": "1.0.3",
"flv.js": "1.6.2", "flv.js": "1.6.2",
"headroom.js": "0.12.0", "headroom.js": "0.12.0",

11
src/components/actionSheet/actionSheet.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
@ -156,10 +157,10 @@ export function show(options) {
} }
if (options.title) { if (options.title) {
html += '<h1 class="actionSheetTitle">' + options.title + '</h1>'; html += '<h1 class="actionSheetTitle">' + escapeHtml(options.title) + '</h1>';
} }
if (options.text) { if (options.text) {
html += '<p class="actionSheetText">' + options.text + '</p>'; html += '<p class="actionSheetText">' + escapeHtml(options.text) + '</p>';
} }
let scrollerClassName = 'actionSheetScroller'; let scrollerClassName = 'actionSheetScroller';
@ -212,17 +213,17 @@ export function show(options) {
html += '<div class="listItemBody actionsheetListItemBody">'; html += '<div class="listItemBody actionsheetListItemBody">';
html += '<div class="listItemBodyText actionSheetItemText">'; html += '<div class="listItemBodyText actionSheetItemText">';
html += (item.name || item.textContent || item.innerText); html += escapeHtml(item.name || item.textContent || item.innerText);
html += '</div>'; html += '</div>';
if (item.secondaryText) { if (item.secondaryText) {
html += `<div class="listItemBodyText secondary">${item.secondaryText}</div>`; html += `<div class="listItemBodyText secondary">${escapeHtml(item.secondaryText)}</div>`;
} }
html += '</div>'; html += '</div>';
if (item.asideText) { if (item.asideText) {
html += `<div class="listItemAside actionSheetItemAsideText">${item.asideText}</div>`; html += `<div class="listItemAside actionSheetItemAsideText">${escapeHtml(item.asideText)}</div>`;
} }
html += '</button>'; html += '</button>';

5
src/components/activitylog.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import { Events } from 'jellyfin-apiclient'; import { Events } from 'jellyfin-apiclient';
import globalize from '../scripts/globalize'; import globalize from '../scripts/globalize';
import dom from '../scripts/dom'; import dom from '../scripts/dom';
@ -33,13 +34,13 @@ import alert from './alert';
html += '<div class="listItemBody three-line">'; html += '<div class="listItemBody three-line">';
html += '<div class="listItemBodyText">'; html += '<div class="listItemBodyText">';
html += entry.Name; html += escapeHtml(entry.Name);
html += '</div>'; html += '</div>';
html += '<div class="listItemBodyText secondary">'; html += '<div class="listItemBodyText secondary">';
html += datefns.formatRelative(Date.parse(entry.Date), Date.parse(new Date()), { locale: dfnshelper.getLocale() }); html += datefns.formatRelative(Date.parse(entry.Date), Date.parse(new Date()), { locale: dfnshelper.getLocale() });
html += '</div>'; html += '</div>';
html += '<div class="listItemBodyText secondary listItemBodyText-nowrap">'; html += '<div class="listItemBodyText secondary listItemBodyText-nowrap">';
html += entry.ShortOverview || ''; html += escapeHtml(entry.ShortOverview || '');
html += '</div>'; html += '</div>';
html += '</div>'; html += '</div>';

27
src/components/cardbuilder/cardBuilder.js
View file

@ -5,6 +5,7 @@
* @module components/cardBuilder/cardBuilder * @module components/cardBuilder/cardBuilder
*/ */
import escapeHtml from 'escape-html';
import datetime from '../../scripts/datetime'; import datetime from '../../scripts/datetime';
import imageLoader from '../images/imageLoader'; import imageLoader from '../images/imageLoader';
import itemHelper from '../itemHelper'; import itemHelper from '../itemHelper';
@ -813,11 +814,11 @@ import ServerConnections from '../ServerConnections';
IsFolder: true IsFolder: true
})); }));
} else { } else {
lines.push(item.SeriesName); lines.push(escapeHtml(item.SeriesName));
} }
} else { } else {
if (isUsingLiveTvNaming(item)) { if (isUsingLiveTvNaming(item)) {
lines.push(item.Name); lines.push(escapeHtml(item.Name));
if (!item.EpisodeTitle) { if (!item.EpisodeTitle) {
titleAdded = true; titleAdded = true;
@ -826,7 +827,7 @@ import ServerConnections from '../ServerConnections';
const parentTitle = item.SeriesName || item.Series || item.Album || item.AlbumArtist || ''; const parentTitle = item.SeriesName || item.Series || item.Album || item.AlbumArtist || '';
if (parentTitle || showTitle) { if (parentTitle || showTitle) {
lines.push(parentTitle); lines.push(escapeHtml(parentTitle));
} }
} }
} }
@ -860,7 +861,7 @@ import ServerConnections from '../ServerConnections';
item.AlbumArtists[0].IsFolder = true; item.AlbumArtists[0].IsFolder = true;
lines.push(getTextActionButton(item.AlbumArtists[0], null, serverId)); lines.push(getTextActionButton(item.AlbumArtists[0], null, serverId));
} else { } else {
lines.push(isUsingLiveTvNaming(item) ? item.Name : (item.SeriesName || item.Series || item.Album || item.AlbumArtist || '')); lines.push(escapeHtml(isUsingLiveTvNaming(item) ? item.Name : (item.SeriesName || item.Series || item.Album || item.AlbumArtist || '')));
} }
} }
@ -948,13 +949,13 @@ import ServerConnections from '../ServerConnections';
}, item.ChannelName)); }, item.ChannelName));
} else { } else {
lines.push(item.ChannelName || '&nbsp;'); lines.push(escapeHtml(item.ChannelName) || '&nbsp;');
} }
} }
if (options.showCurrentProgram && item.Type === 'TvChannel') { if (options.showCurrentProgram && item.Type === 'TvChannel') {
if (item.CurrentProgram) { if (item.CurrentProgram) {
lines.push(item.CurrentProgram.Name); lines.push(escapeHtml(item.CurrentProgram.Name));
} else { } else {
lines.push(''); lines.push('');
} }
@ -980,13 +981,13 @@ import ServerConnections from '../ServerConnections';
if (item.RecordAnyChannel) { if (item.RecordAnyChannel) {
lines.push(globalize.translate('AllChannels')); lines.push(globalize.translate('AllChannels'));
} else { } else {
lines.push(item.ChannelName || globalize.translate('OneChannel')); lines.push(escapeHtml(item.ChannelName) || globalize.translate('OneChannel'));
} }
} }
if (options.showPersonRoleOrType) { if (options.showPersonRoleOrType) {
if (item.Role) { if (item.Role) {
lines.push(globalize.translate('PersonRole', item.Role)); lines.push(globalize.translate('PersonRole', escapeHtml(item.Role)));
} }
} }
} }
@ -996,7 +997,7 @@ import ServerConnections from '../ServerConnections';
} }
if (overlayText && showTitle) { if (overlayText && showTitle) {
lines = [item.Name]; lines = [escapeHtml(item.Name)];
} }
const addRightTextMargin = isOuterFooter && options.cardLayout && !options.centerText && options.cardFooterAside !== 'none' && layoutManager.mobile; const addRightTextMargin = isOuterFooter && options.cardLayout && !options.centerText && options.cardFooterAside !== 'none' && layoutManager.mobile;
@ -1031,6 +1032,8 @@ import ServerConnections from '../ServerConnections';
text = itemHelper.getDisplayName(item); text = itemHelper.getDisplayName(item);
} }
text = escapeHtml(text);
if (layoutManager.tv) { if (layoutManager.tv) {
return text; return text;
} }
@ -1442,7 +1445,7 @@ import ServerConnections from '../ServerConnections';
const mediaTypeData = item.MediaType ? (' data-mediatype="' + item.MediaType + '"') : ''; const mediaTypeData = item.MediaType ? (' data-mediatype="' + item.MediaType + '"') : '';
const collectionTypeData = item.CollectionType ? (' data-collectiontype="' + item.CollectionType + '"') : ''; const collectionTypeData = item.CollectionType ? (' data-collectiontype="' + item.CollectionType + '"') : '';
const channelIdData = item.ChannelId ? (' data-channelid="' + item.ChannelId + '"') : ''; const channelIdData = item.ChannelId ? (' data-channelid="' + item.ChannelId + '"') : '';
const pathData = item.Path ? (' data-path="' + item.Path + '"') : ''; const pathData = item.Path ? (' data-path="' + escapeHtml(item.Path) + '"') : '';
const contextData = options.context ? (' data-context="' + options.context + '"') : ''; const contextData = options.context ? (' data-context="' + options.context + '"') : '';
const parentIdData = options.parentId ? (' data-parentid="' + options.parentId + '"') : ''; const parentIdData = options.parentId ? (' data-parentid="' + options.parentId + '"') : '';
const startDate = item.StartDate ? (' data-startdate="' + item.StartDate.toString() + '"') : ''; const startDate = item.StartDate ? (' data-startdate="' + item.StartDate.toString() + '"') : '';
@ -1454,7 +1457,7 @@ import ServerConnections from '../ServerConnections';
additionalCardContent += getHoverMenuHtml(item, action); additionalCardContent += getHoverMenuHtml(item, action);
} }
return '<' + tagName + ' data-index="' + index + '"' + timerAttributes + actionAttribute + ' data-isfolder="' + (item.IsFolder || false) + '" data-serverid="' + (item.ServerId || options.serverId) + '" data-id="' + (item.Id || item.ItemId) + '" data-type="' + item.Type + '"' + mediaTypeData + collectionTypeData + channelIdData + pathData + positionTicksData + collectionIdData + playlistIdData + contextData + parentIdData + startDate + endDate + ' data-prefix="' + prefix + '" class="' + className + '"' + ariaLabelAttribute + '>' + cardImageContainerOpen + innerCardFooter + cardImageContainerClose + overlayButtons + additionalCardContent + cardScalableClose + outerCardFooter + cardBoxClose + '</' + tagName + '>'; return '<' + tagName + ' data-index="' + index + '"' + timerAttributes + actionAttribute + ' data-isfolder="' + (item.IsFolder || false) + '" data-serverid="' + (item.ServerId || options.serverId) + '" data-id="' + (item.Id || item.ItemId) + '" data-type="' + item.Type + '"' + mediaTypeData + collectionTypeData + channelIdData + pathData + positionTicksData + collectionIdData + playlistIdData + contextData + parentIdData + startDate + endDate + ' data-prefix="' + escapeHtml(prefix) + '" class="' + className + '"' + ariaLabelAttribute + '>' + cardImageContainerOpen + innerCardFooter + cardImageContainerClose + overlayButtons + additionalCardContent + cardScalableClose + outerCardFooter + cardBoxClose + '</' + tagName + '>';
} }
/** /**
@ -1544,7 +1547,7 @@ import ServerConnections from '../ServerConnections';
} }
const defaultName = isUsingLiveTvNaming(item) ? item.Name : itemHelper.getDisplayName(item); const defaultName = isUsingLiveTvNaming(item) ? item.Name : itemHelper.getDisplayName(item);
return '<div class="cardText cardDefaultText">' + defaultName + '</div>'; return '<div class="cardText cardDefaultText">' + escapeHtml(defaultName) + '</div>';
} }
/** /**

3
src/components/cardbuilder/chaptercardbuilder.js
View file

@ -5,6 +5,7 @@
* @module components/cardBuilder/chaptercardbuilder * @module components/cardBuilder/chaptercardbuilder
*/ */
import escapeHtml from 'escape-html';
import datetime from '../../scripts/datetime'; import datetime from '../../scripts/datetime';
import imageLoader from '../images/imageLoader'; import imageLoader from '../images/imageLoader';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
@ -98,7 +99,7 @@ import ServerConnections from '../ServerConnections';
} }
let nameHtml = ''; let nameHtml = '';
nameHtml += `<div class="cardText">${chapter.Name}</div>`; nameHtml += `<div class="cardText">${escapeHtml(chapter.Name)}</div>`;
nameHtml += `<div class="cardText">${datetime.getDisplayRunningTime(chapter.StartPositionTicks)}</div>`; nameHtml += `<div class="cardText">${datetime.getDisplayRunningTime(chapter.StartPositionTicks)}</div>`;
const cardBoxCssClass = 'cardBox'; const cardBoxCssClass = 'cardBox';

7
src/components/channelMapper/channelMapper.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import loading from '../loading/loading'; import loading from '../loading/loading';
@ -29,7 +30,7 @@ export default class channelMapper {
}).then(mapping => { }).then(mapping => {
const listItem = dom.parentWithClass(button, 'listItem'); const listItem = dom.parentWithClass(button, 'listItem');
button.setAttribute('data-providerid', mapping.ProviderChannelId); button.setAttribute('data-providerid', mapping.ProviderChannelId);
listItem.querySelector('.secondary').innerHTML = getMappingSecondaryName(mapping, currentMappingOptions.ProviderName); listItem.querySelector('.secondary').innerText = getMappingSecondaryName(mapping, currentMappingOptions.ProviderName);
loading.hide(); loading.hide();
}); });
} }
@ -75,12 +76,12 @@ export default class channelMapper {
html += '<span class="material-icons listItemIcon dvr" aria-hidden="true"></span>'; html += '<span class="material-icons listItemIcon dvr" aria-hidden="true"></span>';
html += '<div class="listItemBody two-line">'; html += '<div class="listItemBody two-line">';
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += channel.Name; html += escapeHtml(channel.Name);
html += '</h3>'; html += '</h3>';
html += '<div class="secondary listItemBodyText">'; html += '<div class="secondary listItemBodyText">';
if (channel.ProviderChannelName) { if (channel.ProviderChannelName) {
html += getMappingSecondaryName(channel, providerName); html += escapeHtml(getMappingSecondaryName(channel, providerName));
} }
html += '</div>'; html += '</div>';

3
src/components/collectionEditor/collectionEditor.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import loading from '../loading/loading'; import loading from '../loading/loading';
@ -112,7 +113,7 @@ import toast from '../toast/toast';
html += `<option value="">${globalize.translate('OptionNew')}</option>`; html += `<option value="">${globalize.translate('OptionNew')}</option>`;
html += result.Items.map(i => { html += result.Items.map(i => {
return `<option value="${i.Id}">${i.Name}</option>`; return `<option value="${i.Id}">${escapeHtml(i.Name)}</option>`;
}); });
select.innerHTML = html; select.innerHTML = html;

3
src/components/dashboard/users/SelectElement.tsx
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import React, { FunctionComponent } from 'react'; import React, { FunctionComponent } from 'react';
import globalize from '../../../scripts/globalize'; import globalize from '../../../scripts/globalize';
@ -26,7 +27,7 @@ type IProps = {
const SelectElement: FunctionComponent<IProps> = ({ className, label, currentProviderId, providers }: IProps) => { const SelectElement: FunctionComponent<IProps> = ({ className, label, currentProviderId, providers }: IProps) => {
const renderOption = providers.map((provider) => { const renderOption = providers.map((provider) => {
const selected = provider.Id === currentProviderId || providers.length < 2 ? ' selected' : ''; const selected = provider.Id === currentProviderId || providers.length < 2 ? ' selected' : '';
return '<option value="' + provider.Id + '"' + selected + '>' + provider.Name + '</option>'; return '<option value="' + provider.Id + '"' + selected + '>' + escapeHtml(provider.Name) + '</option>';
}); });
return ( return (

3
src/components/dashboard/users/SelectMaxParentalRating.tsx
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import React, { FunctionComponent } from 'react'; import React, { FunctionComponent } from 'react';
import globalize from '../../../scripts/globalize'; import globalize from '../../../scripts/globalize';
@ -27,7 +28,7 @@ const SelectMaxParentalRating: FunctionComponent<IProps> = ({ className, label,
const renderOption = () => { const renderOption = () => {
let content = ''; let content = '';
for (const rating of parentalRatings) { for (const rating of parentalRatings) {
content += `<option value='${rating.Value}'>${rating.Name}</option>`; content += `<option value='${rating.Value}'>${escapeHtml(rating.Name)}</option>`;
} }
return content; return content;
}; };

5
src/components/dialog/dialog.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
@ -47,7 +48,7 @@ import template from './dialog.template.html';
} }
if (options.title) { if (options.title) {
dlg.querySelector('.formDialogHeaderTitle').innerHTML = options.title || ''; dlg.querySelector('.formDialogHeaderTitle').innerText = options.title || '';
} else { } else {
dlg.querySelector('.formDialogHeaderTitle').classList.add('hide'); dlg.querySelector('.formDialogHeaderTitle').classList.add('hide');
} }
@ -82,7 +83,7 @@ import template from './dialog.template.html';
buttonClass += ' formDialogFooterItem-vertical formDialogFooterItem-nomarginbottom'; buttonClass += ' formDialogFooterItem-vertical formDialogFooterItem-nomarginbottom';
} }
html += `<button is="emby-button" type="button" class="${buttonClass}" data-id="${item.id}"${autoFocus}>${item.name}</button>`; html += `<button is="emby-button" type="button" class="${buttonClass}" data-id="${item.id}"${autoFocus}>${escapeHtml(item.name)}</button>`;
if (item.description) { if (item.description) {
html += `<div class="formDialogFooterItem formDialogFooterItem-autosize fieldDescription" style="margin-top:.25em!important;margin-bottom:1.25em!important;">${item.description}</div>`; html += `<div class="formDialogFooterItem formDialogFooterItem-autosize fieldDescription" style="margin-top:.25em!important;margin-bottom:1.25em!important;">${item.description}</div>`;

9
src/components/directorybrowser/directorybrowser.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import loading from '../loading/loading'; import loading from '../loading/loading';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
@ -71,10 +72,10 @@ function refreshDirectoryBrowser(page, path, fileOptions, updatePathOnError) {
function getItem(cssClass, type, path, name) { function getItem(cssClass, type, path, name) {
let html = ''; let html = '';
html += `<div class="listItem listItem-border ${cssClass}" data-type="${type}" data-path="${path}">`; html += `<div class="listItem listItem-border ${cssClass}" data-type="${type}" data-path="${escapeHtml(path)}">`;
html += '<div class="listItemBody" style="padding-left:0;padding-top:.5em;padding-bottom:.5em;">'; html += '<div class="listItemBody" style="padding-left:0;padding-top:.5em;padding-bottom:.5em;">';
html += '<div class="listItemBodyText">'; html += '<div class="listItemBodyText">';
html += name; html += escapeHtml(name);
html += '</div>'; html += '</div>';
html += '</div>'; html += '</div>';
html += '<span class="material-icons arrow_forward" aria-hidden="true" style="font-size:inherit;"></span>'; html += '<span class="material-icons arrow_forward" aria-hidden="true" style="font-size:inherit;"></span>';
@ -87,7 +88,7 @@ function getEditorHtml(options, systemInfo) {
html += '<div class="formDialogContent scrollY">'; html += '<div class="formDialogContent scrollY">';
html += '<div class="dialogContentInner dialog-content-centered" style="padding-top:2em;">'; html += '<div class="dialogContentInner dialog-content-centered" style="padding-top:2em;">';
if (!options.pathReadOnly) { if (!options.pathReadOnly) {
const instruction = options.instruction ? `${options.instruction}<br/><br/>` : ''; const instruction = options.instruction ? `${escapeHtml(options.instruction)}<br/><br/>` : '';
html += '<div class="infoBanner" style="margin-bottom:1.5em;">'; html += '<div class="infoBanner" style="margin-bottom:1.5em;">';
html += instruction; html += instruction;
if (systemInfo.OperatingSystem.toLowerCase() === 'bsd') { if (systemInfo.OperatingSystem.toLowerCase() === 'bsd') {
@ -266,7 +267,7 @@ class DirectoryBrowser {
html += '<div class="formDialogHeader">'; html += '<div class="formDialogHeader">';
html += `<button is="paper-icon-button-light" class="btnCloseDialog autoSize" tabindex="-1" title="${globalize.translate('ButtonBack')}"><span class="material-icons arrow_back" aria-hidden="true"></span></button>`; html += `<button is="paper-icon-button-light" class="btnCloseDialog autoSize" tabindex="-1" title="${globalize.translate('ButtonBack')}"><span class="material-icons arrow_back" aria-hidden="true"></span></button>`;
html += '<h3 class="formDialogHeaderTitle">'; html += '<h3 class="formDialogHeaderTitle">';
html += options.header || globalize.translate('HeaderSelectPath'); html += escapeHtml(options.header) || globalize.translate('HeaderSelectPath');
html += '</h3>'; html += '</h3>';
html += '</div>'; html += '</div>';
html += getEditorHtml(options, systemInfo); html += getEditorHtml(options, systemInfo);

5
src/components/displaySettings/displaySettings.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import browser from '../../scripts/browser'; import browser from '../../scripts/browser';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
import { pluginManager } from '../pluginManager'; import { pluginManager } from '../pluginManager';
@ -21,7 +22,7 @@ import template from './displaySettings.template.html';
function fillThemes(select, selectedTheme) { function fillThemes(select, selectedTheme) {
skinManager.getThemes().then(themes => { skinManager.getThemes().then(themes => {
select.innerHTML = themes.map(t => { select.innerHTML = themes.map(t => {
return `<option value="${t.id}">${t.name}</option>`; return `<option value="${t.id}">${escapeHtml(t.name)}</option>`;
}).join(''); }).join('');
// get default theme // get default theme
@ -47,7 +48,7 @@ import template from './displaySettings.template.html';
}); });
selectScreensaver.innerHTML = options.map(o => { selectScreensaver.innerHTML = options.map(o => {
return `<option value="${o.value}">${o.name}</option>`; return `<option value="${o.value}">${escapeHtml(o.name)}</option>`;
}).join(''); }).join('');
selectScreensaver.value = userSettings.screensaver(); selectScreensaver.value = userSettings.screensaver();

3
src/components/filtermenu/filtermenu.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import focusManager from '../focusManager'; import focusManager from '../focusManager';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
@ -37,7 +38,7 @@ function renderOptions(context, selector, cssClass, items, isCheckedFn) {
const checkedHtml = isCheckedFn(filter) ? ' checked' : ''; const checkedHtml = isCheckedFn(filter) ? ' checked' : '';
itemHtml += '<label>'; itemHtml += '<label>';
itemHtml += '<input is="emby-checkbox" type="checkbox"' + checkedHtml + ' data-filter="' + filter.Id + '" class="' + cssClass + '"/>'; itemHtml += '<input is="emby-checkbox" type="checkbox"' + checkedHtml + ' data-filter="' + filter.Id + '" class="' + cssClass + '"/>';
itemHtml += '<span>' + filter.Name + '</span>'; itemHtml += '<span>' + escapeHtml(filter.Name) + '</span>';
itemHtml += '</label>'; itemHtml += '</label>';
return itemHtml; return itemHtml;

9
src/components/guide/guide.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import inputManager from '../../scripts/inputManager'; import inputManager from '../../scripts/inputManager';
import browser from '../../scripts/browser'; import browser from '../../scripts/browser';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
@ -538,7 +539,7 @@ function Guide(options) {
html += '<div class="guide-programNameCaret hide"><span class="guideProgramNameCaretIcon material-icons keyboard_arrow_left" aria-hidden="true"></span></div>'; html += '<div class="guide-programNameCaret hide"><span class="guideProgramNameCaretIcon material-icons keyboard_arrow_left" aria-hidden="true"></span></div>';
html += '<div class="guideProgramNameText">' + program.Name; html += '<div class="guideProgramNameText">' + escapeHtml(program.Name);
let indicatorHtml = null; let indicatorHtml = null;
if (program.IsLive && options.showLiveIndicator) { if (program.IsLive && options.showLiveIndicator) {
@ -556,7 +557,7 @@ function Guide(options) {
html += '<div class="guideProgramSecondaryInfo">'; html += '<div class="guideProgramSecondaryInfo">';
if (program.EpisodeTitle && options.showEpisodeTitle) { if (program.EpisodeTitle && options.showEpisodeTitle) {
html += '<span class="programSecondaryTitle">' + program.EpisodeTitle + '</span>'; html += '<span class="programSecondaryTitle">' + escapeHtml(program.EpisodeTitle) + '</span>';
} }
html += '</div>'; html += '</div>';
} }
@ -604,7 +605,7 @@ function Guide(options) {
title.push(channel.Name); title.push(channel.Name);
} }
html += '<button title="' + title.join(' ') + '" type="button" class="' + cssClass + '"' + ' data-action="link" data-isfolder="' + channel.IsFolder + '" data-id="' + channel.Id + '" data-serverid="' + channel.ServerId + '" data-type="' + channel.Type + '">'; html += '<button title="' + escapeHtml(title.join(' ')) + '" type="button" class="' + cssClass + '"' + ' data-action="link" data-isfolder="' + channel.IsFolder + '" data-id="' + channel.Id + '" data-serverid="' + channel.ServerId + '" data-type="' + channel.Type + '">';
if (hasChannelImage) { if (hasChannelImage) {
const url = apiClient.getScaledImageUrl(channel.Id, { const url = apiClient.getScaledImageUrl(channel.Id, {
@ -621,7 +622,7 @@ function Guide(options) {
} }
if (!hasChannelImage && channel.Name) { if (!hasChannelImage && channel.Name) {
html += '<div class="guideChannelName">' + channel.Name + '</div>'; html += '<div class="guideChannelName">' + escapeHtml(channel.Name) + '</div>';
} }
html += '</button>'; html += '</button>';

9
src/components/homeScreenSettings/homeScreenSettings.js
View file

@ -1,4 +1,5 @@
import escapeHtml from 'escape-html';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
import focusManager from '../focusManager'; import focusManager from '../focusManager';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
@ -32,7 +33,7 @@ import template from './homeScreenSettings.template.html';
currentHtml += '<label>'; currentHtml += '<label>';
currentHtml += `<input type="checkbox" is="emby-checkbox" class="chkGroupFolder" data-folderid="${i.Id}" id="${id}"${checkedHtml}/>`; currentHtml += `<input type="checkbox" is="emby-checkbox" class="chkGroupFolder" data-folderid="${i.Id}" id="${id}"${checkedHtml}/>`;
currentHtml += `<span>${i.Name}</span>`; currentHtml += `<span>${escapeHtml(i.Name)}</span>`;
currentHtml += '</label>'; currentHtml += '</label>';
return currentHtml; return currentHtml;
@ -165,7 +166,7 @@ import template from './homeScreenSettings.template.html';
const selectedHtml = selected ? ' selected' : ''; const selectedHtml = selected ? ' selected' : '';
const optionValue = o.isDefault ? '' : o.value; const optionValue = o.isDefault ? '' : o.value;
return `<option value="${optionValue}"${selectedHtml}>${o.name}</option>`; return `<option value="${optionValue}"${selectedHtml}>${escapeHtml(o.name)}</option>`;
}).join(''); }).join('');
} }
@ -182,7 +183,7 @@ import template from './homeScreenSettings.template.html';
currentHtml += '<div class="listItemBody">'; currentHtml += '<div class="listItemBody">';
currentHtml += '<div>'; currentHtml += '<div>';
currentHtml += view.Name; currentHtml += escapeHtml(view.Name);
currentHtml += '</div>'; currentHtml += '</div>';
currentHtml += '</div>'; currentHtml += '</div>';
@ -265,7 +266,7 @@ import template from './homeScreenSettings.template.html';
prefix += '<div class="verticalSection">'; prefix += '<div class="verticalSection">';
prefix += '<h2 class="sectionTitle">'; prefix += '<h2 class="sectionTitle">';
prefix += item.Name; prefix += escapeHtml(item.Name);
prefix += '</h2>'; prefix += '</h2>';
html = prefix + html; html = prefix + html;

7
src/components/homesections/homesections.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import cardBuilder from '../cardbuilder/cardBuilder'; import cardBuilder from '../cardbuilder/cardBuilder';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
@ -192,7 +193,7 @@ import ServerConnections from '../ServerConnections';
for (let i = 0, length = items.length; i < length; i++) { for (let i = 0, length = items.length; i < length; i++) {
const item = items[i]; const item = items[i];
const icon = imageHelper.getLibraryIcon(item.CollectionType); const icon = imageHelper.getLibraryIcon(item.CollectionType);
html += '<a is="emby-linkbutton" href="' + appRouter.getRouteUrl(item) + '" class="raised homeLibraryButton"><span class="material-icons homeLibraryIcon ' + icon + '" aria-hidden="true"></span><span class="homeLibraryText">' + item.Name + '</span></a>'; html += '<a is="emby-linkbutton" href="' + appRouter.getRouteUrl(item) + '" class="raised homeLibraryButton"><span class="material-icons homeLibraryIcon ' + icon + '" aria-hidden="true"></span><span class="homeLibraryText">' + escapeHtml(item.Name) + '</span></a>';
} }
html += '</div>'; html += '</div>';
@ -281,12 +282,12 @@ import ServerConnections from '../ServerConnections';
section: 'latest' section: 'latest'
}) + '" class="more button-flat button-flat-mini sectionTitleTextButton">'; }) + '" class="more button-flat button-flat-mini sectionTitleTextButton">';
html += '<h2 class="sectionTitle sectionTitle-cards">'; html += '<h2 class="sectionTitle sectionTitle-cards">';
html += globalize.translate('LatestFromLibrary', parent.Name); html += globalize.translate('LatestFromLibrary', escapeHtml(parent.Name));
html += '</h2>'; html += '</h2>';
html += '<span class="material-icons chevron_right" aria-hidden="true"></span>'; html += '<span class="material-icons chevron_right" aria-hidden="true"></span>';
html += '</a>'; html += '</a>';
} else { } else {
html += '<h2 class="sectionTitle sectionTitle-cards">' + globalize.translate('LatestFromLibrary', parent.Name) + '</h2>'; html += '<h2 class="sectionTitle sectionTitle-cards">' + globalize.translate('LatestFromLibrary', escapeHtml(parent.Name)) + '</h2>';
} }
html += '</div>'; html += '</div>';

5
src/components/itemMediaInfo/itemMediaInfo.js
View file

@ -5,6 +5,7 @@
* @module components/itemMediaInfo/itemMediaInfo * @module components/itemMediaInfo/itemMediaInfo
*/ */
import escapeHtml from 'escape-html';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
import toast from '../toast/toast'; import toast from '../toast/toast';
@ -55,7 +56,7 @@ const attributeDelimiterHtml = layoutManager.tv ? '' : '<span class="hide">: </s
function getMediaSourceHtml(user, item, version) { function getMediaSourceHtml(user, item, version) {
let html = '<div class="mediaInfoSource">'; let html = '<div class="mediaInfoSource">';
if (version.Name) { if (version.Name) {
html += `<div><h2 class="mediaInfoStreamType">${version.Name}${copyButtonHtml}</h2></div>\n`; html += `<div><h2 class="mediaInfoStreamType">${escapeHtml(version.Name)}${copyButtonHtml}</h2></div>\n`;
} }
if (version.Container) { if (version.Container) {
html += `${createAttribute(globalize.translate('MediaInfoContainer'), version.Container)}<br/>`; html += `${createAttribute(globalize.translate('MediaInfoContainer'), version.Container)}<br/>`;
@ -181,7 +182,7 @@ const attributeDelimiterHtml = layoutManager.tv ? '' : '<span class="hide">: </s
} }
function createAttribute(label, value) { function createAttribute(label, value) {
return `<span class="mediaInfoLabel">${label}</span>${attributeDelimiterHtml}<span class="mediaInfoAttribute">${value}</span>\n`; return `<span class="mediaInfoLabel">${label}</span>${attributeDelimiterHtml}<span class="mediaInfoAttribute">${escapeHtml(value)}</span>\n`;
} }
function loadMediaInfo(itemId, serverId) { function loadMediaInfo(itemId, serverId) {

11
src/components/itemidentifier/itemidentifier.js
View file

@ -5,6 +5,7 @@
* @module components/itemidentifier/itemidentifier * @module components/itemidentifier/itemidentifier
*/ */
import escapeHtml from 'escape-html';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import loading from '../loading/loading'; import loading from '../loading/loading';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
@ -162,7 +163,7 @@ import template from './itemidentifier.template.html';
currentSearchResult = identifyResult; currentSearchResult = identifyResult;
const lines = []; const lines = [];
lines.push(identifyResult.Name); lines.push(escapeHtml(identifyResult.Name));
if (identifyResult.ProductionYear) { if (identifyResult.ProductionYear) {
lines.push(identifyResult.ProductionYear); lines.push(identifyResult.ProductionYear);
@ -218,7 +219,7 @@ import template from './itemidentifier.template.html';
if (result.ImageUrl) { if (result.ImageUrl) {
html += `<div class="cardImageContainer coveredImage" style="background-image:url('${result.ImageUrl}');"></div>`; html += `<div class="cardImageContainer coveredImage" style="background-image:url('${result.ImageUrl}');"></div>`;
} else { } else {
html += `<div class="cardImageContainer coveredImage defaultCardBackground defaultCardBackground1"><div class="cardText cardCenteredText">${result.Name}</div></div>`; html += `<div class="cardImageContainer coveredImage defaultCardBackground defaultCardBackground1"><div class="cardText cardCenteredText">${escapeHtml(result.Name)}</div></div>`;
} }
html += '</div>'; html += '</div>';
html += '</div>'; html += '</div>';
@ -245,7 +246,7 @@ import template from './itemidentifier.template.html';
} else { } else {
html += '<div class="cardText cardText-secondary cardTextCentered">'; html += '<div class="cardText cardText-secondary cardTextCentered">';
} }
html += lines[i] || '&nbsp;'; html += escapeHtml(lines[i]) || '&nbsp;';
html += '</div>'; html += '</div>';
} }
@ -299,7 +300,7 @@ import template from './itemidentifier.template.html';
fullName = `${idInfo.Name} ${globalize.translate(idInfo.Type)}`; fullName = `${idInfo.Name} ${globalize.translate(idInfo.Type)}`;
} }
const idLabel = globalize.translate('LabelDynamicExternalId', fullName); const idLabel = globalize.translate('LabelDynamicExternalId', escapeHtml(fullName));
html += `<input is="emby-input" class="txtLookupId" data-providerkey="${idInfo.Key}" id="${id}" label="${idLabel}"/>`; html += `<input is="emby-input" class="txtLookupId" data-providerkey="${idInfo.Key}" id="${id}" label="${idLabel}"/>`;
@ -364,7 +365,7 @@ import template from './itemidentifier.template.html';
dlg.querySelector('.fldPath').classList.add('hide'); dlg.querySelector('.fldPath').classList.add('hide');
} }
dlg.querySelector('.txtPath').innerHTML = item.Path || ''; dlg.querySelector('.txtPath').innerText = item.Path || '';
dialogHelper.open(dlg); dialogHelper.open(dlg);

25
src/components/libraryoptionseditor/libraryoptionseditor.js
View file

@ -5,6 +5,7 @@
* @module components/libraryoptionseditor/libraryoptionseditor * @module components/libraryoptionseditor/libraryoptionseditor
*/ */
import escapeHtml from 'escape-html';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import '../../elements/emby-checkbox/emby-checkbox'; import '../../elements/emby-checkbox/emby-checkbox';
@ -68,11 +69,11 @@ import template from './libraryoptionseditor.template.html';
html += '<div class="checkboxList paperList checkboxList-paperList">'; html += '<div class="checkboxList paperList checkboxList-paperList">';
for (let i = 0; i < plugins.length; i++) { for (let i = 0; i < plugins.length; i++) {
const plugin = plugins[i]; const plugin = plugins[i];
html += `<div class="listItem localReaderOption sortableOption" data-pluginname="${plugin.Name}">`; html += `<div class="listItem localReaderOption sortableOption" data-pluginname="${escapeHtml(plugin.Name)}">`;
html += '<span class="listItemIcon material-icons live_tv" aria-hidden="true"></span>'; html += '<span class="listItemIcon material-icons live_tv" aria-hidden="true"></span>';
html += '<div class="listItemBody">'; html += '<div class="listItemBody">';
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += plugin.Name; html += escapeHtml(plugin.Name);
html += '</h3>'; html += '</h3>';
html += '</div>'; html += '</div>';
if (i > 0) { if (i > 0) {
@ -101,7 +102,7 @@ import template from './libraryoptionseditor.template.html';
html += '<div class="checkboxList paperList checkboxList-paperList">'; html += '<div class="checkboxList paperList checkboxList-paperList">';
for (let i = 0; i < metadataSavers.length; i++) { for (let i = 0; i < metadataSavers.length; i++) {
const plugin = metadataSavers[i]; const plugin = metadataSavers[i];
html += `<label><input type="checkbox" data-defaultenabled="${plugin.DefaultEnabled}" is="emby-checkbox" class="chkMetadataSaver" data-pluginname="${plugin.Name}" ${false}><span>${plugin.Name}</span></label>`; html += `<label><input type="checkbox" data-defaultenabled="${plugin.DefaultEnabled}" is="emby-checkbox" class="chkMetadataSaver" data-pluginname="${escapeHtml(plugin.Name)}" ${false}><span>${escapeHtml(plugin.Name)}</span></label>`;
} }
html += '</div>'; html += '</div>';
html += `<div class="fieldDescription" style="margin-top:.25em;">${globalize.translate('LabelMetadataSaversHelp')}</div>`; html += `<div class="fieldDescription" style="margin-top:.25em;">${globalize.translate('LabelMetadataSaversHelp')}</div>`;
@ -122,13 +123,13 @@ import template from './libraryoptionseditor.template.html';
html += '<div class="checkboxList paperList checkboxList-paperList">'; html += '<div class="checkboxList paperList checkboxList-paperList">';
plugins.forEach((plugin, index) => { plugins.forEach((plugin, index) => {
html += '<div class="listItem metadataFetcherItem sortableOption" data-pluginname="' + plugin.Name + '">'; html += '<div class="listItem metadataFetcherItem sortableOption" data-pluginname="' + escapeHtml(plugin.Name) + '">';
const isChecked = libraryOptionsForType.MetadataFetchers ? libraryOptionsForType.MetadataFetchers.includes(plugin.Name) : plugin.DefaultEnabled; const isChecked = libraryOptionsForType.MetadataFetchers ? libraryOptionsForType.MetadataFetchers.includes(plugin.Name) : plugin.DefaultEnabled;
const checkedHtml = isChecked ? ' checked="checked"' : ''; const checkedHtml = isChecked ? ' checked="checked"' : '';
html += '<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkMetadataFetcher" data-pluginname="' + plugin.Name + '" ' + checkedHtml + '><span></span></label>'; html += '<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkMetadataFetcher" data-pluginname="' + escapeHtml(plugin.Name) + '" ' + checkedHtml + '><span></span></label>';
html += '<div class="listItemBody">'; html += '<div class="listItemBody">';
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += plugin.Name; html += escapeHtml(plugin.Name);
html += '</h3>'; html += '</h3>';
html += '</div>'; html += '</div>';
if (index > 0) { if (index > 0) {
@ -188,13 +189,13 @@ import template from './libraryoptionseditor.template.html';
html += '<div class="checkboxList paperList checkboxList-paperList">'; html += '<div class="checkboxList paperList checkboxList-paperList">';
for (let i = 0; i < plugins.length; i++) { for (let i = 0; i < plugins.length; i++) {
const plugin = plugins[i]; const plugin = plugins[i];
html += `<div class="listItem subtitleFetcherItem sortableOption" data-pluginname="${plugin.Name}">`; html += `<div class="listItem subtitleFetcherItem sortableOption" data-pluginname="${escapeHtml(plugin.Name)}">`;
const isChecked = libraryOptions.DisabledSubtitleFetchers ? !libraryOptions.DisabledSubtitleFetchers.includes(plugin.Name) : plugin.DefaultEnabled; const isChecked = libraryOptions.DisabledSubtitleFetchers ? !libraryOptions.DisabledSubtitleFetchers.includes(plugin.Name) : plugin.DefaultEnabled;
const checkedHtml = isChecked ? ' checked="checked"' : ''; const checkedHtml = isChecked ? ' checked="checked"' : '';
html += `<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkSubtitleFetcher" data-pluginname="${plugin.Name}" ${checkedHtml}><span></span></label>`; html += `<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkSubtitleFetcher" data-pluginname="${escapeHtml(plugin.Name)}" ${checkedHtml}><span></span></label>`;
html += '<div class="listItemBody">'; html += '<div class="listItemBody">';
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += plugin.Name; html += escapeHtml(plugin.Name);
html += '</h3>'; html += '</h3>';
html += '</div>'; html += '</div>';
if (i > 0) { if (i > 0) {
@ -227,13 +228,13 @@ import template from './libraryoptionseditor.template.html';
html += '<div class="checkboxList paperList checkboxList-paperList">'; html += '<div class="checkboxList paperList checkboxList-paperList">';
for (let i = 0; i < plugins.length; i++) { for (let i = 0; i < plugins.length; i++) {
const plugin = plugins[i]; const plugin = plugins[i];
html += '<div class="listItem imageFetcherItem sortableOption" data-pluginname="' + plugin.Name + '">'; html += '<div class="listItem imageFetcherItem sortableOption" data-pluginname="' + escapeHtml(plugin.Name) + '">';
const isChecked = libraryOptionsForType.ImageFetchers ? libraryOptionsForType.ImageFetchers.includes(plugin.Name) : plugin.DefaultEnabled; const isChecked = libraryOptionsForType.ImageFetchers ? libraryOptionsForType.ImageFetchers.includes(plugin.Name) : plugin.DefaultEnabled;
const checkedHtml = isChecked ? ' checked="checked"' : ''; const checkedHtml = isChecked ? ' checked="checked"' : '';
html += '<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkImageFetcher" data-pluginname="' + plugin.Name + '" ' + checkedHtml + '><span></span></label>'; html += '<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkImageFetcher" data-pluginname="' + escapeHtml(plugin.Name) + '" ' + checkedHtml + '><span></span></label>';
html += '<div class="listItemBody">'; html += '<div class="listItemBody">';
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += plugin.Name; html += escapeHtml(plugin.Name);
html += '</h3>'; html += '</h3>';
html += '</div>'; html += '</div>';
if (i > 0) { if (i > 0) {

3
src/components/listview/listview.js
View file

@ -5,6 +5,7 @@
* @module components/listview/listview * @module components/listview/listview
*/ */
import escapeHtml from 'escape-html';
import itemHelper from '../itemHelper'; import itemHelper from '../itemHelper';
import mediaInfo from '../mediainfo/mediainfo'; import mediaInfo from '../mediainfo/mediainfo';
import indicators from '../indicators/indicators'; import indicators from '../indicators/indicators';
@ -203,7 +204,7 @@ import ServerConnections from '../ServerConnections';
} else { } else {
html += '<h2 class="listGroupHeader">'; html += '<h2 class="listGroupHeader">';
} }
html += itemGroupTitle; html += escapeHtml(itemGroupTitle);
html += '</h2>'; html += '</h2>';
html += '<div>'; html += '<div>';

5
src/components/mediaLibraryCreator/mediaLibraryCreator.js
View file

@ -5,6 +5,7 @@
* @module components/mediaLibraryCreator/mediaLibraryCreator * @module components/mediaLibraryCreator/mediaLibraryCreator
*/ */
import escapeHtml from 'escape-html';
import loading from '../loading/loading'; import loading from '../loading/loading';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
@ -120,10 +121,10 @@ import template from './mediaLibraryCreator.template.html';
let html = ''; let html = '';
html += '<div class="listItem listItem-border lnkPath" style="padding-left:.5em;">'; html += '<div class="listItem listItem-border lnkPath" style="padding-left:.5em;">';
html += `<div class="${pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody'}">`; html += `<div class="${pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody'}">`;
html += `<div class="listItemBodyText">${pathInfo.Path}</div>`; html += `<div class="listItemBodyText">${escapeHtml(pathInfo.Path)}</div>`;
if (pathInfo.NetworkPath) { if (pathInfo.NetworkPath) {
html += `<div class="listItemBodyText secondary">${pathInfo.NetworkPath}</div>`; html += `<div class="listItemBodyText secondary">${escapeHtml(pathInfo.NetworkPath)}</div>`;
} }
html += '</div>'; html += '</div>';

7
src/components/mediaLibraryEditor/mediaLibraryEditor.js
View file

@ -5,6 +5,7 @@
* @module components/mediaLibraryEditor/mediaLibraryEditor * @module components/mediaLibraryEditor/mediaLibraryEditor
*/ */
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import loading from '../loading/loading'; import loading from '../loading/loading';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
@ -111,11 +112,11 @@ import template from './mediaLibraryEditor.template.html';
html += `<div class="listItem listItem-border lnkPath" data-index="${index}" style="padding-left:.5em;">`; html += `<div class="listItem listItem-border lnkPath" data-index="${index}" style="padding-left:.5em;">`;
html += `<div class="${pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody'}">`; html += `<div class="${pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody'}">`;
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += pathInfo.Path; html += escapeHtml(pathInfo.Path);
html += '</h3>'; html += '</h3>';
if (pathInfo.NetworkPath) { if (pathInfo.NetworkPath) {
html += `<div class="listItemBodyText secondary">${pathInfo.NetworkPath}</div>`; html += `<div class="listItemBodyText secondary">${escapeHtml(pathInfo.NetworkPath)}</div>`;
} }
html += '</div>'; html += '</div>';
@ -213,7 +214,7 @@ export class showEditor {
dlg.classList.add('background-theme-a'); dlg.classList.add('background-theme-a');
dlg.classList.add('formDialog'); dlg.classList.add('formDialog');
dlg.innerHTML = globalize.translateHtml(template); dlg.innerHTML = globalize.translateHtml(template);
dlg.querySelector('.formDialogHeaderTitle').innerHTML = options.library.Name; dlg.querySelector('.formDialogHeaderTitle').innerText = options.library.Name;
initEditor(dlg, options); initEditor(dlg, options);
dlg.addEventListener('close', onDialogClosed); dlg.addEventListener('close', onDialogClosed);
dialogHelper.open(dlg); dialogHelper.open(dlg);

7
src/components/mediainfo/mediainfo.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import datetime from '../../scripts/datetime'; import datetime from '../../scripts/datetime';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
import { appRouter } from '../appRouter'; import { appRouter } from '../appRouter';
@ -77,10 +78,10 @@ import '../../elements/emby-button/emby-button';
Name: item.ChannelName, Name: item.ChannelName,
Id: item.ChannelId Id: item.ChannelId
})}">${item.ChannelName}</a>` })}">${escapeHtml(item.ChannelName)}</a>`
}); });
} else { } else {
miscInfo.push(item.ChannelName); miscInfo.push(escapeHtml(item.ChannelName));
} }
} }
@ -221,7 +222,7 @@ import '../../elements/emby-button/emby-button';
}); });
if (text) { if (text) {
miscInfo.push(text); miscInfo.push(escapeHtml(text));
} }
} else if (item.IsMovie && item.ProductionYear && options.originalAirDate !== false) { } else if (item.IsMovie && item.ProductionYear && options.originalAirDate !== false) {
miscInfo.push(item.ProductionYear); miscInfo.push(item.ProductionYear);

11
src/components/metadataEditor/metadataEditor.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
@ -448,12 +449,12 @@ import template from './metadataEditor.template.html';
fullName = idInfo.Name + ' ' + globalize.translate(idInfo.Type); fullName = idInfo.Name + ' ' + globalize.translate(idInfo.Type);
} }
const labelText = globalize.translate('LabelDynamicExternalId', fullName); const labelText = globalize.translate('LabelDynamicExternalId', escapeHtml(fullName));
html += '<div class="inputContainer">'; html += '<div class="inputContainer">';
html += '<div class="flex align-items-center">'; html += '<div class="flex align-items-center">';
const value = providerIds[idInfo.Key] || ''; const value = escapeHtml(providerIds[idInfo.Key] || '');
html += '<div class="flex-grow">'; html += '<div class="flex-grow">';
html += '<input is="emby-input" class="txtExternalId" value="' + value + '" data-providerkey="' + idInfo.Key + '" data-formatstring="' + formatString + '" id="' + id + '" label="' + labelText + '"/>'; html += '<input is="emby-input" class="txtExternalId" value="' + value + '" data-providerkey="' + idInfo.Key + '" data-formatstring="' + formatString + '" id="' + id + '" label="' + labelText + '"/>';
@ -860,7 +861,7 @@ import template from './metadataEditor.template.html';
for (let i = 0, length = ratings.length; i < length; i++) { for (let i = 0, length = ratings.length; i < length; i++) {
rating = ratings[i]; rating = ratings[i];
html += "<option value='" + rating.Value + "'>" + rating.Name + '</option>'; html += "<option value='" + escapeHtml(rating.Value) + "'>" + escapeHtml(rating.Name) + '</option>';
} }
select.innerHTML = html; select.innerHTML = html;
@ -893,7 +894,7 @@ import template from './metadataEditor.template.html';
html += '<div class="listItemBody">'; html += '<div class="listItemBody">';
html += '<div class="textValue">'; html += '<div class="textValue">';
html += items[i]; html += escapeHtml(items[i]);
html += '</div>'; html += '</div>';
html += '</div>'; html += '</div>';
@ -923,7 +924,7 @@ import template from './metadataEditor.template.html';
html += '<button style="text-align:left;" type="button" class="btnEditPerson clearButton" data-index="' + i + '">'; html += '<button style="text-align:left;" type="button" class="btnEditPerson clearButton" data-index="' + i + '">';
html += '<div class="textValue">'; html += '<div class="textValue">';
html += (person.Name || ''); html += escapeHtml(person.Name || '');
html += '</div>'; html += '</div>';
if (person.Role && person.Role !== lastType) { if (person.Role && person.Role !== lastType) {

6
src/components/playback/nowplayinghelper.js
View file

@ -1,3 +1,5 @@
import escapeHtml from 'escape-html';
export function getNowPlayingNames(nowPlayingItem, includeNonNameInfo) { export function getNowPlayingNames(nowPlayingItem, includeNonNameInfo) {
let topItem = nowPlayingItem; let topItem = nowPlayingItem;
let bottomItem = null; let bottomItem = null;
@ -59,13 +61,13 @@ export function getNowPlayingNames(nowPlayingItem, includeNonNameInfo) {
const list = []; const list = [];
list.push({ list.push({
text: topText, text: escapeHtml(topText),
item: topItem item: topItem
}); });
if (bottomText) { if (bottomText) {
list.push({ list.push({
text: bottomText, text: escapeHtml(bottomText),
item: bottomItem item: bottomItem
}); });
} }

3
src/components/playlisteditor/playlisteditor.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dom from '../../scripts/dom'; import dom from '../../scripts/dom';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import loading from '../loading/loading'; import loading from '../loading/loading';
@ -126,7 +127,7 @@ import ServerConnections from '../ServerConnections';
html += `<option value="">${globalize.translate('OptionNew')}</option>`; html += `<option value="">${globalize.translate('OptionNew')}</option>`;
html += result.Items.map(i => { html += result.Items.map(i => {
return `<option value="${i.Id}">${i.Name}</option>`; return `<option value="${i.Id}">${escapeHtml(i.Name)}</option>`;
}); });
select.innerHTML = html; select.innerHTML = html;

6
src/components/prompt/prompt.js
View file

@ -54,10 +54,10 @@ export default (() => {
dialogHelper.close(dlg); dialogHelper.close(dlg);
}); });
dlg.querySelector('.formDialogHeaderTitle').innerHTML = options.title || ''; dlg.querySelector('.formDialogHeaderTitle').innerText = options.title || '';
if (options.description) { if (options.description) {
dlg.querySelector('.fieldDescription').innerHTML = options.description; dlg.querySelector('.fieldDescription').innerText = options.description;
} else { } else {
dlg.querySelector('.fieldDescription').classList.add('hide'); dlg.querySelector('.fieldDescription').classList.add('hide');
} }
@ -79,7 +79,7 @@ export default (() => {
return false; return false;
}); });
dlg.querySelector('.submitText').innerHTML = options.confirmText || globalize.translate('ButtonOk'); dlg.querySelector('.submitText').innerText = options.confirmText || globalize.translate('ButtonOk');
dlg.style.minWidth = `${Math.min(400, dom.getWindowSize().innerWidth - 50)}px`; dlg.style.minWidth = `${Math.min(400, dom.getWindowSize().innerWidth - 50)}px`;

8
src/components/recordingcreator/recordingcreator.js
View file

@ -81,10 +81,10 @@ function renderRecording(context, defaultTimer, program, apiClient, refreshRecor
imageContainer.classList.add('hide'); imageContainer.classList.add('hide');
} }
context.querySelector('.recordingDialog-itemName').innerHTML = program.Name; context.querySelector('.recordingDialog-itemName').innerText = program.Name;
context.querySelector('.formDialogHeaderTitle').innerHTML = program.Name; context.querySelector('.formDialogHeaderTitle').innerText = program.Name;
context.querySelector('.itemGenres').innerHTML = (program.Genres || []).join(' / '); context.querySelector('.itemGenres').innerText = (program.Genres || []).join(' / ');
context.querySelector('.itemOverview').innerHTML = program.Overview || ''; context.querySelector('.itemOverview').innerText = program.Overview || '';
const formDialogFooter = context.querySelector('.formDialogFooter'); const formDialogFooter = context.querySelector('.formDialogFooter');
const now = new Date(); const now = new Date();

2
src/components/recordingcreator/seriesrecordingeditor.js
View file

@ -45,7 +45,7 @@ function renderTimer(context, item) {
context.querySelector('.selectKeepUpTo').value = item.KeepUpTo || 0; context.querySelector('.selectKeepUpTo').value = item.KeepUpTo || 0;
if (item.ChannelName || item.ChannelNumber) { if (item.ChannelName || item.ChannelNumber) {
context.querySelector('.optionChannelOnly').innerHTML = globalize.translate('ChannelNameOnly', item.ChannelName || item.ChannelNumber); context.querySelector('.optionChannelOnly').innerText = globalize.translate('ChannelNameOnly', item.ChannelName || item.ChannelNumber);
} else { } else {
context.querySelector('.optionChannelOnly').innerHTML = globalize.translate('OneChannel'); context.querySelector('.optionChannelOnly').innerHTML = globalize.translate('OneChannel');
} }

25
src/components/remotecontrol/remotecontrol.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import datetime from '../../scripts/datetime'; import datetime from '../../scripts/datetime';
import backdrop from '../backdrop/backdrop'; import backdrop from '../backdrop/backdrop';
import listView from '../listview/listview'; import listView from '../listview/listview';
@ -139,13 +140,13 @@ function updateNowPlayingInfo(context, state, serverId) {
if (item) { if (item) {
const nowPlayingServerId = (item.ServerId || serverId); const nowPlayingServerId = (item.ServerId || serverId);
if (item.Type == 'Audio' || item.MediaStreams[0].Type == 'Audio') { if (item.Type == 'Audio' || item.MediaStreams[0].Type == 'Audio') {
const songName = item.Name; const songName = escapeHtml(item.Name);
let artistsSeries = ''; let artistsSeries = '';
let albumName = ''; let albumName = '';
if (item.Artists != null) { if (item.Artists != null) {
if (item.ArtistItems != null) { if (item.ArtistItems != null) {
for (const artist of item.ArtistItems) { for (const artist of item.ArtistItems) {
const artistName = artist.Name; const artistName = escapeHtml(artist.Name);
const artistId = artist.Id; const artistId = artist.Id;
artistsSeries += `<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=${artistId}&serverId=${nowPlayingServerId}">${artistName}</a>`; artistsSeries += `<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=${artistId}&serverId=${nowPlayingServerId}">${artistName}</a>`;
if (artist !== item.ArtistItems.slice(-1)[0]) { if (artist !== item.ArtistItems.slice(-1)[0]) {
@ -157,7 +158,7 @@ function updateNowPlayingInfo(context, state, serverId) {
// to normal item.Artists item. // to normal item.Artists item.
// TODO: Normalise fields returned by all the players // TODO: Normalise fields returned by all the players
for (const artist of item.Artists) { for (const artist of item.Artists) {
artistsSeries += `<a>${artist}</a>`; artistsSeries += `<a>${escapeHtml(artist)}</a>`;
if (artist !== item.Artists.slice(-1)[0]) { if (artist !== item.Artists.slice(-1)[0]) {
artistsSeries += ', '; artistsSeries += ', ';
} }
@ -165,27 +166,27 @@ function updateNowPlayingInfo(context, state, serverId) {
} }
} }
if (item.Album != null) { if (item.Album != null) {
albumName = '<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=' + item.AlbumId + `&serverId=${nowPlayingServerId}">` + item.Album + '</a>'; albumName = '<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=' + item.AlbumId + `&serverId=${nowPlayingServerId}">` + escapeHtml(item.Album) + '</a>';
} }
context.querySelector('.nowPlayingAlbum').innerHTML = albumName; context.querySelector('.nowPlayingAlbum').innerText = albumName;
context.querySelector('.nowPlayingArtist').innerHTML = artistsSeries; context.querySelector('.nowPlayingArtist').innerText = artistsSeries;
context.querySelector('.nowPlayingSongName').innerHTML = songName; context.querySelector('.nowPlayingSongName').innerText = songName;
} else if (item.Type == 'Episode') { } else if (item.Type == 'Episode') {
if (item.SeasonName != null) { if (item.SeasonName != null) {
const seasonName = item.SeasonName; const seasonName = item.SeasonName;
context.querySelector('.nowPlayingSeason').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=' + item.SeasonId + `&serverId=${nowPlayingServerId}">${seasonName}</a>`; context.querySelector('.nowPlayingSeason').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=' + item.SeasonId + `&serverId=${nowPlayingServerId}">${escapeHtml(seasonName)}</a>`;
} }
if (item.SeriesName != null) { if (item.SeriesName != null) {
const seriesName = item.SeriesName; const seriesName = item.SeriesName;
if (item.SeriesId != null) { if (item.SeriesId != null) {
context.querySelector('.nowPlayingSerie').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=' + item.SeriesId + `&serverId=${nowPlayingServerId}">${seriesName}</a>`; context.querySelector('.nowPlayingSerie').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="#!/details?id=' + item.SeriesId + `&serverId=${nowPlayingServerId}">${escapeHtml(seriesName)}</a>`;
} else { } else {
context.querySelector('.nowPlayingSerie').innerHTML = seriesName; context.querySelector('.nowPlayingSerie').innerText = seriesName;
} }
} }
context.querySelector('.nowPlayingEpisode').innerHTML = item.Name; context.querySelector('.nowPlayingEpisode').innerText = item.Name;
} else { } else {
context.querySelector('.nowPlayingPageTitle').innerHTML = displayName; context.querySelector('.nowPlayingPageTitle').innerText = displayName;
} }
if (displayName.length > 0 && item.Type != 'Audio' && item.Type != 'Episode') { if (displayName.length > 0 && item.Type != 'Audio' && item.Type != 'Episode') {

3
src/components/search/SearchSuggestions.tsx
View file

@ -1,4 +1,5 @@
import { BaseItemDto } from '@thornbill/jellyfin-sdk/dist/generated-client'; import { BaseItemDto } from '@thornbill/jellyfin-sdk/dist/generated-client';
import escapeHtml from 'escape-html';
import React, { FunctionComponent, useEffect, useState } from 'react'; import React, { FunctionComponent, useEffect, useState } from 'react';
import { appRouter } from '../appRouter'; import { appRouter } from '../appRouter';
@ -16,7 +17,7 @@ const createSuggestionLink = ({ name, href }: { name: string, href: string }) =>
class='button-link' class='button-link'
style='display: inline-block; padding: 0.5em 1em;' style='display: inline-block; padding: 0.5em 1em;'
href='${href}' href='${href}'
>${name}</a>` >${escapeHtml(name)}</a>`
}); });
type SearchSuggestionsProps = { type SearchSuggestionsProps = {

11
src/components/subtitleeditor/subtitleeditor.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import { appHost } from '../apphost'; import { appHost } from '../apphost';
import dialogHelper from '../dialogHelper/dialogHelper'; import dialogHelper from '../dialogHelper/dialogHelper';
import layoutManager from '../layoutManager'; import layoutManager from '../layoutManager';
@ -103,11 +104,11 @@ function fillSubtitleList(context, item) {
itemHtml += '<div class="listItemBody two-line">'; itemHtml += '<div class="listItemBody two-line">';
itemHtml += '<div>'; itemHtml += '<div>';
itemHtml += s.DisplayTitle || ''; itemHtml += escapeHtml(s.DisplayTitle || '');
itemHtml += '</div>'; itemHtml += '</div>';
if (s.Path) { if (s.Path) {
itemHtml += '<div class="secondary listItemBodyText">' + (s.Path) + '</div>'; itemHtml += '<div class="secondary listItemBodyText">' + escapeHtml(s.Path) + '</div>';
} }
itemHtml += '</a>'; itemHtml += '</a>';
@ -199,7 +200,7 @@ function renderSearchResults(context, results) {
html += '<div class="listItemBody ' + bodyClass + '">'; html += '<div class="listItemBody ' + bodyClass + '">';
html += '<div>' + (result.Name) + '</div>'; html += '<div>' + escapeHtml(result.Name) + '</div>';
html += '<div class="secondary listItemBodyText">'; html += '<div class="secondary listItemBodyText">';
if (result.Format) { if (result.Format) {
@ -212,7 +213,7 @@ function renderSearchResults(context, results) {
html += '</div>'; html += '</div>';
if (result.Comment) { if (result.Comment) {
html += '<div class="secondary listItemBodyText">' + (result.Comment) + '</div>'; html += '<div class="secondary listItemBodyText">' + escapeHtml(result.Comment) + '</div>';
} }
if (result.IsHashMatch) { if (result.IsHashMatch) {
@ -265,7 +266,7 @@ function reload(context, apiClient, itemId) {
} }
if (file) { if (file) {
context.querySelector('.pathValue').innerHTML = file; context.querySelector('.pathValue').innerText = file;
context.querySelector('.originalFile').classList.remove('hide'); context.querySelector('.originalFile').classList.remove('hide');
} else { } else {
context.querySelector('.pathValue').innerHTML = ''; context.querySelector('.pathValue').innerHTML = '';

2
src/components/upnextdialog/upnextdialog.js
View file

@ -80,7 +80,7 @@ import '../../assets/css/flexstyles.scss';
title = item.SeriesName + ' - ' + title; title = item.SeriesName + ' - ' + title;
} }
elem.querySelector('.upNextDialog-title').innerHTML = title || ''; elem.querySelector('.upNextDialog-title').innerText = title || '';
instance.itemType = item.Type; instance.itemType = item.Type;

37
src/controllers/dashboard/dashboard.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import datetime from '../../scripts/datetime'; import datetime from '../../scripts/datetime';
import { Events } from 'jellyfin-apiclient'; import { Events } from 'jellyfin-apiclient';
import itemHelper from '../../components/itemHelper'; import itemHelper from '../../components/itemHelper';
@ -199,10 +200,10 @@ import confirm from '../../components/confirm/confirm';
function reloadSystemInfo(view, apiClient) { function reloadSystemInfo(view, apiClient) {
apiClient.getSystemInfo().then(function (systemInfo) { apiClient.getSystemInfo().then(function (systemInfo) {
view.querySelector('#serverName').innerHTML = globalize.translate('DashboardServerName', systemInfo.ServerName); view.querySelector('#serverName').innerText = globalize.translate('DashboardServerName', systemInfo.ServerName);
view.querySelector('#versionNumber').innerHTML = globalize.translate('DashboardVersionNumber', systemInfo.Version); view.querySelector('#versionNumber').innerText = globalize.translate('DashboardVersionNumber', systemInfo.Version);
view.querySelector('#operatingSystem').innerHTML = globalize.translate('DashboardOperatingSystem', systemInfo.OperatingSystem); view.querySelector('#operatingSystem').innerText = globalize.translate('DashboardOperatingSystem', systemInfo.OperatingSystem);
view.querySelector('#architecture').innerHTML = globalize.translate('DashboardArchitecture', systemInfo.SystemArchitecture); view.querySelector('#architecture').innerText = globalize.translate('DashboardArchitecture', systemInfo.SystemArchitecture);
if (systemInfo.CanSelfRestart) { if (systemInfo.CanSelfRestart) {
view.querySelector('#btnRestartServer').classList.remove('hide'); view.querySelector('#btnRestartServer').classList.remove('hide');
@ -210,11 +211,11 @@ import confirm from '../../components/confirm/confirm';
view.querySelector('#btnRestartServer').classList.add('hide'); view.querySelector('#btnRestartServer').classList.add('hide');
} }
view.querySelector('#cachePath').innerHTML = systemInfo.CachePath; view.querySelector('#cachePath').innerText = systemInfo.CachePath;
view.querySelector('#logPath').innerHTML = systemInfo.LogPath; view.querySelector('#logPath').innerText = systemInfo.LogPath;
view.querySelector('#transcodePath').innerHTML = systemInfo.TranscodingTempPath; view.querySelector('#transcodePath').innerText = systemInfo.TranscodingTempPath;
view.querySelector('#metadataPath').innerHTML = systemInfo.InternalMetadataPath; view.querySelector('#metadataPath').innerText = systemInfo.InternalMetadataPath;
view.querySelector('#webPath').innerHTML = systemInfo.WebPath; view.querySelector('#webPath').innerText = systemInfo.WebPath;
}); });
} }
@ -279,8 +280,8 @@ import confirm from '../../components/confirm/confirm';
} }
html += '<div class="sessionAppName" style="display:inline-block;">'; html += '<div class="sessionAppName" style="display:inline-block;">';
html += '<div class="sessionDeviceName">' + session.DeviceName + '</div>'; html += '<div class="sessionDeviceName">' + escapeHtml(session.DeviceName) + '</div>';
html += '<div class="sessionAppSecondaryText">' + DashboardPage.getAppSecondaryText(session) + '</div>'; html += '<div class="sessionAppSecondaryText">' + escapeHtml(DashboardPage.getAppSecondaryText(session)) + '</div>';
html += '</div>'; html += '</div>';
html += '</div>'; html += '</div>';
@ -289,7 +290,7 @@ import confirm from '../../components/confirm/confirm';
html += '<div class="sessionNowPlayingInfo" data-imgsrc="' + nowPlayingName.image + '">'; html += '<div class="sessionNowPlayingInfo" data-imgsrc="' + nowPlayingName.image + '">';
html += nowPlayingName.html; html += nowPlayingName.html;
html += '</div>'; html += '</div>';
html += '<div class="sessionNowPlayingTime">' + DashboardPage.getSessionNowPlayingTime(session) + '</div>'; html += '<div class="sessionNowPlayingTime">' + escapeHtml(DashboardPage.getSessionNowPlayingTime(session)) + '</div>';
html += '</div>'; html += '</div>';
let percent = 100 * session?.PlayState?.PositionTicks / nowPlayingItem?.RunTimeTicks; let percent = 100 * session?.PlayState?.PositionTicks / nowPlayingItem?.RunTimeTicks;
@ -480,16 +481,16 @@ import confirm from '../../components/confirm/confirm';
}; };
} }
let topText = itemHelper.getDisplayName(nowPlayingItem); let topText = escapeHtml(itemHelper.getDisplayName(nowPlayingItem));
let bottomText = ''; let bottomText = '';
if (nowPlayingItem.Artists && nowPlayingItem.Artists.length) { if (nowPlayingItem.Artists && nowPlayingItem.Artists.length) {
bottomText = topText; bottomText = topText;
topText = nowPlayingItem.Artists[0]; topText = escapeHtml(nowPlayingItem.Artists[0]);
} else { } else {
if (nowPlayingItem.SeriesName || nowPlayingItem.Album) { if (nowPlayingItem.SeriesName || nowPlayingItem.Album) {
bottomText = topText; bottomText = topText;
topText = nowPlayingItem.SeriesName || nowPlayingItem.Album; topText = escapeHtml(nowPlayingItem.SeriesName || nowPlayingItem.Album);
} else if (nowPlayingItem.ProductionYear) { } else if (nowPlayingItem.ProductionYear) {
bottomText = nowPlayingItem.ProductionYear; bottomText = nowPlayingItem.ProductionYear;
} }
@ -575,9 +576,9 @@ import confirm from '../../components/confirm/confirm';
btnSessionPlayPauseIcon.classList.remove('play_arrow', 'pause'); btnSessionPlayPauseIcon.classList.remove('play_arrow', 'pause');
btnSessionPlayPauseIcon.classList.add(session.PlayState && session.PlayState.IsPaused ? 'play_arrow' : 'pause'); btnSessionPlayPauseIcon.classList.add(session.PlayState && session.PlayState.IsPaused ? 'play_arrow' : 'pause');
row.querySelector('.sessionNowPlayingTime').innerHTML = DashboardPage.getSessionNowPlayingTime(session); row.querySelector('.sessionNowPlayingTime').innerText = DashboardPage.getSessionNowPlayingTime(session);
row.querySelector('.sessionUserName').innerHTML = DashboardPage.getUsersHtml(session); row.querySelector('.sessionUserName').innerText = DashboardPage.getUsersHtml(session);
row.querySelector('.sessionAppSecondaryText').innerHTML = DashboardPage.getAppSecondaryText(session); row.querySelector('.sessionAppSecondaryText').innerText = DashboardPage.getAppSecondaryText(session);
const nowPlayingName = DashboardPage.getNowPlayingName(session); const nowPlayingName = DashboardPage.getNowPlayingName(session);
const nowPlayingInfoElem = row.querySelector('.sessionNowPlayingInfo'); const nowPlayingInfoElem = row.querySelector('.sessionNowPlayingInfo');

2
src/controllers/dashboard/devices/device.js
View file

@ -8,7 +8,7 @@ import Dashboard from '../../../scripts/clientUtils';
function load(page, device, deviceOptions) { function load(page, device, deviceOptions) {
page.querySelector('#txtCustomName', page).value = deviceOptions.CustomName || ''; page.querySelector('#txtCustomName', page).value = deviceOptions.CustomName || '';
page.querySelector('.reportedName', page).innerHTML = device.Name || ''; page.querySelector('.reportedName', page).innerText = device.Name || '';
} }
function loadData() { function loadData() {

7
src/controllers/dashboard/devices/devices.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import cardBuilder from '../../../components/cardbuilder/cardBuilder'; import cardBuilder from '../../../components/cardbuilder/cardBuilder';
import loading from '../../../components/loading/loading'; import loading from '../../../components/loading/loading';
import dom from '../../../scripts/dom'; import dom from '../../../scripts/dom';
@ -118,15 +119,15 @@ import confirm from '../../../components/confirm/confirm';
} }
deviceHtml += "<div class='cardText'>"; deviceHtml += "<div class='cardText'>";
deviceHtml += device.Name; deviceHtml += escapeHtml(device.Name);
deviceHtml += '</div>'; deviceHtml += '</div>';
deviceHtml += "<div class='cardText cardText-secondary'>"; deviceHtml += "<div class='cardText cardText-secondary'>";
deviceHtml += device.AppName + ' ' + device.AppVersion; deviceHtml += escapeHtml(device.AppName + ' ' + device.AppVersion);
deviceHtml += '</div>'; deviceHtml += '</div>';
deviceHtml += "<div class='cardText cardText-secondary'>"; deviceHtml += "<div class='cardText cardText-secondary'>";
if (device.LastUserName) { if (device.LastUserName) {
deviceHtml += device.LastUserName; deviceHtml += escapeHtml(device.LastUserName);
deviceHtml += ', ' + formatDistanceToNow(Date.parse(device.DateLastActivity), localeWithSuffix); deviceHtml += ', ' + formatDistanceToNow(Date.parse(device.DateLastActivity), localeWithSuffix);
} }

11
src/controllers/dashboard/dlna/profile.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import loading from '../../../components/loading/loading'; import loading from '../../../components/loading/loading';
import globalize from '../../../scripts/globalize'; import globalize from '../../../scripts/globalize';
@ -76,7 +77,7 @@ import toast from '../../../components/toast/toast';
profile.CodecProfiles = profile.CodecProfiles || []; profile.CodecProfiles = profile.CodecProfiles || [];
profile.ResponseProfiles = profile.ResponseProfiles || []; profile.ResponseProfiles = profile.ResponseProfiles || [];
const usersHtml = '<option></option>' + users.map(function (u) { const usersHtml = '<option></option>' + users.map(function (u) {
return '<option value="' + u.Id + '">' + u.Name + '</option>'; return '<option value="' + u.Id + '">' + escapeHtml(u.Name) + '</option>';
}).join(''); }).join('');
$('#selectUser', page).html(usersHtml).val(profile.UserId || ''); $('#selectUser', page).html(usersHtml).val(profile.UserId || '');
renderSubProfiles(page, profile); renderSubProfiles(page, profile);
@ -88,8 +89,8 @@ import toast from '../../../components/toast/toast';
let li = '<div class="listItem">'; let li = '<div class="listItem">';
li += '<span class="material-icons listItemIcon info" aria-hidden="true"></span>'; li += '<span class="material-icons listItemIcon info" aria-hidden="true"></span>';
li += '<div class="listItemBody">'; li += '<div class="listItemBody">';
li += '<h3 class="listItemBodyText">' + h.Name + ': ' + (h.Value || '') + '</h3>'; li += '<h3 class="listItemBodyText">' + escapeHtml(h.Name + ': ' + (h.Value || '')) + '</h3>';
li += '<div class="listItemBodyText secondary">' + (h.Match || '') + '</div>'; li += '<div class="listItemBodyText secondary">' + escapeHtml(h.Match || '') + '</div>';
li += '</div>'; li += '</div>';
li += '<button type="button" is="paper-icon-button-light" class="btnDeleteIdentificationHeader listItemButton" data-index="' + index + '"><span class="material-icons delete" aria-hidden="true"></span></button>'; li += '<button type="button" is="paper-icon-button-light" class="btnDeleteIdentificationHeader listItemButton" data-index="' + index + '"><span class="material-icons delete" aria-hidden="true"></span></button>';
li += '</div>'; li += '</div>';
@ -144,7 +145,7 @@ import toast from '../../../components/toast/toast';
let li = '<div class="listItem">'; let li = '<div class="listItem">';
li += '<span class="material-icons listItemIcon info" aria-hidden="true"></span>'; li += '<span class="material-icons listItemIcon info" aria-hidden="true"></span>';
li += '<div class="listItemBody">'; li += '<div class="listItemBody">';
li += '<h3 class="listItemBodyText">' + h.Name + ' = ' + (h.Value || '') + '</h3>'; li += '<h3 class="listItemBodyText">' + escapeHtml(h.Name + ' = ' + (h.Value || '')) + '</h3>';
li += '</div>'; li += '</div>';
li += '<button type="button" is="paper-icon-button-light" class="btnDeleteXmlAttribute listItemButton" data-index="0"><span class="material-icons delete" aria-hidden="true"></span></button>'; li += '<button type="button" is="paper-icon-button-light" class="btnDeleteXmlAttribute listItemButton" data-index="0"><span class="material-icons delete" aria-hidden="true"></span></button>';
return li += '</div>'; return li += '</div>';
@ -186,7 +187,7 @@ import toast from '../../../components/toast/toast';
let li = '<div class="listItem lnkEditSubProfile" data-index="' + index + '">'; let li = '<div class="listItem lnkEditSubProfile" data-index="' + index + '">';
li += '<span class="material-icons listItemIcon info" aria-hidden="true"></span>'; li += '<span class="material-icons listItemIcon info" aria-hidden="true"></span>';
li += '<div class="listItemBody">'; li += '<div class="listItemBody">';
li += '<h3 class="listItemBodyText">' + (h.Format || '') + '</h3>'; li += '<h3 class="listItemBodyText">' + escapeHtml(h.Format || '') + '</h3>';
li += '</div>'; li += '</div>';
li += '<button type="button" is="paper-icon-button-light" class="btnDeleteProfile listItemButton" data-index="' + index + '"><span class="material-icons delete" aria-hidden="true"></span></button>'; li += '<button type="button" is="paper-icon-button-light" class="btnDeleteProfile listItemButton" data-index="' + index + '"><span class="material-icons delete" aria-hidden="true"></span></button>';
li += '</div>'; li += '</div>';

3
src/controllers/dashboard/dlna/profiles.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import globalize from '../../../scripts/globalize'; import globalize from '../../../scripts/globalize';
import loading from '../../../components/loading/loading'; import loading from '../../../components/loading/loading';
@ -42,7 +43,7 @@ import confirm from '../../../components/confirm/confirm';
html += '<span class="listItemIcon material-icons live_tv" aria-hidden="true"></span>'; html += '<span class="listItemIcon material-icons live_tv" aria-hidden="true"></span>';
html += '<div class="listItemBody two-line">'; html += '<div class="listItemBody two-line">';
html += "<a is='emby-linkbutton' style='padding:0;margin:0;' data-ripple='false' class='clearLink' href='#!/dlnaprofile.html?id=" + profile.Id + "'>"; html += "<a is='emby-linkbutton' style='padding:0;margin:0;' data-ripple='false' class='clearLink' href='#!/dlnaprofile.html?id=" + profile.Id + "'>";
html += '<div>' + profile.Name + '</div>'; html += '<div>' + escapeHtml(profile.Name) + '</div>';
html += '</a>'; html += '</a>';
html += '</div>'; html += '</div>';

3
src/controllers/dashboard/dlna/settings.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import loading from '../../../components/loading/loading'; import loading from '../../../components/loading/loading';
import libraryMenu from '../../../scripts/libraryMenu'; import libraryMenu from '../../../scripts/libraryMenu';
@ -14,7 +15,7 @@ import Dashboard from '../../../scripts/clientUtils';
$('#chkBlastAliveMessages', page).prop('checked', config.BlastAliveMessages); $('#chkBlastAliveMessages', page).prop('checked', config.BlastAliveMessages);
$('#txtBlastInterval', page).val(config.BlastAliveMessageIntervalSeconds); $('#txtBlastInterval', page).val(config.BlastAliveMessageIntervalSeconds);
const usersHtml = users.map(function (u) { const usersHtml = users.map(function (u) {
return '<option value="' + u.Id + '">' + u.Name + '</option>'; return '<option value="' + u.Id + '">' + escapeHtml(u.Name) + '</option>';
}).join(''); }).join('');
$('#selectUser', page).html(usersHtml).val(config.DefaultUserId || ''); $('#selectUser', page).html(usersHtml).val(config.DefaultUserId || '');
loading.hide(); loading.hide();

5
src/controllers/dashboard/library.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import taskButton from '../../scripts/taskbutton'; import taskButton from '../../scripts/taskbutton';
import loading from '../../components/loading/loading'; import loading from '../../components/loading/loading';
@ -297,7 +298,7 @@ import cardBuilder from '../../components/cardbuilder/cardBuilder';
if (virtualFolder.showNameWithIcon) { if (virtualFolder.showNameWithIcon) {
html += '<div style="margin:1em 0;position:width:100%;">'; html += '<div style="margin:1em 0;position:width:100%;">';
html += virtualFolder.Name; html += escapeHtml(virtualFolder.Name);
html += '</div>'; html += '</div>';
} }
@ -319,7 +320,7 @@ import cardBuilder from '../../components/cardbuilder/cardBuilder';
if (virtualFolder.showNameWithIcon) { if (virtualFolder.showNameWithIcon) {
html += '&nbsp;'; html += '&nbsp;';
} else { } else {
html += virtualFolder.Name; html += escapeHtml(virtualFolder.Name);
} }
html += '</div>'; html += '</div>';

3
src/controllers/dashboard/metadatanfo.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import loading from '../../components/loading/loading'; import loading from '../../components/loading/loading';
import libraryMenu from '../../scripts/libraryMenu'; import libraryMenu from '../../scripts/libraryMenu';
@ -10,7 +11,7 @@ import alert from '../../components/alert';
function loadPage(page, config, users) { function loadPage(page, config, users) {
let html = '<option value="" selected="selected">' + globalize.translate('None') + '</option>'; let html = '<option value="" selected="selected">' + globalize.translate('None') + '</option>';
html += users.map(function (user) { html += users.map(function (user) {
return '<option value="' + user.Id + '">' + user.Name + '</option>'; return '<option value="' + user.Id + '">' + escapeHtml(user.Name) + '</option>';
}).join(''); }).join('');
$('#selectUser', page).html(html).val(config.UserId || ''); $('#selectUser', page).html(html).val(config.UserId || '');
$('#selectReleaseDateFormat', page).val(config.ReleaseDateFormat); $('#selectReleaseDateFormat', page).val(config.ReleaseDateFormat);

5
src/controllers/dashboard/notifications/notification/index.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import '../../../../elements/emby-checkbox/emby-checkbox'; import '../../../../elements/emby-checkbox/emby-checkbox';
import Dashboard from '../../../../scripts/clientUtils'; import Dashboard from '../../../../scripts/clientUtils';
@ -7,7 +8,7 @@ function fillItems(elem, items, cssClass, idPrefix, currentList, isEnabledList)
html += items.map(function (u) { html += items.map(function (u) {
const isChecked = isEnabledList ? currentList.indexOf(u.Id) != -1 : currentList.indexOf(u.Id) == -1; const isChecked = isEnabledList ? currentList.indexOf(u.Id) != -1 : currentList.indexOf(u.Id) == -1;
const checkedHtml = isChecked ? ' checked="checked"' : ''; const checkedHtml = isChecked ? ' checked="checked"' : '';
return '<label><input is="emby-checkbox" class="' + cssClass + '" type="checkbox" data-itemid="' + u.Id + '"' + checkedHtml + '/><span>' + u.Name + '</span></label>'; return '<label><input is="emby-checkbox" class="' + cssClass + '" type="checkbox" data-itemid="' + u.Id + '"' + checkedHtml + '/><span>' + escapeHtml(u.Name) + '</span></label>';
}).join(''); }).join('');
html += '</div>'; html += '</div>';
elem.html(html).trigger('create'); elem.html(html).trigger('create');
@ -37,7 +38,7 @@ function reload(page) {
$('.monitorUsers', page).hide(); $('.monitorUsers', page).hide();
} }
$('.notificationType', page).html(typeInfo.Name || 'Unknown Notification'); $('.notificationType', page).html(escapeHtml(typeInfo.Name) || 'Unknown Notification');
if (!notificationConfig) { if (!notificationConfig) {
notificationConfig = { notificationConfig = {

2
src/controllers/dashboard/users/userpasswordpage.js
View file

@ -13,7 +13,7 @@ import confirm from '../../../components/confirm/confirm';
ApiClient.getUser(userid).then(function (user) { ApiClient.getUser(userid).then(function (user) {
Dashboard.getCurrentUser().then(function (loggedInUser) { Dashboard.getCurrentUser().then(function (loggedInUser) {
libraryMenu.setTitle(user.Name); libraryMenu.setTitle(user.Name);
page.querySelector('.username').innerHTML = user.Name; page.querySelector('.username').innerText = user.Name;
let showPasswordSection = true; let showPasswordSection = true;
let showLocalAccessSection = false; let showLocalAccessSection = false;

47
src/controllers/itemDetails/index.js
View file

@ -1,4 +1,5 @@
import { intervalToDuration } from 'date-fns'; import { intervalToDuration } from 'date-fns';
import escapeHtml from 'escape-html';
import { appHost } from '../../components/apphost'; import { appHost } from '../../components/apphost';
import loading from '../../components/loading/loading'; import loading from '../../components/loading/loading';
import { appRouter } from '../../components/appRouter'; import { appRouter } from '../../components/appRouter';
@ -211,7 +212,7 @@ function renderTrackSelections(page, instance, item, forceReload) {
const selectedId = mediaSources[0].Id; const selectedId = mediaSources[0].Id;
select.innerHTML = mediaSources.map(function (v) { select.innerHTML = mediaSources.map(function (v) {
const selected = v.Id === selectedId ? ' selected' : ''; const selected = v.Id === selectedId ? ' selected' : '';
return '<option value="' + v.Id + '"' + selected + '>' + v.Name + '</option>'; return '<option value="' + v.Id + '"' + selected + '>' + escapeHtml(v.Name) + '</option>';
}).join(''); }).join('');
if (mediaSources.length > 1) { if (mediaSources.length > 1) {
@ -415,7 +416,7 @@ function getArtistLinksHtml(artists, serverId, context) {
itemType: 'MusicArtist', itemType: 'MusicArtist',
serverId: serverId serverId: serverId
}); });
html.push('<a style="color:inherit;" class="button-link" is="emby-linkbutton" href="' + href + '">' + artist.Name + '</a>'); html.push('<a style="color:inherit;" class="button-link" is="emby-linkbutton" href="' + href + '">' + escapeHtml(artist.Name) + '</a>');
} }
return html.join(' / '); return html.join(' / ');
@ -438,21 +439,21 @@ function renderName(item, container, context) {
parentNameHtml.push(getArtistLinksHtml(item.ArtistItems, item.ServerId, context)); parentNameHtml.push(getArtistLinksHtml(item.ArtistItems, item.ServerId, context));
parentNameLast = true; parentNameLast = true;
} else if (item.SeriesName && item.Type === 'Episode') { } else if (item.SeriesName && item.Type === 'Episode') {
parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.SeriesId}" data-serverid="${item.ServerId}" data-type="Series" data-isfolder="true">${item.SeriesName}</a>`); parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.SeriesId}" data-serverid="${item.ServerId}" data-type="Series" data-isfolder="true">${escapeHtml(item.SeriesName)}</a>`);
} else if (item.IsSeries || item.EpisodeTitle) { } else if (item.IsSeries || item.EpisodeTitle) {
parentNameHtml.push(item.Name); parentNameHtml.push(escapeHtml(item.Name));
} }
if (item.SeriesName && item.Type === 'Season') { if (item.SeriesName && item.Type === 'Season') {
parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.SeriesId}" data-serverid="${item.ServerId}" data-type="Series" data-isfolder="true">${item.SeriesName}</a>`); parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.SeriesId}" data-serverid="${item.ServerId}" data-type="Series" data-isfolder="true">${escapeHtml(item.SeriesName)}</a>`);
} else if (item.ParentIndexNumber != null && item.Type === 'Episode') { } else if (item.ParentIndexNumber != null && item.Type === 'Episode') {
parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.SeasonId}" data-serverid="${item.ServerId}" data-type="Season" data-isfolder="true">${item.SeasonName}</a>`); parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.SeasonId}" data-serverid="${item.ServerId}" data-type="Season" data-isfolder="true">${escapeHtml(item.SeasonName)}</a>`);
} else if (item.ParentIndexNumber != null && item.IsSeries) { } else if (item.ParentIndexNumber != null && item.IsSeries) {
parentNameHtml.push(item.SeasonName || 'S' + item.ParentIndexNumber); parentNameHtml.push(escapeHtml(item.SeasonName) || 'S' + item.ParentIndexNumber);
} else if (item.Album && item.AlbumId && (item.Type === 'MusicVideo' || item.Type === 'Audio')) { } else if (item.Album && item.AlbumId && (item.Type === 'MusicVideo' || item.Type === 'Audio')) {
parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.AlbumId}" data-serverid="${item.ServerId}" data-type="MusicAlbum" data-isfolder="true">${item.Album}</a>`); parentNameHtml.push(`<a style="color:inherit;" class="button-link itemAction" is="emby-linkbutton" href="#" data-action="link" data-id="${item.AlbumId}" data-serverid="${item.ServerId}" data-type="MusicAlbum" data-isfolder="true">${escapeHtml(item.Album)}</a>`);
} else if (item.Album) { } else if (item.Album) {
parentNameHtml.push(item.Album); parentNameHtml.push(escapeHtml(item.Album));
} }
// FIXME: This whole section needs some refactoring, so it becames easier to scale across all form factors. See GH #1022 // FIXME: This whole section needs some refactoring, so it becames easier to scale across all form factors. See GH #1022
@ -473,9 +474,9 @@ function renderName(item, container, context) {
} }
} }
const name = itemHelper.getDisplayName(item, { const name = escapeHtml(itemHelper.getDisplayName(item, {
includeParentInfo: false includeParentInfo: false
}); }));
if (html && !parentNameLast) { if (html && !parentNameLast) {
if (tvSeasonHtml) { if (tvSeasonHtml) {
@ -490,7 +491,7 @@ function renderName(item, container, context) {
} }
if (item.OriginalTitle && item.OriginalTitle != item.Name) { if (item.OriginalTitle && item.OriginalTitle != item.Name) {
html += '<h4 class="itemName infoText originalTitle">' + item.OriginalTitle + '</h4>'; html += '<h4 class="itemName infoText originalTitle">' + escapeHtml(item.OriginalTitle) + '</h4>';
} }
container.innerHTML = html; container.innerHTML = html;
@ -667,7 +668,7 @@ function reloadFromItem(instance, page, params, item, user) {
location = `<a is="emby-linkbutton" class="button-link textlink" target="_blank" href="https://www.openstreetmap.org/search?query=${encodeURIComponent(location)}">${location}</a>`; location = `<a is="emby-linkbutton" class="button-link textlink" target="_blank" href="https://www.openstreetmap.org/search?query=${encodeURIComponent(location)}">${location}</a>`;
} }
itemBirthLocation.classList.remove('hide'); itemBirthLocation.classList.remove('hide');
itemBirthLocation.innerHTML = globalize.translate('BirthPlaceValue', location); itemBirthLocation.innerText = globalize.translate('BirthPlaceValue', location);
} else { } else {
itemBirthLocation.classList.add('hide'); itemBirthLocation.classList.add('hide');
} }
@ -947,7 +948,7 @@ function renderGenres(page, item, context = inferContext(item)) {
Id: p.Id Id: p.Id
}, { }, {
context: context context: context
}) + '">' + p.Name + '</a>'; }) + '">' + escapeHtml(p.Name) + '</a>';
}).join(', '); }).join(', ');
const genresLabel = page.querySelector('.genresLabel'); const genresLabel = page.querySelector('.genresLabel');
@ -976,7 +977,7 @@ function renderWriter(page, item, context) {
Id: person.Id Id: person.Id
}, { }, {
context: context context: context
}) + '">' + person.Name + '</a>'; }) + '">' + escapeHtml(person.Name) + '</a>';
}).join(', '); }).join(', ');
const writersLabel = page.querySelector('.writersLabel'); const writersLabel = page.querySelector('.writersLabel');
@ -1005,7 +1006,7 @@ function renderDirector(page, item, context) {
Id: person.Id Id: person.Id
}, { }, {
context: context context: context
}) + '">' + person.Name + '</a>'; }) + '">' + escapeHtml(person.Name) + '</a>';
}).join(', '); }).join(', ');
const directorsLabel = page.querySelector('.directorsLabel'); const directorsLabel = page.querySelector('.directorsLabel');
@ -1058,7 +1059,7 @@ function renderTagline(page, item) {
if (item.Taglines && item.Taglines.length) { if (item.Taglines && item.Taglines.length) {
taglineElement.classList.remove('hide'); taglineElement.classList.remove('hide');
taglineElement.innerHTML = item.Taglines[0]; taglineElement.innerText = item.Taglines[0];
} else { } else {
taglineElement.classList.add('hide'); taglineElement.classList.add('hide');
} }
@ -1125,7 +1126,7 @@ function renderMoreFromSeason(view, item, apiClient) {
} }
section.classList.remove('hide'); section.classList.remove('hide');
section.querySelector('h2').innerHTML = globalize.translate('MoreFromValue', item.SeasonName); section.querySelector('h2').innerText = globalize.translate('MoreFromValue', item.SeasonName);
const itemsContainer = section.querySelector('.itemsContainer'); const itemsContainer = section.querySelector('.itemsContainer');
cardBuilder.buildCards(result.Items, { cardBuilder.buildCards(result.Items, {
parentContainer: section, parentContainer: section,
@ -1184,9 +1185,9 @@ function renderMoreFromArtist(view, item, apiClient) {
section.classList.remove('hide'); section.classList.remove('hide');
if (item.Type === 'MusicArtist') { if (item.Type === 'MusicArtist') {
section.querySelector('h2').innerHTML = globalize.translate('HeaderAppearsOn'); section.querySelector('h2').innerText = globalize.translate('HeaderAppearsOn');
} else { } else {
section.querySelector('h2').innerHTML = globalize.translate('MoreFromValue', item.AlbumArtists[0].Name); section.querySelector('h2').innerText = globalize.translate('MoreFromValue', item.AlbumArtists[0].Name);
} }
cardBuilder.buildCards(result.Items, { cardBuilder.buildCards(result.Items, {
@ -1276,7 +1277,7 @@ function renderSeriesAirTime(page, item, isStatic) {
} }
if (item.Studios.length) { if (item.Studios.length) {
if (isStatic) { if (isStatic) {
html += ' on ' + item.Studios[0].Name; html += ' on ' + escapeHtml(item.Studios[0].Name);
} else { } else {
const context = inferContext(item); const context = inferContext(item);
const href = appRouter.getRouteUrl(item.Studios[0], { const href = appRouter.getRouteUrl(item.Studios[0], {
@ -1284,7 +1285,7 @@ function renderSeriesAirTime(page, item, isStatic) {
itemType: 'Studio', itemType: 'Studio',
serverId: item.ServerId serverId: item.ServerId
}); });
html += ' on <a class="textlink button-link" is="emby-linkbutton" href="' + href + '">' + item.Studios[0].Name + '</a>'; html += ' on <a class="textlink button-link" is="emby-linkbutton" href="' + href + '">' + escapeHtml(item.Studios[0].Name) + '</a>';
} }
} }
if (html) { if (html) {
@ -1310,7 +1311,7 @@ function renderTags(page, item) {
} }
if (tagElements.length) { if (tagElements.length) {
itemTags.innerHTML = globalize.translate('TagsValue', tagElements.join(', ')); itemTags.innerText = globalize.translate('TagsValue', tagElements.join(', '));
itemTags.classList.remove('hide'); itemTags.classList.remove('hide');
} else { } else {
itemTags.innerHTML = ''; itemTags.innerHTML = '';

3
src/controllers/movies/moviegenres.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import layoutManager from '../../components/layoutManager'; import layoutManager from '../../components/layoutManager';
import loading from '../../components/loading/loading'; import loading from '../../components/loading/loading';
import libraryBrowser from '../../scripts/libraryBrowser'; import libraryBrowser from '../../scripts/libraryBrowser';
@ -150,7 +151,7 @@ import '../../elements/emby-button/emby-button';
parentId: params.topParentId parentId: params.topParentId
}) + '" class="more button-flat button-flat-mini sectionTitleTextButton btnMoreFromGenre' + item.Id + '">'; }) + '" class="more button-flat button-flat-mini sectionTitleTextButton btnMoreFromGenre' + item.Id + '">';
html += '<h2 class="sectionTitle sectionTitle-cards">'; html += '<h2 class="sectionTitle sectionTitle-cards">';
html += item.Name; html += escapeHtml(item.Name);
html += '</h2>'; html += '</h2>';
html += '<span class="material-icons hide chevron_right" aria-hidden="true"></span>'; html += '<span class="material-icons hide chevron_right" aria-hidden="true"></span>';
html += '</a>'; html += '</a>';

4
src/controllers/movies/moviesrecommended.js
View file

@ -1,4 +1,4 @@
import escapeHtml from 'escape-html';
import { Events } from 'jellyfin-apiclient'; import { Events } from 'jellyfin-apiclient';
import layoutManager from '../../components/layoutManager'; import layoutManager from '../../components/layoutManager';
import inputManager from '../../scripts/inputManager'; import inputManager from '../../scripts/inputManager';
@ -127,7 +127,7 @@ import Dashboard from '../../scripts/clientUtils';
} }
html += '<div class="verticalSection">'; html += '<div class="verticalSection">';
html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + title + '</h2>'; html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + escapeHtml(title) + '</h2>';
const allowBottomPadding = true; const allowBottomPadding = true;
if (enableScrollX()) { if (enableScrollX()) {

3
src/controllers/playback/video/index.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import { playbackManager } from '../../../components/playback/playbackmanager'; import { playbackManager } from '../../../components/playback/playbackmanager';
import SyncPlay from '../../../components/syncPlay/core'; import SyncPlay from '../../../components/syncPlay/core';
import browser from '../../../scripts/browser'; import browser from '../../../scripts/browser';
@ -1236,7 +1237,7 @@ import { appRouter } from '../../../components/appRouter';
html += '<img class="chapterThumb" src="' + src + '" />'; html += '<img class="chapterThumb" src="' + src + '" />';
html += '<div class="chapterThumbTextContainer">'; html += '<div class="chapterThumbTextContainer">';
html += '<div class="chapterThumbText chapterThumbText-dim">'; html += '<div class="chapterThumbText chapterThumbText-dim">';
html += chapter.Name; html += escapeHtml(chapter.Name);
html += '</div>'; html += '</div>';
html += '<h2 class="chapterThumbText">'; html += '<h2 class="chapterThumbText">';
html += datetime.getDisplayRunningTime(positionTicks); html += datetime.getDisplayRunningTime(positionTicks);

3
src/controllers/session/selectServer/index.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import loading from '../../../components/loading/loading'; import loading from '../../../components/loading/loading';
import { appRouter } from '../../../components/appRouter'; import { appRouter } from '../../../components/appRouter';
import layoutManager from '../../../components/layoutManager'; import layoutManager from '../../../components/layoutManager';
@ -71,7 +72,7 @@ import cardBuilder from '../../../components/cardbuilder/cardBuilder';
cardContainer += '</div>'; cardContainer += '</div>';
cardContainer += '</div>'; cardContainer += '</div>';
cardContainer += '<div class="cardFooter">'; cardContainer += '<div class="cardFooter">';
cardContainer += '<div class="cardText cardTextCentered">' + item.name + '</div>'; cardContainer += '<div class="cardText cardTextCentered">' + escapeHtml(item.name) + '</div>';
cardContainer += '</div></div></button>'; cardContainer += '</div></div></button>';
return cardContainer; return cardContainer;
}).join(''); }).join('');

3
src/controllers/shows/tvgenres.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import layoutManager from '../../components/layoutManager'; import layoutManager from '../../components/layoutManager';
import loading from '../../components/loading/loading'; import loading from '../../components/loading/loading';
import libraryBrowser from '../../scripts/libraryBrowser'; import libraryBrowser from '../../scripts/libraryBrowser';
@ -148,7 +149,7 @@ import '../../elements/emby-button/emby-button';
parentId: params.topParentId parentId: params.topParentId
}) + '" class="more button-flat button-flat-mini sectionTitleTextButton btnMoreFromGenre' + item.Id + '">'; }) + '" class="more button-flat button-flat-mini sectionTitleTextButton btnMoreFromGenre' + item.Id + '">';
html += '<h2 class="sectionTitle sectionTitle-cards">'; html += '<h2 class="sectionTitle sectionTitle-cards">';
html += item.Name; html += escapeHtml(item.Name);
html += '</h2>'; html += '</h2>';
html += '<span class="material-icons hide chevron_right" aria-hidden="true"></span>'; html += '<span class="material-icons hide chevron_right" aria-hidden="true"></span>';
html += '</a>'; html += '</a>';

2
src/controllers/user/menu/index.js
View file

@ -55,7 +55,7 @@ export default function (view, params) {
console.debug('Failed to get QuickConnect status'); console.debug('Failed to get QuickConnect status');
}); });
ApiClient.getUser(userId).then(function (user) { ApiClient.getUser(userId).then(function (user) {
page.querySelector('.headerUsername').innerHTML = user.Name; page.querySelector('.headerUsername').innerText = user.Name;
if (user.Policy.IsAdministrator && !layoutManager.tv) { if (user.Policy.IsAdministrator && !layoutManager.tv) {
page.querySelector('.adminSection').classList.remove('hide'); page.querySelector('.adminSection').classList.remove('hide');
} }

2
src/controllers/user/profile/index.js
View file

@ -12,7 +12,7 @@ function reloadUser(page) {
const userId = getParameterByName('userId'); const userId = getParameterByName('userId');
loading.show(); loading.show();
ApiClient.getUser(userId).then(function (user) { ApiClient.getUser(userId).then(function (user) {
page.querySelector('.username').innerHTML = user.Name; page.querySelector('.username').innerText = user.Name;
libraryMenu.setTitle(user.Name); libraryMenu.setTitle(user.Name);
let imageUrl = 'assets/img/avatar.png'; let imageUrl = 'assets/img/avatar.png';

4
src/elements/emby-input/emby-input.js
View file

@ -45,7 +45,7 @@ import 'webcomponents.js/webcomponents-lite';
const parentNode = this.parentNode; const parentNode = this.parentNode;
const document = this.ownerDocument; const document = this.ownerDocument;
const label = document.createElement('label'); const label = document.createElement('label');
label.innerHTML = this.getAttribute('label') || ''; label.innerText = this.getAttribute('label') || '';
label.classList.add('inputLabel'); label.classList.add('inputLabel');
label.classList.add('inputLabelUnfocused'); label.classList.add('inputLabelUnfocused');
@ -114,7 +114,7 @@ import 'webcomponents.js/webcomponents-lite';
}; };
EmbyInputPrototype.label = function (text) { EmbyInputPrototype.label = function (text) {
this.labelElement.innerHTML = text; this.labelElement.innerText = text;
}; };
document.registerElement('emby-input', { document.registerElement('emby-input', {

2
src/elements/emby-playstatebutton/emby-playstatebutton.js
View file

@ -79,7 +79,7 @@ import ServerConnections from '../../components/ServerConnections';
const text = button.querySelector('.button-text'); const text = button.querySelector('.button-text');
if (text) { if (text) {
text.innerHTML = button.title; text.innerText = button.title;
} }
} }

2
src/elements/emby-ratingbutton/emby-ratingbutton.js
View file

@ -97,7 +97,7 @@ import ServerConnections from '../../components/ServerConnections';
const text = button.querySelector('.button-text'); const text = button.querySelector('.button-text');
if (text) { if (text) {
text.innerHTML = button.title; text.innerText = button.title;
} }
} }

4
src/elements/emby-select/emby-select.js
View file

@ -135,7 +135,7 @@ import 'webcomponents.js/webcomponents-lite';
this.classList.add('emby-select'); this.classList.add('emby-select');
const label = this.ownerDocument.createElement('label'); const label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || ''; label.innerText = this.getAttribute('label') || '';
label.classList.add('selectLabel'); label.classList.add('selectLabel');
label.htmlFor = this.id; label.htmlFor = this.id;
this.parentNode?.insertBefore(label, this); this.parentNode?.insertBefore(label, this);
@ -148,7 +148,7 @@ import 'webcomponents.js/webcomponents-lite';
EmbySelectPrototype.setLabel = function (text) { EmbySelectPrototype.setLabel = function (text) {
const label = this.parentNode?.querySelector('label'); const label = this.parentNode?.querySelector('label');
label.innerHTML = text; label.innerText = text;
}; };
document.registerElement('emby-select', { document.registerElement('emby-select', {

2
src/elements/emby-slider/emby-slider.js
View file

@ -154,7 +154,7 @@ import '../emby-input/emby-input';
if (topContainer && this.getAttribute('label')) { if (topContainer && this.getAttribute('label')) {
const label = this.ownerDocument.createElement('label'); const label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label'); label.innerText = this.getAttribute('label');
label.classList.add('sliderLabel'); label.classList.add('sliderLabel');
label.htmlFor = this.id; label.htmlFor = this.id;
topContainer.insertBefore(label, topContainer.firstChild); topContainer.insertBefore(label, topContainer.firstChild);

4
src/elements/emby-textarea/emby-textarea.js
View file

@ -107,7 +107,7 @@ import '../emby-input/emby-input';
const parentNode = this.parentNode; const parentNode = this.parentNode;
const label = this.ownerDocument.createElement('label'); const label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || ''; label.innerText = this.getAttribute('label') || '';
label.classList.add('textareaLabel'); label.classList.add('textareaLabel');
label.htmlFor = this.id; label.htmlFor = this.id;
@ -123,7 +123,7 @@ import '../emby-input/emby-input';
}); });
this.label = function (text) { this.label = function (text) {
label.innerHTML = text; label.innerText = text;
}; };
new autoGrow(this); new autoGrow(this);

3
src/scripts/editorsidebar.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import 'jquery'; import 'jquery';
import globalize from './globalize'; import globalize from './globalize';
import 'material-design-icons-iconfont'; import 'material-design-icons-iconfont';
@ -62,7 +63,7 @@ import Dashboard from './clientUtils';
if (item.LockData) { if (item.LockData) {
htmlName += '<span class="material-icons metadataSidebarIcon lock" aria-hidden="true"></span>'; htmlName += '<span class="material-icons metadataSidebarIcon lock" aria-hidden="true"></span>';
} }
htmlName += name; htmlName += escapeHtml(name);
htmlName += '</div>'; htmlName += '</div>';
return htmlName; return htmlName;
} }

11
src/scripts/libraryMenu.js
View file

@ -1,3 +1,4 @@
import escapeHtml from 'escape-html';
import dom from './dom'; import dom from './dom';
import layoutManager from '../components/layoutManager'; import layoutManager from '../components/layoutManager';
import inputManager from './inputManager'; import inputManager from './inputManager';
@ -558,7 +559,7 @@ import Headroom from 'headroom.js';
} }
menuHtml += '<span class="navMenuOptionText">'; menuHtml += '<span class="navMenuOptionText">';
menuHtml += item.name; menuHtml += escapeHtml(item.name);
menuHtml += '</span>'; menuHtml += '</span>';
return menuHtml + '</a>'; return menuHtml + '</a>';
} }
@ -576,7 +577,7 @@ import Headroom from 'headroom.js';
menuHtml += getToolsLinkHtml(item); menuHtml += getToolsLinkHtml(item);
} else if (item.name) { } else if (item.name) {
menuHtml += '<h3 class="sidebarHeader">'; menuHtml += '<h3 class="sidebarHeader">';
menuHtml += item.name; menuHtml += escapeHtml(item.name);
menuHtml += '</h3>'; menuHtml += '</h3>';
} }
} }
@ -700,7 +701,7 @@ import Headroom from 'headroom.js';
return `<a is="emby-linkbutton" data-itemid="${itemId}" class="lnkMediaFolder navMenuOption" href="${getItemHref(i, i.CollectionType)}"> return `<a is="emby-linkbutton" data-itemid="${itemId}" class="lnkMediaFolder navMenuOption" href="${getItemHref(i, i.CollectionType)}">
<span class="material-icons navMenuOptionIcon ${icon}" aria-hidden="true"></span> <span class="material-icons navMenuOptionIcon ${icon}" aria-hidden="true"></span>
<span class="sectionName navMenuOptionText">${i.Name}</span> <span class="sectionName navMenuOptionText">${escapeHtml(i.Name)}</span>
</a>`; </a>`;
}).join(''); }).join('');
libraryMenuOptions.innerHTML = html; libraryMenuOptions.innerHTML = html;
@ -751,7 +752,7 @@ import Headroom from 'headroom.js';
if (info && !info.isLocalPlayer) { if (info && !info.isLocalPlayer) {
icon.classList.add('cast_connected'); icon.classList.add('cast_connected');
headerCastButton.classList.add('castButton-active'); headerCastButton.classList.add('castButton-active');
context.querySelector('.headerSelectedPlayer').innerHTML = info.deviceName || info.name; context.querySelector('.headerSelectedPlayer').innerText = info.deviceName || info.name;
} else { } else {
icon.classList.add('cast'); icon.classList.add('cast');
headerCastButton.classList.remove('castButton-active'); headerCastButton.classList.remove('castButton-active');
@ -973,7 +974,7 @@ import Headroom from 'headroom.js';
pageTitleElement.classList.remove('pageTitleWithLogo'); pageTitleElement.classList.remove('pageTitleWithLogo');
pageTitleElement.classList.remove('pageTitleWithDefaultLogo'); pageTitleElement.classList.remove('pageTitleWithDefaultLogo');
pageTitleElement.style.backgroundImage = null; pageTitleElement.style.backgroundImage = null;
pageTitleElement.innerHTML = html || ''; pageTitleElement.innerText = html || '';
} }
document.title = title || 'Jellyfin'; document.title = title || 'Jellyfin';