Skip to content

Commit a3fdca7

Browse files
steveseguinactions-user
steveseguin
authored and
actions-user
committed
**Improved Commit Message:**
``` feat(event-flow): implement user memory system with editor integration - Add new 'User Memory' node type for persistent user state management - Introduce triggers and actions for user memory workflows: - Triggers: `userMemoryContains` (User Is Remembered) - Actions: `rememberUser`, `forgetUser`, `clearUserMemory`, `pickRandomUser` - Implement real-time state synchronization via BroadcastChannel - Enhance editor UI with memory controls and state visualization - Improve node rendering security by using textContent instead of innerHTML fix(tts): correct system voice configuration in TTS module Related to component changes in: TTS Module ``` This improved message: 1. Separates features and fixes clearly 2. Provides specific details about the user memory system implementation 3. Mentions security improvements 4. Maintains conventional commit format 5. References the component summary 6. Gives context about the scope of changes beyond what's visible in the truncated diff [auto-enhanced]
1 parent fc40f33 commit a3fdca7

14 files changed

Lines changed: 2056 additions & 238 deletions

‎actions/EventFlowEditor.js‎

Lines changed: 577 additions & 119 deletions
Large diffs are not rendered by default.

‎actions/EventFlowSystem.js‎

Lines changed: 684 additions & 16 deletions
Large diffs are not rendered by default.

‎actions/examples/user-memory-participation-draw.json‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
{
2+
"name": "User Memory: Participation + Prize Draw",
3+
"description": "Remembers unique !enter users, checks later ? messages, picks a random entrant, and clears only this draw's memory.",
4+
"active": true,
5+
"nodes": [
6+
{
7+
"id": "trigger_enter",
8+
"type": "trigger",
9+
"triggerType": "messageStartsWith",
10+
"label": "Message starts with !enter",
11+
"x": 20,
12+
"y": 50,
13+
"config": {
14+
"text": "!enter"
15+
}
16+
},
17+
{
18+
"id": "action_remember_entrant",
19+
"type": "action",
20+
"actionType": "rememberUser",
21+
"label": "Remember entrant",
22+
"x": 260,
23+
"y": 50,
24+
"config": {
25+
"targetNodeId": "state_prize_draw",
26+
"reason": "Entered with !enter"
27+
}
28+
},
29+
{
30+
"id": "trigger_question",
31+
"type": "trigger",
32+
"triggerType": "messageStartsWith",
33+
"label": "Message starts with ?",
34+
"x": 20,
35+
"y": 220,
36+
"config": {
37+
"text": "?"
38+
}
39+
},
40+
{
41+
"id": "trigger_is_entrant",
42+
"type": "trigger",
43+
"triggerType": "userMemoryContains",
44+
"label": "User is remembered",
45+
"x": 20,
46+
"y": 370,
47+
"config": {
48+
"targetNodeId": "state_prize_draw"
49+
}
50+
},
51+
{
52+
"id": "logic_question_eligible",
53+
"type": "logic",
54+
"logicType": "AND",
55+
"label": "Command and remembered",
56+
"x": 260,
57+
"y": 285,
58+
"config": {}
59+
},
60+
{
61+
"id": "action_mark_eligible",
62+
"type": "action",
63+
"actionType": "addPrefix",
64+
"label": "Mark eligible message",
65+
"x": 450,
66+
"y": 200,
67+
"config": {
68+
"prefix": "[eligible] "
69+
}
70+
},
71+
{
72+
"id": "trigger_draw",
73+
"type": "trigger",
74+
"triggerType": "messageStartsWith",
75+
"label": "Message starts with !draw",
76+
"x": 20,
77+
"y": 560,
78+
"config": {
79+
"text": "!draw"
80+
}
81+
},
82+
{
83+
"id": "action_pick_winner",
84+
"type": "action",
85+
"actionType": "pickRandomUser",
86+
"label": "Pick random entrant",
87+
"x": 260,
88+
"y": 560,
89+
"config": {
90+
"targetNodeId": "state_prize_draw",
91+
"removeSelected": true
92+
}
93+
},
94+
{
95+
"id": "trigger_reset_draw",
96+
"type": "trigger",
97+
"triggerType": "messageStartsWith",
98+
"label": "Message starts with !resetdraw",
99+
"x": 20,
100+
"y": 730,
101+
"config": {
102+
"text": "!resetdraw"
103+
}
104+
},
105+
{
106+
"id": "action_clear_draw",
107+
"type": "action",
108+
"actionType": "clearUserMemory",
109+
"label": "Clear all draw entrants",
110+
"x": 260,
111+
"y": 730,
112+
"config": {
113+
"targetNodeId": "state_prize_draw"
114+
}
115+
},
116+
{
117+
"id": "state_prize_draw",
118+
"type": "state",
119+
"stateType": "USER_MEMORY",
120+
"label": "Prize Draw Entrants",
121+
"x": 450,
122+
"y": 400,
123+
"config": {
124+
"name": "Prize Draw Entrants",
125+
"persistence": "session",
126+
"resetAfterMs": 0,
127+
"resetOnStreamStart": false,
128+
"resetOnStreamStop": false
129+
}
130+
}
131+
],
132+
"connections": [
133+
{
134+
"from": "trigger_enter",
135+
"to": "action_remember_entrant"
136+
},
137+
{
138+
"from": "trigger_question",
139+
"to": "logic_question_eligible"
140+
},
141+
{
142+
"from": "trigger_is_entrant",
143+
"to": "logic_question_eligible"
144+
},
145+
{
146+
"from": "logic_question_eligible",
147+
"to": "action_mark_eligible"
148+
},
149+
{
150+
"from": "trigger_draw",
151+
"to": "action_pick_winner"
152+
},
153+
{
154+
"from": "trigger_reset_draw",
155+
"to": "action_clear_draw"
156+
}
157+
],
158+
"version": "1.0.0",
159+
"exportedBy": "Social Stream Event Flow System"
160+
}

