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:
parent
65649eaef0
commit
386a9d26ec
|
@ -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) {
|
||||||
|
|
|
@ -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;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
|
||||||
|
|
|
@ -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) {
|
||||||
|
|
|
@ -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");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue