@fc3/mmcadi 0.1.0

package/src/server/result-serializer/month.ts

@@ -0,0 +1,170 @@
+import Month from 'type/month';
+import Color from 'enum/color';
+import datesAreEqual from 'server/utility/dates-are-equal';
+import datesInSameMonth from 'server/utility/dates-in-same-month';
+import PageType from 'client/enum/page-type';
+import BaseResultSerializer from 'server/result-serializer/base';
+import monthToDate from 'server/utility/month-to-date';
+import dateLessThan from 'server/utility/date-less-than';
+import Emoji from 'enum/emoji';
+import createDate from 'server/utility/create-date';
+import dateToPath from 'server/utility/date-to-path';
+import getEndOfWeek from 'server/utility/get-end-of-week';
+import getEndOfMonth from 'server/utility/get-end-of-month';
+import getStartOfMonth from 'server/utility/get-start-of-month';
+import getShortMonthName from 'server/utility/get-short-month-name';
+import getNextMonth from 'server/utility/get-next-month';
+import getPreviousMonth from 'server/utility/get-previous-month';
+import monthToPath from 'server/utility/month-to-path';
+import weekToPath from 'server/utility/week-to-path';
+import yearToPath from 'server/utility/year-to-path';
+import getStartOfYear from 'server/utility/get-start-of-year';
+import getMonthName from 'server/utility/get-month-name';
+import getStartOfWeek from 'server/utility/get-start-of-week';
+import weekGreaterThan from 'server/utility/week-greater-than';
+import incrementDate from 'server/utility/increment-date';
+import createToastPath from 'server/utility/create-toast-path';
+
+class MonthResultSerializer extends BaseResultSerializer<Month> {
+	public serializeSections(): string {
+		const target_date = this.getTargetDate();
+		const start_of_month = getStartOfMonth(target_date);
+		const end_of_month = getEndOfMonth(target_date);
+		const end_date = incrementDate(getEndOfWeek(end_of_month), 1);
+		const serialized_rows: string[] = [];
+		const reticule = '<div class="focus-reticule scaling"></div>';
+		const today = createDate();
+
+		let current_week = getStartOfWeek(start_of_month);
+		let current_date = current_week;
+		let current_row: string[] = [];
+
+		while (dateLessThan(current_date, end_date)) {
+			if (datesInSameMonth(current_date, target_date)) {
+				const base_path = dateToPath(current_date);
+				const date_is_today = datesAreEqual(current_date, today);
+
+				const day_path = (() => {
+					if (date_is_today) {
+						return createToastPath(base_path, {
+							message: `${Emoji.SUNSHINE} today ${Emoji.SUNSHINE}`,
+							color: Color.YELLOW
+						});
+					} else {
+						return base_path;
+					}
+				})();
+
+				const reticule_markup = date_is_today ? reticule : '';
+				const utc_date = current_date.getUTCDate();
+				const date_label = date_is_today ? Emoji.SUNSHINE : utc_date;
+
+				current_row.push(`
+					<td class="focus-reticule-container">
+						<a href="${day_path}" class="biglink">
+							${reticule_markup}
+							${date_label}
+						</a>
+					</td>
+				`);
+			} else {
+				current_row.push('<td></td>');
+			}
+
+			current_date = incrementDate(current_date, 1);
+
+			if (weekGreaterThan(current_date, current_week)) {
+				const week_path = weekToPath(current_week);
+				const serialized_row = current_row.join('\n');
+
+				serialized_rows.push(`
+					<tr>
+						<td>
+							<a class="biglink" href="${week_path}">
+								↳
+							</a>
+						</td>
+						${serialized_row}
+					</tr>
+				`);
+
+				current_row = [];
+				current_week = getStartOfWeek(current_date);
+			}
+		}
+
+		const target_month = getStartOfMonth(target_date);
+		const target_month_name = getMonthName(target_month);
+		const target_year = getStartOfYear(target_month);
+		const year_name = target_year.getUTCFullYear();
+		const year_path = yearToPath(target_year);
+		const previous_month = getPreviousMonth(target_month);
+		const previous_month_path = monthToPath(previous_month);
+		const previous_month_name = getShortMonthName(previous_month);
+		const next_month = getNextMonth(target_month);
+		const next_month_path = monthToPath(next_month);
+		const next_month_name = getShortMonthName(next_month);
+
+		return `
+			<table>
+				<thead>
+					<tr>
+						<th class="no-background">
+						</th>
+						<th>
+							<a class="biglink mb-8" href="${year_path}">
+								${Emoji.UP_ARROW_UNICODE} ${year_name} ${Emoji.UP_ARROW_UNICODE}
+							</a>
+						</th>
+						<th class="no-background">
+						</th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr>
+						<td class="biglink-container">
+							<a class="biglink stretch" href="${previous_month_path}">${Emoji.LEFT_ARROW_UNICODE} ${previous_month_name}</a>
+						</td>
+						<td>
+							<h2>${target_month_name}</h2>
+							<table class="fixed">
+								<thead>
+									<th></th>
+									<th>s</th>
+									<th>m</th>
+									<th>t</th>
+									<th>w</th>
+									<th>t</th>
+									<th>f</th>
+									<th>s</th>
+								</thead>
+								<tbody>
+									${serialized_rows.join('\n')}
+								</tbody>
+							</table>
+						</td>
+						<td class="biglink-container">
+							<a class="biglink stretch" href="${next_month_path}">${next_month_name} ${Emoji.RIGHT_ARROW_UNICODE}</a>
+						</td>
+					</tr>
+				</tbody>
+			</table>
+		`;
+	}
+
+	protected getTitle(): string {
+		return 'xxx';
+	}
+
+	protected getPageType(): PageType {
+		return PageType.MONTH;
+	}
+
+	private getTargetDate(): Date {
+		const month = this.getResult();
+
+		return monthToDate(month);
+	}
+}
+
+export default MonthResultSerializer;

