From 14a41159e782580521e5e510d91663bc93c9d2dc Mon Sep 17 00:00:00 2001
From: James Tanner <jimmyt857@gmail.com>
Date: Thu, 28 Dec 2023 14:40:43 +0900
Subject: [PATCH] Support sim links for sharing specific categories of settings
 (gear, rotation, etc)

---
 ui/core/components/exporters.ts         | 139 ++++++++++++++--
 ui/core/components/importers.ts         |  66 +++++++-
 ui/core/individual_sim_ui.ts            | 204 ++++++++++++------------
 ui/core/player.ts                       | 147 +++++++++++------
 ui/core/sim.ts                          |  11 ++
 ui/raid/import_export.ts                |   2 +-
 ui/scss/core/components/_exporters.scss |   6 +
 7 files changed, 412 insertions(+), 163 deletions(-)

diff --git a/ui/core/components/exporters.ts b/ui/core/components/exporters.ts
index 31a0229ca6..dacf15d7dc 100644
--- a/ui/core/components/exporters.ts
+++ b/ui/core/components/exporters.ts
@@ -9,18 +9,30 @@ import { IndividualSimSettings } from '../proto/ui';
 import { classNames, raceNames } from '../proto_utils/names';
 import { UnitStat } from '../proto_utils/stats';
 import { specNames } from '../proto_utils/utils';
-import { downloadString, jsonStringifyWithFlattenedPaths } from '../utils';
+import { arrayEquals, downloadString, getEnumValues, jsonStringifyWithFlattenedPaths } from '../utils';
 import { BaseModal } from './base_modal';
-import { IndividualWowheadGearPlannerImporter } from './importers';
+import { IndividualLinkImporter, IndividualWowheadGearPlannerImporter } from './importers';
 import { RaidSimRequest } from '../proto/api';
+import { SimSettingCategories } from '../sim';
+import { EventID, TypedEvent } from '../typed_event';
+import { BooleanPicker } from './boolean_picker';
 
 import * as Mechanics from '../constants/mechanics';
 
