|
|
@@ -72,7 +72,9 @@ const renderPokemon = (
|
|
|
const pkmn = document.createElement("div");
|
|
|
pkmn.setAttribute("class", "pokemon_tile");
|
|
|
pkmn.innerHTML = `
|
|
|
- <img src="${getSprite(name)}" />
|
|
|
+ <div class="pokemon_tile-image-wrapper">
|
|
|
+ <img src="${getSprite(name)}" />
|
|
|
+ </div>
|
|
|
<div class="pokemon_tile-info_panel">
|
|
|
<span class="pokemon_tile-pokemon_name">${titleName}</span>
|
|
|
<div class="pokemon_tile-results">
|
|
|
@@ -122,7 +124,11 @@ const renderNorm = vec => `\\frac{${vec}}{\\left|\\left|${vec}\\right|\\right|}`
|
|
|
const renderMath = (includeX, normQY, closeCoeff) => {
|
|
|
const xTerm = includeX ? "X\\left(P\\right)" : "";
|
|
|
const qyMod = normQY ? c => renderNorm(renderVec(c)) : renderVec;
|
|
|
- return TeXZilla.toMathML(`${xTerm}-${closeCoeff}${qyMod("q")}\\cdot ${qyMod("Y\\left(P\\right)")}`);
|
|
|
+ return TeXZilla.toMathML(`\\arg\\min_{P}\\left[${xTerm}-${closeCoeff}${qyMod("q")}\\cdot ${qyMod("Y\\left(P\\right)")}\\right]`);
|
|
|
+}
|
|
|
+
|
|
|
+const renderQVec = (q, id) => {
|
|
|
+ document.getElementById(id).innerHTML = TeXZilla.toMathMLString(`\\vec{q}_{\\text{RGB}} = \\left(${q.join(", ")}\\right)`);
|
|
|
}
|
|
|
|
|
|
const changePageColors = color => {
|
|
|
@@ -173,7 +179,8 @@ const onUpdate = (event) => {
|
|
|
|
|
|
// Update the color display
|
|
|
changePageColors(targetColor);
|
|
|
- // TODO render q vectors somewhere
|
|
|
+ renderQVec(targetRGB.map(c => c.toFixed()), "q-vec-rgb");
|
|
|
+ renderQVec(targetJAB.map(c => c.toFixed(2)), "q-vec-jab");
|
|
|
|
|
|
// Determine metrics from configuration
|
|
|
const xSelector = includeX ? ({ xRGB, xJAB }) => [ xRGB, xJAB ] : () => [ 0, 0 ];
|
|
|
@@ -219,15 +226,9 @@ const onUpdate = (event) => {
|
|
|
}
|
|
|
|
|
|
// Lookup by name
|
|
|
- if (pokemonName.length === 0) {
|
|
|
- const searchList = document.getElementById("search-list");
|
|
|
- searchList.innerHTML = '';
|
|
|
- } else if (lastPkmnSearch !== pokemonName || newParams) {
|
|
|
- // Update last search
|
|
|
- lastPkmnSearch = pokemonName;
|
|
|
-
|
|
|
- const searchList = document.getElementById("search-list");
|
|
|
- searchList.innerHTML = '';
|
|
|
+ const searchList = document.getElementById("search-list");
|
|
|
+ searchList.innerHTML = '';
|
|
|
+ if (pokemonName.length > 0 && (lastPkmnSearch !== pokemonName || newParams)) {
|
|
|
pokemonLookup
|
|
|
.search(pokemonName, { limit: 10 })
|
|
|
// If scoring is impossible, totalScorer will just be identity
|
|
|
@@ -238,6 +239,7 @@ const onUpdate = (event) => {
|
|
|
searchList.appendChild(li);
|
|
|
});
|
|
|
}
|
|
|
+ lastPkmnSearch = pokemonName;
|
|
|
};
|
|
|
|
|
|
const onRandomColor = () => {
|
