Merge pull request #38 from pjwebster/readable-line-length

New Feature: full-width view based off vault config
cooklang · Nov 10, 2024 · 8316d53 · 8316d53
2 parents ede64b7 + 928aec9
commit 8316d53
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 4 deletions.
diff --git a/src/cookView.ts b/src/cookView.ts
@@ -23,10 +23,18 @@ export class CookView extends TextFileView {
 
     this.alarmAudio = new Howl({ src: [alarmMp3], loop: false, preload: true });
     this.timerAudio = new Howl({ src: [timerMp3], loop: true, preload: true });
-    // Add Preview Mode Container
-    this.previewEl = this.contentEl.createDiv({ cls: 'cook-preview-view', attr: { 'style': 'display: none' } });
-    // Add Source Mode Container
-    this.sourceEl = this.contentEl.createDiv({ cls: 'cook-source-view', attr: { 'style': 'display: block' } });
+    if ((this.app.vault as any).getConfig('readableLineLength')) {
+      // Add Preview Mode Container
+      this.previewEl = this.contentEl.createDiv({ cls: 'cook-preview-view', attr: { 'style': 'display: none' } });
+      // Add Source Mode Container
+      this.sourceEl = this.contentEl.createDiv({ cls: 'cook-source-view', attr: { 'style': 'display: block' } });
+    }
+    else {
+      // Add Source Mode Container
+      this.previewEl = this.contentEl.createDiv({ cls: 'cook-preview-view-full', attr: { 'style': 'display: none' } });
+      // Add Source Mode Container
+      this.sourceEl = this.contentEl.createDiv({ cls: 'cook-source-view-full', attr: { 'style': 'display: block' } });
+    }
     // Create CodeMirror Editor with specific config
     this.editor = CodeMirror.fromTextArea(this.sourceEl.createEl('textarea', { cls: 'cook-cm-editor' }), {
       lineNumbers: (this.app.vault as any).getConfig('showLineNumber'),

diff --git a/src/styles.scss b/src/styles.scss
@@ -9,6 +9,11 @@
     margin-left: auto;
     margin-right: auto;
   }
+  .cook-preview-view-full,
+  .cook-source-view-full {
+    margin-left: auto;
+    margin-right: auto;
+  }
 
   .main-image {
     width: 100vw;