herocode/hostbasket
Archived
13
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

...

Browse Source
This commit is contained in:
despiegk
2025-04-21 10:52:19 +02:00
parent 1fa0b30169
commit 4b637b7e04
14 changed files with 1023 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
actix_mvc_app/src/views/base.html
View File

@@ -32,6 +32,9 @@
<li class="nav-item">
<a class="nav-link {% if active_page == 'editor' %}active{% endif %}" href="/editor">Markdown Editor</a>
</li>
<li class="nav-item">
<a class="nav-link {% if active_page == 'calendar' %}active{% endif %}" href="/calendar">Calendar</a>
</li>
</ul>
<ul class="navbar-nav ms-auto">
{% if user and user.id %}

132
actix_mvc_app/src/views/calendar/index.html Normal file
View File

@@ -0,0 +1,132 @@
{% extends "base.html" %}
{% block title %}Calendar{% endblock %}
{% block content %}
<div class="container">
<h1>Calendar</h1>
<p>View Mode: {{ view_mode }}</p>
<p>Current Date: {{ current_date }}</p>
<div class="d-flex justify-content-between align-items-center mb-3">
<div class="btn-group">
<a href="/calendar?view=day" class="btn btn-outline-primary">Day</a>
<a href="/calendar?view=month" class="btn btn-outline-primary">Month</a>
<a href="/calendar?view=year" class="btn btn-outline-primary">Year</a>
</div>
<a href="/calendar/new" class="btn btn-success">
<i class="bi bi-plus-circle"></i> Create New Event
</a>
</div>
{% if view_mode == "month" %}
<h2>Month View: {{ month_name }} {{ current_year }}</h2>
<table class="table table-bordered">
<thead>
<tr>
<th>Sun</th>
<th>Mon</th>
<th>Tue</th>
<th>Wed</th>
<th>Thu</th>
<th>Fri</th>
<th>Sat</th>
</tr>
</thead>
<tbody>
{% for week in range(start=0, end=6) %}
<tr>
{% for day_idx in range(start=0, end=7) %}
<td>
{% set idx = week * 7 + day_idx %}
{% if idx < calendar_days|length %}
{% set day = calendar_days[idx] %}
{% if day.day > 0 %}
{{ day.day }}
{% endif %}
{% endif %}
</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
{% elif view_mode == "year" %}
<h2>Year View: {{ current_year }}</h2>
<div class="row">
{% for month in months %}
<div class="col-md-4 mb-3">
<div class="card">
<div class="card-header">{{ month.name }}</div>
<div class="card-body">
<p>Events: {{ month.events|length }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
{% elif view_mode == "day" %}
<h2>Day View: {{ current_date }}</h2>
<div class="card mb-4">
<div class="card-header bg-primary text-white">
All Day Events
</div>
<div class="card-body">
{% if events is defined and events|length > 0 %}
{% for event in events %}
{% if event.all_day %}
<div class="alert" style="background-color: {{ event.color }}; color: white;">
<h5>{{ event.title }}</h5>
<p>{{ event.description }}</p>
</div>
{% endif %}
{% endfor %}
{% else %}
<p class="text-muted">No all-day events</p>
{% endif %}
</div>
</div>
<div class="list-group">
{% for hour in range(start=0, end=24) %}
<div class="list-group-item">
<div class="d-flex">
<div class="pe-3" style="width: 60px; text-align: right;">
<strong>{{ "%02d"|format(value=hour) }}:00</strong>
</div>
<div class="flex-grow-1">
{% if events is defined and events|length > 0 %}
{% for event in events %}
{% if not event.all_day %}
{% set start_hour = event.start_time|date(format="%H") %}
{% if start_hour == hour|string %}
<div class="alert mb-2" style="background-color: {{ event.color }}; color: white;">
<h5>{{ event.title }}</h5>
<p>{{ event.start_time|date(format="%H:%M") }} - {{ event.end_time|date(format="%H:%M") }}</p>
<p>{{ event.description }}</p>
</div>
{% endif %}
{% endif %}
{% endfor %}
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
{% endif %}
<!-- Floating Action Button (FAB) for creating new events -->
<a href="/calendar/new" class="position-fixed bottom-0 end-0 m-4 btn btn-primary rounded-circle shadow" style="width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; font-size: 24px;">
<i class="bi bi-plus"></i>
</a>
</div>
{% block extra_css %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
{% endblock %}
{% endblock %}

98
actix_mvc_app/src/views/calendar/new_event.html Normal file
View File

@@ -0,0 +1,98 @@
{% extends "base.html" %}
{% block title %}New Calendar Event{% endblock %}
{% block content %}
<div class="container">
<h1>Create New Event</h1>
{% if error %}
<div class="alert alert-danger" role="alert">
{{ error }}
</div>
{% endif %}
<form action="/calendar/new" method="post">
<div class="mb-3">
<label for="title" class="form-label">Event Title</label>
<input type="text" class="form-control" id="title" name="title" required>
</div>
<div class="mb-3">
<label for="description" class="form-label">Description</label>
<textarea class="form-control" id="description" name="description" rows="3"></textarea>
</div>
<div class="mb-3 form-check">
<input type="checkbox" class="form-check-input" id="all_day" name="all_day">
<label class="form-check-label" for="all_day">All Day Event</label>
</div>
<div class="row mb-3">
<div class="col">
<label for="start_time" class="form-label">Start Time</label>
<input type="datetime-local" class="form-control" id="start_time" name="start_time" required>
</div>
<div class="col">
<label for="end_time" class="form-label">End Time</label>
<input type="datetime-local" class="form-control" id="end_time" name="end_time" required>
</div>
</div>
<div class="mb-3">
<label for="color" class="form-label">Event Color</label>
<select class="form-control" id="color" name="color">
<option value="#4285F4">Blue</option>
<option value="#EA4335">Red</option>
<option value="#34A853">Green</option>
<option value="#FBBC05">Yellow</option>
<option value="#A142F4">Purple</option>
<option value="#24C1E0">Cyan</option>
</select>
</div>
<div class="mb-3">
<button type="submit" class="btn btn-primary">Create Event</button>
<a href="/calendar" class="btn btn-secondary">Cancel</a>
</div>
</form>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Convert datetime-local inputs to RFC3339 format on form submission
document.querySelector('form').addEventListener('submit', function(e) {
e.preventDefault();
const startTime = document.getElementById('start_time').value;
const endTime = document.getElementById('end_time').value;
// Convert to RFC3339 format
const startRFC = new Date(startTime).toISOString();
const endRFC = new Date(endTime).toISOString();
// Create hidden inputs for the RFC3339 values
const startInput = document.createElement('input');
startInput.type = 'hidden';
startInput.name = 'start_time';
startInput.value = startRFC;
const endInput = document.createElement('input');
endInput.type = 'hidden';
endInput.name = 'end_time';
endInput.value = endRFC;
// Remove the original inputs
document.getElementById('start_time').removeAttribute('name');
document.getElementById('end_time').removeAttribute('name');
// Add the hidden inputs to the form
this.appendChild(startInput);
this.appendChild(endInput);
// Submit the form
this.submit();
});
});
</script>
{% endblock %}