152 lines
No EOL
7 KiB
HTML
152 lines
No EOL
7 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{{ action }} Log - Bullet Journal{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="card card--full">
|
|
<p class="card__eyebrow">{{ action }}</p>
|
|
<h2>{{ action }} Log Entry</h2>
|
|
|
|
<form method="POST" action="{{ url_for('main.log_new') }}" id="log-form">
|
|
<div class="form-group">
|
|
<label for="date">Date</label>
|
|
<input type="text" id="date" name="date" value="{{ log.date.strftime('%Y-%m-%d') if log else '' }}" placeholder="YYYY-MM-DD" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="prompt">Daily Prompt</label>
|
|
<textarea id="prompt" name="prompt" rows="3" placeholder="What's on your mind today?">{{ log.prompt or '' }}</textarea>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="notes">Notes</label>
|
|
<textarea id="notes" name="notes" rows="4" placeholder="Free-form notes...">{{ log.notes or '' }}</textarea>
|
|
</div>
|
|
|
|
<div class="bullets-section">
|
|
<h3>Bullets & Insights</h3>
|
|
<div class="bullets-list" id="bullets-list">
|
|
{% if log %}
|
|
{% for item in log.items %}
|
|
<div class="bullet-item" data-item-id="{{ item.id }}">
|
|
<div class="bullet-item__row">
|
|
<select name="item_type[]" class="bullet-item__type">
|
|
<option value="bullet" {% if item.type == 'bullet' %}selected{% endif %}>Bullet</option>
|
|
<option value="task" {% if item.type == 'task' %}selected{% endif %}>Task</option>
|
|
<option value="note" {% if item.type == 'note' %}selected{% endif %}>Note</option>
|
|
</select>
|
|
<select name="item_symbol[]" class="bullet-item__symbol">
|
|
<option value="•" {% if item.symbol == '•' %}selected{% endif %}>•</option>
|
|
<option value="-" {% if item.symbol == '-' %}selected{% endif %}>-</option>
|
|
<option value="○" {% if item.symbol == '○' %}selected{% endif %}>○</option>
|
|
</select>
|
|
<input type="text" name="item_text[]" class="bullet-item__text" value="{{ item.text }}" placeholder="Add a bullet point...">
|
|
<select name="item_status[]" class="bullet-item__status">
|
|
<option value="todo" {% if item.status == 'todo' %}selected{% endif %}>Todo</option>
|
|
<option value="doing" {% if item.status == 'doing' %}selected{% endif %}>Doing</option>
|
|
<option value="done" {% if item.status == 'done' %}selected{% endif %}>Done</option>
|
|
<option value="cancelled" {% if item.status == 'cancelled' %}selected{% endif %}>Cancelled</option>
|
|
</select>
|
|
<input type="hidden" name="item_id[]" value="{{ item.id }}">
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|
|
<button type="button" class="btn btn-secondary btn-sm" onclick="addBullet()">+ Add Bullet</button>
|
|
</div>
|
|
|
|
<div class="gratitude-section">
|
|
<h3>Gratitude</h3>
|
|
<div class="gratitude-grid">
|
|
<div class="gratitude-item">
|
|
<label for="gratitude_0">1. I'm grateful for...</label>
|
|
<input type="text" id="gratitude_0" name="gratitude_0" value="{{ log.gratitude_list[0] if log and log.gratitude_list else '' }}" placeholder="Item 1">
|
|
</div>
|
|
<div class="gratitude-item">
|
|
<label for="gratitude_1">2. I'm grateful for...</label>
|
|
<input type="text" id="gratitude_1" name="gratitude_1" value="{{ log.gratitude_list[1] if log and log.gratitude_list else '' }}" placeholder="Item 2">
|
|
</div>
|
|
<div class="gratitude-item">
|
|
<label for="gratitude_2">3. I'm grateful for...</label>
|
|
<input type="text" id="gratitude_2" name="gratitude_2" value="{{ log.gratitude_list[2] if log and log.gratitude_list else '' }}" placeholder="Item 3">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="sleep-section">
|
|
<h3>Sleep</h3>
|
|
<div class="sleep-grid">
|
|
<div class="sleep-item">
|
|
<label for="bedtime">Bedtime</label>
|
|
<input type="text" id="bedtime" name="bedtime" value="{{ log.bedtime or '' }}" placeholder="e.g., 11:00 PM">
|
|
</div>
|
|
<div class="sleep-item">
|
|
<label for="wake_time">Wake Time</label>
|
|
<input type="text" id="wake_time" name="wake_time" value="{{ log.wake_time or '' }}" placeholder="e.g., 7:00 AM">
|
|
</div>
|
|
<div class="sleep-item">
|
|
<label for="sleep_quality">Sleep Quality</label>
|
|
<select id="sleep_quality" name="sleep_quality">
|
|
<option value="">Select...</option>
|
|
<option value="poor" {% if log and log.sleep_quality == 'poor' %}selected{% endif %}>Poor</option>
|
|
<option value="fair" {% if log and log.sleep_quality == 'fair' %}selected{% endif %}>Fair</option>
|
|
<option value="good" {% if log and log.sleep_quality == 'good' %}selected{% endif %}>Good</option>
|
|
<option value="excellent" {% if log and log.sleep_quality == 'excellent' %}selected{% endif %}>Excellent</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mood-section">
|
|
<h3>Mood</h3>
|
|
<div class="mood-selector">
|
|
<label for="mood">How are you feeling?</label>
|
|
<select id="mood" name="mood">
|
|
<option value="">Select mood...</option>
|
|
<option value="amazing" {% if log and log.mood == 'amazing' %}selected{% endif %}>Amazing</option>
|
|
<option value="good" {% if log and log.mood == 'good' %}selected{% endif %}>Good</option>
|
|
<option value="okay" {% if log and log.mood == 'okay' %}selected{% endif %}>Okay</option>
|
|
<option value="bad" {% if log and log.mood == 'bad' %}selected{% endif %}>Bad</option>
|
|
<option value="terrible" {% if log and log.mood == 'terrible' %}selected{% endif %}>Terrible</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary btn-block">Save Log</button>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
function addBullet() {
|
|
const list = document.getElementById('bullets-list');
|
|
const newItem = document.createElement('div');
|
|
newItem.className = 'bullet-item';
|
|
newItem.dataset.itemId = '';
|
|
newItem.innerHTML = `
|
|
<div class="bullet-item__row">
|
|
<select name="item_type[]" class="bullet-item__type">
|
|
<option value="bullet" selected>Bullet</option>
|
|
<option value="task">Task</option>
|
|
<option value="note">Note</option>
|
|
</select>
|
|
<select name="item_symbol[]" class="bullet-item__symbol">
|
|
<option value="•" selected>•</option>
|
|
<option value="-">-</option>
|
|
<option value="○">○</option>
|
|
</select>
|
|
<input type="text" name="item_text[]" class="bullet-item__text" placeholder="Add a bullet point...">
|
|
<select name="item_status[]" class="bullet-item__status">
|
|
<option value="todo" selected>Todo</option>
|
|
<option value="doing">Doing</option>
|
|
<option value="done">Done</option>
|
|
<option value="cancelled">Cancelled</option>
|
|
</select>
|
|
<input type="hidden" name="item_id[]" value="">
|
|
</div>
|
|
`;
|
|
list.appendChild(newItem);
|
|
newItem.querySelector('.bullet-item__text').focus();
|
|
}
|
|
</script>
|
|
{% endblock %} |