package/src/server/result-serializer/page.ts

@@ -0,0 +1,548 @@
+import {Session} from 'lib/execution-context';
+import {InvariantViolation} from 'lib/errors';
+
+import Page from 'type/page';
+import BlockType from 'enum/block-type';
+import createDate from 'server/utility/create-date';
+import Color from 'enum/color';
+import createToastPath from 'server/utility/create-toast-path';
+import CustomPageType from 'server/enum/custom-page-type';
+import dateToPath from 'server/utility/date-to-path';
+import isIndexPath from 'server/utility/is-index-path';
+import getHexForColor from 'server/utility/get-hex-for-color';
+import ToolType from 'enum/tool-type';
+import Block from 'type/block';
+import getEmojiForToolType from 'server/utility/get-emoji-for-tool-type';
+import pathToDate from 'server/utility/path-to-date';
+import Account from 'type/account';
+import PageType from 'client/enum/page-type';
+import pathIsDate from 'server/utility/path-is-date';
+import datesAreEqual from 'server/utility/dates-are-equal';
+import createIndexPath from 'server/utility/create-index-path';
+import HeaderBlock from 'type/block/header';
+import Emoji from 'enum/emoji';
+import BaseResultSerializer from 'server/result-serializer/base';
+import ActionType from 'enum/action-type';
+import BlockResultSerializerFactory from 'server/factory/block-result-serializer';
+import Toast from 'type/toast';
+
+export interface PageMetadata {
+	readonly editing: boolean;
+	readonly target_index_path: string | null;
+	readonly toast: Toast | null;
+	readonly roles: string[];
+	readonly account: Account | null;
+	readonly custom_page_type: CustomPageType;
+}
+
+class PageResultSerializer extends BaseResultSerializer<Page> {
+	private metadata: PageMetadata;
+
+	public constructor(
+		result: Page,
+		metadata: PageMetadata,
+		path: string,
+		referrer_url: string,
+		session: Session
+	) {
+		super(result, path, referrer_url, session);
+
+		this.metadata = metadata;
+	}
+
+	protected getBodyClass(): string {
+		if (this.isEditing()) {
+			return 'editing';
+		} else {
+			return super.getBodyClass();
+		}
+	}
+
+	protected getPageType(): PageType {
+		if (this.isEditing()) {
+			return PageType.EDIT_CUSTOM;
+		} else {
+			return PageType.VIEW_CUSTOM;
+		}
+	}
+
+	protected isHome(): boolean {
+		const {path} = this.getResult();
+
+		return isIndexPath(path);
+	}
+
+	protected isToday(): boolean {
+		const {path} = this.getResult();
+
+		if (path === '/today') {
+			return true;
+		}
+
+		const is_date = pathIsDate(path);
+
+		if (!is_date) {
+			return false;
+		}
+
+		const date = pathToDate(path);
+		const today = createDate();
+
+		return datesAreEqual(date, today);
+	}
+
+	protected getTitle(): string {
+		const {blocks, path} = this.getResult();
+
+		let index = 0;
+
+		while (index < blocks.length) {
+			const block = blocks[index++];
+
+			if (!block) {
+				throw new InvariantViolation(`
+					Tried to read block at index ${index}, but it was not set
+				`);
+			}
+
+			const {block_type} = block;
+
+			switch (block_type) {
+				case BlockType.HEADER:
+					const {title} = block as HeaderBlock;
+
+					return title;
+
+				default:
+					continue;
+			}
+		}
+
+		return path;
+	}
+
+	protected serializeBreadcrumbs(): string {
+		const {path} = this.getResult();
+
+		const prefix = (() => {
+			const query_index = path.indexOf('?');
+
+			if (query_index !== -1) {
+				return path.slice(0, query_index);
+			} else {
+				return path;
+			}
+		})();
+
+		const parts = prefix.split('/').filter((part) => {
+			return part !== '';
+		});
+
+		if (parts.length === 0) {
+			return '';
+		}
+
+		const last_part = parts.pop();
+		const segments: string[] = [];
+
+		let current_path = '';
+
+		segments.push('<a href="/">home</a>');
+
+		parts.forEach((part) => {
+			current_path += '/' + part;
+			segments.push(`<a href="${current_path}">${part}</a>`);
+		});
+
+		segments.push(`<span>${last_part}</span>`);
+
+		return `
+			<nav class="mb-16 text-smaller">
+				${segments.join(' / ')}
+			</nav>
+		`;
+	}
+
+	private serializeToast(): string {
+		const {toast} = this.getMetadata();
+
+		if (toast === null) {
+			return '';
+		}
+
+		const {color} = toast;
+		const color_hex = getHexForColor(color);
+
+		return `
+			<input type="checkbox" class="toast-toggle" autocomplete="off" />
+			<div class="toast">
+				<div class="toast-wrapper" style="background:${color_hex}">
+					<div class="toast-background"></div>
+					<div class="toast-message">
+						${toast.message}
+					</div>
+				</div>
+			</div>
+		`
+	}
+
+	protected serializeHeader(): string {
+		const toast = this.serializeToast();
+
+		if (!this.isLoggedIn()) {
+			return `
+				${toast}
+			`;
+		}
+
+		const {account} = this.getMetadata();
+
+		if (account === null) {
+			throw new InvariantViolation(`
+				Tried to read account for logged-in user,
+				but it was null
+			`);
+		}
+
+		const {settings} = account;
+		const {tool_types} = settings;
+
+		const serialized_tools = tool_types.map((tool_type) => {
+			return this.serializeToolType(tool_type);
+		});
+
+		return `
+			${toast}
+
+			<header>
+				<div class="section-wrapper">
+					<section>
+						<table class="fixed" style="width:auto;min-width:180px;margin:0 auto;">
+							<tbody>
+								<tr>
+									${serialized_tools.join('\n')}
+								</tr>
+							</tbody>
+						</table>
+					</section>
+				</div>
+			</header>
+		`;
+	}
+
+	private serializeToolType(tool_type: ToolType): string {
+		switch (tool_type) {
+			case ToolType.LOCK:
+				return this.serializeLockTool();
+
+			case ToolType.HOME:
+				return this.serializeHomeTool();
+
+			case ToolType.TODAY:
+				return this.serializeTodayTool();
+
+			case ToolType.NOTE:
+				return this.serializeNoteTool();
+
+			case ToolType.AUDIO:
+				return this.serializeAudioTool();
+
+			case ToolType.IMAGE:
+				return this.serializeImageTool();
+
+			case ToolType.FOLDER:
+				return this.serializeFolderTool();
+
+			case ToolType.TODO:
+				return this.serializeTodoTool();
+
+			case ToolType.SETTINGS:
+				return this.serializeSettingsTool();
+
+			default:
+				throw new InvariantViolation(`Unsupported tool type: ${tool_type}`);
+		}
+	}
+
+	private serializeLockTool(): string {
+		const {path} = this.getResult();
+		const editing = this.isEditing();
+
+		const editing_path = (() => {
+			if (editing) {
+				return createToastPath(path, {
+					message: `${Emoji.LOCKED} locked`,
+					color: Color.GREEN
+				});
+			} else {
+				return createToastPath(`${path}?editing=true`, {
+					message: `${Emoji.UNLOCKED} unlocked`,
+					color: Color.YELLOW
+				});
+			}
+		})();
+
+		const editing_emoji  = editing ? Emoji.UNLOCKED : Emoji.LOCKED;
+
+		return `
+			<td>
+				<a href="${editing_path}" class="squarelink">
+					${editing_emoji}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeHomeTool(): string {
+		const {path} = this.getResult();
+		const is_index = isIndexPath(path);
+		const index_label = `${Emoji.HOUSE} home ${Emoji.HOUSE}`;
+		const index_disabled_class = is_index ? 'disabled' : '';
+
+		const toasted_index_path = (() => {
+			if (is_index) {
+				return createToastPath('/', {
+					message: `already ${index_label}`,
+					color: Color.FUSCHIA
+				});
+			} else {
+				return createToastPath('/', {
+					message: index_label,
+					color: Color.BLUE
+				});
+			}
+		})();
+
+		return `
+			<td>
+				<a href="${toasted_index_path}" class="squarelink ${index_disabled_class}">
+					${Emoji.HOUSE}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeTodayTool(): string {
+		const {path} = this.getResult();
+		const today = createDate();
+		const today_path = dateToPath(today);
+		const is_today = path === today_path;
+		const today_label = `${Emoji.SUNSHINE} today ${Emoji.SUNSHINE}`;
+		const today_disabled_class = is_today ? 'disabled' : '';
+
+		const toasted_today_path = (() => {
+			if (is_today) {
+				return createToastPath(path, {
+					message: `already ${today_label}`,
+					color: Color.FUSCHIA
+				});
+			} else {
+				return createToastPath(today_path, {
+					message: today_label,
+					color: Color.YELLOW
+				});
+			}
+		})();
+
+		return `
+			<td>
+				<a href="${toasted_today_path}" class="squarelink ${today_disabled_class}">
+					${Emoji.SUNSHINE}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeNoteTool(): string {
+		const {path} = this.getResult();
+		const editing = this.isEditing();
+		const index_path = this.getInsertionIndexPath();
+		const emoji = getEmojiForToolType(ToolType.NOTE);
+
+		return `
+			<td>
+				<a href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&block_type=${BlockType.NOTE}&index_path=${index_path}" class="squarelink">
+					${emoji}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeAudioTool(): string {
+		const {path} = this.getResult();
+		const editing = this.isEditing();
+		const index_path = this.getInsertionIndexPath();
+		const emoji = getEmojiForToolType(ToolType.AUDIO);
+
+		return `
+			<td>
+				<a href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&block_type=${BlockType.AUDIO}&index_path=${index_path}" class="squarelink">
+					${emoji}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeImageTool(): string {
+		const {path} = this.getResult();
+		const editing = this.isEditing();
+		const index_path = this.getInsertionIndexPath();
+		const emoji = getEmojiForToolType(ToolType.IMAGE);
+
+		return `
+			<td>
+				<a href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&block_type=${BlockType.IMAGE}&index_path=${index_path}" class="squarelink">
+					${emoji}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeFolderTool(): string {
+		const {path} = this.getResult();
+		const editing = this.isEditing();
+		const index_path = this.getInsertionIndexPath();
+		const emoji = getEmojiForToolType(ToolType.FOLDER);
+
+		return `
+			<td>
+				<a href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&block_type=${BlockType.FOLDER}&index_path=${index_path}" class="squarelink">
+					${emoji}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeTodoTool(): string {
+		const {path} = this.getResult();
+		const editing = this.isEditing();
+		const index_path = this.getInsertionIndexPath();
+		const emoji = getEmojiForToolType(ToolType.TODO);
+
+		return `
+			<td>
+				<a href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&block_type=${BlockType.TODO}&index_path=${index_path}" class="squarelink">
+					${emoji}
+				</a>
+			</td>
+		`;
+	}
+
+	private serializeSettingsTool(): string {
+		return `
+			<td>
+				<a href="/settings" class="squarelink">
+					${Emoji.GEAR}
+				</a>
+			</td>
+		`;
+	}
+
+	protected serializeSections(): string {
+		const page = this.getResult();
+		const {path, blocks} = page;
+
+		const elements: string[] = [];
+		const editing = this.isEditing();
+		const hidden_class = editing ? '' : 'hidden';
+
+		elements.push(`
+			<a data-role="add_block_link" class="biglink grey mt-16 mb-16 ${hidden_class}" href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&index_path=0">+</a>
+		`);
+
+		blocks.forEach((block, index) => {
+			if (block.hidden && !editing) {
+				return;
+			}
+
+			const serialized_block = this.serializeBlock(block, index);
+
+			elements.push(serialized_block);
+
+			elements.push(`
+				<a data-role="add_block_link" class="biglink grey mt-16 mb-16 ${hidden_class}" href="/actions?path=${path}&editing=${editing}&action_type=${ActionType.ADD_BLOCK}&index_path=${index + 1}">+</a>
+			`);
+		});
+
+		if (this.shouldPrintRawConfig()) {
+			const raw_page = JSON.stringify(page, null, 2);
+
+			elements.push(`
+				<section class="grey">
+					<details>
+						<summary>raw config:</summary>
+						<pre>${raw_page}</pre>
+					</details>
+				</section>
+			`);
+		}
+
+		return elements.join('\n');
+	}
+
+	private getInsertionIndexPath(): string {
+		const {blocks} = this.getResult();
+
+		let index = 0;
+
+		while (index < blocks.length) {
+			const block = blocks[index];
+			const {block_type} = block;
+
+			if (block_type !== BlockType.HEADER) {
+				break;
+			}
+
+			index++;
+		}
+
+		return createIndexPath([index]);
+	}
+
+	private shouldPrintRawConfig(): boolean {
+		if (!this.isLoggedIn()) {
+			return false;
+		}
+
+		return false;
+	}
+
+	private serializeBlock(block: Block, index: number): string {
+		const editing = this.isEditing();
+		const {path} = this.getResult();
+		const {target_index_path, roles, account} = this.getMetadata();
+		const referrer_url = this.getReferrerUrl();
+		const index_path = createIndexPath([index]);
+		const creator_username = '0xfc3';
+
+		const block_metadata = {
+			editing,
+			page_path: path,
+			roles,
+			account,
+			index,
+			referrer_url,
+			index_path,
+			target_index_path,
+			creator_username
+		};
+
+		const session = this.getSession();
+		const factory = new BlockResultSerializerFactory(block, block_metadata, session);
+		const serializer = factory.create();
+
+		return serializer.serializeContent();
+	}
+
+	private isEditing(): boolean {
+		const {editing} = this.getMetadata();
+
+		return editing;
+	}
+
+	private getMetadata(): PageMetadata {
+		return this.metadata;
+	}
+}
+
+export default PageResultSerializer;