+declare var pako: any;
+
+interface ExporterOptions {
+	title: string,
+	header?: boolean,
+	allowDownload?: boolean,
+}
+
 export abstract class Exporter extends BaseModal {
 	private readonly textElem: HTMLElement;
+	protected readonly changedEvent: TypedEvent<void> = new TypedEvent();
 
-	constructor(parent: HTMLElement, simUI: SimUI, title: string, allowDownload: boolean) {
-		super(parent, 'exporter', { title: title, footer: true });
+	constructor(parent: HTMLElement, simUI: SimUI, options: ExporterOptions) {
+		super(parent, 'exporter', { title: options.title, header: options.header, footer: true });
 
 		this.body.innerHTML = `
 			<textarea spellCheck="false" class="exporter-textarea form-control"></textarea>
@@ -30,7 +42,7 @@ export abstract class Exporter extends BaseModal {
 				<i class="fas fa-clipboard"></i>
 				Copy to Clipboard
 			</button>
-			${allowDownload ? `
+			${options.allowDownload ? `
 				<button class="exporter-button btn btn-primary download-button">
 					<i class="fa fa-download"></i>
 					Download
@@ -57,7 +69,7 @@ export abstract class Exporter extends BaseModal {
 			}
 		});
 
-		if (allowDownload) {
+		if (options.allowDownload) {
 			const downloadButton = this.rootElem.getElementsByClassName('download-button')[0] as HTMLElement;
 			downloadButton.addEventListener('click', event => {
 				const data = this.textElem.textContent!;
@@ -67,6 +79,11 @@ export abstract class Exporter extends BaseModal {
 	}
 
 	protected init() {
+		this.changedEvent.on(() => this.updateContent());
+		this.updateContent();
+	}
+
+	private updateContent() {
 		this.textElem.textContent = this.getData();
 	}
 
@@ -74,16 +91,112 @@ export abstract class Exporter extends BaseModal {
 }
 
 export class IndividualLinkExporter<SpecType extends Spec> extends Exporter {
+	private static readonly exportPickerConfigs: Array<{
+		category: SimSettingCategories,
+		label: string,
+		labelTooltip: string,
+	}> = [
+		{
+			category: SimSettingCategories.Gear,
+			label: 'Gear',
+			labelTooltip: 'Also includes bonus stats and weapon swaps.',
+		},
+		{
+			category: SimSettingCategories.Talents,
+			label: 'Talents',
+			labelTooltip: 'Talents and Glyphs.',
+		},
+		{
+			category: SimSettingCategories.Rotation,
+			label: 'Rotation',
+			labelTooltip: 'Includes everything found in the Rotation tab.',
+		},
+		{
+			category: SimSettingCategories.Consumes,
+			label: 'Consumes',
+			labelTooltip: 'Flask, pots, food, etc.',
+		},
+		{
+			category: SimSettingCategories.External,
+			label: 'Buffs & Debuffs',
+			labelTooltip: 'All settings which are applied by other raid members.',
+		},
+		{
+			category: SimSettingCategories.Miscellaneous,
+			label: 'Misc',
+			labelTooltip: 'Spec-specific settings, front/back of target, distance from target, etc.',
+		},
+		{
+			category: SimSettingCategories.Encounter,
+			label: 'Encounter',
+			labelTooltip: 'Fight-related settings.',
+		},
+		// Intentionally exclude UISettings category here, because users almost
+		// never intend to export them and it messes with other users' settings.
+		// If they REALLY want to export UISettings, just use the JSON exporter.
+	];
+
 	private readonly simUI: IndividualSimUI<SpecType>;
+	private readonly exportCategories: Record<SimSettingCategories, boolean>;
 
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
-		super(parent, simUI, 'Sharable Link', false);
+		super(parent, simUI, {title: 'Sharable Link', header: true});
 		this.simUI = simUI;
+
+		const exportCategories: Partial<Record<SimSettingCategories, boolean>> = {};
+		(getEnumValues(SimSettingCategories) as Array<SimSettingCategories>)
+			.forEach(cat => exportCategories[cat] = IndividualLinkImporter.DEFAULT_CATEGORIES.includes(cat));
+		this.exportCategories = exportCategories as Record<SimSettingCategories, boolean>;
+
+		const pickersContainer = document.createElement('div');
+		pickersContainer.classList.add('link-exporter-pickers')
+		this.body.prepend(pickersContainer);
+
+		IndividualLinkExporter.exportPickerConfigs.forEach(exportConfig => {
+			const category = exportConfig.category;
+			new BooleanPicker(pickersContainer, this, {
+				label: exportConfig.label,
+				labelTooltip: exportConfig.labelTooltip,
+				inline: true,
+				getValue: () => this.exportCategories[category],
+				setValue: (eventID: EventID, modObj: IndividualLinkExporter<SpecType>, newValue: boolean) => {
+					this.exportCategories[category] = newValue;
+					this.changedEvent.emit(eventID);
+				},
+				changedEvent: () => this.changedEvent,
+			});
+		});
+
 		this.init();
 	}
 
 	getData(): string {
-		return this.simUI.toLink();
+		return IndividualLinkExporter.createLink(
+			this.simUI,
+			(getEnumValues(SimSettingCategories) as Array<SimSettingCategories>)
+				.filter(c => this.exportCategories[c]));
+	}
+
+	static createLink(simUI: IndividualSimUI<any>, exportCategories?: Array<SimSettingCategories>): string {
+		if (!exportCategories) {
+			exportCategories = IndividualLinkImporter.DEFAULT_CATEGORIES;
+		}
+
+		const proto = simUI.toProto(exportCategories);
+
+		const protoBytes = IndividualSimSettings.toBinary(proto);
+		const deflated = pako.deflate(protoBytes, { to: 'string' });
+		const encoded = btoa(String.fromCharCode(...deflated));
+
+		const linkUrl = new URL(window.location.href);
+		linkUrl.hash = encoded;
+		if (arrayEquals(exportCategories, IndividualLinkImporter.DEFAULT_CATEGORIES)) {
+			linkUrl.searchParams.delete(IndividualLinkImporter.CATEGORY_PARAM);
+		} else {
+			const categoryCharString = exportCategories.map(c => IndividualLinkImporter.CATEGORY_KEYS.get(c)).join('');
+			linkUrl.searchParams.set(IndividualLinkImporter.CATEGORY_PARAM, categoryCharString);
+		}
+		return linkUrl.toString();
 	}
 }
 
@@ -91,7 +204,7 @@ export class IndividualJsonExporter<SpecType extends Spec> extends Exporter {
 	private readonly simUI: IndividualSimUI<SpecType>;
 
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
-		super(parent, simUI, 'JSON Export', true);
+		super(parent, simUI, {title: 'JSON Export', allowDownload: true});
 		this.simUI = simUI;
 		this.init();
 	}
@@ -119,7 +232,7 @@ export class IndividualWowheadGearPlannerExporter<SpecType extends Spec> extends
 	private readonly simUI: IndividualSimUI<SpecType>;
 
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
-		super(parent, simUI, 'Wowhead Export', true);
+		super(parent, simUI, {title: 'Wowhead Export', allowDownload: true});
 		this.simUI = simUI;
 		this.init();
 	}
@@ -228,7 +341,7 @@ export class Individual80UEPExporter<SpecType extends Spec> extends Exporter {
 	private readonly simUI: IndividualSimUI<SpecType>;
 
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
-		super(parent, simUI, '80Upgrades EP Export', true);
+		super(parent, simUI, {title: '80Upgrades EP Export', allowDownload: true});
 		this.simUI = simUI;
 		this.init();
 	}
@@ -320,7 +433,7 @@ export class IndividualPawnEPExporter<SpecType extends Spec> extends Exporter {
 	private readonly simUI: IndividualSimUI<SpecType>;
 
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
-		super(parent, simUI, 'Pawn EP Export', true);
+		super(parent, simUI, {title: 'Pawn EP Export', allowDownload: true});
 		this.simUI = simUI;
 		this.init();
 	}
@@ -413,7 +526,7 @@ export class IndividualCLIExporter<SpecType extends Spec> extends Exporter {
 	private readonly simUI: IndividualSimUI<SpecType>;
 
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
-		super(parent, simUI, "CLI Export", true);
+		super(parent, simUI, {title: 'CLI Export', allowDownload: true});
 		this.simUI = simUI;
 		this.init();
 	}
diff --git a/ui/core/components/importers.ts b/ui/core/components/importers.ts
index b0e8dd6166..94dd646670 100644
--- a/ui/core/components/importers.ts
+++ b/ui/core/components/importers.ts
@@ -17,8 +17,11 @@ import { classNames, nameToClass, nameToRace, nameToProfession } from '../proto_
 import { classGlyphsConfig, talentSpellIdsToTalentString } from '../talents/factory';
 import { GlyphConfig } from '../talents/glyphs_picker';
 import { BaseModal } from './base_modal';
-import { buf2hex } from '../utils';
+import { buf2hex, getEnumValues } from '../utils';
 import { JsonObject } from '@protobuf-ts/runtime';
+import { SimSettingCategories } from '../sim';
+
+declare var pako: any;
 
 export abstract class Importer extends BaseModal {
 	protected readonly textElem: HTMLTextAreaElement;
@@ -119,6 +122,67 @@ export abstract class Importer extends BaseModal {
 	}
 }
 
+interface UrlParseData {
+	settings: IndividualSimSettings,
+	categories: Array<SimSettingCategories>,
+}
+
+// For now this just holds static helpers to match the exporter, so it doesn't extend Importer.
+export class IndividualLinkImporter {
+
+	// Exclude UISettings by default, since most users don't intend to export those.
+	static readonly DEFAULT_CATEGORIES = getEnumValues(SimSettingCategories).filter(c => c != SimSettingCategories.UISettings) as Array<SimSettingCategories>;
+
+	static readonly CATEGORY_PARAM = 'i';
+	static readonly CATEGORY_KEYS: Map<SimSettingCategories, string> = (() => {
+		const map = new Map();
+		// Use single-letter abbreviations since these will be included in sim links.
+		map.set(SimSettingCategories.Gear, 'g');
+		map.set(SimSettingCategories.Talents, 't');
+		map.set(SimSettingCategories.Rotation, 'r');
+		map.set(SimSettingCategories.Consumes, 'c');
+		map.set(SimSettingCategories.Miscellaneous, 'm');
+		map.set(SimSettingCategories.External, 'x');
+		map.set(SimSettingCategories.Encounter, 'e');
+		map.set(SimSettingCategories.UISettings, 'u');
+		return map;
+	})();
+
+	static tryParseUrlLocation(location: Location): UrlParseData|null {
+		let hash = location.hash;
+		if (hash.length <= 1) {
+			return null;
+		}
+
+		// Remove leading '#'
+		hash = hash.substring(1);
+		const binary = atob(hash);
+		const bytes = new Uint8Array(binary.length);
+		for (let i = 0; i < bytes.length; i++) {
+			bytes[i] = binary.charCodeAt(i);
+		}
+
+		const settingsBytes = pako.inflate(bytes);
+		const settings = IndividualSimSettings.fromBinary(settingsBytes);
+
+		let exportCategories = IndividualLinkImporter.DEFAULT_CATEGORIES;
+		const urlParams = new URLSearchParams(window.location.search);
+		if (urlParams.has(IndividualLinkImporter.CATEGORY_PARAM)) {
+			const categoryChars = urlParams.get(IndividualLinkImporter.CATEGORY_PARAM)!.split('');
+			exportCategories = categoryChars
+				.map(char => [...IndividualLinkImporter.CATEGORY_KEYS.entries()]
+				.find(e => e[1] == char))
+				.filter(e => e)
+				.map(e => e![0]);
+		}
+
+		return {
+			settings: settings,
+			categories: exportCategories,
+		};
+	}
+}
+
 export class IndividualJsonImporter<SpecType extends Spec> extends Importer {
 	private readonly simUI: IndividualSimUI<SpecType>;
 	constructor(parent: HTMLElement, simUI: IndividualSimUI<SpecType>) {
diff --git a/ui/core/individual_sim_ui.ts b/ui/core/individual_sim_ui.ts
index 35cbc6793c..b1a26e633c 100644
--- a/ui/core/individual_sim_ui.ts
+++ b/ui/core/individual_sim_ui.ts
@@ -60,8 +60,7 @@ import * as IconInputs from './components/icon_inputs';
 import * as InputHelpers from './components/input_helpers';
 import * as Mechanics from './constants/mechanics';
 import * as Tooltips from './constants/tooltips';
-
-declare var pako: any;
+import { SimSettingCategories } from './sim';
 
 const SAVED_GEAR_STORAGE_KEY = '__savedGear__';
 const SAVED_ROTATION_STORAGE_KEY = '__savedRotation__';
@@ -308,43 +307,30 @@ export abstract class IndividualSimUI<SpecType extends Spec> extends SimUI {
 	private loadSettings() {
 		const initEventID = TypedEvent.nextEventID();
 		TypedEvent.freezeAllAndDo(() => {
-			let loadedSettings = false;
-
-			let hash = window.location.hash;
-			if (hash.length > 1) {
-				// Remove leading '#'
-				hash = hash.substring(1);
-				try {
-					const binary = atob(hash);
-					const bytes = new Uint8Array(binary.length);
-					for (let i = 0; i < bytes.length; i++) {
-						bytes[i] = binary.charCodeAt(i);
-					}
-
-					const settingsBytes = pako.inflate(bytes);
-					const settings = IndividualSimSettings.fromBinary(settingsBytes);
-					this.fromProto(initEventID, settings);
-					loadedSettings = true;
-				} catch (e) {
-					console.warn('Failed to parse settings from window hash: ' + e);
-				}
-			}
-			window.location.hash = '';
+			this.applyDefaults(initEventID);
 
 			const savedSettings = window.localStorage.getItem(this.getSettingsStorageKey());
-			if (!loadedSettings && savedSettings != null) {
+			if (savedSettings != null) {
 				try {
 					const settings = IndividualSimSettings.fromJsonString(savedSettings);
 					this.fromProto(initEventID, settings);
-					loadedSettings = true;
 				} catch (e) {
 					console.warn('Failed to parse saved settings: ' + e);
 				}
 			}
 
-			if (!loadedSettings) {
-				this.applyDefaults(initEventID);
+			// Loading from link needs to happen after loading saved settings, so that partial link imports
+			// (e.g. rotation only) include the previous settings for other categories.
+			try {
+				const urlParseResults = Importers.IndividualLinkImporter.tryParseUrlLocation(window.location);
+				if (urlParseResults) {
+					this.fromProto(initEventID, urlParseResults.settings, urlParseResults.categories);
+				}
+			} catch (e) {
+				console.warn('Failed to parse link settings: ' + e);
 			}
+			window.location.hash = '';
+
 			this.player.setName(initEventID, 'Player');
 
 			// This needs to go last so it doesn't re-store things as they are initialized.
@@ -489,95 +475,115 @@ export abstract class IndividualSimUI<SpecType extends Spec> extends SimUI {
 		return specToLocalStorageKey[this.player.spec] + keyPart;
 	}
 
-	toProto(): IndividualSimSettings {
-		return IndividualSimSettings.create({
-			settings: this.sim.toProto(),
-			player: this.player.toProto(true),
-			raidBuffs: this.sim.raid.getBuffs(),
-			debuffs: this.sim.raid.getDebuffs(),
-			tanks: this.sim.raid.getTanks(),
-			partyBuffs: this.player.getParty()?.getBuffs() || PartyBuffs.create(),
-			encounter: this.sim.encounter.toProto(),
-			epWeightsStats: this.player.getEpWeights().toProto(),
-			epRatios: this.player.getEpRatios(),
-			dpsRefStat: this.dpsRefStat,
-			healRefStat: this.healRefStat,
-			tankRefStat: this.tankRefStat,
-			targetDummies: this.sim.raid.getTargetDummies(),
+	toProto(exportCategories?: Array<SimSettingCategories>): IndividualSimSettings {
+		const exportCategory = (cat: SimSettingCategories) =>
+				!exportCategories
+				|| exportCategories.length == 0
+				|| exportCategories.includes(cat);
+		
+		const proto = IndividualSimSettings.create({
+			player: this.player.toProto(true, false, exportCategories),
 		});
+
+		if (exportCategory(SimSettingCategories.Miscellaneous)) {
+			IndividualSimSettings.mergePartial(proto, {
+				tanks: this.sim.raid.getTanks(),
+			});
+		}
+		if (exportCategory(SimSettingCategories.Encounter)) {
+			IndividualSimSettings.mergePartial(proto, {
+				encounter: this.sim.encounter.toProto(),
+			});
+		}
+		if (exportCategory(SimSettingCategories.External)) {
+			IndividualSimSettings.mergePartial(proto, {
+				partyBuffs: this.player.getParty()?.getBuffs() || PartyBuffs.create(),
+				raidBuffs: this.sim.raid.getBuffs(),
+				debuffs: this.sim.raid.getDebuffs(),
+				targetDummies: this.sim.raid.getTargetDummies(),
+			});
+		}
+		if (exportCategory(SimSettingCategories.UISettings)) {
+			IndividualSimSettings.mergePartial(proto, {
+				settings: this.sim.toProto(),
+				epWeightsStats: this.player.getEpWeights().toProto(),
+				epRatios: this.player.getEpRatios(),
+				dpsRefStat: this.dpsRefStat,
+				healRefStat: this.healRefStat,
+				tankRefStat: this.tankRefStat,
+			});
+		}
+
+		return proto;
 	}
 
 	toLink(): string {
-		const proto = this.toProto();
-		// When sharing links, people generally don't intend to share settings/ep weights.
-		proto.settings = undefined;
-		proto.epWeights = [];
-
-		const protoBytes = IndividualSimSettings.toBinary(proto);
-		const deflated = pako.deflate(protoBytes, { to: 'string' });
-		const encoded = btoa(String.fromCharCode(...deflated));
-
-		const linkUrl = new URL(window.location.href);
-		linkUrl.hash = encoded;
-		return linkUrl.toString();
+		return Exporters.IndividualLinkExporter.createLink(this);
 	}
 
-	fromProto(eventID: EventID, settings: IndividualSimSettings) {
+	fromProto(eventID: EventID, settings: IndividualSimSettings, includeCategories?: Array<SimSettingCategories>) {
+		const loadCategory = (cat: SimSettingCategories) =>
+				!includeCategories
+				|| includeCategories.length == 0
+				|| includeCategories.includes(cat);
+
+		const tankSpec = isTankSpec(this.player.spec);
+		const healingSpec = isHealingSpec(this.player.spec);
+
 		TypedEvent.freezeAllAndDo(() => {
 			if (!settings.player) {
 				return;
 			}
-			this.player.fromProto(eventID, settings.player);
-			if (settings.epWeights?.length > 0) {
-				this.player.setEpWeights(eventID, new Stats(settings.epWeights));
-			} else if (settings.epWeightsStats) {
-				this.player.setEpWeights(eventID, Stats.fromProto(settings.epWeightsStats));
-			} else {
-				this.player.setEpWeights(eventID, this.individualConfig.defaults.epWeights);
-			}
 
-			const tankSpec = isTankSpec(this.player.spec);
-			const healingSpec = isHealingSpec(this.player.spec);
-			const defaultRatios = this.player.getDefaultEpRatios(tankSpec, healingSpec);
-			if (settings.epRatios) {
-				const missingRatios = new Array<number>(defaultRatios.length - settings.epRatios.length).fill(0);
-				this.player.setEpRatios(eventID, settings.epRatios.concat(missingRatios));
-			} else {
-				this.player.setEpRatios(eventID, defaultRatios);
-			}
+			this.player.fromProto(eventID, settings.player, includeCategories);
 
-			if (settings.dpsRefStat) {
-				this.dpsRefStat = settings.dpsRefStat;
+			if (loadCategory(SimSettingCategories.Miscellaneous)) {
+				this.sim.raid.setTanks(eventID, settings.tanks || []);
 			}
-			if (settings.healRefStat) {
-				this.healRefStat = settings.healRefStat;
+			if (loadCategory(SimSettingCategories.External)) {
+				this.sim.raid.setBuffs(eventID, settings.raidBuffs || RaidBuffs.create());
+				this.sim.raid.setDebuffs(eventID, settings.debuffs || Debuffs.create());
+				const party = this.player.getParty();
+				if (party) {
+					party.setBuffs(eventID, settings.partyBuffs || PartyBuffs.create());
+				}
+				this.sim.raid.setTargetDummies(eventID, settings.targetDummies);
 			}
-			if (settings.tankRefStat) {
-				this.tankRefStat = settings.tankRefStat;
-			}
-
-			this.sim.raid.setBuffs(eventID, settings.raidBuffs || RaidBuffs.create());
-			this.sim.raid.setDebuffs(eventID, settings.debuffs || Debuffs.create());
-			this.sim.raid.setTanks(eventID, settings.tanks || []);
-			this.sim.raid.setTargetDummies(eventID, settings.targetDummies);
-			const party = this.player.getParty();
-			if (party) {
-				party.setBuffs(eventID, settings.partyBuffs || PartyBuffs.create());
+			if (loadCategory(SimSettingCategories.Encounter)) {
+				this.sim.encounter.fromProto(eventID, settings.encounter || EncounterProto.create());
 			}
+			if (loadCategory(SimSettingCategories.UISettings)) {
+				if (settings.epWeights?.length > 0) {
+					this.player.setEpWeights(eventID, new Stats(settings.epWeights));
+				} else if (settings.epWeightsStats) {
+					this.player.setEpWeights(eventID, Stats.fromProto(settings.epWeightsStats));
+				} else {
+					this.player.setEpWeights(eventID, this.individualConfig.defaults.epWeights);
+				}
 
-			this.sim.encounter.fromProto(eventID, settings.encounter || EncounterProto.create());
+				const defaultRatios = this.player.getDefaultEpRatios(tankSpec, healingSpec);
+				if (settings.epRatios) {
+					const missingRatios = new Array<number>(defaultRatios.length - settings.epRatios.length).fill(0);
+					this.player.setEpRatios(eventID, settings.epRatios.concat(missingRatios));
+				} else {
+					this.player.setEpRatios(eventID, defaultRatios);
+				}
 
-			if (settings.settings) {
-				this.sim.fromProto(eventID, settings.settings);
-			} else {
-				const tankSpec = isTankSpec(this.player.spec);
-				const healingSpec = isHealingSpec(this.player.spec);
-				this.sim.applyDefaults(eventID, tankSpec, healingSpec);
-			}
+				if (settings.dpsRefStat) {
+					this.dpsRefStat = settings.dpsRefStat;
+				}
+				if (settings.healRefStat) {
+					this.healRefStat = settings.healRefStat;
+				}
+				if (settings.tankRefStat) {
+					this.tankRefStat = settings.tankRefStat;
+				}
 
-			// Needed because of new proto field addition. Can remove on 2022/11/14 (2 months).
-			if (!isHealingSpec(this.player.spec)) {
-				this.sim.setShowDamageMetrics(eventID, true);
+				if (settings.settings) {
+					this.sim.fromProto(eventID, settings.settings);
+				} else {
+					this.sim.applyDefaults(eventID, tankSpec, healingSpec);
+				}
 			}
 		});
 	}
diff --git a/ui/core/player.ts b/ui/core/player.ts
index f6a9d26245..0c64a544c5 100644
--- a/ui/core/player.ts
+++ b/ui/core/player.ts
@@ -87,7 +87,7 @@ import { getLanguageCode } from './constants/lang.js';
 import { EventID, TypedEvent } from './typed_event.js';
 import { Party, MAX_PARTY_SIZE } from './party.js';
 import { Raid } from './raid.js';
-import { Sim } from './sim.js';
+import { Sim, SimSettingCategories } from './sim.js';
 import { stringComparator, sum } from './utils.js';
 import { ElementalShaman_Options, ElementalShaman_Options_ThunderstormRange, ElementalShaman_Rotation, ElementalShaman_Rotation_BloodlustUse, EnhancementShaman_Rotation, EnhancementShaman_Rotation_BloodlustUse, RestorationShaman_Rotation, RestorationShaman_Rotation_BloodlustUse } from './proto/shaman.js';
 import { Database } from './proto_utils/database.js';
@@ -1331,28 +1331,51 @@ export class Player<SpecType extends Spec> {
 		return Database.mergeSimDatabases(dbGear, dbItemSwapGear);
 	}
 
-	toProto(forExport?: boolean, forSimming?: boolean): PlayerProto {
+	toProto(forExport?: boolean, forSimming?: boolean, exportCategories?: Array<SimSettingCategories>): PlayerProto {
+		const exportCategory = (cat: SimSettingCategories) =>
+				!exportCategories
+				|| exportCategories.length == 0
+				|| exportCategories.includes(cat);
+
 		const aplIsLaunched = aplLaunchStatuses[this.spec] == LaunchStatus.Launched;
 		const gear = this.getGear();
 		const aplRotation = forSimming ? this.getResolvedAplRotation() : this.aplRotation;
-		return withSpecProto(
-			this.spec,
-			PlayerProto.create({
-				name: this.getName(),
-				race: this.getRace(),
-				class: this.getClass(),
+
+		let player = PlayerProto.create({
+			class: this.getClass(),
+			database: forExport ? undefined : this.toDatabase(),
+		});
+		if (exportCategory(SimSettingCategories.Gear)) {
+			PlayerProto.mergePartial(player, {
 				equipment: gear.asSpec(),
-				consumes: this.getConsumes(),
 				bonusStats: this.getBonusStats().toProto(),
 				enableItemSwap: this.getEnableItemSwap(),
 				itemSwap: this.getItemSwapGear().toProto(),
-				buffs: this.getBuffs(),
+			});
+		}
+		if (exportCategory(SimSettingCategories.Talents)) {
+			PlayerProto.mergePartial(player, {
+				talentsString: this.getTalentsString(),
+				glyphs: this.getGlyphs(),
+			});
+		}
+		if (exportCategory(SimSettingCategories.Rotation)) {
+			PlayerProto.mergePartial(player, {
 				cooldowns: (aplIsLaunched || (forSimming && aplRotation.type == APLRotationType.TypeAPL))
 					? Cooldowns.create({ hpPercentForDefensives: this.getCooldowns().hpPercentForDefensives })
 					: this.getCooldowns(),
-				talentsString: this.getTalentsString(),
-				glyphs: this.getGlyphs(),
 				rotation: aplRotation,
+			});
+		}
+		if (exportCategory(SimSettingCategories.Consumes)) {
+			PlayerProto.mergePartial(player, {
+				consumes: this.getConsumes(),
+			});
+		}
+		if (exportCategory(SimSettingCategories.Miscellaneous)) {
+			PlayerProto.mergePartial(player, {
+				name: this.getName(),
+				race: this.getRace(),
 				profession1: this.getProfession1(),
 				profession2: this.getProfession2(),
 				reactionTimeMs: this.getReactionTime(),
@@ -1360,17 +1383,32 @@ export class Player<SpecType extends Spec> {
 				inFrontOfTarget: this.getInFrontOfTarget(),
 				distanceFromTarget: this.getDistanceFromTarget(),
 				healingModel: this.getHealingModel(),
-				database: forExport ? SimDatabase.create() : this.toDatabase(),
 				nibelungAverageCasts: this.getNibelungAverageCasts(),
 				nibelungAverageCastsSet: this.nibelungAverageCastsSet,
-			}),
-			(aplIsLaunched || (forSimming && aplRotation.type == APLRotationType.TypeAPL))
+			});
+		}
+		if (exportCategory(SimSettingCategories.External)) {
+			PlayerProto.mergePartial(player, {
+				buffs: this.getBuffs(),
+			});
+		}
+		return withSpecProto(
+			this.spec,
+			player,
+			(aplIsLaunched || (forSimming && aplRotation.type == APLRotationType.TypeAPL) || !exportCategory(SimSettingCategories.Rotation))
 				? this.specTypeFunctions.rotationCreate()
 				: this.getRotation(),
-			this.getSpecOptions());
+			exportCategory(SimSettingCategories.Miscellaneous)
+				? this.getSpecOptions()
+				: this.specTypeFunctions.optionsCreate());
 	}
 
-	fromProto(eventID: EventID, proto: PlayerProto) {
+	fromProto(eventID: EventID, proto: PlayerProto, includeCategories?: Array<SimSettingCategories>) {
+		const loadCategory = (cat: SimSettingCategories) =>
+				!includeCategories
+				|| includeCategories.length == 0
+				|| includeCategories.includes(cat);
+
 		if (proto.rotation) {
 			proto.rotation.prepullActions.forEach(ppa => {
 				if (ppa.doAt) {
@@ -1408,42 +1446,53 @@ export class Player<SpecType extends Spec> {
 		}
 
 		TypedEvent.freezeAllAndDo(() => {
-			this.setName(eventID, proto.name);
-			this.setRace(eventID, proto.race);
-			this.setGear(eventID, proto.equipment ? this.sim.db.lookupEquipmentSpec(proto.equipment) : new Gear({}));
-			this.setEnableItemSwap(eventID, proto.enableItemSwap);
-			this.setItemSwapGear(eventID, proto.itemSwap ? this.sim.db.lookupItemSwap(proto.itemSwap) : new ItemSwapGear({}));
-			//this.setBulkEquipmentSpec(eventID, BulkEquipmentSpec.create()); // Do not persist the bulk equipment settings.
-			this.setConsumes(eventID, proto.consumes || Consumes.create());
-			this.setBonusStats(eventID, Stats.fromProto(proto.bonusStats || UnitStats.create()));
-			this.setBuffs(eventID, proto.buffs || IndividualBuffs.create());
-			this.setTalentsString(eventID, proto.talentsString);
-			this.setGlyphs(eventID, proto.glyphs || Glyphs.create());
-			this.setProfession1(eventID, proto.profession1);
-			this.setProfession2(eventID, proto.profession2);
-			this.setReactionTime(eventID, proto.reactionTimeMs);
-			this.setChannelClipDelay(eventID, proto.channelClipDelayMs);
-			this.setInFrontOfTarget(eventID, proto.inFrontOfTarget);
-			this.setDistanceFromTarget(eventID, proto.distanceFromTarget);
-			this.setNibelungAverageCastsSet(eventID, proto.nibelungAverageCastsSet);
-			if (this.nibelungAverageCastsSet) {
-				this.setNibelungAverageCasts(eventID, proto.nibelungAverageCasts);
+			if (loadCategory(SimSettingCategories.Gear)) {
+				this.setGear(eventID, proto.equipment ? this.sim.db.lookupEquipmentSpec(proto.equipment) : new Gear({}));
+				this.setEnableItemSwap(eventID, proto.enableItemSwap);
+				this.setItemSwapGear(eventID, proto.itemSwap ? this.sim.db.lookupItemSwap(proto.itemSwap) : new ItemSwapGear({}));
+				this.setBonusStats(eventID, Stats.fromProto(proto.bonusStats || UnitStats.create()));
+				//this.setBulkEquipmentSpec(eventID, BulkEquipmentSpec.create()); // Do not persist the bulk equipment settings.
 			}
-			this.setHealingModel(eventID, proto.healingModel || HealingModel.create());
-			this.setSpecOptions(eventID, this.specTypeFunctions.optionsFromPlayer(proto));
-
-			if (aplLaunchStatuses[this.spec] == LaunchStatus.Launched) {
-				if (proto.rotation?.type == APLRotationType.TypeUnknown || proto.rotation?.type == APLRotationType.TypeLegacy) {
-					if (!proto.rotation) {
-						proto.rotation = APLRotation.create();
+			if (loadCategory(SimSettingCategories.Talents)) {
+				this.setTalentsString(eventID, proto.talentsString);
+				this.setGlyphs(eventID, proto.glyphs || Glyphs.create());
+			}
+			if (loadCategory(SimSettingCategories.Rotation)) {
+				if (aplLaunchStatuses[this.spec] == LaunchStatus.Launched) {
+					if (proto.rotation?.type == APLRotationType.TypeUnknown || proto.rotation?.type == APLRotationType.TypeLegacy) {
+						if (!proto.rotation) {
+							proto.rotation = APLRotation.create();
+						}
+						proto.rotation.type = APLRotationType.TypeAuto;
 					}
-					proto.rotation.type = APLRotationType.TypeAuto;
+				} else {
+					this.setCooldowns(eventID, proto.cooldowns || Cooldowns.create());
+					this.setRotation(eventID, this.specTypeFunctions.rotationFromPlayer(proto));
 				}
-			} else {
-				this.setCooldowns(eventID, proto.cooldowns || Cooldowns.create());
-				this.setRotation(eventID, this.specTypeFunctions.rotationFromPlayer(proto));
+				this.setAplRotation(eventID, proto.rotation || APLRotation.create())
+			}
+			if (loadCategory(SimSettingCategories.Consumes)) {
+				this.setConsumes(eventID, proto.consumes || Consumes.create());
+			}
+			if (loadCategory(SimSettingCategories.Miscellaneous)) {
+				this.setSpecOptions(eventID, this.specTypeFunctions.optionsFromPlayer(proto));
+				this.setName(eventID, proto.name);
+				this.setRace(eventID, proto.race);
+				this.setProfession1(eventID, proto.profession1);
+				this.setProfession2(eventID, proto.profession2);
+				this.setReactionTime(eventID, proto.reactionTimeMs);
+				this.setChannelClipDelay(eventID, proto.channelClipDelayMs);
+				this.setInFrontOfTarget(eventID, proto.inFrontOfTarget);
+				this.setDistanceFromTarget(eventID, proto.distanceFromTarget);
+				this.setNibelungAverageCastsSet(eventID, proto.nibelungAverageCastsSet);
+				if (this.nibelungAverageCastsSet) {
+					this.setNibelungAverageCasts(eventID, proto.nibelungAverageCasts);
+				}
+				this.setHealingModel(eventID, proto.healingModel || HealingModel.create());
+			}
+			if (loadCategory(SimSettingCategories.External)) {
+				this.setBuffs(eventID, proto.buffs || IndividualBuffs.create());
 			}
-			this.setAplRotation(eventID, proto.rotation || APLRotation.create())
 
 			const options = this.getSpecOptions();
 			for (let key in options) {
diff --git a/ui/core/sim.ts b/ui/core/sim.ts
index def668201e..727dc5042f 100644
--- a/ui/core/sim.ts
+++ b/ui/core/sim.ts
@@ -42,6 +42,17 @@ export type StatWeightsData = {
 	result: StatWeightsResult,
 };
 
+export enum SimSettingCategories {
+	Gear = 0,
+	Talents,
+	Rotation,
+	Consumes,
+	Miscellaneous, // Spec-specific settings, Distance from target, tank status, etc
+	External, // Buffs and debuffs
+	Encounter,
+	UISettings, // # iterations, EP weights, filters, etc
+}
+
 // Core Sim module which deals only with api types, no UI-related stuff.
 export class Sim {
 	private readonly workerPool: WorkerPool;
diff --git a/ui/raid/import_export.ts b/ui/raid/import_export.ts
index a3cb44f500..eba1aabc48 100644
--- a/ui/raid/import_export.ts
+++ b/ui/raid/import_export.ts
@@ -65,7 +65,7 @@ export class RaidJsonExporter extends Exporter {
 	private readonly simUI: RaidSimUI;
 
 	constructor(parent: HTMLElement, simUI: RaidSimUI) {
-		super(parent, simUI, 'JSON Export', true);
+		super(parent, simUI, {title: 'JSON Export', allowDownload: true});
 		this.simUI = simUI;
 		this.init();
 	}
diff --git a/ui/scss/core/components/_exporters.scss b/ui/scss/core/components/_exporters.scss
index aebae6007b..3c56aea96c 100644
--- a/ui/scss/core/components/_exporters.scss
+++ b/ui/scss/core/components/_exporters.scss
@@ -4,4 +4,10 @@
 		height: 40vh;
 		resize: none;
 	}
+
+	.link-exporter-pickers {
+		display: grid;
+		grid-template-columns: repeat(3,1fr);
+		column-gap: 1.25rem;
+	}
 }