Skip to content

Commit a1689eb

Browse files
MearmanMearman
committed
Merge remote-tracking branch 'upstream/main' into 10-json-schema-C
2 parents 9262b5c + 49c1ca7 commit a1689eb

17 files changed

+182
-110
lines changed

‎.layouts/default.html renamed to ‎.layouts/canvas.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
<div id="canvas-nodes">
2222
<node id="logo" class="node node-file" data-node-type="file" data-node-file="logo.svg" style="left: 36px; top: 48px;">
2323
<div class="node-name">logo.svg</div>
24-
<img width="160" height="60" src="logo.svg" alt="JSON Feed" />
24+
<img width="160" height="60" src="/logo.svg" alt="JSON Feed" />
2525
</node>
2626

2727
<node id="readme" class="node node-link" data-node-type="file" data-node-file="readme.md" style="left: 36px; top: 240px;">
@@ -34,7 +34,7 @@
3434
<iframe
3535
width="100%"
3636
height="100%"
37-
src="/spec/1.0">
37+
src="/spec/1.0?hidenav=true">
3838
</iframe>
3939
</node>
4040

@@ -43,7 +43,7 @@
4343
<div class="node-text-content">
4444
<p>Learn more:</p>
4545
<ul>
46-
<li><a href="/">Readme</a></li>
46+
<li><a href="/docs/apps">Apps</a></li>
4747
<li><a href="/spec/1.0">Spec</a></li>
4848
<li><a href="https://github.com/obsidianmd/jsoncanvas">GitHub</a></li>
4949
</ul>

‎.layouts/docs.html

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
{% include head.html %}
4+
<body>
5+
6+
{% include nav.html %}
7+
8+
<div class="page">
9+
{{ content }}
10+
</div>
11+
12+
<script>
13+
document.addEventListener("DOMContentLoaded", function() {
14+
const urlParams = new URLSearchParams(window.location.search);
15+
const hideNav = urlParams.get('hidenav');
16+
if(hideNav === 'true') {
17+
document.body.classList.add('hidenav');
18+
}
19+
});
20+
document.addEventListener('DOMContentLoaded', function() {
21+
const links = document.querySelectorAll('a');
22+
links.forEach(link => {
23+
const url = new URL(link.href);
24+
if (url.hostname !== window.location.hostname) {
25+
link.target = '_blank';
26+
link.rel = 'noopener noreferrer';
27+
}
28+
});
29+
});
30+
</script>
31+
</body>
32+
</html>

‎.layouts/head.html

+5-5
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,24 @@
33
<title>{{ site.title }} — {{ page.title }}</title>
44

55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<meta name="description" content="{% if page.description -%}{{ page.description | strip_html | strip_newlines | truncate: 160 }}{% else -%}{{ site.description }}{% endif -%}">
6+
<meta name="description" content="{% if page.content -%}{{ page.content | markdownify | strip_html | strip_newlines | truncate: 160 }}{% else -%}{{ site.description }}{% endif -%}">
77
<meta name="author" content="{{ site.name }}">
88

99
<link rel="canonical" href="{{ site.url }}{{ page.url }}">
1010
<link rel="icon" href="{{ site.url }}/favicon.ico" sizes="32x32">
11-
<link rel="icon" href="{{ site.url }}/icon.svg" type="image/svg+xml">
12-
<link rel="apple-touch-icon" href="{{ site.url }}/apple-touch-icon.png">
11+
<link rel="icon" href="{{ site.url }}/assets/icon.svg" type="image/svg+xml">
12+
<link rel="apple-touch-icon" href="{{ site.url }}/assets/apple-touch-icon.png">
1313
<link rel="stylesheet" href="{{ site.url }}/assets/style.css" type="text/css">
1414

1515
<meta property="og:site_name" content="{{ site.title }}">
1616
<meta property="og:url" content="{{ site.url }}{{ page.url }}">
1717
<meta property="og:title" content="{{ site.title }}">
18-
<meta property="og:description" content="{% if page.description -%}{{ page.description | strip_html | strip_newlines | truncate: 160 }}{% else -%}{{ site.description }}{% endif -%}">
18+
<meta property="og:description" content="{% if page.content -%}{{ page.content | markdownify | strip_html | strip_newlines | truncate: 160 }}{% else -%}{{ site.description }}{% endif -%}">
1919
<meta property="og:type" content="{% if page.title -%}article{% else -%}website{% endif -%}">
2020
<meta property="og:image" content="{{ site.url }}/assets/card.png">
2121

2222
<meta name="twitter:card" content="summary_large_image">
2323
<meta name="twitter:image" content="{{ site.url }}/assets/card.png">
2424
<meta name="twitter:title" content="{{ site.title }}">
25-
<meta name="twitter:description" content="{% if page.description -%}{{ page.description | strip_html | strip_newlines | truncate: 160 }}{% else -%}{{ site.description }}{% endif -%}">
25+
<meta name="twitter:description" content="{% if page.content -%}{{ page.content | markdownify | strip_html | strip_newlines | truncate: 160 }}{% else -%}{{ site.description }}{% endif -%}">
2626
</head>

