Cardoza_Construction/TasGrid
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fixed bad commit and reverted prior to create note. Also added note id linking for iframe

Browse Source
This commit is contained in:
Timothy Cardoza
2026-02-27 13:53:08 -06:00
parent ef935ac37b
commit b59e2c2187
4 changed files with 272 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test-embed.html
+22 -72
View File
@@ -124,21 +124,15 @@
<div id="status" class="status"></div>
</div>
<div id="api-section" style="margin-top: 30px; border-top: 1px solid #eee; padding-top: 20px;">
<h3>Note Creation API</h3>
<div style="display: flex; gap: 10px; align-items: center;">
<button class="send-manual" onclick="createNote()"
style="margin-top: 0; background: #28a745; color: white; border: none; border-radius: 4px; padding: 10px 15px; font-weight: bold; cursor: pointer;">Create
Sample Note</button>
<div id="api-status" style="font-size: 12px; color: #666;"></div>
</div>
<div id="api-result"
style="margin-top: 10px; font-family: monospace; font-size: 11px; background: #eee; padding: 10px; border-radius: 4px; display: none; word-break: break-all;">
</div>
</div>
<div id="manual-section" style="margin-top: 30px; border-top: 1px solid #eee; padding-top: 20px;">
<p style="font-size: 13px; color: #666;">Or send a token manually:</p>
<p style="font-size: 13px; color: #666;"><strong>Test Deep Linking:</strong></p>
<div style="display: flex; gap: 10px; margin-bottom: 10px;">
<input type="text" id="note-id-input" style="flex: 1; padding: 8px;"
placeholder="Paste Note ID here...">
<button onclick="loadSpecificNote()" style="padding: 8px 16px; cursor: pointer;">Load Note</button>
</div>
<p style="font-size: 13px; color: #666; margin-top: 20px;"><strong>Manual Auth:</strong></p>
<input type="text" id="token" class="manual-token" placeholder="Paste PB Token here...">
<button class="send-manual" onclick="sendAuthFromInput()">Send Manual Token</button>
</div>
@@ -151,6 +145,7 @@
<p><strong>1. Available Routes:</strong></p>
<ul>
<li><code>/embed/notes</code>: Renders the full notepad/editor.</li>
<li><code>/embed/notes?noteId=XXX</code>: Renders a specific note directly.</li>
<li><code>/embed/quick-add</code>: Renders a standalone task creation form.</li>
</ul>
@@ -165,28 +160,9 @@ iframe.contentWindow.postMessage({
user: { /* optional PB user record */ }
}, "*");</pre>
<p><strong>4. Note Creation API (TASGRID_CREATE_NOTE):</strong></p>
<p>Trigger note creation from the parent app. TasGrid will respond with
<code>TASGRID_NOTE_CREATED</code>.</p>
<pre
style="background: #f8f9fa; padding: 15px; border-radius: 4px; border: 1px solid #e9ecef; overflow-x: auto;">
// Request
iframe.contentWindow.postMessage({
type: "TASGRID_CREATE_NOTE",
note: {
title: "Project Alpha",
content: "Initial requirements...",
tags: ["Project", "2024"],
isPrivate: false
}
}, "*");
// Response Listener
window.addEventListener("message", (event) => {
if (event.data.type === "TASGRID_NOTE_CREATED") {
console.log("New Note ID:", event.data.noteId);
}
});</pre>
<p><strong>3. Responsiveness:</strong></p>
<p>Both routes are designed to be fluid. Ensure your iframe container has defined dimensions; the
content will expand to fill it.</p>
</div>
</details>
</div>
@@ -216,6 +192,16 @@ window.addEventListener("message", (event) => {
const pb = new PocketBase('https://pocketbase.ccllc.pro');
const statusEl = document.getElementById('status');
function loadSpecificNote() {
const id = document.getElementById('note-id-input').value.trim();
const iframe = document.getElementById('notes-iframe');
if (id) {
iframe.src = `http://localhost:4000/embed/notes?noteId=${id}`;
} else {
iframe.src = `http://localhost:4000/embed/notes`;
}
}
async function login() {
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
@@ -262,42 +248,6 @@ window.addEventListener("message", (event) => {
quickAddIframe.postMessage(payload, "*");
}
async function createNote() {
const apiStatus = document.getElementById('api-status');
const apiResult = document.getElementById('api-result');
apiStatus.textContent = "Sending creation request...";
apiResult.style.display = 'none';
const payload = {
type: "TASGRID_CREATE_NOTE",
note: {
title: "Test Note from Parent " + new Date().toLocaleTimeString(),
content: "This note was created automatically via the postMessage API.",
tags: ["API-TEST", "SISTER-APP"],
isPrivate: false
}
};
// We can send to either iframe since EmbedAuthWrapper handles it globally for all embedded views
document.getElementById('notes-iframe').contentWindow.postMessage(payload, "*");
}
// Listen for responses
window.addEventListener("message", (event) => {
const { data } = event;
console.log("Parent received message:", data);
if (data.type === "TASGRID_NOTE_CREATED") {
const apiStatus = document.getElementById('api-status');
const apiResult = document.getElementById('api-result');
apiStatus.innerHTML = `<span style="color: green; font-weight: bold;">Note Created! ID: ${data.noteId}</span>`;
apiResult.textContent = JSON.stringify(data, null, 2);
apiResult.style.display = 'block';
}
});
// Handle case where user refreshed but is still logged in to the parent
window.addEventListener('load', () => {
if (pb.authStore.isValid && pb.authStore.model) {