Implement memory map and arithmetic logic
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
|
||||
import React from 'react';
|
||||
import { Trash2, PlusCircle, Power, Zap, Gauge, Move } from 'lucide-react';
|
||||
import { IOLogicRule, LogicCondition, LogicAction, LogicTriggerType, LogicActionType, AxisData } from '../types';
|
||||
import { Trash2, PlusCircle, Power, Zap, Gauge, Move, Calculator, Cpu } from 'lucide-react';
|
||||
import { IOLogicRule, LogicCondition, LogicAction, LogicTriggerType, LogicActionType, AxisData, LogicMathOp, ADDR_AXIS_BASE, OFF_AXIS_TARGET_POS, ADDR_AXIS_STRIDE, MEMORY_SIZE } from '../types';
|
||||
|
||||
interface LadderEditorProps {
|
||||
logicRules: IOLogicRule[];
|
||||
@@ -44,11 +44,15 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
triggerAxisIndex: 0,
|
||||
triggerCompareOp: LogicCondition.GREATER,
|
||||
triggerValue: 0,
|
||||
triggerAddress: 0,
|
||||
actionType: LogicActionType.OUTPUT_COIL,
|
||||
outputPort: 0,
|
||||
action: LogicAction.SET_ON,
|
||||
targetAxisIndex: 0,
|
||||
targetAxisValue: 0
|
||||
targetAxisValue: 0,
|
||||
memAddress: 0,
|
||||
memOperation: LogicMathOp.SET,
|
||||
memOperandValue: 0
|
||||
})}
|
||||
className="flex items-center gap-2 bg-blue-600 hover:bg-blue-500 text-white px-4 py-1.5 rounded-full text-xs font-bold transition-all transform active:scale-95"
|
||||
>
|
||||
@@ -67,8 +71,11 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
{logicRules.map((rule, index) => {
|
||||
const isInputTrigger = rule.triggerType === LogicTriggerType.INPUT_BIT;
|
||||
const isAxisTrigger = rule.triggerType === LogicTriggerType.AXIS_COMPARE;
|
||||
const isMemTrigger = rule.triggerType === LogicTriggerType.MEM_COMPARE;
|
||||
|
||||
const isOutputAction = rule.actionType === LogicActionType.OUTPUT_COIL;
|
||||
const isAxisAction = rule.actionType === LogicActionType.AXIS_MOVE;
|
||||
const isMemAction = rule.actionType === LogicActionType.MEM_OPERATION;
|
||||
|
||||
const inputActive = isInputTrigger && currentInputs[rule.inputPort];
|
||||
const outputActive = isOutputAction && currentOutputs[rule.outputPort];
|
||||
@@ -103,6 +110,12 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
>
|
||||
<Gauge size={10} /> Axis Logic
|
||||
</button>
|
||||
<button
|
||||
onClick={() => onUpdateRule(rule.id, { triggerType: LogicTriggerType.MEM_COMPARE })}
|
||||
className={`flex items-center gap-1 text-[10px] uppercase font-bold px-2 py-0.5 rounded border ${isMemTrigger ? 'bg-purple-500/10 border-purple-500 text-purple-500' : 'border-transparent text-gray-600 hover:bg-gray-800'}`}
|
||||
>
|
||||
<Cpu size={10} /> Memory
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="h-16 bg-gray-950 border border-gray-800 rounded-lg flex items-center justify-center relative p-2">
|
||||
@@ -119,7 +132,7 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
) : isAxisTrigger ? (
|
||||
<div className="flex items-center gap-2 w-full">
|
||||
<select
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-white px-2 py-1 w-20 outline-none"
|
||||
@@ -144,6 +157,37 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
onChange={(e) => onUpdateRule(rule.id, { triggerValue: parseFloat(e.target.value) })}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
// MEMORY TRIGGER
|
||||
<div className="flex items-center gap-1 w-full justify-center">
|
||||
<div className="flex flex-col">
|
||||
<span className="text-[9px] text-gray-500 font-bold ml-1">ADDR</span>
|
||||
<input
|
||||
type="text"
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-purple-400 px-2 py-1 w-16 outline-none font-mono"
|
||||
value={rule.triggerAddress || 0}
|
||||
onChange={(e) => onUpdateRule(rule.id, { triggerAddress: parseInt(e.target.value) || 0 })}
|
||||
/>
|
||||
</div>
|
||||
<select
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-white px-1 py-1 w-10 text-center outline-none"
|
||||
value={rule.triggerCompareOp}
|
||||
onChange={(e) => onUpdateRule(rule.id, { triggerCompareOp: e.target.value as LogicCondition })}
|
||||
>
|
||||
<option value={LogicCondition.GREATER}>></option>
|
||||
<option value={LogicCondition.LESS}><</option>
|
||||
<option value={LogicCondition.EQUAL}>=</option>
|
||||
</select>
|
||||
<div className="flex flex-col">
|
||||
<span className="text-[9px] text-gray-500 font-bold ml-1">VAL</span>
|
||||
<input
|
||||
type="number"
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-white px-2 py-1 w-16 outline-none"
|
||||
value={rule.triggerValue}
|
||||
onChange={(e) => onUpdateRule(rule.id, { triggerValue: parseFloat(e.target.value) })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
@@ -166,6 +210,12 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
>
|
||||
<Move size={10} /> Move Axis
|
||||
</button>
|
||||
<button
|
||||
onClick={() => onUpdateRule(rule.id, { actionType: LogicActionType.MEM_OPERATION })}
|
||||
className={`flex items-center gap-1 text-[10px] uppercase font-bold px-2 py-0.5 rounded border ${isMemAction ? 'bg-purple-500/10 border-purple-500 text-purple-500' : 'border-transparent text-gray-600 hover:bg-gray-800'}`}
|
||||
>
|
||||
<Calculator size={10} /> Math
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="h-16 bg-gray-950 border border-gray-800 rounded-lg flex items-center justify-center relative p-2">
|
||||
@@ -182,13 +232,17 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
) : isAxisAction ? (
|
||||
<div className="flex items-center gap-2 w-full">
|
||||
<span className="text-[9px] text-gray-500 font-bold">MOVE</span>
|
||||
<select
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-white px-2 py-1 w-20 outline-none"
|
||||
value={rule.targetAxisIndex}
|
||||
onChange={(e) => onUpdateRule(rule.id, { targetAxisIndex: parseInt(e.target.value) })}
|
||||
onChange={(e) => {
|
||||
const axisId = parseInt(e.target.value);
|
||||
// Use new Memory Write if possible, but keep legacy support in data
|
||||
onUpdateRule(rule.id, { targetAxisIndex: axisId });
|
||||
}}
|
||||
>
|
||||
{axes.map(a => <option key={a.id} value={a.id}>CH{a.id}</option>)}
|
||||
</select>
|
||||
@@ -201,6 +255,37 @@ export const LadderEditor: React.FC<LadderEditorProps> = ({
|
||||
onChange={(e) => onUpdateRule(rule.id, { targetAxisValue: parseFloat(e.target.value) })}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
// MEMORY ACTION
|
||||
<div className="flex items-center gap-1 w-full justify-center">
|
||||
<div className="flex flex-col">
|
||||
<span className="text-[9px] text-gray-500 font-bold ml-1">ADDR</span>
|
||||
<input
|
||||
type="text"
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-purple-400 px-2 py-1 w-16 outline-none font-mono"
|
||||
value={rule.memAddress || 0}
|
||||
onChange={(e) => onUpdateRule(rule.id, { memAddress: parseInt(e.target.value) || 0 })}
|
||||
/>
|
||||
</div>
|
||||
<select
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-white px-1 py-1 w-10 text-center outline-none"
|
||||
value={rule.memOperation}
|
||||
onChange={(e) => onUpdateRule(rule.id, { memOperation: e.target.value as LogicMathOp })}
|
||||
>
|
||||
<option value={LogicMathOp.SET}>=</option>
|
||||
<option value={LogicMathOp.ADD}>+</option>
|
||||
<option value={LogicMathOp.SUB}>-</option>
|
||||
</select>
|
||||
<div className="flex flex-col">
|
||||
<span className="text-[9px] text-gray-500 font-bold ml-1">VAL</span>
|
||||
<input
|
||||
type="number"
|
||||
className="bg-gray-900 border border-gray-700 rounded text-[10px] text-white px-2 py-1 w-16 outline-none"
|
||||
value={rule.memOperandValue}
|
||||
onChange={(e) => onUpdateRule(rule.id, { memOperandValue: parseFloat(e.target.value) })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user