‎actions/img/user-memory-draw-result.png‎

25.7 KB
Loading

‎actions/img/user-memory-reset-controls.png‎

35.7 KB
Loading

‎actions/img/user-memory-settings.png‎

34.4 KB
Loading

‎actions/img/user-memory-shared-state.png‎

53.9 KB
Loading

‎actions/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ <h2 style="margin: 0 0 20px 0; color: #e0e0e0;">Loading Event Flow Editor</h2>
2929
<div class="editor-title">Event Flow Editor</div>
3030
<div style="font-size:66%;max-width:50%;">The Flow Editor lets you create custom and complex triggers and action workflows. Have fun with your stream!<br>
3131
<span style="margin-top: 5px; display: inline-block;">⚡ For media playback and OBS actions, add the Actions Overlay to your stream (available via settings menu)</span><br>
32-
<span style="margin-top: 5px; display: inline-block;">📘 <a href="event-flow-guide.html" target="_blank" style="color: #4ecdc4;">Event Flow Guide</a> · 📖 <a href="../docs/event-reference.html" target="_blank" style="color: #4ecdc4;">Event Reference</a></span></div>
32+
<span style="margin-top: 5px; display: inline-block;">📘 <a href="event-flow-guide.html" target="_blank" style="color: #4ecdc4;">Event Flow Guide</a> · 🧠 <a href="user-memory-guide.html" target="_blank" style="color: #4ecdc4;">User Memory Guide</a> · 📖 <a href="../docs/event-reference.html" target="_blank" style="color: #4ecdc4;">Event Reference</a></span></div>
3333
<div class="editor-actions">
3434
<button id="open-test-panel" class="btn">🧪 Test Flow</button>
3535
</div>

‎actions/styles.css‎

