Continue implementing WhatsApp

This commit is contained in:
2026-02-16 00:39:16 +00:00
parent b1a53034d5
commit 3d32834ccf
12 changed files with 796 additions and 120 deletions

View File

@@ -1,13 +1,8 @@
<div id="widget">
<div id="widget-{{ unique }}" class="grid-stack-item" {% block widget_options %}{% if widget_options is None %}gs-w="6" gs-h="1" gs-y="20" gs-x="0"{% else %}{% autoescape off %}{{ widget_options }}{% endautoescape %}{% endif %}{% endblock %}>
<div class="grid-stack-item-content">
<span class="gia-widget-focus-indicator" aria-hidden="true">
<i class="{{ widget_icon|default:'fa-solid fa-circle' }}"></i>
</span>
<nav class="panel">
<p class="panel-heading" style="padding: .2em; line-height: .5em;">
<i class="{{ widget_icon|default:'fa-solid fa-arrows-up-down-left-right' }} has-text-grey-light"></i>
{% block close_button %}
{% include "mixins/partials/close-widget.html" %}
{% endblock %}
@@ -30,60 +25,11 @@
</div>
</div>
<style>
#widget-{{ unique }} .grid-stack-item-content {
position: relative;
}
#widget-{{ unique }} .gia-widget-focus-indicator {
position: absolute;
left: 0.32rem;
top: 50%;
width: 1rem;
height: 1rem;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 0.7rem;
color: #2f5f9f;
background: rgba(235, 244, 255, 0.92);
border: 1px solid rgba(47, 95, 159, 0.3);
opacity: 0;
transform: translateY(-50%) scale(0.92);
transition: opacity 120ms ease, transform 120ms ease;
pointer-events: none;
z-index: 3;
}
#widget-{{ unique }}.is-widget-active .gia-widget-focus-indicator {
opacity: 1;
transform: translateY(-50%) scale(1);
}
</style>
<script>
{% block custom_script %}
{% endblock %}
var widget_event = new Event("load-widget");
document.dispatchEvent(widget_event);
(function () {
var widgetRoot = document.getElementById("widget-{{ unique }}");
if (!widgetRoot) {
return;
}
function setActive() {
document.querySelectorAll(".grid-stack-item.is-widget-active").forEach(function (node) {
if (node !== widgetRoot) {
node.classList.remove("is-widget-active");
}
});
widgetRoot.classList.add("is-widget-active");
}
widgetRoot.addEventListener("mousedown", setActive);
widgetRoot.addEventListener("focusin", setActive);
window.setTimeout(setActive, 0);
})();
</script>
{% block custom_end %}
{% endblock %}

View File

@@ -83,9 +83,11 @@
<table class="table is-fullwidth is-hoverable is-striped">
<thead>
<tr>
<th>Contact</th>
<th>Person</th>
<th>Detected Name</th>
<th>Service</th>
<th>Identifier</th>
<th>Suggested Match</th>
<th>Status</th>
<th></th>
</tr>
@@ -93,12 +95,35 @@
<tbody>
{% for row in candidates %}
<tr>
<td>{{ row.person_name }}</td>
<td>{{ row.linked_person_name|default:"-" }}</td>
<td>{{ row.detected_name|default:"-" }}</td>
<td>
<span class="icon is-small"><i class="{{ row.service_icon_class }}"></i></span>
{{ row.service|title }}
</td>
<td><code>{{ row.identifier }}</code></td>
<td>
{% if not row.linked_person and row.suggestions %}
<div class="buttons are-small">
{% for suggestion in row.suggestions %}
<form method="post" style="display: inline-flex;">
{% csrf_token %}
<input type="hidden" name="service" value="{{ row.service }}">
<input type="hidden" name="identifier" value="{{ row.identifier }}">
<input type="hidden" name="person_id" value="{{ suggestion.person.id }}">
<button
type="submit"
class="button is-small is-success is-light is-rounded"
title="Accept suggested match">
<span class="icon is-small"><i class="fa-solid fa-check"></i></span>
<span>{{ suggestion.person.name }}</span>
</button>
</form>
{% endfor %}
</div>
{% else %}
<span class="has-text-grey">-</span>
{% endif %}
</td>
<td>
{% if row.linked_person %}
<span class="tag is-success is-light">linked</span>

View File