‎.layouts/nav.html

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<div id="navbar">
2+
<nav>
3+
<a href="/" id="logo"><img width="120" height="44" src="/logo.svg" alt="JSON Feed" /></a>
4+
<a href="/spec/1.0" class="link">Spec</a>
5+
<a href="/docs/apps" class="link">Apps</a>
6+
<a href="https://github.com/obsidianmd/jsoncanvas" class="link">GitHub</a>
7+
</nav>
8+
9+
<hr>
10+
</div>

‎.layouts/node.html

-13
This file was deleted.

‎404.html

-11
This file was deleted.

‎404.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
---
2+
title: Not found
3+
permalink: /404.html
4+
layout: default
5+
---
6+
7+
<div class="container">
8+
<svg width="96" height="96" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
9+
<path d="M-4.36441e-06 102.115C-1.95401e-06 88.3294 11.1757 77.1537 24.9615 77.1538V77.1538C38.7474 77.1538 49.9231 88.3294 49.9231 102.115V102.115C49.9231 115.901 38.7474 127.077 24.9615 127.077V127.077C11.1757 127.077 -6.77481e-06 115.901 -4.36441e-06 102.115V102.115Z" fill="var(--color-ax-1)"/>
10+
<path d="M77.1538 24.9615C77.1538 11.1757 88.3295 1.95401e-06 102.115 4.36441e-06V4.36441e-06C115.901 6.77481e-06 127.077 11.1757 127.077 24.9615V24.9615C127.077 38.7474 115.901 49.9231 102.115 49.9231V49.9231C88.3295 49.9231 77.1538 38.7474 77.1538 24.9615V24.9615Z" fill="var(--color-ax-1)"/>
11+
<path fill-rule="evenodd" clip-rule="evenodd" d="M63.5386 104.102C63.5385 81.6995 81.699 63.539 104.101 63.539H113.462V82.2601H104.101C92.0384 82.2601 82.2597 92.0389 82.2597 104.102L82.2598 113.462L63.5386 113.462L63.5386 104.102Z" fill="var(--color-ax-1)"/>
12+
</svg>
13+
14+
<h1>404</h1>
15+
16+
<p>Whoops. You've found an unknown part of this infinite canvas. <a href="/">Head back home</a>.</p>
17+
</div>

‎Gemfile.lock

-4
Original file line numberDiff line numberDiff line change
@@ -295,11 +295,7 @@ PLATFORMS
295295

296296
DEPENDENCIES
297297
github-pages
298-
http_parser.rb (~> 0.6.0)
299298
jekyll-feed (~> 0.12)
300-
tzinfo (>= 1, < 3)
301-
tzinfo-data
302-
wdm (~> 0.1.1)
303299
webrick (~> 1.8)
304300

305301
BUNDLED WITH

‎_config.yml

+6-2
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,12 @@ defaults:
2020
- scope:
2121
path: "**/*"
2222
values:
23-
layout: "default"
23+
layout: "canvas"
2424
- scope:
2525
path: "spec/**/*.md"
2626
values:
27-
layout: "node"
27+
layout: "docs"
28+
- scope:
29+
path: "docs/**/*.md"
30+
values:
31+
layout: "docs"

‎apple-touch-icon.png renamed to ‎assets/apple-touch-icon.png

File renamed without changes.

‎assets/canvas.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,9 @@ const container = document.getElementById('canvas-nodes');
99
let isDragging = false;
1010
let isSpacePressed = false;
1111
let isPanning = false;
12+
1213
let startX = 0;
1314
let startY = 0;
14-
1515
let lastTouchX = 0;
1616
let lastTouchY = 0;
1717
let touchStartPanX = 0;
@@ -68,7 +68,7 @@ window.addEventListener('wheel', (e) => {
6868
}
6969
}, {passive: false});
7070

71-
71+
// Buttons
7272
document.getElementById('zoom-in').addEventListener('click', function() {
7373
scale = Math.min(scale + ZOOM_SPEED, maxScale);
7474
document.body.style.setProperty('--scale', scale);
@@ -235,6 +235,7 @@ function drawEdges() {
235235
});
236236
}
237237

