heex login screen added

assets/css/app.css

@@ -2,4 +2,92 @@
 @import "tailwindcss/components";
 @import "tailwindcss/utilities";
 
-/* This file is for your main application CSS */
+
+
+body {
+	font-family: Arial, sans-serif;
+	background-color: #f7f7f7;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	height: 100vh;
+	margin: 0;
+}
+header {
+	width: 100%;
+	background-color: #0d1547;
+	padding: 15px 0;
+	text-align: center;
+	color: rgb(255, 241, 233);
+	font-size: 18px;
+	font-weight: bold;
+	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+	position: fixed;
+	top: 0;
+	left: 0;
+	z-index: 1000;
+}
+.login-container {
+	background-color: #fff;
+	padding: 20px;
+	border-radius: 8px;
+	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+	width: 300px;
+}
+h2 {
+	margin-bottom: 20px;
+	color: #333;
+	text-align: center;
+}
+.input-group {
+	margin-bottom: 15px;
+}
+.input-group label {
+	display: block;
+	margin-bottom: 5px;
+	color: #555;
+}
+.input-group input {
+	width: 100%;
+	padding: 10px;
+	border: 1px solid #ccc;
+	border-radius: 4px;
+}
+.login-button {
+	width: 100%;
+	padding: 10px;
+	background-color: #0d1547;
+	color: #fff;
+	border: none;
+	border-radius: 4px;
+	cursor: pointer;
+	font-size: 16px;
+}
+.login-button:hover {
+	background-color: #0d1547;
+}
+
+.gallery-container {
+	display: grid;
+	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+	grid-gap: 10px;
+	padding: 10px;
+}
+.gallery-item {
+	background-color: #fff;
+	padding: 10px;
+	border-radius: 8px;
+	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+	text-align: center;
+}
+.gallery-item img {
+	max-width: 100%;
+	height: auto;
+	border-radius: 4px;
+}
+.gallery-item p {
+	margin-top: 10px;
+	font-size: 14px;
+	color: #555;
+}

assets/js/app.js

@@ -42,3 +42,33 @@ liveSocket.connect()
 // >> liveSocket.disableLatencySim()
 window.liveSocket = liveSocket
 
+function initialize_gallery() {
+	document.addEventListener('DOMContentLoaded', function() {
+		const imagePaths = [
+			'image1.jpg',
+			'image2.jpg',
+			'image3.jpg',
+			'image4.jpg',
+			'image5.jpg'
+			// Add more image filenames here
+		];
+
+		const gallery = document.getElementById('gallery');
+
+		imagePaths.forEach(function(image) {
+			const item = document.createElement('div');
+			item.className = 'gallery-item';
+
+			const img = document.createElement('img');
+			img.src = '/images/' + image;
+			img.alt = image;
+
+			const caption = document.createElement('p');
+			caption.textContent = image;
+
+			item.appendChild(img);
+			item.appendChild(caption);
+			gallery.appendChild(item);
+		});
+	});
+}

lib/draincloud_core/application.ex

