@onetype/framework 2.0.42 → 2.0.43

package/addons/render/pages/front/functions/change.js

@@ -1,119 +1,30 @@
-pages.Fn('change', function(target, parameters = {}, options = {})
+pages.Fn('change', async function(id, path = null, parameters = {}, push = true, search = '')
 {
-    this.resolve = null;
-    this.page = null;
-    this.id = null;
-    this.parameters = parameters;
-    this.options = options;
+	this.methods.route = (page) =>
+	{
+		const route = page.Get('route');
 
-    this.methods.init = async (resolve) =>
-    {
-        this.resolve = resolve;
+		if(!Array.isArray(route))
+		{
+			return route;
+		}
 
-        if(this.options.path)
-        {
-            this.methods.match();
-        }
-        else
-        {
-            this.page = this.ItemGet(target);
-            this.id = target;
-        }
+		return route.findLast(pattern => (pattern.match(/:(\w+)/g) || []).every(param => Object.keys(parameters).includes(param.slice(1)))) || route[0];
+	};
 
-        if(!this.page)
-        {
-            // Try to find a 404 page
-            const notFoundPage = Object.values(this.Items()).find(p => p.Get('404'));
+	const resolved = this.Fn('resolve', id, path, parameters);
 
-            if(notFoundPage)
-            {
-                this.page = notFoundPage;
-                this.id = notFoundPage.Get('id');
-            }
-            else
-            {
-                return this.methods.done(null, `Page "${target}" not found.`, 404);
-            }
-        }
+	if(!resolved)
+	{
+		return null;
+	}
 
-        const route = this.page.Get('route');
-        const url = this.methods.url(this.methods.route(route, this.parameters), this.parameters);
+	if(push !== false)
+	{
+		history.pushState(null, '', onetype.RouteBuild(this.methods.route(resolved.page), resolved.parameters) + search);
+	}
 
-        if(this.options.push !== false)
-        {
-            history.pushState(null, '', url + (this.options.search || ''));
-        }
+	const result = await this.Fn('open', resolved.id, resolved.parameters);
 
-        const result = this.Fn('open', this.id, this.parameters);
-
-        if(result === false)
-        {
-            return this.methods.done(null, 'Navigation prevented.', 403);
-        }
-
-        return this.methods.done({ id: this.id, parameters: this.parameters, url }, 'Page changed.', 200);
-    };
-
-    this.methods.match = () =>
-    {
-        const result = this.Fn('match', target);
-
-        if(result)
-        {
-            this.page = result.page;
-            this.id = result.page.Get('id');
-            this.parameters = { ...result.parameters, ...this.parameters };
-        }
-    };
-
-    this.methods.route = (route, parameters) =>
-    {
-        if(!Array.isArray(route))
-        {
-            return route;
-        }
-
-        const keys = Object.keys(parameters);
-
-        for(let i = route.length - 1; i >= 0; i--)
-        {
-            const params = (route[i].match(/:(\w+)/g) || []).map(p => p.slice(1));
-
-            if(params.length && params.every(p => keys.includes(p)))
-            {
-                return route[i];
-            }
-        }
-
-        return route[0];
-    };
-
-    this.methods.url = (route, parameters) =>
-    {
-        let url = route;
-
-        for(const key in parameters)
-        {
-            url = url.replace(`:${key}`, parameters[key]);
-        }
-
-        return url;
-    };
-
-    this.methods.done = (data, message, code) =>
-    {
-        this.resolve({ data, message, code });
-    };
-
-    return new Promise((resolve) =>
-    {
-        try
-        {
-            this.methods.init(resolve);
-        }
-        catch(error)
-        {
-            resolve({ data: null, message: error.message, code: 500 });
-        }
-    });
+	return result === false ? null : resolved.page;
 });

package/addons/render/pages/front/functions/match.js

@@ -4,7 +4,6 @@ pages.Fn('match', function(path)
 
 	for(const item of items)
 	{
-		// Skip 404 pages during normal matching
 		if(item.Get('404'))
 		{
 			continue;
@@ -19,9 +18,9 @@ pages.Fn('match', function(path)
 
 		const routes = Array.isArray(route) ? route : [route];
 
-		for(const r of routes)
+		for(const part of routes)
 		{
-			const result = onetype.RouteMatch(r, path || onetype.RouteCurrent());
+			const result = onetype.RouteMatch(part, path || onetype.RouteCurrent());
 
 			if(result.match)
 			{

package/addons/render/pages/front/functions/open.js

@@ -4,49 +4,17 @@ pages.Fn('open', async function(id, parameters = {})
 
 	if(!page)
 	{
-		console.warn(`Page with id "${id}" not found`);
 		return false;
 	}
 
-	const active = pages.StoreGet('active');
-
-	if(page.Get('data'))
-	{
-		const data = {};
-		let loaded = false;
-
-		const promise = page.Get('data').call(page, parameters).then(result =>
-		{
-			Object.assign(data, result);
-			loaded = true;
-		});
-
-		await Promise.race([promise, new Promise(resolve => setTimeout(resolve, 500))]);
+	const data = page.Get('data') ? await page.Get('data').call(page, parameters) : null;
 
-		if(!loaded)
-		{
-			if(active && active.Fn('leave') === false)
-			{
-				return false;
-			}
-
-			await promise;
-		}
-		else
-		{
-			if(active && active.Fn('leave') === false)
-			{
-				return false;
-			}
-		}
-
-		return await page.Fn('enter', parameters, data);
-	}
+	const active = pages.StoreGet('active');
 
 	if(active && active.Fn('leave') === false)
 	{
 		return false;
 	}
 
-	return await page.Fn('enter', parameters);
+	return await page.Fn('enter', parameters, data);
 });

package/addons/render/pages/front/functions/resolve.js

@@ -0,0 +1,30 @@
+pages.Fn('resolve', function(id, path = null, parameters = {})
+{
+	if(path)
+	{
+		const match = this.Fn('match', path);
+
+		if(match)
+		{
+			return { page: match.page, id: match.page.Get('id'), parameters: { ...match.parameters, ...parameters } };
+		}
+	}
+	else if(id)
+	{
+		const page = this.ItemGet(id);
+
+		if(page)
+		{
+			return { page, id, parameters };
+		}
+	}
+
+	const page = Object.values(this.Items()).find(p => p.Get('404'));
+
+	if(page)
+	{
+		return { page, id: page.Get('id'), parameters };
+	}
+
+	return null;
+});

package/addons/render/pages/front/item/catch/add.js

@@ -1,24 +1,26 @@
 pages.ItemOn('add', (item) =>
 {
-	const map = item.Get('areas');
+	const areas = item.Get('areas');
 
-	if(map)
+	if(areas)
 	{
-		Object.keys(map).forEach(name =>
+		for(const [name, value] of Object.entries(areas))
 		{
-			const id = map[name];
-
-			if(typeof id === 'function')
+			if(typeof value === 'function')
 			{
-				pages.RenderAdd(item.Get('id') + ':' + name, function(parameters)
+				pages.RenderAdd(item.Get('id') + ':' + name, function(context)
 				{
+					const parameters = context?.parameters || {};
+					const data = context?.data || {};
+
 					this.Define({
-						parameters: ['object', {}]
+						parameters: ['object', {}],
+						data: ['object', {}],
 					});
 
-					return id.call(this, parameters);
+					return value.call(this, {parameters, data});
 				});
 			}
-		});
+		}
 	}
 });

package/addons/render/pages/front/item/catch/remove.js

@@ -1,17 +1,15 @@
 pages.ItemOn('removed', (item) =>
 {
-	const map = item.Get('layouts');
+	const areas = item.Get('areas');
 
-	if(map)
+	if(areas)
 	{
-		Object.keys(map).forEach(name =>
+		for(const [name, value] of Object.entries(areas))
 		{
-			const id = map[name];
-
-			if(typeof id === 'function')
+			if(typeof value === 'function')
 			{
 				pages.RenderRemove(item.Get('id') + ':' + name);
 			}
-		});
+		}
 	}
 });

package/addons/render/pages/front/item/functions/enter.js

@@ -1,38 +1,26 @@
-pages.Fn('item.enter', async function(item, parameters = {}, preloaded = null)
+pages.Fn('item.enter', async function(item, parameters = {}, data = null)
 {
-	const onEnter = item.Get('onEnter');
-	const onBeforeEnter = item.Get('onBeforeEnter');
-
-	const data = {};
-
-	if(preloaded)
-	{
-		Object.assign(data, preloaded);
-	}
-	else if(item.Get('data'))
-	{
-		Object.assign(data, await item.Get('data').call(item, parameters));
-	}
-
-	if(onBeforeEnter && onBeforeEnter.call(item, parameters, data) === false)
+	if(item.Get('onBeforeEnter') && item.Get('onBeforeEnter').call(item, parameters, data) === false)
 	{
 		return false;
 	}
 
 	pages.StoreSet('active', item);
 
+	onetype.StateSet('page', { 
+		id: item.Get('id'), 
+		route: item.Get('route'), 
+		meta: item.Get('meta'),
+		parameters,
+		data, 
+		'404': item.Get('404') 
+	});
+
 	const title = item.Get('title');
 
 	if(title)
 	{
-		if(typeof title === 'function')
-		{
-			document.title = title.call(item, parameters, data);
-		}
-		else
-		{
-			document.title = title;
-		}
+		document.title = typeof title === 'function' ? title.call(item, parameters, data) : title;
 	}
 
 	const element = item.Fn('render', parameters, data);
@@ -40,10 +28,9 @@ pages.Fn('item.enter', async function(item, parameters = {}, preloaded = null)
 
 	document.body.appendChild(element);
 
-	if(onEnter)
-	{
-		onEnter.call(item, parameters, data);
-	}
+	item.Get('onEnter') && item.Get('onEnter').call(item, parameters, data);
+
+	onetype.Emit('@pages.enter', { page: item, parameters, data });
 
 	return true;
 });

package/addons/render/pages/front/item/functions/leave.js

@@ -1,19 +1,17 @@
 pages.Fn('item.leave', function(item)
 {
-	const onLeave = item.Get('onLeave');
-	const onBeforeLeave = item.Get('onBeforeLeave');
-
-	if(onBeforeLeave && onBeforeLeave.call(item) === false)
+	if(item.Get('onBeforeLeave') && item.Get('onBeforeLeave').call(item) === false)
 	{
 		return false;
 	}
 
 	pages.StoreSet('active', null);
 
-	if(onLeave)
-	{
-		onLeave.call(item);
-	}
+	onetype.StateSet('page', null);
+
+	item.Get('onLeave') && item.Get('onLeave').call(item);
+
+	onetype.Emit('@pages.leave', { page: item });
 
 	const element = item.Get('element');
 

package/addons/render/pages/front/items/commands/change.js

@@ -0,0 +1,60 @@
+onetype.AddonReady('commands', (commands) =>
+{
+	commands.Item({
+		id: 'pages:change',
+		method: 'POST',
+		endpoint: '/api/pages/change',
+		exposed: true,
+		description: 'Navigate to an application page by ID or path',
+		in: {
+			id: {
+				type: 'string',
+				description: 'Page ID to navigate to'
+			},
+			path: {
+				type: 'string',
+				description: 'URL path to navigate to'
+			},
+			parameters: {
+				type: 'object',
+				value: {},
+				description: 'Route parameters'
+			},
+			push: {
+				type: 'boolean',
+				value: true,
+				description: 'Push to browser history'
+			}
+		},
+		out: {
+			page: {
+				type: 'object',
+				config: {
+					id: ['string'],
+					route: ['string|array'],
+					meta: ['object'],
+					'404': ['boolean']
+				}
+			}
+		},
+		callback: async function(properties, resolve)
+		{
+			if(!properties.id && !properties.path)
+			{
+				resolve({ page: null });
+				return;
+			}
+
+			const page = await pages.Fn('change', properties.id, properties.path, properties.parameters, properties.push);
+
+			resolve({
+				page: page ? {
+					id: page.Get('id'),
+					route: page.Get('route'),
+					meta: page.Get('meta'),
+					'404': page.Get('404')
+				} : null
+			});
+		}
+	});
+});

package/addons/render/pages/front/items/commands/list.js

@@ -0,0 +1,38 @@
+onetype.AddonReady('commands', (commands) =>
+{
+	commands.Item({
+		id: 'pages:list',
+		method: 'GET',
+		endpoint: '/api/pages/list',
+		exposed: true,
+		description: 'List all application pages with their routes and metadata',
+		out: {
+			pages: {
+				type: 'array',
+				each: {
+					type: 'object',
+					config: {
+						id: ['string'],
+						route: ['string|array'],
+						meta: ['object'],
+						'404': ['boolean']
+					}
+				}
+			}
+		},
+		callback: function(properties, resolve)
+		{
+			const items = Object.values(pages.Items());
+
+			resolve({
+				pages: items.map(item =>
+				({
+					id: item.Get('id'),
+					route: item.Get('route'),
+					meta: item.Get('meta'),
+					'404': item.Get('404')
+				}))
+			});
+		}
+	});
+});

package/addons/render/pages/front/items/directives/change.js

@@ -25,7 +25,7 @@ onetype.AddonReady('directives', function()
 
 			const change = () =>
 			{
-				pages.Fn('change', route, parameters, { path: true, push });
+				pages.Fn('change', null, route, parameters, push);
 			};
 
 			if(timeout > 0)

package/addons/render/transforms/css/transforms.css

@@ -0,0 +1,4 @@
+[ot]
+{
+	opacity: 0;
+}

package/addons/render/transforms/{addon.js → js/addon.js}

@@ -7,7 +7,14 @@ const transforms = onetype.Addon('transforms', (addon) =>
     addon.Field('js', ['array', []]);
     addon.Field('css', ['array', []]);
     addon.Field('config', ['object', {}]);
+    addon.Field('metadata', ['object', {}]);
+    addon.Field('tags', ['array', []]);
     addon.Field('code', ['function']);
     addon.Field('destroy', ['function', null]);
+    addon.Field('visible', ['function', null]);
+    addon.Field('resize', ['function', null]);
+    addon.Field('scroll', ['function', null]);
+    addon.Field('hover', ['function', null]);
+    addon.Field('click', ['function', null]);
     addon.Field('structure', ['function', null]);
 });

package/addons/render/transforms/js/item/functions/run.js

@@ -0,0 +1,87 @@
+transforms.Fn('item.run', function(item, node, data = null)
+{
+	if(data === null)
+	{
+		data = transforms.Fn('data', item.Get('config'), node);
+	}
+
+	item.Fn('load').then(() =>
+	{
+		const context = {
+			scroll: { progress: 0, direction: 'down', speed: 0, top: 0, bottom: 0, visible: false },
+			hover: { active: false, x: 0, y: 0, offset: 0 },
+			click: { x: 0, y: 0 }
+		};
+
+		item.Get('code').call(context, data, node, item);
+
+		if(item.Get('visible'))
+		{
+			onetype.ObserverVisible(node, () =>
+			{
+				item.Get('visible').call(context, data, node, item);
+			});
+		}
+
+		if(item.Get('resize'))
+		{
+			onetype.ObserverResize(node, () =>
+			{
+				item.Get('resize').call(context, data, node, item);
+			});
+		}
+
+		if(item.Get('scroll'))
+		{
+			onetype.ObserverScroll(node, (scroll) =>
+			{
+				context.scroll = scroll;
+				item.Get('scroll').call(context, data, node, item);
+			});
+		}
+
+		if(item.Get('hover'))
+		{
+			onetype.ObserverHover(node, (hover) =>
+			{
+				context.hover = hover;
+				item.Get('hover').call(context, data, node, item);
+			}, context.hover.offset);
+		}
+
+		if(item.Get('click'))
+		{
+			onetype.ObserverClick(node, (click) =>
+			{
+				context.click = click;
+				item.Get('click').call(context, data, node, item);
+			});
+		}
+
+		const listener = onetype.EmitOn('@dom.remove', (removed) =>
+		{
+			if(removed !== node && document.contains(node))
+			{
+				return;
+			}
+
+			onetype.EmitOff('@dom.remove', listener);
+			onetype.ObserverUnvisible(node);
+			onetype.ObserverUnresize(node);
+			onetype.ObserverUnscroll(node);
+			onetype.ObserverUnhover(node);
+			onetype.ObserverUnclick(node);
+
+			if(item.Get('destroy'))
+			{
+				item.Get('destroy').call(context, data, node, item);
+			}
+		});
+
+		requestAnimationFrame(() =>
+		{
+			node.removeAttribute('ot');
+			node.removeAttribute('ot-init');
+		});
+	});
+});

package/addons/services/cloudflare/images/back/addon.js

@@ -0,0 +1,23 @@
+import onetype from '#framework/load.js';
+
+const images = onetype.Addon('cloudflare.images', (addon) =>
+{
+	addon.Table('cloudflare_images');
+
+	addon.Field('id', ['string']);
+	addon.Field('team_id', ['string', null, true]);
+	addon.Field('site_id', ['string', null, true]);
+	addon.Field('cloudflare_id', ['string', null, true]);
+	addon.Field('filename', ['string', null, true]);
+	addon.Field('url', ['string']);
+	addon.Field('variants', ['object', {}]);
+	addon.Field('alt', ['string']);
+	addon.Field('size', ['number']);
+	addon.Field('type', ['string']);
+	addon.Field('width', ['number']);
+	addon.Field('height', ['number']);
+	addon.Field('updated_at', ['string']);
+	addon.Field('created_at', ['string']);
+});
+
+export default images;

package/addons/services/cloudflare/images/back/expose.js

@@ -0,0 +1,22 @@
+import images from '#cloudflare-images/addon.js';
+
+images.Expose({
+	filter: ['team_id', 'site_id', 'type'],
+	sort: ['filename', 'created_at'],
+	select: [
+		'id', 'team_id', 'site_id', 'cloudflare_id', 'filename', 'url', 'variants', 'alt', 'size', 'type', 'width', 'height', 'updated_at', 'created_at'
+	],
+	callback: function(query)
+	{
+		const user = this.http.state.user;
+
+		if(user)
+		{
+			query.filter('team_id', user.team.id);
+		}
+		else
+		{
+			query.filter('id', null, 'NULL');
+		}
+	}
+});