Skip to content

make doc site better with wasm #21

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Dishpit merged 1 commit into from
Jun 2, 2025
Merged

make doc site better with wasm #21

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 28 additions & 1 deletion Makefile
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -148,11 +148,32 @@ $(BIN_DIR)/gemch: $(SRC_FILES) $(VERSION_HEADER)
$(CC) $(SRC_FILES) -o $(BIN_DIR)/gemch $(CFLAGS) $(LDFLAGS)
@echo "Built: $(BIN_DIR)/gemch (without standard library) - version $(VERSION_STRING)"

# WASM build targets
EMCC = emcc
WASM_CFLAGS = -O3 -s WASM=1 -s EXPORTED_RUNTIME_METHODS='["ccall","cwrap"]' -s ALLOW_MEMORY_GROWTH=1 -s MODULARIZE=1 -s EXPORT_NAME="GemModule" -s ENVIRONMENT=web -s EXPORTED_FUNCTIONS='["_gem_init","_gem_cleanup","_gem_clear_output","_gem_get_output","_gem_add_to_output","_gem_interpret","_gem_get_version","_gem_is_initialized"]'
WASM_SRC_FILES = $(filter-out $(SRC_DIR)/main.c, $(SRC_FILES))

# Build WASM version with standard library
$(DOCS_DIR)/gem.js: $(WASM_SRC_FILES) $(EMBEDDED_STL_HEADER) $(VERSION_HEADER)
@echo "Building Gem interpreter for WebAssembly with standard library..."
$(EMCC) $(WASM_SRC_FILES) -o $(DOCS_DIR)/gem.js $(WASM_CFLAGS) -DWITH_STL -DSTL_PATH='"$(STL_DIR)"'
@echo "Built: $(DOCS_DIR)/gem.js and $(DOCS_DIR)/gem.wasm (with standard library) - version $(VERSION_STRING)"

# Build WASM version without standard library
$(DOCS_DIR)/gem-no-stl.js: $(WASM_SRC_FILES) $(VERSION_HEADER)
@echo "Building Gem interpreter for WebAssembly without standard library..."
$(EMCC) $(WASM_SRC_FILES) -o $(DOCS_DIR)/gem-no-stl.js $(WASM_CFLAGS)
@echo "Built: $(DOCS_DIR)/gem-no-stl.js and $(DOCS_DIR)/gem-no-stl.wasm (without standard library) - version $(VERSION_STRING)"

# Convenience targets
gemc: $(BIN_DIR)/gemc

gemch: $(BIN_DIR)/gemch

wasm: $(DOCS_DIR)/gem.js

wasm-no-stl: $(DOCS_DIR)/gem-no-stl.js

# Alternative target for --no-stl flag
no-stl: $(BIN_DIR)/gemch

Expand All @@ -170,6 +191,8 @@ clean:
rm -rf $(BIN_DIR)
rm -f $(EMBEDDED_STL_HEADER)
rm -f $(VERSION_HEADER)
rm -f $(DOCS_DIR)/gem.js $(DOCS_DIR)/gem.wasm
rm -f $(DOCS_DIR)/gem-no-stl.js $(DOCS_DIR)/gem-no-stl.wasm

# Install to system (optional)
install: $(BIN_DIR)/gemc
Expand Down Expand Up @@ -202,6 +225,8 @@ help:
@echo " all - Build gemc with standard library (default)"
@echo " gemc - Build gemc with standard library"
@echo " gemch - Build gemch without standard library"
@echo " wasm - Build WebAssembly version with standard library"
@echo " wasm-no-stl - Build WebAssembly version without standard library"
@echo " no-stl - Alias for gemch (without standard library)"
@echo " version - Show current version information"
@echo " version-update- Update version and rebuild everything"
Expand All @@ -214,15 +239,17 @@ help:
@echo ""
@echo "Build output:"
@echo " Binaries are built in the $(BIN_DIR)/ directory"
@echo " WASM files are built in the $(DOCS_DIR)/ directory"
@echo ""
@echo "Version management:"
@echo " Edit $(VERSION_CONF) to change version"
@echo " Run 'make version-update' to apply changes everywhere"
@echo ""
@echo "Examples:"
@echo " make # Build with standard library ($(BIN_DIR)/gemc)"
@echo " make wasm # Build WebAssembly version ($(DOCS_DIR)/gem.js)"
@echo " make version # Show current version"
@echo " make version-update# Update version and rebuild"
@echo " make clean # Clean build artifacts"

.PHONY: gemc gemch clean install uninstall test help no-stl version version-update update-docs
.PHONY: gemc gemch clean install uninstall test help no-stl version version-update update-docs wasm wasm-no-stl
20 changes: 20 additions & 0 deletions docs/gem.js
View file
Open in desktop

