wip
This commit is contained in:
		
							parent
							
								
									74f1090cb0
								
							
						
					
					
						commit
						52840faa85
					
				
					 1 changed files with 34 additions and 4 deletions
				
			
		| 
						 | 
					@ -4,6 +4,8 @@ import { api } from './os';
 | 
				
			||||||
import { get, set } from './scripts/idb-proxy';
 | 
					import { get, set } from './scripts/idb-proxy';
 | 
				
			||||||
import { defaultStore } from './store';
 | 
					import { defaultStore } from './store';
 | 
				
			||||||
import { stream } from './stream';
 | 
					import { stream } from './stream';
 | 
				
			||||||
 | 
					// SafariがBroadcastChannel未実装なのでライブラリを使う
 | 
				
			||||||
 | 
					import { BroadcastChannel } from 'broadcast-channel';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
type StateDef = Record<string, {
 | 
					type StateDef = Record<string, {
 | 
				
			||||||
	where: 'account' | 'device' | 'deviceAccount';
 | 
						where: 'account' | 'device' | 'deviceAccount';
 | 
				
			||||||
| 
						 | 
					@ -15,6 +17,13 @@ type ReactiveState<T extends StateDef> = { [K in keyof T]: Ref<T[K]['default']>;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
type ArrayElement<A> = A extends readonly (infer T)[] ? T : never;
 | 
					type ArrayElement<A> = A extends readonly (infer T)[] ? T : never;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					type PizzaxChannelMessage<T extends StateDef> = {
 | 
				
			||||||
 | 
						where: 'device' | 'deviceAccount';
 | 
				
			||||||
 | 
						key: keyof T;
 | 
				
			||||||
 | 
						value: T[keyof T];
 | 
				
			||||||
 | 
						userId?: string;
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const connection = $i && stream.useChannel('main');
 | 
					const connection = $i && stream.useChannel('main');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export class Storage<T extends StateDef> {
 | 
					export class Storage<T extends StateDef> {
 | 
				
			||||||
| 
						 | 
					@ -22,9 +31,9 @@ export class Storage<T extends StateDef> {
 | 
				
			||||||
	public readonly loaded: Promise<void>;
 | 
						public readonly loaded: Promise<void>;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public readonly key: string;
 | 
						public readonly key: string;
 | 
				
			||||||
	public readonly deviceStateKeyName: string;
 | 
						public readonly deviceStateKeyName: `pizzax::${this['key']}`;
 | 
				
			||||||
	public readonly deviceAccountStateKeyName: string;
 | 
						public readonly deviceAccountStateKeyName: `pizzax::${this['key']}::${string}` | '';
 | 
				
			||||||
	public readonly registryCacheKeyName: string;
 | 
						public readonly registryCacheKeyName: `pizzax::${this['key']}::cache::${string}` | '';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public readonly def: T;
 | 
						public readonly def: T;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -32,6 +41,8 @@ export class Storage<T extends StateDef> {
 | 
				
			||||||
	public readonly state = {} as State<T>;
 | 
						public readonly state = {} as State<T>;
 | 
				
			||||||
	public readonly reactiveState = {} as ReactiveState<T>;
 | 
						public readonly reactiveState = {} as ReactiveState<T>;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						private pizzaxChannel: BroadcastChannel<PizzaxChannelMessage<T>>;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	// 簡易的にキューイングして占有ロックとする
 | 
						// 簡易的にキューイングして占有ロックとする
 | 
				
			||||||
	private currentIdbJob: Promise<any> = Promise.resolve();
 | 
						private currentIdbJob: Promise<any> = Promise.resolve();
 | 
				
			||||||
	private addIdbSetJob<T>(job: () => Promise<T>) {
 | 
						private addIdbSetJob<T>(job: () => Promise<T>) {
 | 
				
			||||||
| 
						 | 
					@ -50,6 +61,8 @@ export class Storage<T extends StateDef> {
 | 
				
			||||||
		this.registryCacheKeyName = $i ? `pizzax::${key}::cache::${$i.id}` : '';
 | 
							this.registryCacheKeyName = $i ? `pizzax::${key}::cache::${$i.id}` : '';
 | 
				
			||||||
		this.def = def;
 | 
							this.def = def;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
							this.pizzaxChannel = new BroadcastChannel(`pizzax::${key}`);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		this.ready = this.init();
 | 
							this.ready = this.init();
 | 
				
			||||||
		this.loaded = this.ready.then(() => this.load());
 | 
							this.loaded = this.ready.then(() => this.load());
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
| 
						 | 
					@ -77,6 +90,12 @@ export class Storage<T extends StateDef> {
 | 
				
			||||||
			this.reactiveState[k] = ref(v);
 | 
								this.reactiveState[k] = ref(v);
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
							this.pizzaxChannel.addEventListener('message', ({ where, key, value, userId }) => {
 | 
				
			||||||
 | 
								if (where === 'deviceAccount' && !($i && userId !== $i.id)) return;
 | 
				
			||||||
 | 
								this.state[key] = value;
 | 
				
			||||||
 | 
								this.reactiveState[key].value = value;
 | 
				
			||||||
 | 
							});
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		if ($i) {
 | 
							if ($i) {
 | 
				
			||||||
			// streamingのuser storage updateイベントを監視して更新
 | 
								// streamingのuser storage updateイベントを監視して更新
 | 
				
			||||||
			connection?.on('registryUpdated', ({ scope, key, value }: { scope?: string[], key: keyof T, value: T[typeof key]['default'] }) => {
 | 
								connection?.on('registryUpdated', ({ scope, key, value }: { scope?: string[], key: keyof T, value: T[typeof key]['default'] }) => {
 | 
				
			||||||
| 
						 | 
					@ -141,6 +160,11 @@ export class Storage<T extends StateDef> {
 | 
				
			||||||
			if (_DEV_) console.log(`set ${key} start`);
 | 
								if (_DEV_) console.log(`set ${key} start`);
 | 
				
			||||||
			switch (this.def[key].where) {
 | 
								switch (this.def[key].where) {
 | 
				
			||||||
				case 'device': {
 | 
									case 'device': {
 | 
				
			||||||
 | 
										this.pizzaxChannel.postMessage({
 | 
				
			||||||
 | 
											where: 'device',
 | 
				
			||||||
 | 
											key,
 | 
				
			||||||
 | 
											value: rawValue,
 | 
				
			||||||
 | 
										});
 | 
				
			||||||
					const deviceState = await get(this.deviceStateKeyName) || {};
 | 
										const deviceState = await get(this.deviceStateKeyName) || {};
 | 
				
			||||||
					deviceState[key] = rawValue;
 | 
										deviceState[key] = rawValue;
 | 
				
			||||||
					await set(this.deviceStateKeyName, deviceState);
 | 
										await set(this.deviceStateKeyName, deviceState);
 | 
				
			||||||
| 
						 | 
					@ -148,6 +172,12 @@ export class Storage<T extends StateDef> {
 | 
				
			||||||
				}
 | 
									}
 | 
				
			||||||
				case 'deviceAccount': {
 | 
									case 'deviceAccount': {
 | 
				
			||||||
					if ($i == null) break;
 | 
										if ($i == null) break;
 | 
				
			||||||
 | 
										this.pizzaxChannel.postMessage({
 | 
				
			||||||
 | 
											where: 'deviceAccount',
 | 
				
			||||||
 | 
											key,
 | 
				
			||||||
 | 
											value: rawValue,
 | 
				
			||||||
 | 
											userId: $i.id,
 | 
				
			||||||
 | 
										});
 | 
				
			||||||
					const deviceAccountState = await get(this.deviceAccountStateKeyName) || {};
 | 
										const deviceAccountState = await get(this.deviceAccountStateKeyName) || {};
 | 
				
			||||||
					deviceAccountState[key] = rawValue;
 | 
										deviceAccountState[key] = rawValue;
 | 
				
			||||||
					await set(this.deviceAccountStateKeyName, deviceAccountState);
 | 
										await set(this.deviceAccountStateKeyName, deviceAccountState);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue