RubyGems - presently - Versions diffs - 0.1.0 - Mend

presently 0.1.0

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.

Files changed (215) hide show

data/public/_components/@socketry/syntax/update-examples.js ADDED Viewed

@@ -0,0 +1,135 @@
+#!/usr/bin/env node
+import { readFileSync, writeFileSync, readdirSync } from 'fs';
+import { join } from 'path';
+const examplesDir = './examples';
+const excludeFiles = new Set([
+	'_template.html',
+	'index.html',
+	'javascript.html',
+	'markdown.html',
+	'python.html',
+	'ruby.html',
+	'html.html',
+	'css-colors.html',
+	'java.html',
+	'custom-theme.html',
+	'README.md'
+]);
+// Language name mappings
+const languageNames = {
+	'apache': 'Apache',
+	'applescript': 'AppleScript',
+	'assembly': 'Assembly',
+	'bash': 'Bash',
+	'basic': 'BASIC/VB',
+	'c': 'C/C++',
+	'clang': 'C/C++',
+	'csharp': 'C#',
+	'diff': 'Diff/Patch',
+	'go': 'Go',
+	'haskell': 'Haskell',
+	'io': 'Io',
+	'json': 'JSON',
+	'lisp': 'Lisp',
+	'lua': 'Lua',
+	'mixed': 'Mixed Languages',
+	'nginx': 'Nginx',
+	'ocaml': 'OCaml',
+	'pascal': 'Pascal',
+	'perl5': 'Perl 5',
+	'php': 'PHP',
+	'php-script': 'PHP Script',
+	'plain': 'Plain Text',
+	'protobuf': 'Protocol Buffers',
+	'scala': 'Scala',
+	'smalltalk': 'Smalltalk',
+	'sql': 'SQL',
+	'super-collider': 'SuperCollider',
+	'swift': 'Swift',
+	'wrap-demo': 'Wrap Demo',
+	'xrb': 'XRB',
+	'xml': 'XML',
+	'yaml': 'YAML'
+};
+// Process each file
+const files = readdirSync(examplesDir).filter(f =>
+	f.endsWith('.html') && !excludeFiles.has(f)
+);
+console.log(`Processing ${files.length} files...`);
+files.forEach(file => {
+	const filePath = join(examplesDir, file);
+	let content = readFileSync(filePath, 'utf8');
+	const baseName = file.replace('.html', '');
+	const langName = languageNames[baseName] || baseName;
+	// Check if already updated
+	if (content.includes('examples.css')) {
+		console.log(`✓ ${file} already updated`);
+		return;
+	}
+	console.log(`Updating ${file}...`);
+	// Replace <head> with inline styles
+	content = content.replace(
+		/<head>[\s\S]*?<\/head>/,
+		`<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>${langName} Examples - @socketry/syntax</title>
+	<link rel="stylesheet" href="examples.css">
+</head>`
+	);
+	// Add header if not present
+	if (!content.includes('<header>')) {
+		content = content.replace(
+			/<body[^>]*>\s*/,
+			`<body>
+	<header>
+		<h1>${langName} Examples</h1>
+		<p class="subtitle">${langName} syntax highlighting</p>
+	</header>
+	<nav>
+		<a href="index.html">Back to Examples</a>
+	</nav>
+`
+		);
+	}
+	// Wrap examples in div.example if needed
+	if (!content.includes('class="example"')) {
+		// Simple wrapping for code blocks
+		content = content.replace(
+			/<h2>(.*?)<\/h2>\s*(<syntax-code|<pre>)/g,
+			`<div class="example">
+		<h2>$1</h2>
+		<p class="description">Example:</p>
+		$2`
+		);
+		content = content.replace(
+			/(<\/syntax-code>|<\/pre>)\s*(?=<h2>|<script>)/g,
+			'$1\n\t</div>\n\n\t'
+		);
+		// Close last example before script
+		content = content.replace(
+			/(<\/syntax-code>|<\/pre>)\s*<script/,
+			'$1\n\t</div>\n\t\n\t<script'
+		);
+	}
+	writeFileSync(filePath, content, 'utf8');
+	console.log(`✓ Updated ${file}`);
+});
+console.log('\nDone!');

data/public/_static/index.css ADDED Viewed

