diff --git a/src/css/augmentedsteam.css b/src/css/augmentedsteam.css
index 262a4278c..6d3557ef4 100644
--- a/src/css/augmentedsteam.css
+++ b/src/css/augmentedsteam.css
@@ -1616,17 +1616,6 @@ label.es_dlc_label > input:checked::after {
background-size: auto;
}
-/***************************************
- * addCustomTags() to community guides
- *
- **************************************/
-.es_tag {
- text-transform: capitalize;
-}
-.es_tag::placeholder {
- text-transform: none;
-}
-
/* || SEARCH PAGE FILTERS */
diff --git a/src/js/Content/Features/Community/EditGuide/CEditGuide.ts b/src/js/Content/Features/Community/EditGuide/CEditGuide.ts
index 8a126ecf7..6e190e509 100644
--- a/src/js/Content/Features/Community/EditGuide/CEditGuide.ts
+++ b/src/js/Content/Features/Community/EditGuide/CEditGuide.ts
@@ -1,4 +1,3 @@
-import FMultiLanguageGuide from "./FMultiLanguageGuide";
import FCustomTags from "./FCustomTags";
import Context from "@Content/Modules/Context/Context";
import ContextType from "@Content/Modules/Context/ContextType";
@@ -8,10 +7,9 @@ export default class CEditGuide extends Context {
constructor() {
// Don't apply features if there's an error message (e.g. not your guide thus can't edit)
- const hasFeatures = !document.getElementById("message");
+ const hasFeatures = document.getElementById("message") === null;
super(ContextType.EDIT_GUIDE, hasFeatures ? [
- FMultiLanguageGuide,
FCustomTags,
] : []);
}
diff --git a/src/js/Content/Features/Community/EditGuide/Components/AddTagForm.svelte b/src/js/Content/Features/Community/EditGuide/Components/AddTagForm.svelte
new file mode 100644
index 000000000..822179738
--- /dev/null
+++ b/src/js/Content/Features/Community/EditGuide/Components/AddTagForm.svelte
@@ -0,0 +1,21 @@
+
+
+
+
+
+
+
+
+
diff --git a/src/js/Content/Features/Community/EditGuide/FCustomTags.svelte b/src/js/Content/Features/Community/EditGuide/FCustomTags.svelte
new file mode 100644
index 000000000..f2ab18d6b
--- /dev/null
+++ b/src/js/Content/Features/Community/EditGuide/FCustomTags.svelte
@@ -0,0 +1,118 @@
+
+
+
+
+
+
+
{L(__customTags)}
+ {#each customTags as tag}
+
+
+ {tag}
+
+ {/each}
+
+
+ {L(__addTag)}
+
+
+
+
+
diff --git a/src/js/Content/Features/Community/EditGuide/FCustomTags.ts b/src/js/Content/Features/Community/EditGuide/FCustomTags.ts
index 9766456df..ac6c25b81 100644
--- a/src/js/Content/Features/Community/EditGuide/FCustomTags.ts
+++ b/src/js/Content/Features/Community/EditGuide/FCustomTags.ts
@@ -1,81 +1,23 @@
-import {__addTag, __customTags, __enterTag} from "@Strings/_strings";
-import {L} from "@Core/Localization/Localization";
+import self_ from "./FCustomTags.svelte";
import Feature from "@Content/Modules/Context/Feature";
import type CEditGuide from "@Content/Features/Community/EditGuide/CEditGuide";
-import DOMHelper from "@Content/Modules/DOMHelper";
-import HTML from "@Core/Html/Html";
-import LocalStorage from "@Core/Storage/LocalStorage";
export default class FCustomTags extends Feature {
override apply(): void {
- this._addTags();
- this._rememberTags();
- }
-
- _addTags(): void {
- const langSection = document.querySelector("#checkboxgroup_1");
- if (!langSection) { return; }
-
- // @ts-ignore
- document.addEventListener("as_addTag", (e: CustomEvent) => {
- this._addTag(e.detail, true);
- });
-
- HTML.afterEnd(langSection,
- ``);
-
- DOMHelper.insertScript("scriptlets/Community/EditGuide/customTags.js", {
- customTags: L(__customTags),
- enterTag: L(__enterTag)
- });
- }
-
- async _rememberTags(): Promise {
-
- const submitBtn = document.querySelector("[href*=SubmitGuide]");
- if (!submitBtn) { return; }
-
- const params = new URLSearchParams(window.location.search);
- const curId = params.get("id") ?? "recent";
- const savedTags: Record = (await LocalStorage.get("es_guide_tags")) ?? {};
- if (!savedTags[curId]) {
- savedTags[curId] = savedTags.recent ?? [];
+ const anchor = document.querySelector("#checkboxgroup_1");
+ if (!anchor) {
+ throw new Error("Node not found");
}
- for (const [id, tags] of Object.entries(savedTags)) {
- for (const tag of tags) {
- const node = document.querySelector(`[name="tags[]"][value="${tag.replace(/"/g, '\\"')}"]`);
- if (node && curId === id) {
- node.checked = true;
- } else if (!node) {
- this._addTag(tag, curId === id);
- }
- }
+ // Make language options multi-selectable
+ for (const tag of anchor.querySelectorAll("[name='tags[]']")) {
+ tag.type = "checkbox";
}
- submitBtn.removeAttribute("href");
- submitBtn.addEventListener("click", () => {
- savedTags.recent = [];
- savedTags[curId] = Array.from(
- document.querySelectorAll("[name='tags[]']:checked")
- ).map(node => node.value);
-
- LocalStorage.set("es_guide_tags", savedTags);
-
- DOMHelper.insertScript("scriptlets/Community/EditGuide/submitGuide.js");
+ new self_({
+ target: anchor.parentElement!,
+ anchor: anchor.nextElementSibling ?? undefined,
});
}
-
- _addTag(name: string, checked: boolean = true): void {
- const _name = HTML.escape(name);
- const attr = checked ? " checked" : "";
- const tag = `${_name}
`;
- HTML.beforeBegin("#es_add_tag", tag);
- }
}
diff --git a/src/js/Content/Features/Community/EditGuide/FMultiLanguageGuide.ts b/src/js/Content/Features/Community/EditGuide/FMultiLanguageGuide.ts
deleted file mode 100644
index bfb79d4c6..000000000
--- a/src/js/Content/Features/Community/EditGuide/FMultiLanguageGuide.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import Feature from "@Content/Modules/Context/Feature";
-import type CEditGuide from "@Content/Features/Community/EditGuide/CEditGuide";
-
-export default class FMultiLanguageGuide extends Feature {
-
- apply() {
- for (const tag of document.querySelectorAll("[name='tags[]']")) {
- tag.type = "checkbox";
- }
- }
-}
diff --git a/src/js/Content/Modules/Facades/SteamFacade.ts b/src/js/Content/Modules/Facades/SteamFacade.ts
index 4f0dd4586..2ba403301 100644
--- a/src/js/Content/Modules/Facades/SteamFacade.ts
+++ b/src/js/Content/Modules/Facades/SteamFacade.ts
@@ -127,4 +127,10 @@ export default class SteamFacade {
static openFriendChatInWebChat(steamid: string, accountid: number): void {
Messenger.call(MessageHandler.SteamFacade, "openFriendChatInWebChat", [steamid, accountid]);
}
+
+ // edit guide
+
+ static submitGuide(): void {
+ Messenger.call(MessageHandler.SteamFacade, "submitGuide");
+ }
}
diff --git a/src/js/Core/Storage/LocalStorage.ts b/src/js/Core/Storage/LocalStorage.ts
index 6e6c2a74f..aa1169441 100644
--- a/src/js/Core/Storage/LocalStorage.ts
+++ b/src/js/Core/Storage/LocalStorage.ts
@@ -25,7 +25,8 @@ export interface LocalStorageSchema extends StorageSchema {
show_review_section: boolean,
hide_login_warn_store: boolean,
hide_login_warn_community: boolean,
- es_guide_tags: Record,
+ es_guide_tags: Record, // TODO deprecated
+ guide_tags: string[],
market_stats: {
startListing: string|null,
purchaseTotal: number,
diff --git a/src/scriptlets/Community/EditGuide/customTags.js b/src/scriptlets/Community/EditGuide/customTags.js
deleted file mode 100644
index 35acde6ff..000000000
--- a/src/scriptlets/Community/EditGuide/customTags.js
+++ /dev/null
@@ -1,34 +0,0 @@
-(function() {
- const params = JSON.parse(document.currentScript.dataset.params);
- const {customTags, enterTag} = params;
-
- $J("#es_add_tag").on("click", () => {
- const modal = window.ShowConfirmDialog(customTags,
- ``
- );
-
- const elem = $J(".es_tag");
- let tag = elem.val();
-
- function done() {
- if (tag.trim().length === 0) {
- return;
- }
- tag = tag[0].toUpperCase() + tag.slice(1);
-
- document.dispatchEvent(new CustomEvent("as_addTag", {detail: tag}));
- }
-
- elem.on("keydown paste input", e => {
- tag = elem.val();
- if (e.key === "Enter") {
- modal.Dismiss();
- done();
- }
- });
-
- modal.done(done);
- });
-})();
diff --git a/src/scriptlets/Community/EditGuide/submitGuide.js b/src/scriptlets/Community/EditGuide/submitGuide.js
deleted file mode 100644
index 9690dc42a..000000000
--- a/src/scriptlets/Community/EditGuide/submitGuide.js
+++ /dev/null
@@ -1,3 +0,0 @@
-(function() {
- SubmitGuide();
-})();
diff --git a/src/scriptlets/SteamScriptlet.js b/src/scriptlets/SteamScriptlet.js
index c40ebf3b1..4d87199d8 100644
--- a/src/scriptlets/SteamScriptlet.js
+++ b/src/scriptlets/SteamScriptlet.js
@@ -107,6 +107,12 @@
static openFriendChatInWebChat(steamid, accountid) {
OpenFriendChatInWebChat(steamid, accountid);
}
+
+ // edit guide
+
+ static submitGuide() {
+ SubmitGuide();
+ }
}
document.addEventListener("as_SteamFacade", async function(e) {