238+
// Drag nodes
238239
document.querySelectorAll('.node .node-name').forEach(nodeName => {
239240
nodeName.addEventListener('mousedown', function(e) {
240241
if (isSpacePressed) return;
@@ -272,7 +273,7 @@ window.addEventListener('mouseup', function() {
272273
}
273274
});
274275

275-
//Panning
276+
// Panning
276277
window.addEventListener('keydown', function(e) {
277278
if (e.code === 'Space') {
278279
e.preventDefault();

‎icon.svg renamed to ‎assets/icon.svg

File renamed without changes.

‎assets/style.css

+73-18
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
--color-ui-1: #ddd;
1515
--color-ui-2: #bbb;
1616
--color-ui-3: #5E0641;
17+
--color-ax-1: #8B0A5F;
1718

1819
--color-selection: rgba(139,10,95,0.15);
1920
}
@@ -26,6 +27,8 @@
2627
--color-ui-1: #3F062D;
2728
--color-ui-2: #68154C;
2829
--color-ui-3: #b40e7a;
30+
--color-ax-1: #8B0A5F;
31+
2932
--color-selection: rgba(139,10,95,0.5);
3033
}
3134

@@ -64,10 +67,10 @@ body {
6467
color: var(--color-tx-1);
6568
}
6669

70+
/* Canvas area */
6771
#home {
6872
overflow: hidden;
6973
}
70-
7174
#container {
7275
touch-action: none;
7376
display: flex;
@@ -115,20 +118,11 @@ body {
115118
#arrowhead {
116119
fill: var(--color-ui-3);
117120
}
118-
119121
.will-pan {
120122
cursor: grab;
121123
}
122124

123-
#logo-lockup {
124-
display: flex;
125-
gap: 8px;
126-
font-size: 1.5em;
127-
font-weight: 800;
128-
text-decoration: none;
129-
align-items: center;
130-
}
131-
125+
/* Canvas output pane */
132126
#output.hidden {
133127
transform: translateX(120%);
134128
}
@@ -204,6 +198,37 @@ body {
204198
color: var(--color-tx-1);
205199
}
206200

201+
/* Pages */
202+
.page {
203+
padding: 36px;
204+
max-width: 48em;
205+
margin: 0 auto;
206+
}
207+
nav {
208+
padding: 24px 36px;
209+
max-width: 48em;
210+
margin: 0 auto;
211+
display: flex;
212+
align-items: center;
213+
gap: 4px;
214+
}
215+
nav #logo {
216+
flex-grow: 1;
217+
}
218+
nav .link {
219+
color: var(--color-ax-1);
220+
text-decoration: none;
221+
padding: 0.25em 0.5em;
222+
border-radius: 6px;
223+
}
224+
nav .link:hover {
225+
color: var(--color-bg-1);
226+
background-color: var(--color-ax-1);
227+
}
228+
.hidenav #navbar {
229+
display: none;
230+
}
231+
207232
/* Specific nodes */
208233
#logo {
209234
border-radius: 8px;
@@ -224,13 +249,9 @@ body {
224249
width: 480px;
225250
height: 480px;
226251
}
227-
#nav {
228-
padding-right: 36px;
229-
}
230-
.iframe {
231-
padding: 36px;
232-
max-width: 48em;
233-
margin: 0 auto;
252+
#nav .node-text-content {
253+
white-space: nowrap;
254+
padding-right: 72px;
234255
}
235256

236257
/* General node styling */
@@ -340,6 +361,12 @@ a {
340361
small {
341362
color: var(--color-tx-2);
342363
}
364+
hr {
365+
margin: 0;
366+
border: 0;
367+
height: 1px;
368+
background-color: var(--color-ui-1);
369+
}
343370
iframe {
344371
-webkit-appearance: none;
345372
border: none;
@@ -348,6 +375,9 @@ iframe {
348375
vertical-align: bottom;
349376
border-radius: 8px;
350377
}
378+
img {
379+
vertical-align: bottom;
380+
}
351381
code {
352382
-webkit-appearance: none;
353383
font-family: var(--font-mono);
@@ -389,6 +419,31 @@ li::marker {
389419
color: var(--color-tx-2);
390420
}
391421

422+
table {
423+
margin-top: 1.5em;
424+
margin-bottom: 2.5em;
425+
border-collapse:collapse;
426+
border-spacing:0;
427+
}
428+
tr {
429+
border-bottom: 1px solid var(--color-ui-1);
430+
}
431+
td {
432+
padding: 0.5em 1em 0.5em 0;
433+
line-height: 1.3;
434+
}
435+
th:not(:last-child) {
436+
padding-right: 1em;
437+
}
438+
td:last-child {
439+
padding-right: 0;
440+
}
441+
th {
442+
text-align: left;
443+
font-weight: 600;
444+
padding: 0 1em 0.5em 0;
445+
}
446+
392447
button {
393448
-webkit-tap-highlight-color: rgba(0,0,0,0);
394449
-ms-user-select: none;

‎docs/apps.md

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
# Apps and tools
2+
3+
JSON Canvas is supported by the following apps and tools. If you would like to add an app or tool to this list, please submit a pull request on [GitHub](https://github.com/obsidianmd/jsoncanvas).
4+
5+
## Apps
6+
7+
| Name | Storage | Import | Export |
8+
| ----------------------------------------------- | :-----: | :----: | :----: |
9+
| [Obsidian](https://obsidian.md/) | ✓ | ✓ | ✓ |
10+
| [Kinopio](https://kinopio.club/) | | ✓ | ✓ |
11+
| [Flowchart Fun](https://flowchart.fun/) | | ✓ | ✓ |
12+
| [hi-canvas](https://hi-canvas.marknoteapp.com/) | | ✓ | ✓ |
13+
14+
## Tools
15+
16+
- [Heptabase Export](https://github.com/link-ding/Heptabase-Export)
17+
18+
## Libraries
19+
20+
- [Rust crate](https://crates.io/crates/jsoncanvas)
21+
- [TypeScript Library](https://npmjs.com/package/@trbn/jsoncanvas)

0 commit comments

Comments
 (0)