REFACTOR: Remove `Discourse.SvgIconList` and `Discourse.SvgSpritePath`

We use the session instead. This patch also removes some jQuery usage in
favor of regular HTML apis
This commit is contained in:
Robin Ward 2020-08-17 15:28:22 -04:00
parent 65649eaef0
commit 386a9d26ec
4 changed files with 37 additions and 34 deletions

View File

@ -1,7 +1,7 @@
import I18n from "I18n"; import I18n from "I18n";
import { h } from "virtual-dom"; import { h } from "virtual-dom";
import attributeHook from "discourse-common/lib/attribute-hook"; import attributeHook from "discourse-common/lib/attribute-hook";
import { isDevelopment } from "discourse-common/config/environment"; import Session from "discourse/models/session";
const SVG_NAMESPACE = "http://www.w3.org/2000/svg"; const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
let _renderers = []; let _renderers = [];
@ -111,15 +111,12 @@ function iconClasses(icon, params) {
} }
function warnIfMissing(id) { function warnIfMissing(id) {
if ( if (warnMissingIcons) {
typeof Discourse !== "undefined" && let iconList = Session.currentProp("svgIconList");
isDevelopment() && if (iconList.indexOf(id) === -1) {
warnMissingIcons &&
Discourse.SvgIconList &&
Discourse.SvgIconList.indexOf(id) === -1
) {
console.warn(`The icon "${id}" is missing from the SVG subset.`); // eslint-disable-line no-console console.warn(`The icon "${id}" is missing from the SVG subset.`); // eslint-disable-line no-console
} }
}
} }
function handleIconId(icon) { function handleIconId(icon) {

View File

@ -1,21 +1,25 @@
import loadScript from "discourse/lib/load-script"; import loadScript from "discourse/lib/load-script";
export default { const SVG_CONTAINER_ID = "svg-sprites";
name: "svg-sprite-loader",
load(spritePath, spriteName) {
const c = "svg-sprites";
const $cEl = `#${c}`;
const $spriteEl = `${$cEl} .${spriteName}`;
if ($($cEl).length === 0) $("body").append(`<div id="${c}">`); export function loadSprites(spritePath, spriteName) {
let spriteContainer = document.getElementById(SVG_CONTAINER_ID);
if (!spriteContainer) {
spriteContainer = document.createElement("div");
spriteContainer.id = SVG_CONTAINER_ID;
document.body.appendChild(spriteContainer);
}
if ($($spriteEl).length === 0) let sprites = spriteContainer.querySelector(`.${spriteName}`);
$($cEl).append(`<div class="${spriteName}">`); if (!sprites) {
sprites = document.createElement("div");
sprites.className = spriteName;
spriteContainer.appendChild(sprites);
}
loadScript(spritePath).then(() => { loadScript(spritePath).then(() => {
$($spriteEl).html(window.__svg_sprite); sprites.innerHTML = window.__svg_sprite;
// we got to clean up here... this is one giant string // we got to clean up here... this is one giant string
delete window.__svg_sprite; delete window.__svg_sprite;
}); });
} }
};

View File

@ -5,7 +5,8 @@ import RSVP from "rsvp";
import { import {
setEnvironment, setEnvironment,
isTesting, isTesting,
isProduction isProduction,
isDevelopment
} from "discourse-common/config/environment"; } from "discourse-common/config/environment";
import { setupURL, setupS3CDN } from "discourse-common/lib/get-url"; import { setupURL, setupS3CDN } from "discourse-common/lib/get-url";
import deprecated from "discourse-common/lib/deprecated"; import deprecated from "discourse-common/lib/deprecated";
@ -82,10 +83,10 @@ export default {
} }
app.HighlightJSPath = setupData.highlightJsPath; app.HighlightJSPath = setupData.highlightJsPath;
app.SvgSpritePath = setupData.svgSpritePath; Session.currentProp("svgSpritePath", setupData.svgSpritePath);
if (app.Environment === "development") { if (isDevelopment()) {
app.SvgIconList = setupData.svgIconList; Session.currentProp("svgIconList", setupData.svgIconList);
} }
if (setupData.s3BaseUrl) { if (setupData.s3BaseUrl) {

View File

@ -1,11 +1,12 @@
import svgSpriteLoader from "discourse/lib/svg-sprite-loader"; import { loadSprites } from "discourse/lib/svg-sprite-loader";
export default { export default {
name: "svg-sprite-fontawesome", name: "svg-sprite-fontawesome",
initialize() { initialize(container) {
if (Discourse && Discourse.SvgSpritePath) { let session = container.lookup("session:main");
svgSpriteLoader.load(Discourse.SvgSpritePath, "fontawesome"); if (session.svgSpritePath) {
loadSprites(session.svgSpritePath, "fontawesome");
} }
} }
}; };