allow selecting recipe in block picker

index.html

@@ -110,7 +110,7 @@
   </section>
 </aside>
 <footer>
-  <div>pre-alpha 1.1</div>
+  <div>pre-alpha 1.2</div>
   <div>
     <a href="https://discord.gg/Eq72HwPqfg">Discord server</a>
   </div>
@@ -130,7 +130,6 @@
         Roadmap:
       </p>
       <ul>
-        <li>Block and reactor recipe selection - WIP</li>
         <li>Reactor tooltips</li>
         <li>Reactor verification and stats</li>
         <li>Casing improvements</li>

scripts/block-picker.js

@@ -10,8 +10,11 @@ import { lookupFromMetadata, resolveBlockName } from "./ncpf-utils.js";
 registerLoadCallback(() => {
   listenTo("config:end", buildBlockPicker);
   listenTo("block-picker:filter:input", buildBlockPicker);
+  listenTo("block-picker:selection", () => setBlockPickerRecipe(null));
 });
 
+let activeItemRecipe = null;
+
 function buildBlockPicker() {
   const filter = Filter.fromInput("block-picker:filter");
 
@@ -197,3 +200,11 @@ export function getBlockPickerActiveItem() {
   const blockPickerDom = document.getElementById("block-picker-list");
   return Number(blockPickerDom.dataset.activeItem ?? -1);
 }
+
+export function getBlockPickerRecipe() {
+  return activeItemRecipe;
+}
+
+export function setBlockPickerRecipe(recipe) {
+  activeItemRecipe = recipe;
+}

scripts/planner.js

@@ -5,7 +5,8 @@ import { emitEvent, listenTo } from "./events.js";
 import { initialize3dArray } from "./js-utils.js";
 import { recall, save } from "./storage.js";
 import { registerLoadCallback } from "./main.js";
-import { getBlockPickerActiveItem } from "./block-picker.js";
+import { getBlockPickerActiveItem, getBlockPickerRecipe } from "./block-picker.js";
+import { deleteSolverMetadata, setSolverMetadata } from "./solver.js";
 
 const zoomOptions = [ 0.5, 1, 2, 3, 4, 5 ];
 const zoomDefault = 2;
@@ -214,19 +215,18 @@ function cellClickEvent(e) {
     if (e.target.tile === "-1") return;
 
     e.target.dataset.previewRemove = "yes";
-    return;
+    deleteSolverMetadata(e.target);
   } else if (e.buttons === 1) {
     // add
     if (e.target.dataset.preview === activeItem.toString(10)) return;
 
     e.target.dataset.preview = activeItem.toString(10);
     e.target.replaceChildren(makeAtlasImage(activeItem));
+    const pickerRecipe = getBlockPickerRecipe();
+    if (pickerRecipe) {
+      setSolverMetadata(e.target, { block_recipe: pickerRecipe });
+    }
   }
-
-  if (e.target.dataset.preview === activeItem.toString(10)) return;
-
-  e.target.dataset.preview = activeItem.toString(10);
-  e.target.replaceChildren(makeAtlasImage(activeItem));
 }
 function cellSelectEvent(e) {
   if (e.type === "mousedown" && !e.ctrlKey && e.buttons !== 2) {

scripts/recipe-selector.js

@@ -15,6 +15,7 @@ import {
 import { createTooltip, setTooltip, tooltipDataToPlain } from "./tooltip.js";
 import { Filter } from "./filter.js";
 import { debounce } from "./dom-utils.js";
+import { getBlockPickerActiveItem, setBlockPickerRecipe } from "./block-picker.js";
 
 const defaultRecipes = {
   ["nuclearcraft:overhaul_sfr"]: {
@@ -29,9 +30,16 @@ const defaultRecipes = {
 };
 
 registerLoadCallback(() => {
-  listenTo([ "config:end", "solver:reset:done" ], rescanDesignRecipes);
+  listenTo([
+    "config:end",
+    "solver:reset:done",
+  ], rescanDesignRecipes);
 
-  listenTo([ "planner:selection:removed", "planner:selection:added"], rescanSelectionRecipes);
+  listenTo([
+    "planner:selection:removed",
+    "planner:selection:added",
+    "block-picker:selection",
+  ], rescanSelectionRecipes);
 });
 
 function initializeRecipePicker({
@@ -173,6 +181,7 @@ function rescanDesignRecipes() {
 function rescanSelectionRecipes() {
   const selectedCells = getSelectedCells();
   const selectedTiles = new Set(selectedCells.map(v => Number(v.dataset.tile)));
+  const pickerTile = getBlockPickerActiveItem();
 
   const designRecipes = new DomList(
       document.getElementById("recipe-selector:selection"),
@@ -180,13 +189,13 @@ function rescanSelectionRecipes() {
   );
   designRecipes.clear();
 
-  if (selectedTiles.size !== 1 || selectedTiles.has(-1)) {
+  if ((selectedTiles.size !== 1 || selectedTiles.has(-1)) && pickerTile === -1) {
     return;
   }
 
   const multiblockType = getPlannerMultiblockType();
 
-  const tileMetadata = getAtlasMetadata(selectedCells[0].dataset.tile);
+  const tileMetadata = getAtlasMetadata(selectedCells.length > 0 ? selectedCells[0].dataset.tile : pickerTile);
   const tiles = findFullEntryFromAtlasMetadata(tileMetadata, { all: true });
 
   console.log(tiles);
@@ -234,6 +243,9 @@ function rescanSelectionRecipes() {
       }
       const stripped = stripEntryToMinimums(e);
       selectedCells.forEach(v => setSolverMetadata(v, { block_recipe: stripped }));
+      if (pickerTile !== -1) {
+        setBlockPickerRecipe(e);
+      }
     },
     currentSelection: currentRecipe,
   });