-
-
-
Drag & Drop Markdown File
-
or
-
+
+
+
Drag & Drop Markdown File
+
or
+
+
+
Supported formats: .md, .txt. Your note will be added to the current active folder.
+
+
diff --git a/js/editor-actions.js b/js/editor-actions.js
index f1712c4..9f7baf9 100644
--- a/js/editor-actions.js
+++ b/js/editor-actions.js
@@ -116,6 +116,22 @@ window.EditorActions = {
});
});
+ // Export Format Toggle
+ document.querySelectorAll('#export-format-toggle .mode-tab').forEach(btn => {
+ btn.addEventListener('click', (e) => {
+ const format = e.currentTarget.getAttribute('data-format');
+ document.querySelectorAll('#export-format-toggle .mode-tab').forEach(b => b.classList.remove('active'));
+ e.currentTarget.classList.add('active');
+
+ const pdfOptions = document.getElementById('pdf-export-options');
+ if (format === 'pdf') {
+ pdfOptions.style.display = 'block';
+ } else {
+ pdfOptions.style.display = 'none';
+ }
+ });
+ });
+
// Browse File
document.getElementById('btn-browse-file')?.addEventListener('click', () => {
document.getElementById('transfer-import-file').click();
@@ -159,7 +175,13 @@ window.EditorActions = {
// Execute Export
document.getElementById('btn-execute-export')?.addEventListener('click', () => {
const filename = document.getElementById('export-filename-input').value.trim();
- this.handleExportMd(filename);
+ const format = document.querySelector('#export-format-toggle .mode-tab.active').getAttribute('data-format');
+
+ if (format === 'pdf') {
+ this.handlePdfExport(filename);
+ } else {
+ this.handleExportMd(filename);
+ }
window.closeTransferModal();
});
},
@@ -423,9 +445,9 @@ window.EditorActions = {
if (window.lucide) lucide.createIcons();
},
- handlePdfExport() {
+ handlePdfExport(customFilename = null) {
const inputFilename = document.getElementById('pdf-filename');
- let fileName = inputFilename.value.trim() || window.EditorState.getActiveNote().title || "Document";
+ let fileName = customFilename || inputFilename.value.trim() || window.EditorState.getActiveNote().title || "Document";
if (typeof window.closePdfModal === "function") window.closePdfModal();
const style = document.createElement('style');
diff --git a/js/editor-core.js b/js/editor-core.js
index 695c1e2..42973e2 100644
--- a/js/editor-core.js
+++ b/js/editor-core.js
@@ -372,6 +372,15 @@ window.EditorCore = {
nTitle.style.cursor = 'pointer';
nTitle.addEventListener('click', async () => {
+ if (isSelectMode) {
+ const cb = noteRow.querySelector('.manage-checkbox');
+ if (cb) {
+ cb.checked = !cb.checked;
+ cb.dispatchEvent(new Event('change'));
+ }
+ return;
+ }
+
window.EditorState.activeNoteId = note.id;
this.highlightedNoteId = note.id;
window.EditorState.activeFolder = note.folder || 'All Notes';
@@ -664,8 +673,12 @@ document.addEventListener('DOMContentLoaded', () => {
// Editor Events
editor.addEventListener('input', () => {
window.EditorCore.dynamicDebounce(editor.value);
+ window.EditorCore.updateLineCol(editor);
});
+ editor.addEventListener('click', () => window.EditorCore.updateLineCol(editor));
+ editor.addEventListener('keyup', () => window.EditorCore.updateLineCol(editor));
+
editor.addEventListener('keydown', function (e) {
if (e.key === 'Tab') {
e.preventDefault();
diff --git a/js/ui.js b/js/ui.js
index 7256d8e..c70a288 100644
--- a/js/ui.js
+++ b/js/ui.js
@@ -408,24 +408,59 @@ document.addEventListener('DOMContentLoaded', () => {
window.selectedPageSize = val;
});
+ setupStaticDropdown('transfer-size-dropdown', 'transfer-size-selected-text', (val) => {
+ window.selectedPageSize = val;
+ });
+
const divider = document.getElementById('drag-divider');
const editorPanel = document.getElementById('editor-panel-wrapper');
+ const previewPanel = document.getElementById('preview-panel');
const container = document.getElementById('split-workspace');
+ const restoreLeft = document.getElementById('restore-left');
+ const restoreRight = document.getElementById('restore-right');
let isDragging = false;
+ let dragRaf;
if (divider && editorPanel && container) {
divider.addEventListener('mousedown', () => {
isDragging = true;
document.body.style.cursor = 'col-resize';
document.body.style.userSelect = 'none';
+ container.classList.add('is-resizing');
});
document.addEventListener('mousemove', (e) => {
if (!isDragging) return;
- let newWidthPercentage = ((e.clientX - container.getBoundingClientRect().left) / container.getBoundingClientRect().width) * 100;
- if (newWidthPercentage < 20) newWidthPercentage = 20;
- if (newWidthPercentage > 80) newWidthPercentage = 80;
- editorPanel.style.flex = `0 0 ${newWidthPercentage}%`;
+
+ if (dragRaf) cancelAnimationFrame(dragRaf);
+
+ dragRaf = requestAnimationFrame(() => {
+ const containerRect = container.getBoundingClientRect();
+ let newWidthPercentage = ((e.clientX - containerRect.left) / containerRect.width) * 100;
+
+ if (newWidthPercentage <= 5) {
+ // Collapse to Preview Only
+ document.body.classList.add('view-preview');
+ document.body.classList.remove('view-editor');
+ restoreLeft.style.display = 'flex';
+ restoreRight.style.display = 'none';
+ isDragging = false;
+ document.body.style.cursor = 'default';
+ } else if (newWidthPercentage >= 95) {
+ // Collapse to Editor Only
+ document.body.classList.add('view-editor');
+ document.body.classList.remove('view-preview');
+ restoreRight.style.display = 'flex';
+ restoreLeft.style.display = 'none';
+ isDragging = false;
+ document.body.style.cursor = 'default';
+ } else {
+ document.body.classList.remove('view-editor', 'view-preview');
+ restoreLeft.style.display = 'none';
+ restoreRight.style.display = 'none';
+ editorPanel.style.flex = `0 0 ${newWidthPercentage}%`;
+ }
+ });
});
document.addEventListener('mouseup', () => {
@@ -433,8 +468,26 @@ document.addEventListener('DOMContentLoaded', () => {
isDragging = false;
document.body.style.cursor = 'default';
document.body.style.userSelect = 'auto';
+ container.classList.remove('is-resizing');
}
});
+
+ const restoreSplit = () => {
+ document.body.classList.remove('view-editor', 'view-preview');
+ editorPanel.style.flex = '0 0 50%';
+ restoreLeft.style.display = 'none';
+ restoreRight.style.display = 'none';
+ if (window.lucide) lucide.createIcons();
+
+ // Update view buttons UI
+ document.querySelectorAll('.view-btn').forEach(b => {
+ b.classList.remove('active');
+ if (b.getAttribute('data-view') === 'split') b.classList.add('active');
+ });
+ };
+
+ restoreLeft?.addEventListener('click', restoreSplit);
+ restoreRight?.addEventListener('click', restoreSplit);
}
const applyTheme = (themeName) => {
diff --git a/style.css b/style.css
index 6d238b6..07dcc77 100644
--- a/style.css
+++ b/style.css
@@ -560,6 +560,14 @@ body.dark-mode .action-pill-group {
background-color: var(--editor-bg);
}
+.split-workspace.is-resizing * {
+ pointer-events: none !important;
+}
+
+.split-workspace.is-resizing .divider {
+ pointer-events: auto !important;
+}
+
.editor-panel {
flex: 0 0 50%;
display: flex;
@@ -704,6 +712,48 @@ textarea:disabled::placeholder {
left: 2px;
}
+/* ✨ EDGE HANDLES ✨ */
+.edge-handle {
+ position: fixed;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 12px;
+ height: 60px;
+ background-color: var(--accent-color);
+ color: var(--btn-text);
+ display: none;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ z-index: 1000;
+ border-radius: 6px;
+ box-shadow: 0 4px 12px rgba(0,0,0,0.2);
+ transition: all 0.2s ease;
+ opacity: 0.8;
+}
+
+.edge-handle:hover {
+ width: 16px;
+ opacity: 1;
+}
+
+.edge-handle.left {
+ left: 0;
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+}
+
+.edge-handle.right {
+ right: 0;
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+}
+
+.edge-handle i {
+ width: 12px;
+ height: 12px;
+}
+
.preview-panel {
flex: 1;
display: flex;
@@ -1187,6 +1237,90 @@ body.dark-mode .btn-cancel:hover {
background-color: rgba(255, 255, 255, 0.05);
}
+/* ✨ TRANSFER MODAL REDESIGN ✨ */
+.transfer-modal-box {
+ max-width: 440px !important;
+}
+
+.transfer-section {
+ width: 100%;
+}
+
+.drop-zone {
+ border: 2px dashed var(--border-color);
+ border-radius: 20px;
+ padding: 40px 24px;
+ margin-bottom: 20px;
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ background-color: var(--nav-bg);
+}
+
+.drop-zone:hover, .drop-zone.drag-over {
+ border-color: var(--accent-color);
+ background-color: var(--hover-bg);
+ transform: translateY(-2px);
+ box-shadow: 0 8px 24px var(--shadow-color);
+}
+
+.drop-zone i {
+ width: 48px;
+ height: 48px;
+ opacity: 0.5;
+ margin-bottom: 16px;
+ color: var(--accent-color);
+}
+
+.drop-zone p {
+ font-weight: 600;
+ margin-bottom: 12px;
+ color: var(--text-color);
+}
+
+.drop-zone span {
+ font-size: 0.8rem;
+ opacity: 0.5;
+ margin-bottom: 16px;
+ display: block;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+}
+
+.transfer-instructions {
+ background-color: var(--hover-bg);
+ padding: 12px 16px;
+ border-radius: 12px;
+ margin-top: 8px;
+}
+
+.transfer-instructions p {
+ font-size: 0.8rem;
+ margin: 0;
+ opacity: 0.7;
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ line-height: 1.4;
+}
+
+.transfer-instructions i {
+ width: 14px;
+ height: 14px;
+ flex-shrink: 0;
+}
+
+#pdf-export-options {
+ animation: fadeIn 0.3s ease;
+}
+
+@keyframes fadeIn {
+ from { opacity: 0; transform: translateY(5px); }
+ to { opacity: 1; transform: translateY(0); }
+}
+
/* ✨ ALL NOTES DASHBOARD ✨ */
.notes-dashboard-box {
max-width: 600px;