@@ -10,6 +10,7 @@ defmodule DrainCloudCore.Application do
     children = [
       DrainCloudCoreWeb.Telemetry,
       DrainCloudCore.Repo,
+      # DrainCloudCore.Rtc,
       {DNSCluster, query: Application.get_env(:draincloud_core, :dns_cluster_query) || :ignore},
       {Phoenix.PubSub, name: DrainCloudCore.PubSub},
       # Start a worker by calling: DrainCloudCore.Worker.start_link(arg)

lib/draincloud_core/auth/auth.ex

@@ -0,0 +1,5 @@
+defmodule DraincloudCore.Auth do
+  def is_logon(token) :: boolean() do
+
+  end
+end

lib/draincloud_core/rtc.ex

@@ -1,3 +1,103 @@
-defmodule DraincloudCore.Rtc do
+defmodule DrainCloudCore.Rtc.Application do
-  # Real Time Config module
+  use Application
+
+  def child_spec(opts) do
+    %{
+      id: __MODULE__,
+      start: {__MODULE__, :start_link, [opts]},
+      shutdown: 5_000,
+      restart: :permanent,
+      type: :supervisor
+    }
+  end
+  def start_link(_) do
+    children = [
+      DrainCloudCore.Rtc
+    ]
+
+    opts = [strategy: :one_for_one, name: DrainCloudCore.Rtc.Supervisor]
+    Supervisor.start_link(children, opts)
+  end
+end
+
+defmodule DrainCloudCore.Rtc do
+  alias :mnesia, as: Mnesia
+  alias :logger, as: Log
+
+  use GenServer
+
+  # Real-time config table schemas
+  @config_web [attributes: [
+    :host,
+    :enable_https,
+    :port,
+  ]]
+
+  @config_pg [attributes: [
+    :host,
+    :port,
+    :ssl,
+    :user,
+    :password,
+    :db,
+  ]]
+
+
+  @config_s3 [attributes: [
+        :host,
+        :port,
+        # user / secret / secrets etc...
+      ]]
+
+  # def child_spec(opts) do
+  #   %{
+  #     id: __MODULE__,
+  #     start: {__MODULE__, :start_link, [opts]},
+  #     shutdown: 5_000,
+  #     restart: :permanent,
+  #     type: :worker
+  #   }
+  # end
+
+  def start_link(default) when is_list(default) do
+    GenServer.start_link(__MODULE__, default)
+  end
+
+  @impl true
+  def init(stack) do
+    {:ok, stack}
+  end
+
+  @impl true
+  def handle_call(:pop, _from, [head | tail]) do
+    {:reply, head, tail}
+  end
+
+  @impl true
+  def handle_cast({:push, element}, state) do
+    {:noreply, [element | state]}
+  end
+
+  def fetch_config() do
+    # Mnesia.read()
+  end
+  def init() do
+    Log.info("[#{__MODULE__}] start initializin RTC subsystems")
+
+    if Mnesia.create_schema([node()]) != :ok do
+      Log.warning("[#{__MODULE__}] schema #{node()} not created. skipping")
+    end
+
+    if Mnesia.create_table(DrainCloudRtcWeb, @config_web) != {:atomic, :ok} do
+      Log.warning("[#{__MODULE__}] table config_web not created. skipping")
+    end
+
+    if Mnesia.create_table(DrainCloudRtcPG, @config_pg) != {:atomic, :ok} do
+      Log.warning("[#{__MODULE__}] schema config_pg not created. skipping")
+    end
+
+    if Mnesia.create_table(DrainCloudRtcS3, @config_s3) != {:atomic, :ok} do
+      Log.warning("[#{__MODULE__}] schema config_s3 not created. skipping")
+    end
+  end
 end

lib/draincloud_core_web/components/layouts/root.html.heex

@@ -8,6 +8,7 @@
       <%= assigns[:page_title] || "DrainCloudCore" %>
     </.live_title>
     <link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
+	<script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
 	<script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
     </script>
   </head>

lib/draincloud_core_web/controllers/page_controller.ex

@@ -1,9 +1,14 @@
 defmodule DrainCloudCoreWeb.PageController do
   use DrainCloudCoreWeb, :controller
-
+  def home(conn, _params) when is_logon(conn) do
-  def home(conn, _params) do
     # The home page is often custom made,
     # so skip the default app layout.
+
+    if Map.has_key?(conn.req_headers, 'x-access-token') do
+      {_, token} = Map.fetch(conn.req_headers, 'x-access-token')
+
+    end
+
     render(conn, :home, layout: false)
   end
 end

lib/draincloud_core_web/controllers/page_html/home.html.heex

@@ -1 +1,17 @@
-<h1>Hello</h1>
+<header>
+	DrainCloud
+</header>
+<div class="login-container">
+	<h2>Login</h2>
+	<form action="/login" method="post">
+		<div class="input-group">
+			<label for="username">Username</label>
+			<input type="text" id="username" name="username" required>
+		</div>
+		<div class="input-group">
+			<label for="password">Password</label>
+			<input type="password" id="password" name="password" required>
+		</div>
+		<button type="submit" class="login-button">Login</button>
+	</form>
+</div>

lib/draincloud_core_web/controllers/page_html/login.html.heex

@@ -0,0 +1,17 @@
+<header>
+	DrainCloud
+</header>
+<div class="login-container">
+	<h2>Login</h2>
+	<form action="/login" method="post">
+		<div class="input-group">
+			<label for="username">Username</label>
+			<input type="text" id="username" name="username" required>
+		</div>
+		<div class="input-group">
+			<label for="password">Password</label>
+			<input type="password" id="password" name="password" required>
+		</div>
+		<button type="submit" class="login-button">Login</button>
+	</form>
+</div>

mix.exs

@@ -19,7 +19,7 @@ defmodule DrainCloudCore.MixProject do
   def application do
     [
       mod: {DrainCloudCore.Application, []},
-      extra_applications: [:logger, :runtime_tools]
+      extra_applications: [:logger, :runtime_tools, :mnesia]
     ]
   end
 

schemas/users.sql

@@ -0,0 +1,5 @@
+create table users (
+	id bigserial, 
+	login varchar(50), 
+	password varchar(256)
+);