Large diffs are not rendered by default.

Binary file added docs/gem.wasm
View file
Open in desktop
Binary file not shown.
121 changes: 84 additions & 37 deletions docs/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@
<title>Gem Programming Language</title>
<link rel="stylesheet" href="styles.css">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<!-- Prism.js for syntax highlighting -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css" rel="stylesheet" />
</head>
<body>
<nav class="navbar">
Expand Down Expand Up @@ -53,51 +55,90 @@ <h1 class="hero-title">
<a href="https://github.com/SimuCorps/Gem" class="btn btn-secondary" target="_blank">View on GitHub</a>
</div>
</div>
<div class="hero-code">
<div class="code-window">
<div class="code-header">
<div class="code-dots">
<span class="dot red"></span>
<span class="dot yellow"></span>
<span class="dot green"></span>
</div>
<span class="code-title">hello.gem</span>
</div>
<pre class="code-content"><code># Type-safe variables with mutability control
string name = "Alice" # Immutable
# name = "Bob" # ❌ Error: Cannot modify immutable
<div class="hero-interactive">
<div class="interactive-demo">
<div class="demo-file">
<div class="code-window">
<div class="code-header">
<div class="code-dots">
<span class="dot red"></span>
<span class="dot yellow"></span>
<span class="dot green"></span>
</div>
<span class="code-title">hello.gem</span>
<button class="run-button" onclick="runGemCode()">▶ Run</button>
</div>
<div class="code-editor">
<div class="editor-container">
<div class="line-numbers" id="line-numbers"></div>
<div class="editor-wrapper">
<pre class="syntax-highlight"><code class="language-ruby" id="syntax-highlight"></code></pre>
<textarea id="gem-editor" spellcheck="false">
# Type Safety - Variables are immutable by default
string message = "Hello, World!"
string name = "Gem Developer"

# Use 'mut' keyword for mutable variables (recommended)
mut int counter = 0 # Mutable with mut
counter = counter + 1 # ✅ Valid: counter is mutable
# Mutable variables with explicit declaration
mut int counter = 0

# Alternative syntax with '!' suffix
int! altCounter = 0 # Mutable with ! (alternative)
altCounter = altCounter + 1 # ✅ Valid: altCounter is mutable
string? nickname = nil # Nullable
# Memory Safety - Automatic scope-based cleanup
begin
string betelgeusian = "Zaphod Beeblebrox"
# betelgeusian automatically cleaned up here
end

# Functions with type safety
def greet(string name, int age) string
return "Hello #{name}, age #{age}"
# Functions with explicit return types (Type Safety)
def greet(string person) string
return "Welcome to Gem, #{name}!"
end

# Classes with inheritance
class Person
def init(string name) void
this.name = name
end

def introduce() string
return "I'm #{this.name}"
# Recursive Fibonacci (Performance + Safety)
def fibonacci(int n) int
counter = counter + 1 # Track function calls
if (n <= 1)
return n
end
return fibonacci(n - 1) + fibonacci(n - 2)
end

# Memory-safe scoping
begin
obj person = Person("Bob")
puts person.introduce()
# person automatically cleaned up here
end</code></pre>
puts message
puts greet(name)
puts "Fibonacci of 30: #{fibonacci(30)}"
puts "Function calls made: #{counter}"
puts "Gem makes programming safe and beautiful!"
# Uncomment this line to see memory safety in action
# puts "Betelgeusian: #{betelgeusian}"
</textarea>
</div>
</div>
</div>
</div>
</div>
<div class="demo-terminal">
<div class="terminal-window">
<div class="terminal-header">
<div class="terminal-dots">
<span class="dot red"></span>
<span class="dot yellow"></span>
<span class="dot green"></span>
</div>
<span class="terminal-title">Terminal</span>
<button class="clear-button" onclick="clearTerminal()">Clear</button>
</div>
<div class="terminal-content" id="terminal-output">
<div class="terminal-line">
<span class="terminal-prompt">$ </span>
<span class="terminal-command">gemc hello.gem</span>
</div>
<div class="terminal-output-text">
Loading Gem interpreter...
</div>
</div>
</div>
</div>
</div>
<div class="demo-description">
<p>✨ <strong>Try it yourself!</strong> Edit the code above and click "Run" to see Gem in action. This is a real Gem interpreter running in your browser - experience the language's safety and elegance firsthand.</p>
</div>
</div>
</div>
Expand Down Expand Up @@ -275,6 +316,12 @@ <h3>Functions & Classes</h3>
</div>
</footer>

<!-- Scripts -->
<script src="gem.js"></script>
<script src="script.js"></script>
<!-- Prism.js for syntax highlighting -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-ruby.min.js"></script>
</body>
</html>
Loading
Loading