Cardoza_Construction/Prism-Notes-Main
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify attachment menu: keep only image, video, file options

Browse Source 
- Remove Record Video option and related MediaRecorder implementation
- Remove Take Picture option and camera input handling
- Update both note and conversation attachment menus
- Remove unused event listeners and variable declarations
- Simplify file input arrays to 3 inputs instead of 4
This commit is contained in:
aewing
2026-01-11 02:41:51 +00:00
parent 8009ad1eb3
commit af0fef4f08
1 changed files with 2 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+2 -158
View File
@@ -244,25 +244,12 @@
</svg>
Attach File
</button>
<button id="recordVideoBtn" class="w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2" type="button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-4 h-4">
<circle cx="12" cy="13" r="9"/><path d="M12 10v6"/>
</svg>
Record Video
</button>
<button id="takePictureBtn" class="w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2" type="button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-4 h-4">
<path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"/><circle cx="12" cy="13" r="4"/>
</svg>
Take Picture
</button>
</div>
<!-- Hidden file inputs -->
<input id="imageInput" type="file" class="hidden" accept="image/*" multiple>
<input id="videoInput" type="file" class="hidden" accept="video/*">
<input id="fileInput" type="file" class="hidden" multiple accept=".pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.zip,.rar">
<input id="cameraInput" type="file" class="hidden" accept="image/*" capture="environment">
<div id="noteAttachmentsList" class="space-y-1"></div>
</div>
@@ -422,25 +409,12 @@
</svg>
Attach File
</button>
<button id="conversationRecordVideoBtn" class="w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2" type="button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-4 h-4">
<circle cx="12" cy="13" r="9"/><path d="M12 10v6"/>
</svg>
Record Video
</button>
<button id="conversationTakePictureBtn" class="w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2" type="button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-4 h-4">
<path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"/><circle cx="12" cy="13" r="4"/>
</svg>
Take Picture
</button>
</div>
<!-- Hidden file inputs for conversation -->
<input id="conversationImageInput" type="file" class="hidden" accept="image/*" multiple>
<input id="conversationVideoInput" type="file" class="hidden" accept="video/*">
<input id="conversationFileInput" type="file" class="hidden" multiple accept=".pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.zip,.rar">
<input id="conversationCameraInput" type="file" class="hidden" accept="image/*" capture="environment">
<div id="conversationAttachmentsList" class="space-y-1"></div>
</div>
@@ -1430,7 +1404,6 @@
document.getElementById('conversationImageInput').value = '';
document.getElementById('conversationVideoInput').value = '';
document.getElementById('conversationFileInput').value = '';
document.getElementById('conversationCameraInput').value = '';
renderConversationAttachmentsList();
}
@@ -1738,7 +1711,6 @@
const imageInput = document.getElementById('imageInput');
const videoInput = document.getElementById('videoInput');
const fileInput = document.getElementById('fileInput');
const cameraInput = document.getElementById('cameraInput');
attachmentMenuBtn.addEventListener('click', (e) => {
e.preventDefault();
@@ -1760,70 +1732,8 @@
fileInput.click();
});
document.getElementById('takePictureBtn').addEventListener('click', () => {
attachmentMenu.classList.add('hidden');
cameraInput.click();
});
document.getElementById('recordVideoBtn').addEventListener('click', async () => {
attachmentMenu.classList.add('hidden');
try {
const stream = await navigator.mediaDevices.getUserMedia({ video: true, audio: true });
const videoRecorder = new MediaRecorder(stream);
const chunks = [];
videoRecorder.ondataavailable = (e) => {
if (e.data.size > 0) chunks.push(e.data);
};
videoRecorder.onstop = () => {
const blob = new Blob(chunks, { type: 'video/webm' });
const file = new File([blob], `video-${Date.now()}.webm`, { type: 'video/webm' });
pendingNoteAttachments.push(file);
renderNoteAttachmentsList();
stream.getTracks().forEach(track => track.stop());
};
videoRecorder.start();
// Show recording UI
const recordStatus = document.getElementById('recordStatus');
const originalStatus = recordStatus.textContent;
recordStatus.textContent = 'Recording video... (Click to stop)';
recordStatus.style.cursor = 'pointer';
recordStatus.style.color = '#dc2626';
const stopHandler = () => {
recordStatus.removeEventListener('click', stopHandler);
videoRecorder.stop();
recordStatus.textContent = originalStatus;
recordStatus.style.cursor = 'auto';
recordStatus.style.color = '';
};
recordStatus.addEventListener('click', stopHandler);
// Auto-stop after 5 minutes
setTimeout(() => {
if (videoRecorder.state === 'recording') {
recordStatus.removeEventListener('click', stopHandler);
videoRecorder.stop();
recordStatus.textContent = 'Video recording stopped (5 minute limit)';
recordStatus.style.cursor = 'auto';
setTimeout(() => {
recordStatus.textContent = originalStatus;
recordStatus.style.color = '';
}, 3000);
}
}, 5 * 60 * 1000);
} catch (err) {
console.error('Failed to access camera/microphone:', err);
alert('Unable to access camera or microphone. Check permissions.');
}
});
// File input change handlers
[imageInput, videoInput, fileInput, cameraInput].forEach(input => {
[imageInput, videoInput, fileInput].forEach(input => {
input.addEventListener('change', (e) => {
pendingNoteAttachments.push(...Array.from(e.target.files || []));
renderNoteAttachmentsList();
@@ -1836,7 +1746,6 @@
imageInput.value = '';
videoInput.value = '';
fileInput.value = '';
cameraInput.value = '';
renderNoteAttachmentsList();
});
@@ -1853,7 +1762,6 @@
const conversationImageInput = document.getElementById('conversationImageInput');
const conversationVideoInput = document.getElementById('conversationVideoInput');
const conversationFileInput = document.getElementById('conversationFileInput');
const conversationCameraInput = document.getElementById('conversationCameraInput');
conversationAttachmentMenuBtn.addEventListener('click', (e) => {
e.preventDefault();
@@ -1875,70 +1783,8 @@
conversationFileInput.click();
});
document.getElementById('conversationTakePictureBtn').addEventListener('click', () => {
conversationAttachmentMenu.classList.add('hidden');
conversationCameraInput.click();
});
document.getElementById('conversationRecordVideoBtn').addEventListener('click', async () => {
conversationAttachmentMenu.classList.add('hidden');
try {
const stream = await navigator.mediaDevices.getUserMedia({ video: true, audio: true });
const videoRecorder = new MediaRecorder(stream);
const chunks = [];
videoRecorder.ondataavailable = (e) => {
if (e.data.size > 0) chunks.push(e.data);
};
videoRecorder.onstop = () => {
const blob = new Blob(chunks, { type: 'video/webm' });
const file = new File([blob], `video-${Date.now()}.webm`, { type: 'video/webm' });
pendingConversationAttachments.push(file);
renderConversationAttachmentsList();
stream.getTracks().forEach(track => track.stop());
};
videoRecorder.start();
// Show recording UI
const recordStatus = document.getElementById('conversationRecordStatus');
const originalStatus = recordStatus.textContent;
recordStatus.textContent = 'Recording video... (Click to stop)';
recordStatus.style.cursor = 'pointer';
recordStatus.style.color = '#dc2626';
const stopHandler = () => {
recordStatus.removeEventListener('click', stopHandler);
videoRecorder.stop();
recordStatus.textContent = originalStatus;
recordStatus.style.cursor = 'auto';
recordStatus.style.color = '';
};
recordStatus.addEventListener('click', stopHandler);
// Auto-stop after 5 minutes
setTimeout(() => {
if (videoRecorder.state === 'recording') {
recordStatus.removeEventListener('click', stopHandler);
videoRecorder.stop();
recordStatus.textContent = 'Video recording stopped (5 minute limit)';
recordStatus.style.cursor = 'auto';
setTimeout(() => {
recordStatus.textContent = originalStatus;
recordStatus.style.color = '';
}, 3000);
}
}, 5 * 60 * 1000);
} catch (err) {
console.error('Failed to access camera/microphone:', err);
alert('Unable to access camera or microphone. Check permissions.');
}
});
// File input change handlers for conversation
[conversationImageInput, conversationVideoInput, conversationFileInput, conversationCameraInput].forEach(input => {
[conversationImageInput, conversationVideoInput, conversationFileInput].forEach(input => {
input.addEventListener('change', (e) => {
pendingConversationAttachments.push(...Array.from(e.target.files || []));
renderConversationAttachmentsList();
@@ -1951,7 +1797,6 @@
conversationImageInput.value = '';
conversationVideoInput.value = '';
conversationFileInput.value = '';
conversationCameraInput.value = '';
renderConversationAttachmentsList();
});
@@ -2143,7 +1988,6 @@
document.getElementById('imageInput').value = '';
document.getElementById('videoInput').value = '';
document.getElementById('fileInput').value = '';
document.getElementById('cameraInput').value = '';
renderNoteAttachmentsList();
document.getElementById('noteText').value = '';
document.getElementById('noteTitle').value = '';