sunny-html-editor 1.0.1 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/html-editor.js +59 -57
  2. package/package.json +1 -1
package/html-editor.js CHANGED
@@ -1,9 +1,11 @@
1
1
  /**
2
2
  * Sunny HTML Editor - 軽量WYSIWYGエディタ
3
- * @version 1.0.0
3
+ * @version 1.0.3
4
4
  */
5
- (function() {
5
+ document.addEventListener('DOMContentLoaded', function() {
6
6
  var container = document.getElementById('editorContainer');
7
+ if (!container) return; // editorContainerがなければ何もしない
8
+
7
9
  var editModeBtn = document.getElementById('editMode');
8
10
  var toggleSidebarBtn = document.getElementById('toggleSidebar');
9
11
  var saveHtmlBtn = document.getElementById('saveHtml');
@@ -41,13 +43,13 @@
41
43
  }
42
44
 
43
45
  // ========== HTML保存 ==========
44
- saveHtmlBtn.addEventListener('click', function() {
46
+ if (saveHtmlBtn) saveHtmlBtn.addEventListener('click', function() {
45
47
  var wasEditMode = isEditMode;
46
- if (isEditMode) editModeBtn.click();
48
+ if (isEditMode && editModeBtn) editModeBtn.click();
47
49
 
48
50
  var html = '<!DOCTYPE html>\n' + document.documentElement.outerHTML;
49
51
 
50
- if (wasEditMode) editModeBtn.click();
52
+ if (wasEditMode && editModeBtn) editModeBtn.click();
51
53
 
52
54
  var blob = new Blob([html], { type: 'text/html; charset=utf-8' });
53
55
  var url = URL.createObjectURL(blob);
@@ -70,7 +72,7 @@
70
72
  });
71
73
 
72
74
  // ========== Markdown出力 ==========
73
- exportMdBtn.addEventListener('click', function() {
75
+ if (exportMdBtn) exportMdBtn.addEventListener('click', function() {
74
76
  var md = htmlToMarkdown();
75
77
 
76
78
  navigator.clipboard.writeText(md).then(function() {
@@ -83,7 +85,7 @@
83
85
  });
84
86
 
85
87
  // ========== HTMLコピー ==========
86
- exportHtmlBtn.addEventListener('click', function() {
88
+ if (exportHtmlBtn) exportHtmlBtn.addEventListener('click', function() {
87
89
  var html = getPlainHtml();
88
90
 
89
91
  navigator.clipboard.writeText(html).then(function() {
@@ -434,7 +436,7 @@
434
436
  if (newWidth < 200) newWidth = 200;
435
437
  if (newWidth > 400) newWidth = 400;
436
438
  s.style.width = newWidth + 'px';
437
- main.style.marginLeft = newWidth + 'px';
439
+ if (main) main.style.marginLeft = newWidth + 'px';
438
440
  updateResizerPosition();
439
441
  });
440
442
 
@@ -446,23 +448,23 @@
446
448
  }
447
449
  });
448
450
 
449
- toggleSidebarBtn.addEventListener('click', function() {
451
+ if (toggleSidebarBtn) toggleSidebarBtn.addEventListener('click', function() {
450
452
  var s = document.querySelector('.sidebar');
451
453
  var r = document.querySelector('.resizer');
452
454
 
453
- if (sidebarExists) {
455
+ if (sidebarExists && s && r) {
454
456
  savedWidth = s.offsetWidth;
455
457
  sidebarHtml = s.outerHTML;
456
458
  resizerHtml = r.outerHTML;
457
459
  s.remove();
458
460
  r.remove();
459
- main.style.marginLeft = '0';
461
+ if (main) main.style.marginLeft = '0';
460
462
  sidebarExists = false;
461
- } else {
463
+ } else if (!sidebarExists && main) {
462
464
  main.insertAdjacentHTML('beforebegin', sidebarHtml);
463
465
  main.insertAdjacentHTML('beforebegin', resizerHtml);
464
466
  var newSidebar = document.querySelector('.sidebar');
465
- newSidebar.style.width = savedWidth + 'px';
467
+ if (newSidebar) newSidebar.style.width = savedWidth + 'px';
466
468
  main.style.marginLeft = savedWidth + 'px';
467
469
  setupResizer();
468
470
  updateResizerPosition();
@@ -512,7 +514,7 @@
512
514
  }
513
515
 
514
516
  // ========== 編集モード切り替え ==========
515
- editModeBtn.addEventListener('click', function() {
517
+ if (editModeBtn) editModeBtn.addEventListener('click', function() {
516
518
  isEditMode = !isEditMode;
517
519
  if (isEditMode) {
518
520
  container.classList.add('edit-mode');
@@ -623,19 +625,19 @@
623
625
  container.addEventListener('contextmenu', function(e) {
624
626
  if (!isEditMode) return;
625
627
 
626
- contextMenu.classList.remove('show');
627
- h1ContextMenu.classList.remove('show');
628
- headingContextMenu.classList.remove('show');
629
- paragraphContextMenu.classList.remove('show');
630
- listContextMenu.classList.remove('show');
631
- preContextMenu.classList.remove('show');
632
- blockquoteContextMenu.classList.remove('show');
628
+ if (contextMenu) contextMenu.classList.remove('show');
629
+ if (h1ContextMenu) h1ContextMenu.classList.remove('show');
630
+ if (headingContextMenu) headingContextMenu.classList.remove('show');
631
+ if (paragraphContextMenu) paragraphContextMenu.classList.remove('show');
632
+ if (listContextMenu) listContextMenu.classList.remove('show');
633
+ if (preContextMenu) preContextMenu.classList.remove('show');
634
+ if (blockquoteContextMenu) blockquoteContextMenu.classList.remove('show');
633
635
 
634
636
  var x = e.clientX;
635
637
  var y = e.clientY;
636
638
 
637
639
  var h1 = e.target.closest('h1');
638
- if (h1) {
640
+ if (h1 && h1ContextMenu) {
639
641
  e.preventDefault();
640
642
  contextTargetH1 = h1;
641
643
  showContextMenu(h1ContextMenu, x, y);
@@ -643,7 +645,7 @@
643
645
  }
644
646
 
645
647
  var heading = e.target.closest('h2, h3, h4');
646
- if (heading) {
648
+ if (heading && headingContextMenu) {
647
649
  e.preventDefault();
648
650
  contextTargetHeading = heading;
649
651
  showContextMenu(headingContextMenu, x, y);
@@ -651,7 +653,7 @@
651
653
  }
652
654
 
653
655
  var cell = e.target.closest('td, th');
654
- if (cell) {
656
+ if (cell && contextMenu) {
655
657
  e.preventDefault();
656
658
  contextTargetCell = cell;
657
659
  showContextMenu(contextMenu, x, y);
@@ -659,7 +661,7 @@
659
661
  }
660
662
 
661
663
  var li = e.target.closest('li');
662
- if (li) {
664
+ if (li && listContextMenu) {
663
665
  e.preventDefault();
664
666
  contextTargetLi = li;
665
667
  contextTargetList = li.closest('ul, ol');
@@ -668,7 +670,7 @@
668
670
  }
669
671
 
670
672
  var pre = e.target.closest('pre');
671
- if (pre) {
673
+ if (pre && preContextMenu) {
672
674
  e.preventDefault();
673
675
  contextTargetPre = pre;
674
676
  showContextMenu(preContextMenu, x, y);
@@ -676,7 +678,7 @@
676
678
  }
677
679
 
678
680
  var blockquote = e.target.closest('blockquote');
679
- if (blockquote) {
681
+ if (blockquote && blockquoteContextMenu) {
680
682
  e.preventDefault();
681
683
  contextTargetBlockquote = blockquote;
682
684
  showContextMenu(blockquoteContextMenu, x, y);
@@ -684,7 +686,7 @@
684
686
  }
685
687
 
686
688
  var paragraph = e.target.closest('p');
687
- if (paragraph) {
689
+ if (paragraph && paragraphContextMenu) {
688
690
  e.preventDefault();
689
691
  contextTargetParagraph = paragraph;
690
692
  showContextMenu(paragraphContextMenu, x, y);
@@ -693,24 +695,24 @@
693
695
  });
694
696
 
695
697
  document.addEventListener('click', function() {
696
- contextMenu.classList.remove('show');
697
- h1ContextMenu.classList.remove('show');
698
- headingContextMenu.classList.remove('show');
699
- paragraphContextMenu.classList.remove('show');
700
- listContextMenu.classList.remove('show');
701
- preContextMenu.classList.remove('show');
702
- blockquoteContextMenu.classList.remove('show');
698
+ if (contextMenu) contextMenu.classList.remove('show');
699
+ if (h1ContextMenu) h1ContextMenu.classList.remove('show');
700
+ if (headingContextMenu) headingContextMenu.classList.remove('show');
701
+ if (paragraphContextMenu) paragraphContextMenu.classList.remove('show');
702
+ if (listContextMenu) listContextMenu.classList.remove('show');
703
+ if (preContextMenu) preContextMenu.classList.remove('show');
704
+ if (blockquoteContextMenu) blockquoteContextMenu.classList.remove('show');
703
705
  });
704
706
 
705
707
  document.addEventListener('keydown', function(e) {
706
708
  if (e.key === 'Escape') {
707
- contextMenu.classList.remove('show');
708
- h1ContextMenu.classList.remove('show');
709
- headingContextMenu.classList.remove('show');
710
- paragraphContextMenu.classList.remove('show');
711
- listContextMenu.classList.remove('show');
712
- preContextMenu.classList.remove('show');
713
- blockquoteContextMenu.classList.remove('show');
709
+ if (contextMenu) contextMenu.classList.remove('show');
710
+ if (h1ContextMenu) h1ContextMenu.classList.remove('show');
711
+ if (headingContextMenu) headingContextMenu.classList.remove('show');
712
+ if (paragraphContextMenu) paragraphContextMenu.classList.remove('show');
713
+ if (listContextMenu) listContextMenu.classList.remove('show');
714
+ if (preContextMenu) preContextMenu.classList.remove('show');
715
+ if (blockquoteContextMenu) blockquoteContextMenu.classList.remove('show');
714
716
  }
715
717
 
716
718
  // ↓↑キーで編集可能要素間を移動（複数行対応）
@@ -783,15 +785,15 @@
783
785
  switch (e.key.toLowerCase()) {
784
786
  case 'b':
785
787
  e.preventDefault();
786
- toggleSidebarBtn.click();
788
+ if (toggleSidebarBtn) toggleSidebarBtn.click();
787
789
  break;
788
790
  case 'e':
789
791
  e.preventDefault();
790
- editModeBtn.click();
792
+ if (editModeBtn) editModeBtn.click();
791
793
  break;
792
794
  case 'm':
793
795
  e.preventDefault();
794
- exportMdBtn.click();
796
+ if (exportMdBtn) exportMdBtn.click();
795
797
  break;
796
798
  }
797
799
  }
@@ -900,7 +902,7 @@
900
902
  }
901
903
  });
902
904
 
903
- contextMenu.addEventListener('click', function(e) {
905
+ if (contextMenu) contextMenu.addEventListener('click', function(e) {
904
906
  e.stopPropagation();
905
907
  var item = e.target.closest('.context-menu-item');
906
908
  if (!item || !contextTargetCell) return;
@@ -988,7 +990,7 @@
988
990
  contextTargetCell = null;
989
991
  });
990
992
 
991
- h1ContextMenu.addEventListener('click', function(e) {
993
+ if (h1ContextMenu) h1ContextMenu.addEventListener('click', function(e) {
992
994
  e.stopPropagation();
993
995
  var item = e.target.closest('.context-menu-item');
994
996
  if (!item || !contextTargetH1) return;
@@ -1024,7 +1026,7 @@
1024
1026
  contextTargetH1 = null;
1025
1027
  });
1026
1028
 
1027
- headingContextMenu.addEventListener('click', function(e) {
1029
+ if (headingContextMenu) headingContextMenu.addEventListener('click', function(e) {
1028
1030
  e.stopPropagation();
1029
1031
  var item = e.target.closest('.context-menu-item');
1030
1032
  if (!item || !contextTargetHeading) return;
@@ -1087,7 +1089,7 @@
1087
1089
  contextTargetHeading = null;
1088
1090
  });
1089
1091
 
1090
- paragraphContextMenu.addEventListener('click', function(e) {
1092
+ if (paragraphContextMenu) paragraphContextMenu.addEventListener('click', function(e) {
1091
1093
  e.stopPropagation();
1092
1094
  var item = e.target.closest('.context-menu-item');
1093
1095
  if (!item || !contextTargetParagraph) return;
@@ -1132,7 +1134,7 @@
1132
1134
  contextTargetParagraph = null;
1133
1135
  });
1134
1136
 
1135
- listContextMenu.addEventListener('click', function(e) {
1137
+ if (listContextMenu) listContextMenu.addEventListener('click', function(e) {
1136
1138
  e.stopPropagation();
1137
1139
  var item = e.target.closest('.context-menu-item');
1138
1140
  if (!item || !contextTargetList) return;
@@ -1192,7 +1194,7 @@
1192
1194
  contextTargetLi = null;
1193
1195
  });
1194
1196
 
1195
- preContextMenu.addEventListener('click', function(e) {
1197
+ if (preContextMenu) preContextMenu.addEventListener('click', function(e) {
1196
1198
  e.stopPropagation();
1197
1199
  var item = e.target.closest('.context-menu-item');
1198
1200
  if (!item || !contextTargetPre) return;
@@ -1237,7 +1239,7 @@
1237
1239
  contextTargetPre = null;
1238
1240
  });
1239
1241
 
1240
- blockquoteContextMenu.addEventListener('click', function(e) {
1242
+ if (blockquoteContextMenu) blockquoteContextMenu.addEventListener('click', function(e) {
1241
1243
  e.stopPropagation();
1242
1244
  var item = e.target.closest('.context-menu-item');
1243
1245
  if (!item || !contextTargetBlockquote) return;
@@ -1362,9 +1364,9 @@
1362
1364
  }
1363
1365
 
1364
1366
  // ========== PDF出力 ==========
1365
- exportPdfBtn.addEventListener('click', async function() {
1367
+ if (exportPdfBtn) exportPdfBtn.addEventListener('click', async function() {
1366
1368
  var wasEditMode = isEditMode;
1367
- if (isEditMode) editModeBtn.click();
1369
+ if (isEditMode && editModeBtn) editModeBtn.click();
1368
1370
 
1369
1371
  exportPdfBtn.textContent = '...';
1370
1372
 
@@ -1551,7 +1553,7 @@
1551
1553
  }
1552
1554
 
1553
1555
  exportPdfBtn.textContent = '📕';
1554
- if (wasEditMode) editModeBtn.click();
1556
+ if (wasEditMode && editModeBtn) editModeBtn.click();
1555
1557
  });
1556
1558
 
1557
1559
  // ========== Excel出力 ==========
@@ -1561,7 +1563,7 @@
1561
1563
  body: 12
1562
1564
  };
1563
1565
 
1564
- exportExcelBtn.addEventListener('click', async function() {
1566
+ if (exportExcelBtn) exportExcelBtn.addEventListener('click', async function() {
1565
1567
  try {
1566
1568
  await convertToExcel();
1567
1569
  } catch (error) {
@@ -2039,4 +2041,4 @@
2039
2041
  };
2040
2042
  }
2041
2043
 
2042
- })();
2044
+ });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sunny-html-editor",
3
- "version": "1.0.1",
3
+ "version": "1.0.3",
4
4
  "description": "軽量WYSIWYGエディタ - 既存のHTMLに編集機能を後付けで追加",
5
5
  "main": "html-editor.js",
6
6
  "files": [