@cntrl-site/sdk-nextjs 1.9.13-2 → 1.9.13-4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -8,6 +8,7 @@ class InteractionsRegistry {
|
|
|
8
8
|
var _a;
|
|
9
9
|
this.ctrls = new Map();
|
|
10
10
|
this.items = this.unpackItems(article);
|
|
11
|
+
this.layoutId = layoutId;
|
|
11
12
|
const interactions = (_a = article.interactions[layoutId]) !== null && _a !== void 0 ? _a : [];
|
|
12
13
|
const activeStatesIds = interactions.reduce((map, inter) => {
|
|
13
14
|
var _a;
|
|
@@ -145,53 +146,62 @@ class InteractionsRegistry {
|
|
|
145
146
|
// }
|
|
146
147
|
}
|
|
147
148
|
notifyScroll(position) {
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
149
|
+
var _a, _b, _c;
|
|
150
|
+
const timestamp = Date.now();
|
|
151
|
+
const item = this.items.find((item) => item.id === 'FYUIEGBF');
|
|
152
|
+
const testtop = item.area[this.layoutId].top;
|
|
153
|
+
for (const interaction of this.interactions) {
|
|
154
|
+
const currentStateId = this.getCurrentStateByInteractionId(interaction.id);
|
|
155
|
+
const activeStateId = (_a = interaction.states.find((state) => state.id !== interaction.startStateId)) === null || _a === void 0 ? void 0 : _a.id;
|
|
156
|
+
const matchingTrigger = interaction.triggers.find((trigger) => {
|
|
157
|
+
if (!('position' in trigger) || testtop === 0)
|
|
158
|
+
return false;
|
|
159
|
+
const triggerPosition = testtop * window.innerWidth;
|
|
160
|
+
const isScrolledPastTrigger = triggerPosition < position;
|
|
161
|
+
if (!isScrolledPastTrigger && !trigger.isReverse)
|
|
162
|
+
return false;
|
|
163
|
+
const stateId = isScrolledPastTrigger ? trigger.from : trigger.to;
|
|
164
|
+
return stateId === currentStateId;
|
|
165
|
+
});
|
|
166
|
+
if (!matchingTrigger || !('position' in matchingTrigger) || !activeStateId)
|
|
167
|
+
continue;
|
|
168
|
+
const triggerPosition = testtop * window.innerWidth;
|
|
169
|
+
const isScrolledPastTrigger = triggerPosition < position;
|
|
170
|
+
const targetStateId = isScrolledPastTrigger ? matchingTrigger.to : matchingTrigger.from;
|
|
171
|
+
this.setCurrentStateForInteraction(interaction.id, targetStateId);
|
|
172
|
+
const transitioningItems = (_b = this.stateItemsIdsMap[activeStateId]) !== null && _b !== void 0 ? _b : [];
|
|
173
|
+
const state = interaction.states.find((state) => state.id === targetStateId);
|
|
174
|
+
const actions = (_c = state === null || state === void 0 ? void 0 : state.actions) !== null && _c !== void 0 ? _c : [];
|
|
175
|
+
for (const action of actions) {
|
|
176
|
+
const ctrl = this.ctrls.get(action.itemId);
|
|
177
|
+
if (!ctrl)
|
|
178
|
+
continue;
|
|
179
|
+
ctrl.receiveAction(action.type);
|
|
180
|
+
}
|
|
181
|
+
const itemsStages = this.itemsStages.map((stage) => {
|
|
182
|
+
if (stage.interactionId !== interaction.id)
|
|
183
|
+
return stage;
|
|
184
|
+
const newStage = {
|
|
185
|
+
itemId: stage.itemId,
|
|
186
|
+
interactionId: stage.interactionId,
|
|
187
|
+
type: 'transitioning',
|
|
188
|
+
from: stage.type === 'transitioning' ? stage.to : stage.stateId,
|
|
189
|
+
to: targetStateId,
|
|
190
|
+
direction: targetStateId === activeStateId ? 'in' : 'out',
|
|
191
|
+
updated: timestamp
|
|
192
|
+
};
|
|
193
|
+
return newStage;
|
|
194
|
+
});
|
|
195
|
+
this.itemsStages = itemsStages;
|
|
196
|
+
const itemsToNotify = new Set(transitioningItems);
|
|
197
|
+
for (const trigger of interaction.triggers) {
|
|
198
|
+
if (!('itemId' in trigger))
|
|
199
|
+
continue;
|
|
200
|
+
itemsToNotify.add(trigger.itemId);
|
|
201
|
+
}
|
|
202
|
+
this.notifyItemCtrlsChange(Array.from(itemsToNotify));
|
|
203
|
+
this.notifyTransitionStartForItems(transitioningItems, activeStateId);
|
|
204
|
+
}
|
|
195
205
|
}
|
|
196
206
|
notifyItemTrigger(itemId, triggerType) {
|
|
197
207
|
// const timestamp = Date.now();
|
package/package.json
CHANGED
|
@@ -11,6 +11,7 @@ import { isItemType } from '../utils/isItemType';
|
|
|
11
11
|
export class InteractionsRegistry implements InteractionsRegistryPort {
|
|
12
12
|
private ctrls: Map<ItemId, ItemInteractionCtrl> = new Map();
|
|
13
13
|
private items: ItemAny[];
|
|
14
|
+
private layoutId: string;
|
|
14
15
|
private interactions: Interaction[];
|
|
15
16
|
private stateItemsIdsMap: StateItemsIdsMap;
|
|
16
17
|
private interactionStateMap: InteractionStateMap;
|
|
@@ -19,6 +20,7 @@ export class InteractionsRegistry implements InteractionsRegistryPort {
|
|
|
19
20
|
|
|
20
21
|
constructor(article: Article, layoutId: string) {
|
|
21
22
|
this.items = this.unpackItems(article);
|
|
23
|
+
this.layoutId = layoutId;
|
|
22
24
|
const interactions = article.interactions[layoutId] ?? [];
|
|
23
25
|
const activeStatesIds = interactions.reduce<StateId[]>((map, inter) => {
|
|
24
26
|
const activeStateId = inter.states.find((state) => state.id !== inter.startStateId)?.id;
|
|
@@ -156,53 +158,55 @@ export class InteractionsRegistry implements InteractionsRegistryPort {
|
|
|
156
158
|
}
|
|
157
159
|
|
|
158
160
|
notifyScroll(position: number) {
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
161
|
+
const timestamp = Date.now();
|
|
162
|
+
const item = this.items.find((item) => item.id === 'FYUIEGBF')!;
|
|
163
|
+
const testtop = item.area[this.layoutId].top;
|
|
164
|
+
for (const interaction of this.interactions) {
|
|
165
|
+
const currentStateId = this.getCurrentStateByInteractionId(interaction.id);
|
|
166
|
+
const activeStateId = interaction.states.find((state) => state.id !== interaction.startStateId)?.id;
|
|
167
|
+
const matchingTrigger = interaction.triggers.find((trigger) => {
|
|
168
|
+
if (!('position' in trigger) || testtop === 0) return false;
|
|
169
|
+
const triggerPosition = testtop * window.innerWidth;
|
|
170
|
+
const isScrolledPastTrigger = triggerPosition < position;
|
|
171
|
+
if (!isScrolledPastTrigger && !trigger.isReverse) return false;
|
|
172
|
+
const stateId = isScrolledPastTrigger ? trigger.from : trigger.to;
|
|
173
|
+
return stateId === currentStateId;
|
|
174
|
+
});
|
|
175
|
+
if (!matchingTrigger || !('position' in matchingTrigger) || !activeStateId) continue;
|
|
176
|
+
const triggerPosition = testtop * window.innerWidth;
|
|
177
|
+
const isScrolledPastTrigger = triggerPosition < position;
|
|
178
|
+
const targetStateId = isScrolledPastTrigger ? matchingTrigger.to : matchingTrigger.from;
|
|
179
|
+
this.setCurrentStateForInteraction(interaction.id, targetStateId);
|
|
180
|
+
const transitioningItems = this.stateItemsIdsMap[activeStateId] ?? [];
|
|
181
|
+
const state = interaction.states.find((state) => state.id === targetStateId);
|
|
182
|
+
const actions = state?.actions ?? [];
|
|
183
|
+
for (const action of actions) {
|
|
184
|
+
const ctrl = this.ctrls.get(action.itemId);
|
|
185
|
+
if (!ctrl) continue;
|
|
186
|
+
ctrl.receiveAction(action.type);
|
|
187
|
+
}
|
|
188
|
+
const itemsStages = this.itemsStages.map((stage) => {
|
|
189
|
+
if (stage.interactionId !== interaction.id) return stage;
|
|
190
|
+
const newStage = {
|
|
191
|
+
itemId: stage.itemId,
|
|
192
|
+
interactionId: stage.interactionId,
|
|
193
|
+
type: 'transitioning' as const,
|
|
194
|
+
from: stage.type === 'transitioning' ? stage.to : stage.stateId!,
|
|
195
|
+
to: targetStateId,
|
|
196
|
+
direction: targetStateId === activeStateId ? 'in' as const : 'out' as const,
|
|
197
|
+
updated: timestamp
|
|
198
|
+
};
|
|
199
|
+
return newStage;
|
|
200
|
+
});
|
|
201
|
+
this.itemsStages = itemsStages;
|
|
202
|
+
const itemsToNotify = new Set<ItemId>(transitioningItems);
|
|
203
|
+
for (const trigger of interaction.triggers) {
|
|
204
|
+
if (!('itemId' in trigger)) continue;
|
|
205
|
+
itemsToNotify.add(trigger.itemId);
|
|
206
|
+
}
|
|
207
|
+
this.notifyItemCtrlsChange(Array.from(itemsToNotify));
|
|
208
|
+
this.notifyTransitionStartForItems(transitioningItems, activeStateId);
|
|
209
|
+
}
|
|
206
210
|
}
|
|
207
211
|
|
|
208
212
|
notifyItemTrigger(itemId: string, triggerType: TriggerType): void {
|