feat: implement basic info display for anemos

app/assets/stylesheets/application.css

@@ -1,10 +1,82 @@
-/*
- * This is a manifest file that'll be compiled into application.css.
- *
- * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
- * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
- * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
- * depending on specificity.
- *
- * Consider organizing styles into separate files for maintainability.
- */
+body {
+    font-family: sans-serif;
+    margin: 40px;
+}
+
+header {
+    display: flex;
+    align-items: center;
+    gap: 3px;
+    margin-bottom: 10px;
+}
+
+header h1 {
+    margin: 0;
+}
+
+header .muted {
+    color: #666;
+    font-weight: normal;
+}
+
+.new-buttons {
+    display: flex;
+    gap: 5px;
+}
+
+.new-button {
+    padding: 10px;
+}
+
+.nm-list {
+
+}
+
+.nm-list section {
+    margin-bottom: 5px;
+    display: grid;
+    grid-template-columns: .05fr 1fr 1fr .5fr;
+    align-items: center;
+    padding: 0 10px;
+    background-color: #eee;
+}
+
+img {
+    vertical-align: middle;
+}
+
+h3.nm-info {
+    margin: 0;
+    display: inline-block;
+}
+
+.spawn-info {
+    display: inline-block;
+    font-size: 14px;
+    opacity: .6;
+}
+
+.badge {
+    font-size: 12px;
+    font-weight: bold;
+    border: 1px solid black;
+    vertical-align: middle;
+    padding: 1px 6px;
+    border-radius: 10px;
+    font-family: monospace;
+}
+
+small.badge {
+    font-size: 10px;
+}
+
+button.action {
+    width: 100%;
+    height: 100%;
+}
+
+section .meta {
+    padding-left: 10px;
+    padding-top: 4px;
+    padding-bottom: 4px;
+}

app/controllers/instance_controller.rb

@@ -0,0 +1,26 @@
+class InstanceController < ApplicationController
+  def create
+    zone = create_instance_params
+    public_id = Nanoid.generate(size: 6)
+    name = Spicy::Proton.pair(" ")
+    password = Nanoid.generate(size: 3, alphabet: "0123456789")
+    instance = Instance.new(zone: zone, public_id: public_id, name: name, password: password)
+    if instance.save
+      redirect_to(show_instance_path(public_id: public_id))
+    end
+  end
+
+  def show
+    @instance = Instance.find_by(public_id: show_instance_params)
+  end
+
+  private
+
+  def create_instance_params
+    params.expect(:zone)
+  end
+
+  def show_instance_params
+    params.expect(:public_id)
+  end
+end

app/controllers/page_controller.rb

@@ -0,0 +1,4 @@
+class PageController < ApplicationController
+  def index
+  end
+end

app/helpers/instance_helper.rb

@@ -0,0 +1,2 @@
+module InstanceHelper
+end

app/helpers/page_helper.rb

@@ -0,0 +1,2 @@
+module PageHelper
+end

app/models/instance.rb

@@ -0,0 +1,3 @@
+class Instance < ApplicationRecord
+  validates :zone, inclusion: { in: %w[anemos pagos pyros hydatos] }
+end

app/views/instance/_zone_img.html.erb

@@ -0,0 +1,9 @@
+<% if zone == "anemos" %>
+  <img src="/wind.png" width="35" alt=<%= alt %> title=<%= title %> />
+<% elsif zone == "pagos" %>
+  <img src="/ice.png" width="35" alt=<%= alt %> title=<%= title %> />
+<% elsif zone == "pyros" %>
+  <img src="/fire.png" width="35" alt=<%= alt %> title=<%= title %> />
+<% elsif zone == "hydatos" %>
+  <img src="/water.png" width="35" alt=<%= alt %> title=<%= title %> />
+<% end %>

app/views/instance/show.html.erb

@@ -0,0 +1,40 @@
+<header>
+  <img src="/icon.png" width="50" alt="eureka.coffee logo" />
+  <h1><span class="muted">instance</span> <%= @instance.name %></h1>
+  <%= render partial: "zone_img", locals: { zone: @instance.zone, alt: @instance.zone, title: @instance.zone.upcase_first } %>
+</header>
+
+<main class="nm-list">
+  <% APP_DATA[@instance.zone.to_sym][:nms].each do |nm| %>
+    <section class="<%= nm[:element] %>">
+      <div>
+        <img src="<%= "/#{nm[:element]}.png" %>" alt="<%= nm[:element] %>" width="30" />
+      </div>
+      <div class="meta">
+        <h3 class="nm-info">
+          <span class="badge">LV<%= nm[:level].to_s.rjust(2, "0") %></span>
+          <%= nm[:name] %>
+          <% if nm[:weather] %>
+            <img src="/<%= nm[:weather] %>.png" title="during <%= nm[:weather] %> only" width="15" />
+          <% end %>
+        </h3>
+        <div class="spawn-info">
+          «
+          <strong><%= nm[:spawned_by][:name] %></strong>
+          <% if nm[:spawned_by][:night_only] %>
+            <span title="only at night">🌙</span>
+          <% end %>
+          <% if nm[:spawned_by][:weather] %>
+            <img src="/<%= nm[:spawned_by][:weather] %>.png" title="during <%= nm[:spawned_by][:weather] %> only" width="15" />
+          <% end %>
+          <small class="badge">LV<%= nm[:spawned_by][:level].to_s.rjust(2, "0") %></small>
+
+        </div>
+      </div>
+      <div></div>
+      <div>
+        <button class="action">Pop</button>
+      </div>
+    </section>
+  <% end %>
+</main>

app/views/layouts/application.html.erb

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title><%= content_for(:title) || "Ecoffee" %></title>
+    <title><%= content_for(:title) || "eureka.coffee" %></title>
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="mobile-web-app-capable" content="yes">
@@ -14,7 +14,6 @@
     <%#= tag.link rel: "manifest", href: pwa_manifest_path(format: :json) %>
 
     <link rel="icon" href="/icon.png" type="image/png">
-    <link rel="icon" href="/icon.svg" type="image/svg+xml">
     <link rel="apple-touch-icon" href="/icon.png">
 
     <%# Includes all stylesheet files in app/assets/stylesheets %>

app/views/page/index.html.erb

@@ -0,0 +1,34 @@
+<header>
+  <img src="/icon.png" width="50" alt="eureka.coffee logo" />
+  <h1>eureka.coffee</h1>
+</header>
+
+<div class="new-buttons">
+  <%= form_tag "/new?zone=anemos", method: :post do %>
+    <button type="submit" class="new-button">
+      <img src="/wind.png" width="50" alt="Wind" /><br/>
+      Anemos
+    </button>
+  <% end %>
+
+  <%= form_tag "/new?zone=pagos", method: :post do %>
+    <button type="submit" class="new-button">
+      <img src="/ice.png" width="50" alt="Wind" /><br/>
+      Pagos
+    </button>
+  <% end %>
+
+  <%= form_tag "/new?zone=pyros", method: :post do %>
+    <button type="submit" class="new-button">
+      <img src="/fire.png" width="50" alt="Wind" /><br/>
+      Pyros
+    </button>
+  <% end %>
+
+  <%= form_tag "/new?zone=hydatos", method: :post do %>
+    <button type="submit" class="new-button">
+      <img src="/water.png" width="50" alt="Wind" /><br/>
+      Hydatos
+    </button>
+  <% end %>
+</div>