@@ -0,0 +1,593 @@
+/* Reset & Base */
+*, *::before, *::after {
+	box-sizing: border-box;
+}
+:root {
+	--slide-bg: #1a1a2e;
+	--slide-text: #eee;
+	--accent: #e94560;
+	--accent-light: #ff6b81;
+	--surface: #16213e;
+	--surface-light: #0f3460;
+	--on-time: #2ed573;
+	--behind: #ff4757;
+	--ahead: #ffa502;
+	--font-sans: "Inter", "Helvetica Neue", Arial, sans-serif;
+	--font-mono: "JetBrains Mono", "Fira Code", monospace;
+}
+html, body {
+	margin: 0;
+	padding: 0;
+	font-family: var(--font-sans);
+	background: #0a0a1a;
+	color: var(--slide-text);
+	height: 100%;
+	overflow: hidden;
+}
+/* ========================
+   SLIDE STYLES (shared)
+   ======================== */
+.slide {
+	width: 100%;
+	height: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.slide-inner {
+	width: 100%;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding: 4rem;
+}
+/* Default template */
+.default-template .slide-body {
+	font-size: 1.8rem;
+	line-height: 1.6;
+	max-width: 80%;
+}
+.default-template .slide-body ul,
+.default-template .slide-body ol {
+	text-align: left;
+}
+.default-template .slide-body li {
+	margin-bottom: 0.5em;
+}
+/* Title template */
+.title-template {
+	text-align: center;
+}
+.title-template .slide-title {
+	font-size: 3.5rem;
+	font-weight: 700;
+	margin-bottom: 1rem;
+}
+.title-template .slide-title p {
+	margin: 0;
+}
+.title-template .slide-subtitle {
+	font-size: 1.8rem;
+	opacity: 0.7;
+}
+.title-template .slide-subtitle p {
+	margin: 0;
+}
+/* Section template */
+.section-template {
+	background: linear-gradient(135deg, var(--accent), var(--surface-light));
+	text-align: center;
+}
+.section-template .slide-heading {
+	font-size: 3rem;
+	font-weight: 700;
+}
+.section-template .slide-heading p {
+	margin: 0;
+}
+/* Two column template */
+.two-column-template {
+	flex-direction: row;
+	gap: 3rem;
+	padding: 3rem 4rem;
+}
+.two-column-template .column {
+	flex: 1;
+	font-size: 1.4rem;
+	line-height: 1.6;
+}
+.two-column-template .column ul {
+	padding-left: 1.5em;
+}
+.two-column-template .column li {
+	margin-bottom: 0.4em;
+}
+/* Image template */
+.image-template .slide-caption {
+	font-size: 1.6rem;
+	margin-bottom: 2rem;
+	text-align: center;
+}
+.image-template .slide-image {
+	max-width: 80%;
+	text-align: center;
+}
+.image-template .slide-image img {
+	max-width: 100%;
+	max-height: 60vh;
+	border-radius: 8px;
+}
+/* Hide raw code blocks until syntax-js upgrades them */
+pre > code[class*="language-"] {
+	opacity: 0;
+}
+pre > syntax-code {
+	opacity: 1;
+	transition: opacity 0.15s ease-in;
+}
+/* Translation template */
+.translation-template {
+	text-align: center;
+	gap: 2rem;
+}
+.translation-template .slide-title {
+	font-size: 3rem;
+	font-weight: 700;
+}
+.translation-template .slide-title p {
+	margin: 0;
+}
+.translation-template .slide-translation {
+	font-size: 2rem;
+	opacity: 0.7;
+}
+.translation-template .slide-translation p {
+	margin: 0;
+}
+/* Code template */
+.code-template {
+	padding: 2rem 3rem;
+	align-items: stretch;
+}
+.code-template .code-title {
+	font-size: 1.6rem;
+	font-weight: 600;
+	margin-bottom: 1rem;
+}
+.code-template .code-title p {
+	margin: 0;
+}
+.code-viewport {
+	position: relative;
+	flex: 1;
+	overflow: hidden;
+	border-radius: 8px;
+	background: rgba(0, 0, 0, 0.3);
+}
+.code-scroll {
+	transition: transform 0.6s ease-in-out;
+	padding: 1rem;
+}
+.code-scroll pre {
+	margin: 0;
+	background: none;
+	padding: 0;
+	line-height: 1.6;
+}
+.code-scroll code {
+	background: none;
+	padding: 0;
+	font-size: 1.1rem;
+}
+/* Dim overlays */
+.code-dim {
+	position: absolute;
+	left: 0;
+	right: 0;
+	pointer-events: none;
+	transition: all 0.6s ease-in-out;
+	z-index: 1;
+}
+.code-dim-top {
+	top: 0;
+	height: 0;
+	background: rgba(0, 0, 0, 0.7);
+}
+.code-dim-bottom {
+	bottom: 0;
+	height: 0;
+	background: rgba(0, 0, 0, 0.7);
+}
+/* ========================
+   DISPLAY VIEW (audience)
+   ======================== */
+.display {
+	width: 100vw;
+	height: 100vh;
+	background: var(--slide-bg);
+	position: relative;
+	outline: none;
+}
+.display .slide-container {
+	width: 100%;
+	height: 100%;
+	position: relative;
+}
+.display .slide-counter {
+	position: absolute;
+	bottom: 1rem;
+	right: 1.5rem;
+	font-size: 0.9rem;
+	opacity: 0.4;
+}
+/* ========================
+   VIEW TRANSITIONS
+   ======================== */
+/* Give the live-view element the transition name — there's only ever one */
+live-view:has(.display) {
+	view-transition-name: slide-container;
+}
+/* Default: no animation for the container (instant swap) */
+::view-transition-old(slide-container),
+::view-transition-new(slide-container) {
+	animation: none;
+}
+/* Fade */
+html[data-transition="fade"]::view-transition-old(slide-container) {
+	animation: vt-fade-out 0.4s ease-in-out;
+}
+html[data-transition="fade"]::view-transition-new(slide-container) {
+	animation: vt-fade-in 0.4s ease-in-out;
+}
+/* Slide left */
+html[data-transition="slide-left"]::view-transition-old(slide-container) {
+	animation: vt-slide-out-left 0.4s ease-in-out;
+}
+html[data-transition="slide-left"]::view-transition-new(slide-container) {
+	animation: vt-slide-in-right 0.4s ease-in-out;
+}
+/* Slide right */
+html[data-transition="slide-right"]::view-transition-old(slide-container) {
+	animation: vt-slide-out-right 0.4s ease-in-out;
+}
+html[data-transition="slide-right"]::view-transition-new(slide-container) {
+	animation: vt-slide-in-left 0.4s ease-in-out;
+}
+/* Magic move — the browser interpolates position/size for matched
+   view-transition-name elements. No cross-fade on the container
+   to avoid background dimming. */
+html[data-transition="magic-move"]::view-transition-old(slide-container) {
+	animation: none;
+	opacity: 0;
+}
+html[data-transition="magic-move"]::view-transition-new(slide-container) {
+	animation: none;
+}
+@keyframes vt-fade-out {
+	from { opacity: 1; }
+	to { opacity: 0; }
+}
+@keyframes vt-fade-in {
+	from { opacity: 0; }
+	to { opacity: 1; }
+}
+@keyframes vt-slide-out-left {
+	from { transform: translateX(0); opacity: 1; }
+	to { transform: translateX(-100%); opacity: 0; }
+}
+@keyframes vt-slide-in-right {
+	from { transform: translateX(100%); opacity: 0; }
+	to { transform: translateX(0); opacity: 1; }
+}
+@keyframes vt-slide-out-right {
+	from { transform: translateX(0); opacity: 1; }
+	to { transform: translateX(100%); opacity: 0; }
+}
+@keyframes vt-slide-in-left {
+	from { transform: translateX(-100%); opacity: 0; }
+	to { transform: translateX(0); opacity: 1; }
+}
+/* ========================
+   PRESENTER VIEW
+   ======================== */
+.presenter {
+	width: 100vw;
+	height: 100vh;
+	display: grid;
+	grid-template-rows: auto 1fr auto auto;
+	background: #0d0d1a;
+	gap: 0.5rem;
+	padding: 0.5rem;
+}
+/* Controls */
+.controls {
+	display: flex;
+	align-items: center;
+	gap: 1rem;
+	padding: 0.5rem 1rem;
+	background: var(--surface);
+	border-radius: 8px;
+}
+.controls button {
+	background: var(--surface-light);
+	color: var(--slide-text);
+	border: 1px solid rgba(255,255,255,0.1);
+	padding: 0.5rem 1rem;
+	border-radius: 6px;
+	cursor: pointer;
+	font-size: 0.9rem;
+	font-family: var(--font-sans);
+	transition: background 0.2s;
+}
+.controls button:hover {
+	background: var(--accent);
+}
+.controls .jump-to {
+	background: var(--surface-light);
+	color: var(--slide-text);
+	border: 1px solid rgba(255,255,255,0.1);
+	padding: 0.5rem 0.75rem;
+	border-radius: 6px;
+	font-size: 0.9rem;
+	font-family: var(--font-sans);
+	cursor: pointer;
+	min-width: 8rem;
+}
+.controls .jump-to:hover {
+	background: var(--accent);
+}
+.controls button.reload {
+	margin-left: auto;
+}
+.controls .slide-info {
+	font-size: 1rem;
+	opacity: 0.8;
+}
+/* Slide previews */
+.previews {
+	display: grid;
+	grid-template-columns: 1fr 1fr;
+	gap: 0.5rem;
+	min-height: 0;
+}
+.preview {
+	display: flex;
+	flex-direction: column;
+	min-height: 0;
+}
+.preview h3 {
+	margin: 0 0 0.3rem 0;
+	font-size: 0.85rem;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	opacity: 0.6;
+}
+.preview-frame {
+	flex: 1;
+	background: var(--slide-bg);
+	border-radius: 8px;
+	overflow: hidden;
+	position: relative;
+	min-height: 0;
+}
+.preview-frame .slide {
+	zoom: 0.75;
+}
+.preview-frame .no-slide {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	height: 100%;
+	opacity: 0.4;
+	font-size: 1.2rem;
+}
+.current-preview .preview-frame {
+	border: 2px solid var(--accent);
+}
+/* Timing */
+.timing {
+	background: linear-gradient(
+		to right,
+		rgba(233, 69, 96, 0.25) var(--slide-progress, 0%),
+		var(--surface) var(--slide-progress, 0%)
+	);
+	border-radius: 8px;
+	padding: 0.5rem 1rem;
+	transition: background 1s linear;
+}
+.timing-info {
+	display: flex;
+	gap: 2rem;
+	align-items: center;
+	font-size: 1rem;
+}
+.timing-info.on-time .pacing-indicator {
+	color: var(--on-time);
+}
+.timing-info.behind .pacing-indicator {
+	color: var(--behind);
+	font-weight: 700;
+	animation: pulse 1s infinite;
+}
+.timing-info.ahead .pacing-indicator {
+	color: var(--ahead);
+}
+@keyframes pulse {
+	0%, 100% { opacity: 1; }
+	50% { opacity: 0.5; }
+}
+.timing-info .pause-button {
+	background: var(--surface-light);
+	color: var(--slide-text);
+	border: 1px solid rgba(255,255,255,0.1);
+	padding: 0.3rem 0.75rem;
+	border-radius: 6px;
+	cursor: pointer;
+	font-size: 0.9rem;
+	font-family: var(--font-sans);
+	transition: background 0.2s;
+	line-height: 1;
+	min-width: 6rem;
+}
+.timing-info .pause-button:hover {
+	background: var(--accent);
+}
+.timing-info .elapsed {
+	font-variant-numeric: tabular-nums;
+}
+.timing-info .remaining {
+	font-variant-numeric: tabular-nums;
+}
+.timing-info .slide-duration {
+	opacity: 0.6;
+	margin-left: auto;
+}
+/* Notes */
+.notes {
+	background: var(--surface);
+	border-radius: 8px;
+	padding: 0.75rem 1rem;
+	max-height: 30vh;
+	overflow-y: auto;
+}
+.notes h3 {
+	margin: 0 0 0.3rem 0;
+	font-size: 0.85rem;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	opacity: 0.6;
+}
+.notes-content {
+	font-size: 1.1rem;
+	line-height: 1.5;
+}
+.notes-content p {
+	margin: 0.3em 0;
+}
+.notes .no-notes {
+	opacity: 0.4;
+	font-style: italic;
+}
+/* ========================
+   GLOBAL TYPOGRAPHY
+   ======================== */
+strong, b {
+	color: var(--accent-light);
+}
+code {
+	font-family: var(--font-mono);
+	background: rgba(255,255,255,0.1);
+	padding: 0.15em 0.4em;
+	border-radius: 4px;
+	font-size: 0.9em;
+}
+pre {
+	background: rgba(0,0,0,0.3);
+	padding: 1rem;
+	border-radius: 8px;
+	overflow-x: auto;
+}
+pre code {
+	background: none;
+	padding: 0;
+}