@@ -61,11 +61,6 @@
margin: 0;
white-space: nowrap;
">
<span
class="tag is-dark"
style="min-width: 2.5rem; justify-content: center;">
<i class="{{ row.service_icon_class|default:manual_icon_class }}" aria-hidden="true"></i>
</span>
<span
class="tag is-white"
style="
@@ -76,8 +71,7 @@
gap: 0.75rem;
padding-left: 0.7rem;
padding-right: 0.7rem;
border-top: 1px solid rgba(0, 0, 0, 0.2);
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.2);
min-width: 0;
">
<span

View File

@@ -1,8 +1,7 @@
{% if items %}
{% for item in items %}
<a class="navbar-item" href="{{ item.compose_url }}">
<span class="icon is-small"><i class="{{ item.service_icon_class|default:manual_icon_class }}"></i></span>
<span style="margin-left: 0.35rem;">
<span>
{{ item.person_name }} · {{ item.service|title }}
{% if not item.linked_person %}
<small class="has-text-grey"> · unlinked</small>

View File

@@ -1,6 +1,5 @@
{% load cache %}
{% include 'mixins/partials/notify.html' %}
{% cache 600 objects_signal_accounts request.user.id object_list type service %}
<div id="{{ context_object_name|slugify }}-panel">
{% if service_warning %}
<article class="notification is-warning is-light" style="margin-bottom: 0.55rem;">
{{ service_warning }}
@@ -8,10 +7,10 @@
{% endif %}
<table
class="table is-fullwidth is-hoverable"
hx-target="#{{ context_object_name }}-table"
id="{{ context_object_name }}-table"
hx-target="#{{ context_object_name|slugify }}-panel"
id="{{ context_object_name|slugify }}-table"
hx-swap="outerHTML"
hx-trigger="{{ context_object_name_singular }}Event from:body"
hx-trigger="{{ context_object_name_singular|slugify }}-event from:body"
hx-get="{{ list_url }}">
<thead>
<th>{{ service_label|default:"Service" }} account</th>
@@ -24,12 +23,17 @@
<div class="buttons">
<button
hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
hx-delete="{# url 'account_delete' type=type pk=item.id #}"
hx-trigger="click"
hx-target="#modals-here"
hx-swap="innerHTML"
hx-confirm="Are you sure you wish to unlink {{ item }}?"
class="button">
{% if account_unlink_url_name %}
hx-delete="{% url account_unlink_url_name type=type account=item %}"
hx-trigger="click"
hx-target="#{{ context_object_name|slugify }}-panel"
hx-swap="outerHTML"
{% endif %}
{% if account_unlink_url_name %}
hx-confirm="Are you sure you wish to unlink {{ item }}?"
{% endif %}
class="button"
{% if not account_unlink_url_name %}disabled{% endif %}>
<span class="icon-text">
<span class="icon">
<i class="fa-solid fa-xmark"></i>
@@ -94,8 +98,8 @@
<form
hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
hx-post="{% url account_add_url_name type=type %}"
hx-target="#widgets-here"
hx-swap="innerHTML">
hx-target="{% if account_add_target %}{{ account_add_target }}{% else %}#widgets-here{% endif %}"
hx-swap="{% if account_add_swap %}{{ account_add_swap }}{% else %}innerHTML{% endif %}">
{% csrf_token %}
<div class="field has-addons">
<div id="device" class="control is-expanded has-icons-left">
@@ -122,4 +126,4 @@
</div>
</div>
</form>
{% endcache %}
</div>

View File

@@ -1,6 +1,15 @@
<div class="whatsapp-account-add-fragment">
{% if object.ok %}
<img src="data:image/png;base64, {{ object.image_b64 }}" alt="WhatsApp QR code" />
<img
src="data:image/png;base64, {{ object.image_b64 }}"
alt="WhatsApp QR code"
style="
display: block;
width: 100%;
max-width: 420px;
height: auto;
margin: 0 auto;
" />
{% if object.warning %}
<p class="is-size-7" style="margin-top: 0.6rem;">{{ object.warning }}</p>
{% endif %}
@@ -27,8 +36,15 @@
</form>
{% endif %}
{% if object.debug_lines %}
<details style="margin-top: 0.6rem;">
<details open style="margin-top: 0.6rem;">
<summary><strong>Runtime Debug</strong></summary>
<button
type="button"
class="button is-small is-light"
style="margin-top: 0.45rem; margin-bottom: 0.35rem;"
onclick="navigator.clipboard.writeText(this.nextElementSibling.innerText); return false;">
Copy debug
</button>
<article class="notification is-light" style="margin-top: 0.5rem; margin-bottom: 0;">
<pre class="is-size-7" style="white-space: pre-wrap; margin: 0;">{% for line in object.debug_lines %}{{ line }}
{% endfor %}</pre>