#23 add perpouh's contributions and sort the file nicer

2026-03-21 17:34:16 -05:00 · 2023-03-07 06:22:04 -06:00 · 2023-03-07 06:22:04 -06:00 · 00adf4450e
commit 00adf4450e
parent f060597bb7
3 changed files with 2397 additions and 101 deletions
--- a/timeline.html
+++ b/timeline.html
@ -0,0 +1,460 @@
+<html>
+<head>
+<!-- Global settings CSS -->
+<style id="global-css">
+.tab {
+	display: inline-block;
+	position: relative;
+	z-index: 3;
+	cursor: pointer;
+}
+#tab1 {
+	left: 12px;
+}
+#tab2 {
+	left: 30px;
+}
+#tab3 {
+	left: 55px;
+}
+#tab4 {
+	left: 85px;
+}
+#styling-options input {
+	position: absolute;
+	left: 135px;
+}
+#styling-options .reset-button {
+	position: absolute;
+	left: 220px;
+}
+#thread-styling input {
+	position: absolute;
+	left: 150px;
+}
+.thread-input {
+	position: absolute;
+	left: 56px;
+}
+#axis-settings .axis-inputs {
+	position: absolute;
+	left: 90px;
+	display: inline-block;
+}
+#axis-unit {
+	width: 80px;
+}
+#boundary-settings .date-input {
+	position: absolute;
+	left: 70px;
+}
+#axis-style {
+	width: 133px;
+}
+#settings {
+	position: absolute;
+	width: 300px;
+	padding-top: 5px;
+	padding-left: 5px;
+	line-height: 140%
+}
+#start-end {
+	position: relative;
+	top: 3px;
+}
+#axis-input {
+	position: relative;
+	top: 6px;
+}
+#label-define {
+	position: relative;
+	top: 9px;
+}
+#height-define {
+	position: relative;
+	top: 15px;
+}
+#thread-settings, #edit-settings, #event-settings, #export-settings {
+	position: relative;
+	display: none;
+	top: 18px;
+}
+.backdrop {
+	background-color: #cacaca;
+	width: 310px;
+	height: 580px;
+	position: absolute;
+	top: 2px;
+	left: 0px;
+	z-index: -1;
+	border-style: solid;
+	border-width: 1px;
+}
+#live-tab {
+	background-color: #cacaca;
+	width: 80px;
+	height: 22px;
+	position: absolute;
+	top: 6px;
+	left: 8px;
+	border-width: 1px;
+	border-top-style: solid;
+	border-right-style: solid;
+	border-left-style: solid;
+}
+#font-style {
+	left: 135px;
+	position: absolute;
+	width: 129px;
+}
+</style>
+<!--  Automated timeline elements
+	these may be changed by the user
+	but will almost always be handled automatically
+	timeline border, axis styling & labels
+-->
+<style id="auto-css">
+.timeline {
+	left: 330px;
+	width: 730px;
+    height: 600px;
+	position: absolute;
+	border-style: solid;
+	border-width: 1px;
+}
+.timeline .timeline-element {
+	position: absolute;
+}
+.timeline .axis {
+	left: 70px;
+	top: 25px;
+	width: 3px;
+	height: 550px;
+	background-color: #000000;
+}
+.timeline .year-marker {
+	left: 50px;
+	top: 25px;
+	width: 20px;
+	height: 3px;
+	background-color: #000000;
+	z-index: 3;
+}
+.timeline .year-label {
+	left: 15px;
+	position: absolute;
+	text-align: right;
+	z-index: 5;
+}
+</style>
+<!-- General styling: Event bar, label styling -->
+<style id="base-css">
+.timeline .timeline-bar {
+	top: 20px;
+	width: 40px;
+	height: 3px;
+	cursor: pointer;
+}
+.timeline .timeline-label {
+	position: absolute;
+	width: 150px;
+	z-index: 5;
+	transform: translateY(50%);
+	-webkit-transform: translateY(50%);
+    -moz-transform: translateY(50%);
+	pointer-events: none;
+}
+.timeline .timeline-milestone {
+	top: 20px;
+	width: 60px;
+	height: 3px;
+	cursor: pointer;
+}
+</style>
+<!-- Event objects, definitions for the event bar and label for each thread -->
+<style id="events-css">
+.timeline .bar-0 {
+	left: 75px;
+}
+.timeline .bar-0-label {
+	left: 140px;
+	display: block;
+}
+</style>
+<!-- Fonts -->
+<style id="font-css">
+.arial-font {
+	font-family: Arial, sans-serif;
+}
+.verdana-font {
+	font-family: Verdana, sans-serif;
+}
+.tahoma-font {
+	font-family: Tahoma, sans-serif;
+}
+.trebuchet-font {
+	font-family: Trebuchet MS, sans-serif;
+}
+.times-new-roman-font {
+	font-family: Times New Roman, serif;
+}
+.georgia-font {
+	font-family: Georgia, serif;
+}
+.garamond-font {
+	font-family: Garamond, serif;
+}
+.courier-new-font {
+	font-family: Courier New, monospace;
+}
+.brush-script-font {
+	font-family: Brush Script MT, cursive;
+}
+</style>
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
+<script src="timeline.js"></script>
+</head>
+<body onload="documentLoaded();">
+<div class="timeline" id="timeline">
+	<div id="axis" class="timeline-element axis"></div>
+	<div class="timeline-element year-marker" id="year-start"></div>
+	<div class="timeline-element year-marker" id="year-end" style="top:572px;"></div>
+</div>
+<div id="tab-nav">
+	<span class="tab" id="tab1" onclick="switchTab(this);">Timeline</span> 
+	<span class="tab" id="tab2" onclick="switchTab(this);">Threads</span> 
+	<span class="tab" id="tab3" onclick="switchTab(this);">Events</span>
+	<span class="tab" id="tab4" onclick="switchTab(this);">Export</span>
+</div>
+<div id="live-tab"></div>
+<div id="settings">
+	<div class="backdrop"></div>
+	<div id="global-settings">
+		<span id="boundary-settings">
+			<center><b>Boundary Dates</b></center>
+			<label for="startYear">Start:</label>
+			<span class="date-input"><input type="number" id="startYear" placeholder="Year" size="8"></input><input type="number" id="startMonth" placeholder="Month" size="7"></input><input type="number" id="startDay" placeholder="Day" size="7"></input></span>
+			<br>
+			<label for="endYear">End:</label>&nbsp;
+			<span class="date-input"><input type="number" id="endYear" placeholder="Year" size="8"></input><input type="number" id="endMonth" placeholder="Month" size="7"></input><input type="number" id="endDay" placeholder="Day" size="7"></input></span>
+			<br>
+			<center><input type="button" id="btnApplyBoundary" value="Apply Dates" onclick="updateGlobals(this);"> <input type="button" id="btnResetBoundary" value="Reset" onclick="updateGlobals(this);"></center>
+			Decimal years are accepted, given month/day values will overide the converted ones.
+		</span>
+		<hr>
+		<span id="axis-settings">
+			<center><b>Axis Options</b></center>
+			<abbr title="A labeled line will be placed on the timeline at this interval.&#13;&#10;Intervals have a minimum height of 20px,&#13;&#10;so a small major axis may force your timeline to be larger.">
+				<label for="axis-value">Major axis:</label>
+				<span class="axis-inputs"><input type="number" id="axis-value" size="4">
+					<select id="axis-unit">
+						<option value="0">years</option>
+						<option value="1">months</option>
+						<option value="2">days</option>
+					</select>
+					<input type="button" id="axis-button" value="Apply axis" onclick="updateGlobals(this);">
+				</span>
+			</abbr>
+			<br>
+			<abbr title="Default styles for axis labels:&#13;&#10;Outer: Small marks outside the thread area.&#13;&#10;Inner: Small marks that may cover the first thread.&#13;&#10;Under Grid: Thin lines go under the entire timeline.&#13;&#10;Over Grid: Above, but lines layer over event bars.&#13;&#10;Break events: Above, but with a white line to 'break' bars.">
+				<label for="axis-style">Axis style:</label>
+				<span class="axis-inputs">
+					<select id="axis-style" onchange="updateGlobals(this);">
+						<option value="outer">Outer</option>
+						<option value="inner">Inner</option>
+						<option value="grid1">Under Grid</option>
+						<option value="grid2">Over Grid</option>
+						<option value="grid3">Break events</option>
+					</select>
+				</span>
+			</abbr>
+			<br>
+			<label for="label-definer">Date labels:</label><span class="axis-inputs"><input type="text" id="label-definer" placeholder='eg, "{M}, {D} {Y}"' size="18" onchange="updateGlobals(this);"></input></span>
+			<br>
+			The label to use, {Y}, {M}, and {D} will be replaced with the relevant year/month/date.
+		</span>
+		<hr>
+		<span id="styling-options">
+			<center><b>Styling Options</b></center>
+			<abbr title="Controls the height of the timeline.&#13;&#10;A minimum height will be enforced based on your major axis.">
+				Timeline height: <input  type="number" size="6" id="height-definer" value="550" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('height-definer');">
+			<br>
+			<abbr title="Controls the width of the event bars.">
+				Bar width: <input type="number" size="6" id="bar-width" value="40" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('bar-width');">
+			<br>
+			<abbr title="The bar size for special events with the same start and end date.">
+				Milestone width: <input type="number" size="6" id="mile-width" value="60" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('mile-width');">
+			<br>
+			<abbr title="Controls the max width of labels.">
+				Label width: <input type="number" size="6" id="label-width" value="150" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('label-width');">
+			<br>
+			<abbr title="Controls the spacing between the event bars and the labels.">
+				Label offset: <input type="number" size="6" id="label-offset" value="25" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('label-offset');">
+			<br>
+			<abbr title="Controls the spacing between different threads">
+				Thread offset: <input type="number" size="6" id="thread-offset" value="10" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('thread-offset');">
+			<br>
+			<abbr title="Controls the placement of the vertical axis.">
+				Axis offset: <input type="number" size="6" id="axis-offset" value="70" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('axis-offset');">
+			<br>
+			<abbr title="Controls vertical offset of the axis date labels.">
+				Axis label offset: <input type="number" size="6" id="axis-label-offset" value="-6" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('axis-label-offset');">
+			<br>
+			<abbr title="Controls spacing between axis and first bar.">
+				Bar offset: <input type="number" size="6" id="bar-offset" value="5" onchange="updateGlobals(this);">
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('bar-offset');">
+			<br>
+			<abbr title="Controls the font size">
+				Font scaling %: <input type="number" size="6" id="font-scaler" step="10" value="100" onchange="updateGlobals(this);"></input>
+			</abbr>
+			<input class="reset-button" type="button" value="Reset" onclick="resetDefault('font-scaler');">
+			<br>
+			Label font: 
+			<select id="font-style" class="times-new-roman-font" onchange="updateGlobals(this);">
+				<option value="arial-font" class="arial-font">Arial</option>
+				<option value="verdana-font" class="verdana-font">Verdana</option>
+				<option value="tahoma-font" class="tahoma-font">Tahoma</option>
+				<option value="trebuchet-font" class="trebuchet-font">Trebuchet MS</option>
+				<option value="times-new-roman-font" class="times-new-roman-font" selected>Times New Roman</option>
+				<option value="georgia-font" class="georgia-font">Georgia</option>
+				<option value="garamond-font" class="garamond-font">Garamond</option>
+				<option value="courier-new-font" class="courier-new-font">Courier New</option>
+				<option value="brush-script-font" class="brush-script-font">Brush Script MT</option>
+			</select>
+		</span>
+	</div>
+	<div id="thread-settings">
+		Threads: 
+		<select style="width:150px;" id="thread-selector" class="thread-selector" onchange="focusThread(this);">
+			<!--<option id="pick-thread-0" value="0" selected>Thread 1</option>-->
+		</select>
+		<input type="button" id="btnCreateThread" value="New thread" onclick="createThread();">
+		<hr>
+		<center><b>Current Thread</b></center>
+		Name:&nbsp;&nbsp;&nbsp; <input class="thread-input" type="text" size="21" id="thread-name" onchange="updateThread(this);">
+		<br>
+		<abbr title="This determines the order multiple threads are displayed in the timeline,&#13;&#10;starting at index 0 and going up.">
+			Index: <input class="thread-input" type="text" id="thread-index" onchange="updateThread(this);" size="1">
+		</abbr>
+		<br>
+		Color:&nbsp;&nbsp;&nbsp; <input class="thread-input" type="color" id="thread-color" onchange="updateThread(this);">
+		<br>
+		<br>
+		<input class="thread-input" type="button" value="Create new event in this thread" onclick="switchTab({id:'tab3'});">
+		<br>
+		<hr>
+		<span id="thread-styling">
+			<center><b>Thread Styling</b></center>
+			<abbr title="Increase the size of the event bars on this thread.">
+				Bar width offset: <input type="number" id="thread-bar-width" size="6" onchange="updateThread(this);">
+			</abbr>
+			<br>
+			<abbr title="Increase the width of the event labels on this thread.">
+				Label width offset: <input type="number" id="thread-label-width" size="6" onchange="updateThread(this);">
+			</abbr>
+			<br>
+			<abbr title="Increase the spacing between the event bars and labels.">
+				Label offset: <input type="number" id="thread-label-offset" size="6" onchange="updateThread(this);">
+			</abbr>
+			<br>
+			<abbr title="Increase the spacing between this thread and the next one.">
+				Thread offset: <input type="number" id="thread-thread-offset" size="6" onchange="updateThread(this);">
+			</abbr>
+		</span>
+		<hr>
+		<center><b>Danger Zone</b></center>
+		<center><b>Migrate to another thread</b></center>
+		Choose a thread: <select style="width:150px;" id="merge-selector" class="thread-selector" onchange="migrateMetas(this);">
+			<!--<option id="pick-thread-0" value="0" selected>Thread 1</option>-->
+		</select>
+		<br>
+		Inherit new thread's color? <input type="checkbox" value="inherit" id="merge-color" checked>
+		<br>
+		<center><span id="merge-error" style="color: red;visibility: hidden;">A thread can't be merged into itself.</span></center>
+		<center><input type="button" id="btnMerge" value="Merge Thread" onclick="mergeForm();"></center>
+		<hr>
+		<center><b>Delete thread and events</b></center>
+		<br>
+		<center><input type="button" value="Delete thread" onclick="deleteThread();"></center>
+	</div>
+	<div id="event-settings">
+		<div id="event-header"><b>Creating an event on thread <a id="creating-thread-name"></a></b></div>
+		Event label: <input type="text" size="19" id="event-name"> <input type="color" id="event-color">
+		<br>
+		<label for="eventStartYear">Event start date:</label>
+		<br>
+		<input type="number" id="eventStartYear" placeholder="Year" size="8"></input><input type="number" id="eventStartMonth" placeholder="Month" size="8"></input><input type="number" id="eventStartDay" placeholder="Day" size="8"></input>
+		<br>
+		<label for="eventEndYear">Event end date:</label>
+		<br>
+		<input type="number" id="eventEndYear" placeholder="Year" size="8"></input><input type="number" id="eventEndMonth" placeholder="Month" size="8"></input><input type="number" id="eventEndDay" placeholder="Day" size="8"></input>
+		<br>
+		<input type="button" value="Add event" onclick="createTimelineEvent();">
+	</div>
+	<div id="edit-settings">
+		<div id="edit-header"><b>Editing an event on thread <a id="editing-thread-name"></a></b></div>
+		Editing Event: <input type="button" id="btnResume" value="Stop editing" onclick="cancelEditing();">
+		<br>
+		Event label: <input type="text" id="edit-label" onchange="displayEdit(this)"> <input type="color" id="edit-color" onchange="displayEdit(this)">
+		<br>
+		Label offset Y: <input type="number" id="edit-y" size="3" onchange="displayEdit(this)"> X: <input type="number" size="3" id="edit-x" onchange="displayEdit(this)">
+		<br>
+		<label for="year-input">Event start date:</label>
+		<br>
+		<input type="number" id="edit-start-year" placeholder="Year" size="8"></input><input type="number" id="edit-start-month" placeholder="Month" size="8"></input><input type="number" id="edit-start-day" placeholder="Day" size="8"></input>
+		<br>
+		<label for="year-input">Event end date:</label>
+		<br>
+		<input type="number" id="edit-end-year" placeholder="Year" size="8"></input><input type="number" id="edit-end-month" placeholder="Month" size="8"></input><input type="number" id="edit-end-day" placeholder="Day" size="8"></input>
+		<br>
+		<input type="button" id="btnPreview" value="Preview New Date" onclick="displayEdit(this);">
+		<input type="button" id="btnSubmitEdit" value="Save Changes" onclick="saveEventEdit();">
+		<input type="button" id="btnResetEdit" value="Reset" onclick="resetEventEdit(true);">
+		<hr>
+		<center><b>Migrate to another thread</b></center>
+		Choose a thread: <select style="width:150px;" id="migrate-selector" class="thread-selector" onchange="migrateMetas(this);">
+			<!--<option id="pick-thread-0" value="0" selected>Thread 1</option>-->
+		</select>
+		<br>
+		Inherit new thread's color? <input type="checkbox" value="inherit" id="migrate-color" checked>
+		<center><span id="migrate-error" style="color: red;visibility: hidden;">The event is already on this thread.</span></center>
+		<center><input type="button" id="btnMigrate" value="Migrate Event" onclick="migrateEvent();"></center>
+		<hr>
+		<center><b>Danger Zone</b></center>
+		<center><input type="button" id="btnDelete" value="Delete event" onclick="deleteEventEdit();"></center>
+	</div>
+	<div id="export-settings">
+		<center><b>Timeline Import/Export</b></center>
+		<a id="download-link" download="timeline.txt">Click here</a> to download your Timeline Text File. It can be uploaded below to load the current state, or add it to another timeline. Note that this website will not save your timelines if you leave it outside of this download!
+		<input type="file" accept=".txt" id="importer" onchange="document.getElementById('btnImport').style.visibility=''">
+		<input style="visibility:hidden;" type="button" onclick="submitImport();" id="btnImport" value="Load file">
+		<br>
+		<span id="import-error" style="color:red;"></span>
+		<hr>
+		<center><b>CSS/HTML Export</b></center>
+		<center><i>(Coming soon)</i></center>
+	</div>
+</div>
+<script>
+/*just here to prevent Firefox FOUC*/
+let FF_FOUC_FIX;
+</script>
+</body>
+</html>
--- a/timeline.js
+++ b/timeline.js
--- a/translate.js
+++ b/translate.js
@ -13,6 +13,215 @@ var "languages": [
 var regional_suffix = ["Español", "Português", "Français", "Italiano"];
 var no_spaces = ["日本", "简中", "繁中"];
 var translatable = {
+	// Strings missing translations
+	"Gimmick Form": {
+		"English": "",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"PseudoLegend": {
+		"English": "Pseudo Legend",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "600族",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Eeveelution": {
+		"English": "",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Box Legendary": {
+		"English": "",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Download": {
+		"English": "Download Image",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"altLink": {
+		"English": "Alternate download link",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Export": {
+		"English": "Export Choices",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Import": {
+		"English": "Import Choices",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"gridReset": {
+		"English": "Reset the grid!",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"gridConfirm": {
+		"English": "Are you sure you want to reset the grid?",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"importExportInstructions": {
+		"English": "# Don't like my choices? You can overrule them here!\n# Write Code will put a text version of the grid here\n# Then you can edit the names and Import Code to replace the images.\n# Most Pokemon are just their named capitalized, like SWELLOW.\n# Alternate forms have specific tags, like MEOWTH_2 for Galarian Meowth.\n# You can also use this to keep backups",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"spindaInstructions": {
+		"English": "Spinda's spots can be randomized or manually placed.\nEach box pair in the corners moves its nearest spot.\nUp/Down on the first box moves it Right/Left.\nUp/Down on the second box moves it Up/Down.",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"teamInstructions": {
+		"English": "Click a team box, then a Pokemon from the grid to copy it to the box.",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Picking": {
+		"English": "Picking...",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
+	"Credits": { // idk if this one's getting it
+		"English": "",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""		
+	},
+
+	// Less simple strings translated w/ Google Translate
+	// may very well be issues in here
+	// especially in Japanese/Chinese/Korean where I am completely lost
+	"ShinyCharm1": {
+		"English": "Click the Shiny Charm, then click Pokemon to make them shiny.",
+		"Español": "Haz clic en Amuleto Iris, luego haz clic en Pokémon para hacerlos variocolor.",
+		"Português": "Clique no Amuleto Iris e, em seguida, clique em Pokemon para torná-los brilhantes.",
+		"Deutsch": "Klicken Sie auf den Schillerpin und dann auf Pokemon, um sie glänzend zu Schillerndes.",
+		"日本": "ひかるおまもりをクリックしてから、ポケモンをクリックして光るます。",
+		"简中": "点击闪耀护符然后点击宝可梦让它们发光。",
+		"繁中": "單擊闪耀护符然後單擊宝可梦使它們發光。",
+		"Français": "Cliquez sur le Charme Chroma, puis cliquez sur Pokemon pour les rendre chromatique.",
+		"Italiano": "Fai clic sul Cromamuleto , quindi fai clic su Pokemon per renderli cromatico.",
+		"한국어": "빛나는부적 을 클릭한 다음 포켓몬 을 클릭하여 반짝이게 만들 빛나는"
+	},
+	"ShinyCharm2": {
+		"English": "Or click here to make everything shiny.",
+		"Español": "",
+		"Português": "",
+		"Deutsch": "",
+		"日本": "",
+		"简中": "",
+		"繁中": "",
+		"Français": "",
+		"Italiano": "",
+		"한국어": ""
+	},
 	"Randomize!": {
 		"English": ["Randomize!"],
 		"Español": ["Aleatorizar!"],
@ -25,30 +234,57 @@ var translatable = {
 		"Italiano": ["Casuale!"],
 		"한국어": ["무작위의!"]
 	},
-	"Shiny Charm1": {
-		"English": "Click the Shiny Charm, then click Pokemon to make them shiny.",
-		"Español": "Haz clic en Amuleto Iris, luego haz clic en Pokémon para hacerlos variocolor.",
-		"Português": "Clique no Amuleto Iris e, em seguida, clique em Pokemon para torná-los brilhantes.",
-		"Deutsch": "Klicken Sie auf den Schillerpin und dann auf Pokemon, um sie glänzend zu Schillerndes.",
-		"日本": "ひかるおまもりをクリックしてから、ポケモンをクリックして光るます。",
-		"简中": "点击闪耀护符然后点击宝可梦让它们发光。",
-		"繁中": "單擊闪耀护符然後單擊宝可梦使它們發光。",
-		"Français": "Cliquez sur le Charme Chroma, puis cliquez sur Pokemon pour les rendre chromatique.",
-		"Italiano": "Fai clic sul Cromamuleto , quindi fai clic su Pokemon per renderli cromatico.",
-		"한국어": "빛나는부적 을 클릭한 다음 포켓몬 을 클릭하여 반짝이게 만들 빛나는"
+	"Cookie1": {	// disable cookies
+		"English": "This site uses cookies to save your choices. You can disable them here.",
+		"Español": "Este sitio utiliza cookies para guardar sus elecciones. Puede desactivarlos aquí.",
+		"Português": "Este site usa cookies para salvar suas escolhas. Você pode desativá-los aqui.",
+		"Deutsch": "Diese Seite verwendet Cookies, um Ihre Auswahl zu speichern. Sie können sie hier deaktivieren.",
+		"日本": "このサイトでは、選択内容を保存するためにクッキーを使用しています。 ここでそれらを無効にすることができます。",
+		"简中": "本网站使用曲奇饼来保存您的选择。 您可以在此处禁用它们。",
+		"繁中": "本網站使用曲奇餅來保存您的選擇。 您可以在此處禁用它們。",
+		"Français": "Ce site utilise des cookies pour enregistrer vos choix. Vous pouvez les désactiver ici.",
+		"Italiano": "Questo sito utilizza i cookie per salvare le tue scelte. Puoi disabilitarli qui.",
+		"한국어": "이 사이트는 쿠키를 사용하여 선택 사항을 저장합니다. 여기에서 비활성화할 수 있습니다."
 	},
-	// unfinished
-	"Shiny Charm2": {
-		"English": "Or click here to make everything shiny.",
-		"Español": "",
-		"Português": "",
-		"Deutsch": "",
-		"日本": "",
-		"简中": "",
-		"繁中": "",
-		"Français": "",
+	"Cookie2": {	// re-enable cookies
+		"English": "This site uses cookies to save your choices. You can enable them here.",
+		"Español": "Este sitio utiliza cookies para guardar sus elecciones. Puede habilitarlos aquí.",
+		"Português": "Este site usa cookies para salvar suas escolhas. Você pode ativá-los aqui.",
+		"Deutsch": "Diese Seite verwendet Cookies, um Ihre Auswahl zu speichern. Sie können sie hier aktivieren.",
+		"日本": "このサイトでは、選択内容を保存するためにクッキーを使用しています。 ここで有効にできます。",
+		"简中": "本网站使用曲奇饼来保存您的选择。 您可以在此处启用它们。",
+		"繁中": "本網站使用曲奇餅來保存您的選擇。 您可以在此處啟用它們。",
+		"Français": "Ce site utilise des cookies pour enregistrer vos choix. Vous pouvez les activer ici.",
+		"Italiano": "Questo sito utilizza i cookie per salvare le tue scelte. Puoi abilitarli qui.",
+		"한국어": "이 사이트는 쿠키를 사용하여 선택 사항을 저장합니다. 여기에서 활성화할 수 있습니다."
+	},
+	"PikachuClone": {
+		"English": "Pikachu Clone",
+		"Español": "Pikachu Clon",
+		"Português": "Pikachu Clone",
+		"Deutsch": "Pikachuklon",
+		"日本": "ピカチュウのクローン",
+		"简中": "皮卡丘克隆",
+		"繁中": "皮卡丘克隆",
+		"Français": "Pikachu Cloner",
 		"Italiano": "",
-		"한국어": ""
+		"한국어": "피카츄 클론"
+	},
+
+	// Strings with either official or simple translations
+	// reasonably sure these are fine
+	"Favorite": {
+		// masc / femme
+		"English": ["Favorite", "Favorite"],
+		"Español": ["Favorito", "Favorita"],
+		"Português": ["Favorito", "Favorita"],
+		"Deutsch": ["Favorit", "Favoritin"],
+		"日本": ["お気に入り", "お気に入り"],
+		"简中": ["最喜欢的","最喜欢的"],
+		"繁中": ["最喜歡的", "最喜歡的"],
+		"Français": ["Préféré", "Préférée"],
+		"Italiano": ["Preferito", "Preferita"],
+		"한국어": ["가장 좋아하는", "가장 좋아하는"]
 	},
 	"Team": {
 		"English": "Team",
@ -62,19 +298,6 @@ var translatable = {
 		"Italiano": "Squadra",
 		"한국어": "지닌 포켓몬"
 	},
-	// masc / femme
-	"Favorite": {
-		"English": ["Favorite", "Favorite"],
-		"Español": ["Favorito", "Favorita"],
-		"Português": ["Favorito", "Favorita"],
-		"Deutsch": ["Favorit", "Favoritin"],
-		"日本": ["お気に入り", "お気に入り"],
-		"简中": ["最喜欢的","最喜欢的"],
-		"繁中": ["最喜歡的", "最喜歡的"],
-		"Français": ["Préféré", "Préférée"],
-		"Italiano": ["Preferito", "Preferita"],
-		"한국어": ["가장 좋아하는", "가장 좋아하는"]
-	},
 	"Regional": {
 		"English": "Regional",
 		"Español": "regional",
@ -99,18 +322,6 @@ var translatable = {
 		"Italiano": "Uccello",
 		"한국어": "새"
 	},
-	"Bug": {
-		"English": "Bug",
-		"Español": "Bicho",
-		"Português": "Erro",
-		"Deutsch": "Insekt",
-		"日本": "バグ",
-		"简中": "漏洞",
-		"繁中": "漏洞",
-		"Français": "Bogue",
-		"Italiano": "Insetto",
-		"한국어": "벌레"
-	},
 	"Mammal": {
 		"English": "Mammal",
 		"Español": "Mamífero",
@ -123,45 +334,6 @@ var translatable = {
 		"Italiano": "Mammifero",
 		"한국어": "포유류"
 	},
-	// unfinished
-	"Pseudo Legend": {
-		"English": "",
-		"Español": "",
-		"Português": "",
-		"Deutsch": "",
-		"日本": "600族",
-		"简中": "",
-		"繁中": "",
-		"Français": "",
-		"Italiano": "",
-		"한국어": ""
-	},
-	// guesstimated
-	"Pikachu Clone": {
-		"English": "Pikachu Clone",
-		"Español": "Pikachu Clon",
-		"Português": "Pikachu Clone",
-		"Deutsch": "Pikachuklon",
-		"日本": "ピカチュウのクローン",
-		"简中": "皮卡丘克隆",
-		"繁中": "皮卡丘克隆",
-		"Français": "Pikachu Cloner",
-		"Italiano": "",
-		"한국어": "피카츄 클론"
-	},
-	// unfinished
-	"Eeveelution": {
-		"English": "",
-		"Español": "",
-		"Português": "",
-		"Deutsch": "",
-		"日本": "",
-		"简中": "",
-		"繁中": "",
-		"Français": "",
-		"Italiano": "",
-		"한국어": ""
-	},
 	"Fossil": {
 		"English": "Fossil",
 		"Español": "Fósil",
@ -174,7 +346,7 @@ var translatable = {
 		"Italiano": "Fossile",
 		"한국어": "화석"
 	},
-	"Regional Form": {
+	"RegionalForm": {
 		"English": "Regional Form",
 		"Español": "Forma regional",
 		"Português": "Forma regional",
@ -198,19 +370,6 @@ var translatable = {
 		"Italiano": "Gigamax",
 		"한국어": "거다이맥스"
 	},
-	// unfinished
-	"Box Legendary": {
-		"English": "",
-		"Español": "",
-		"Português": "",
-		"Deutsch": "",
-		"日本": "",
-		"简中": "",
-		"繁中": "",
-		"Français": "",
-		"Italiano": "",
-		"한국어": ""
-	},
 	"Mythical": {
 		"English": "Mythical",
 		"Español": "Pokémon mítico",
@ -223,7 +382,7 @@ var translatable = {
 		"Italiano": "Pokémon misterioso",
 		"한국어": "환상의 포켓몬"
 	},
-	"Ultra Beast": {
+	"UltraBeast": {
 		"English": "Ultra Beast",
 		"Español": "Ultraente",
 		"Português": "Ultrafera",
@ -306,5 +465,246 @@ var translatable = {
 		"Français": "Charmilly",
 		"Italiano": "Alcremie",
 		"한국어": "마휘핑"
+	},
+	
+	"Normal": {
+		"English": "Normal",
+		"Español": "Normal",
+		"Português": "Normal",
+		"Deutsch": "Normal",
+		"日本": "ノーマル",
+		"简中": "一般",
+		"繁中": "一般",
+		"Français": "Normal",
+		"Italiano": "Normale",
+		"한국어": "노말"
+	},
+	"Fire": {
+		"English": "Fire",
+		"Español": "Fuego",
+		"Português": "Fogo",
+		"Deutsch": "Feuer ",
+		"日本": "ほのお ",
+		"简中": "炎",
+		"繁中": "炎",
+		"Français": "Feu",
+		"Italiano": " 	Fuoco",
+		"한국어": "불꽃"
+	},
+	"Water": {
+		"English": "Water",
+		"Español": "Agua",
+		"Português": "Água",
+		"Deutsch": "Wasser",
+		"日本": "みず",
+		"简中": "水",
+		"繁中": "水",
+		"Français": "Eau",
+		"Italiano": "Acqua",
+		"한국어": "물"
+	},
+	"Grass": {
+		"English": "Grass",
+		"Español": "Planta",
+		"Português": "Erva",
+		"Deutsch": "Pflanze",
+		"日本": "くさ",
+		"简中": "草",
+		"繁中": "草",
+		"Français": "Plante",
+		"Italiano": "Erba",
+		"한국어": "풀"
+	},
+	"Electric": {
+		"English": "Electric",
+		"Español": "Eléctrico",
+		"Português": "Elétrico",
+		"Deutsch": "Elektro",
+		"日本": "でんき",
+		"简中": "电",
+		"繁中": "電",
+		"Français": "Électrik",
+		"Italiano": "Elettro",
+		"한국어": " 	전기"
+	},
+	"Ice": {
+		"English": "Ice",
+		"Español": "Hielo",
+		"Português": "Gelo",
+		"Deutsch": "Eis",
+		"日本": "こおり",
+		"简中": "冰",
+		"繁中": "冰",
+		"Français": "Glace",
+		"Italiano": "Ghiaccio",
+		"한국어": " 	얼음"
+	},
+	"Fighting": {
+		"English": "Fighting",
+		"Español": "Lucha",
+		"Português": "Luta",
+		"Deutsch": "Kampf",
+		"日本": "かくとう",
+		"简中": "格斗",
+		"繁中": "格鬥",
+		"Français": "Combat",
+		"Italiano": "Lotta",
+		"한국어": "격투"
+	},
+	"Poison": {
+		"English": "Poison",
+		"Español": "Veneno",
+		"Português": "Veneno",
+		"Deutsch": "Gift",
+		"日本": "どく",
+		"简中": "毒",
+		"繁中": "毒",
+		"Français": "Poison",
+		"Italiano": "Veleno",
+		"한국어": "독"
+	},
+	"Ground": {
+		"English": "Ground",
+		"Español": "Tierra",
+		"Português": "Terra",
+		"Deutsch": "Boden",
+		"日本": "じめん",
+		"简中": "地面 ",
+		"繁中": "地面 ",
+		"Français": "Sol",
+		"Italiano": "Terra",
+		"한국어": "땅"
+	},
+	"Flying": {
+		"English": "Flying",
+		"Español": "Volador",
+		"Português": "Voador",
+		"Deutsch": "Flug",
+		"日本": "ひこう",
+		"简中": "飞行",
+		"繁中": "飛行",
+		"Français": "Vol",
+		"Italiano": "Volante",
+		"한국어": "비행"
+	},
+	"Psychic": {
+		"English": "Psychic",
+		"Español": "Psíquico",
+		"Português": "Psíquico",
+		"Deutsch": "Psycho",
+		"日本": "エスパー",
+		"简中": "超能力",
+		"繁中": "超能力",
+		"Français": "Psy",
+		"Italiano": "Psico",
+		"한국어": "에스퍼"
+	},
+	"Bug": {
+		"English": "Bug",
+		"Español": "Bicho",
+		"Português": "Insecto",
+		"Deutsch": "Käfer",
+		"日本": "むし",
+		"简中": "虫",
+		"繁中": "蟲",
+		"Français": "Insecte",
+		"Italiano": "Coleottero",
+		"한국어": "벌레"
+	},
+	"Rock": {
+		"English": "Rock",
+		"Español": "Roca",
+		"Português": "Pedra",
+		"Deutsch": "Gestein",
+		"日本": "いわ",
+		"简中": "岩石",
+		"繁中": "岩石",
+		"Français": "Roche",
+		"Italiano": "Roccia",
+		"한국어": "바위"
+	},
+	"Ghost": {
+		"English": "Ghost",
+		"Español": "Fantasma",
+		"Português": "Fantasma",
+		"Deutsch": "Geist",
+		"日本": "ゴースト",
+		"简中": "幽灵",
+		"繁中": "幽靈",
+		"Français": "Spectre",
+		"Italiano": "Spettro",
+		"한국어": "고스트"
+	},
+	"Dragon": {
+		"English": "Dragon",
+		"Español": "Dragón",
+		"Português": "Dragão",
+		"Deutsch": "Drache",
+		"日本": "ドラゴン",
+		"简中": "龙",
+		"繁中": "龍",
+		"Français": "Dragon",
+		"Italiano": "Drago",
+		"한국어": " 	드래곤"
+	},
+	"Dark": {
+		"English": "Dark",
+		"Español": "Siniestro",
+		"Português": "Sinistro",
+		"Deutsch": "Unlicht",
+		"日本": "あく",
+		"简中": "恶",
+		"繁中": "惡",
+		"Français": "Ténèbres",
+		"Italiano": "Buio",
+		"한국어": "악"
+	},
+	"Steel": {
+		"English": "Steel",
+		"Español": "Acero",
+		"Português": "Aço",
+		"Deutsch": "Stahl",
+		"日本": "はがね",
+		"简中": "钢",
+		"繁中": "鋼",
+		"Français": "Acier",
+		"Italiano": "Acciaio",
+		"한국어": "강철"
+	},
+	"Fairy": {
+		"English": "Fairy",
+		"Español": "Hada",
+		"Português": "Fada",
+		"Deutsch": "Fee",
+		"日本": "フェアリー",
+		"简中": "妖精",
+		"繁中": "妖精",
+		"Français": "Fée",
+		"Italiano": "Folletto",
+		"한국어": "페어리"
+	},
+	"Starter": {
+		"English": "Starter",
+		"Español": "Inicial",
+		"Português": "Inicial",
+		"Deutsch": "Starter",
+		"日本": "はじめて",
+		"简中": "起动机",
+		"繁中": "起動機",
+		"Français": "de départ",
+		"Italiano": "Iniziale",
+		"한국어": "파트너"
+	},
+	"Legend": {
+		"English": "Legend",
+		"Español": "Legend", //legendario
+		"Português": "Lendário", //Legendäre 
+		"Deutsch": "Legend",
+		"日本": "伝説",
+		"简中": "传说的",
+		"繁中": "傳說的",
+		"Français": "Legend", //légendaire
+		"Italiano": "Legend", //leggendari
+		"한국어": " 전설의"
 	}
 }