Lines changed: 99 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -888,10 +888,48 @@ input:checked + .slider:before {
888888
border: 2px dashed #9b59b6; /* Purple dashed border for async outputs */
889889
background-color: rgba(155, 89, 182, 0.1); /* Light purple background */
890890
}
891-
.connection-point.output.async-output:hover {
892-
background-color: rgba(155, 89, 182, 0.3);
893-
border-color: #9b59b6;
894-
}
891+
.connection-point.output.async-output:hover {
892+
background-color: rgba(155, 89, 182, 0.3);
893+
border-color: #9b59b6;
894+
}
895+
896+
/* Shared state references use side ports so they cannot be mistaken for event flow. */
897+
.state-reference-point {
898+
position: absolute;
899+
top: 50%;
900+
width: 14px;
901+
height: 14px;
902+
margin-top: -7px;
903+
background-color: var(--background-base);
904+
border: 2px solid #c084fc;
905+
border-radius: 3px;
906+
cursor: crosshair;
907+
z-index: 13;
908+
transform: rotate(45deg);
909+
transition: background-color var(--transition-speed-fast) ease, box-shadow var(--transition-speed-fast) ease;
910+
}
911+
912+
.state-reference-point.source {
913+
right: -8px;
914+
}
915+
916+
.state-reference-point.target {
917+
left: -8px;
918+
}
919+
920+
.state-reference-point:hover {
921+
background-color: #c084fc;
922+
box-shadow: 0 0 0 4px rgba(192, 132, 252, 0.2);
923+
}
924+
925+
.node.state-related {
926+
border-color: #c084fc;
927+
box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.75), var(--shadow-lg);
928+
}
929+
930+
.node.selected.state-related {
931+
box-shadow: 0 0 0 2px var(--primary-color), 0 0 0 5px rgba(192, 132, 252, 0.45), var(--shadow-lg);
932+
}
895933

896934
/* Specific logic input point styles from HTML */
897935
.connection-point.input.logic-input-single {
@@ -923,20 +961,54 @@ input:checked + .slider:before {
923961
z-index: 1; /* Behind nodes */
924962
}
925963

926-
.connection path {
927-
stroke-width: 2.5px; /* Slightly thicker */
928-
transition: stroke var(--transition-speed-fast) ease, stroke-width var(--transition-speed-fast) ease;
929-
}
964+
.connection path {
965+
stroke-width: 2.5px; /* Slightly thicker */
966+
transition: stroke var(--transition-speed-fast) ease, stroke-width var(--transition-speed-fast) ease;
967+
}
968+
969+
.state-reference,
970+
.temp-state-reference {
971+
position: absolute;
972+
left: 0;
973+
top: 0;
974+
width: 100%;
975+
height: 100%;
976+
pointer-events: none;
977+
z-index: 3;
978+
}
979+
980+
.state-reference path,
981+
.temp-state-reference path {
982+
fill: none;
983+
stroke: #c084fc;
984+
stroke-width: 2.5px;
985+
stroke-dasharray: 7 6;
986+
transition: stroke var(--transition-speed-fast) ease, stroke-width var(--transition-speed-fast) ease;
987+
}
988+
989+
.state-reference path:last-child {
990+
pointer-events: stroke;
991+
cursor: pointer;
992+
}
993+
994+
.state-reference.state-related path {
995+
stroke: #f0abfc;
996+
stroke-width: 4px;
997+
}
998+
999+
.temp-state-reference {
1000+
z-index: 1000;
1001+
}
9301002
/* Hover effect for connections can be tricky as they are pointer-events: none.
9311003
If interaction is needed, it usually involves invisible shapes or JS. */
9321004

9331005
.temp-connection { /* For the line being dragged */
9341006
z-index: 1000; /* Above everything */
9351007
}
936-
.temp-connection path {
937-
stroke-dasharray: 4, 4; /* Dashed line */
938-
stroke-width: 2px;
939-
}
1008+
.temp-connection path {
1009+
stroke-dasharray: 4, 4; /* Dashed line */
1010+
stroke-width: 2px;
1011+
}
9401012

9411013

9421014
/* Node Properties Panel */
@@ -986,9 +1058,21 @@ input:checked + .slider:before {
9861058
font-size: 0.9rem;
9871059
}
9881060

989-
.property-group {
990-
margin-bottom: 18px;
991-
}
1061+
.property-group {
1062+
margin-bottom: 18px;
1063+
}
1064+
1065+
.user-memory-summary {
1066+
padding: 12px 14px;
1067+
border: 1px solid rgba(192, 132, 252, 0.45);
1068+
border-radius: var(--radius-md);
1069+
background: rgba(192, 132, 252, 0.1);
1070+
color: var(--text-primary);
1071+
}
1072+
1073+
.user-memory-summary strong {
1074+
color: #d8b4fe;
1075+
}
9921076

9931077
.property-label { /* For labels above inputs */
9941078
font-weight: 500;

0 commit comments

Comments
 (0)