#inject runtime.vars {
Enable_Heap_Debug :: true
- // Debug :: true
+ Debug :: true
}
reg: otmp.TemplateRegistry;
#inject Res {
render :: (r: &Res, template: str, vars: any) {
- s := reg->render_template(template, &r.writer, .{ vars.data, vars.type });
+ m := misc.any_to_map(vars) ?? make(Map(str, any));
+ s := reg->render_template(template, &r.writer, &m);
if s != .None {
log(.Warning, "Template Renderer", tprintf("{}", s));
h1 {
min-width: 100px;
- font-size: 2.5rem;
+ font-size: 3rem;
+}
+
+h2 {
+ font-size: 2rem;
}
h1, h2, h3, h4, h5, h6 {
navbar a span {
display: inline-block;
padding: 12px 24px;
+ transition: all 0.3s;
+}
+
+navbar a span.active {
+ border-bottom: 3px solid var(--active-color);
}
navbar a span:hover {
}
main pre {
- border: 2px solid var(--dark-background-color);
- border-radius: 4px;
+ border: 0px solid var(--dark-background-color);
+ border-radius: 6px;
box-shadow: 0px 1px 6px 1px rgba(0, 0, 0, 0.2);
padding: 8px;
display: block;
overflow-y: auto;
overflow-x: auto;
+ margin-top: 10px !important;
}
pre code {
<link rel="stylesheet" href="/static/vendor/highlight.min.css">
<script src="/static/vendor/highlight.min.js"></script>
<script defer>
+ hljs.cssSelector = "pre code.language-onyx"
hljs.highlightAll();
</script>
Onyx Documentation
{{ endblock }}
+{{ let navbar_page = "docs" }}
+
{{ block "page_content" }}
<div class="container">
{{block "title"}}Onyx Installation{{endblock}}
+{{ let navbar_page = "docs" }}
+
{{ block "page_content" }}
<div class="container">
{{block "title"}}Onyx Environment Setup{{endblock}}
+{{ let navbar_page = "docs" }}
+
{{ block "page_content" }}
<div class="container">
<h1>Setting Up Your Environment for Onyx</h1>
+
+ <p>The following sections will help set up an environment for you to program Onyx effectively.</p>
+
<p>
<a class="link-button" href="#lsp">LSP</a>
<a class="link-button" href="#vim">Vim / Neovim</a>
<a class="link-button" href="#sublime-text">Sublime text</a>
<a class="link-button" href="#emacs">Emacs</a>
</p>
+
+ <p style="opacity: 0.5; font-size: 0.75em">
+ (If you don't see your favorite editor here, consider making a <a href="https://github.com/onyx-lang/onyx/issues">issue</a>!)
+ </p>
</div>
-<div class="container" id="lsp">
+<div class="container light" id="lsp">
<h2>Language Server</h2>
<p>
If you are unfamiliar, a <em>Language Server</em> abstracts the tooling and language specific functionality out of editors and into a reusable component.
}</pre></code>
</div>
-<div class="container light" id="vim">
+<div class="container " id="vim">
<h2>Vim / Neovim</h2>
<p>
Follow the instructions on the <a href="https://github.com/onyx-lang/onyx.vim">onyx.vim</a> GitHub repo.
</p>
</div>
-<div class="container" id="vscode">
+<div class="container light" id="vscode">
<h2>Visual Studio Code</h2>
<p>
Currently, Onyx does not have a published extension for Visual Studio Code, but you are able to install it manually. In your downloaded or cloned copy of Onyx, there is a <code>misc/vscode</code> folder, which contains multiple versions of the Onyx extension.
<p>This extension does have support for the <code>onyx-lsp</code>, assuming that is setup.
</div>
-<div class="container light" id="sublime-text">
+<div class="container " id="sublime-text">
<h2>Sublime Text</h2>
<p>
Currently, Onyx does not have a published package on Sublime Text's Package Control, but like VS Code, you are able to install it manually. In the <code>misc</code> folder, there is a file called <code>onyx.sublime-syntax</code>. Simply copy this into the <code>Packages/User</code> folder for Sublime Text. See more details <a href="https://www.sublimetext.com/docs/packages.html">here</a>.
</p>
</div>
-<div class="container" id="emacs">
+<div class="container light" id="emacs">
<h2>Emacs</h2>
<p>
Currently, Onyx does not have a published package for Emacs. In the <code>misc</code> folder, there is an Emacs Lisp file that provides an <code>onyx-mode</code>. You should be able to load it into your Emacs config and enable <code>onyx-mode</code> to get syntax highlighting.
The Onyx Programming Language
{{ endblock }}
+{{ let navbar_page = "home" }}
+
{{ block "page_content" }}
-<div class="container center" style="margin: 0 auto">
-<h1>The <b>Onyx</b> Programming Language</h1>
+<div class="container">
+ <div style="text-align: center;">
+ <h1>The <b>Onyx</b> Programming Language</h1>
+ </div>
+ <div style="font-size: 20pt; text-align: center; margin-top: 8px">
+ <p>A data-oriented, safe, and modern programming language</p>
+ </div>
+</div>
+
+<div class="container light">
+ <h2 style="margin-bottom: 8px">Recent News</h2>
</div>
+{% partial "partials/news_listing" %}
-<div class="container light center" style="font-size: 24pt">
-<p><b>Onyx</b> is a data-oriented, safe, and modern programming language for application development</p>
+<div class="container light">
+ <h2>Overview</h2>
</div>
<div class="container">
-<div class="split right-40">
<div>
- <h2>Overview</h2>
+ <h2>Syntax</h2>
<br />
-
- <ul style="font-size: larger;">
- <li>Runs everywhere using <a href="https://webassembly.org">WebAssembly</a></li>
- <li>Lightning fast compilation</li>
- <li>Self-hosted, debuggable runtime using <a href="/news/ovmwasm">OVM-Wasm</a></li>
- <li>Secure and fast runtime using <a href="https://wasmer.io">Wasmer</a></li>
- </ul>
+ <p>Onyx uses a modernized C-like syntax, similar to Jai or Odin. Start learning the syntax from official <a href="https://docs.onyxlang.io/book">Language Reference Book</a>.</p>
</div>
- <pre class="hljs"><code class="language-onyx">use core {println}
+ <pre class="hljs"><code class="language-onyx">use core { printf, iter }
main :: () {
- f := factorial(10);
- println(f);
+ for i: 1 .. 10 {
+ fact := factorial(i);
+ printf("{}! = {}\n", i, fact);
+ }
}
factorial :: (n: i32) -> i32 {
- k := 1;
- for 1 .. n+1 do k *= it;
- return k;
+ return iter.as_iter(1 .. n)
+ |> iter.fold(1, (x, y) => x * y);
}
</code></pre>
</div>
+
+<div class="container light">
+ <div>
+ <h2>Type Safety</h2>
+ <br />
+ <p>Onyx is <b>strictly</b> type-checked. However, the type-inference systems in Onyx usually allow you to omit types.</p>
+ </div>
+
+ <pre class="hljs"><code class="language-onyx">use core { printf }
+
+main :: () {
+ // Inferred variable type
+ x := 10;
+
+ // Function with entirely infered types.
+ change_value :: x => x + 10;
+
+ // Onyx figures out the types of `change_value` when you call it.
+ printf("The value is {}.\n", change_value(x));
+}
+</code></pre>
+
+</div>
+
+<div class="container">
+ <div>
+ <h2>Compilation</h2>
+ <br />
+ <p>Onyx's compiler is written entirely in C and features incredibly fast compilation. The web-server for this website was compiled in <b>49 milliseconds</b>.</p>
+ </div>
+
+ <pre class="hljs"><code>$ onyx build -V ./src/app.onyx
+File search path:
+ /usr/share/onyx
+ .
+
+Type table size: 131244 bytes.
+Foreign blocks size: 8 bytes.
+Tagged procedure size: 504 bytes.
+Tagged global size: 8 bytes.
+
+Statistics:
+ Time taken: 49.000000 ms
+ Processed 20607 lines (420551.031250 lines/second).
+ Processed 107338 tokens (2190571.500000 tokens/second)
+</code></pre>
</div>
<div class="container light">
+ <div>
+ <h2>WebAssembly</h2>
+ <br />
+ <p>Onyx compiles solely to <a href="https://webassembly.org">WebAssembly</a>. You can use the builtin WebAssembly runtime using <code>onyx run</code>, or compile to WASM and run using a WebAssembly runner, like Wasmer or Wasmtime.</p>
+ </div>
+
+ <pre class="hljs"><code># Compile and run directly.
+$ onyx run hello.onyx
+Hello, World!
+
+# This time target 'WASI'.
+$ onyx build -r wasi -o hello.wasm hello.onyx
+
+# Run using Wasmer.
+$ wasmer run hello.wasm
+Hello, World!
+</code></pre>
+</div>
+
+<div class="container">
+ <div>
+ <h2>C-FFI</h2>
+ <br />
+ <p>Onyx features built-in support for linking to native C-libraries.</p>
+ </div>
+
+ <pre class="hljs"><code class="language-onyx">use core {*}
+
+// Using #dyncall dynamically loads the library at runtime.
+#foreign #dyncall "libc.so" {
+ write :: (fd: i32, data: [&] u8, count: i32) -> i32 ---
+}
+
+main :: () {
+ msg: [] u8 = "Hello, libc!";
+
+ write(1, msg.data, msg.length);
+}
+ </code></pre>
+</div>
+
+</div>
+</div>
+
+<!-- <div class="container light">
<h2 style="margin-bottom: 8px">Features</h2>
<div class="panel-container">
<p>Onyx enables programmer expressiveness, while making it easy to write bug-free code.</p>
</div>
</div>
-</div>
+</div> -->
-<div class="container">
- <h2 style="margin-bottom: 8px">Recent News</h2>
- {% partial "partials/news_listing" %}
-</div>
{{endblock}}
{{block "title"}}Onyx News{{endblock}}
+{{ let navbar_page = "news" }}
+
{{block "page_content"}}
<div class="container">
{{block "title"}}Onyx News - {% $article.name %}{{endblock}}
+{{ let navbar_page = "news" }}
+
{{block "content"}}
<main>
</span>
<div>
- <a href="/"><span>Home</span></a>
+ <a href="/"><span {{ if navbar_page == "home" }} class="active" {{ endif }}>Home</span></a>
<a target="_blank" href="/playground/"><span>Try Online</span></a>
- <a href="/docs"><span>Docs</span></a>
- <a href="/news"><span>News</span></a>
+ <a href="/docs"><span {{ if navbar_page == "docs" }} class="active" {{ endif }}>Docs</span></a>
+ <a href="/news"><span {{ if navbar_page == "news" }} class="active" {{ endif }}>News</span></a>
<a href="https://github.com/onyx-lang/onyx" target="_blank"><span>GitHub</span></a>
</div>
</navbar>
{{ foreach $article in $articles }}
<div class="container">
- <h2><a href="/news/{% $article.path %}">{% $article.name %}</a></h2>
- <p><em>{% $article.date %}</em></p>
- <p>
- {% $article.description %}
- </p>
+ <div style="background: var(--light-background-color); padding: 32px; border-radius: 6px; box-shadow: 0px 1px 6px 1px rgba(0, 0, 0, 0.2)">
+ <a href="/news/{% $article.path %}" style="color: var(--foreground-color)">
+ <h2 style="float: left; margin: 0;">{% $article.name %}</h2>
+ <p style="float: right"><em>{% $article.date %}</em></p>
+ <br>
+ <p style="clear:both;">
+ {% $article.description %}
+ </p>
+ </a>
+ </div>
</div>
{{ endforeach }}
projects / onyxlang.io.git / commitdiff