Initial commit

.editorconfig

@@ -0,0 +1,10 @@
+# top-most EditorConfig file
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+indent_style = tab
+indent_size = 4
+tab_width = 4

.eslintignore

@@ -0,0 +1,3 @@
+node_modules/
+
+main.js

.eslintrc

@@ -0,0 +1,23 @@
+{
+    "root": true,
+    "parser": "@typescript-eslint/parser",
+    "env": { "node": true },
+    "plugins": [
+      "@typescript-eslint"
+    ],
+    "extends": [
+      "eslint:recommended",
+      "plugin:@typescript-eslint/eslint-recommended",
+      "plugin:@typescript-eslint/recommended"
+    ], 
+    "parserOptions": {
+        "sourceType": "module"
+    },
+    "rules": {
+      "no-unused-vars": "off",
+      "@typescript-eslint/no-unused-vars": ["error", { "args": "none" }],
+      "@typescript-eslint/ban-ts-comment": "off",
+      "no-prototype-builtins": "off",
+      "@typescript-eslint/no-empty-function": "off"
+    } 
+  }

.eslintrc.js

@@ -0,0 +1,25 @@
+module.exports = {
+	"root": true,
+	"parser": "@typescript-eslint/parser",
+	"env": { "node": true },
+	"plugins": [
+		"@typescript-eslint"
+	],
+	"extends": [
+		"eslint:recommended",
+		"plugin:@typescript-eslint/eslint-recommended",
+		"plugin:@typescript-eslint/recommended"
+	],
+	"parserOptions": {
+		"sourceType": "module"
+	},
+	"rules": {
+		"no-unused-vars": "off",
+		"@typescript-eslint/no-unused-vars": ["error", { "args": "all", "argsIgnorePattern": "_.*" }],
+		"@typescript-eslint/ban-ts-comment": "off",
+		"no-prototype-builtins": "off",
+		"@typescript-eslint/no-empty-function": "off",
+		"semi": "off",
+		"@typescript-eslint/semi": "warn"
+	}
+};

.github/workflows/release.yml

@@ -0,0 +1,36 @@
+name: Release Obsidian plugin
+permissions:
+    contents: write
+
+on:
+    push:
+        tags:
+            - "*"
+
+jobs:
+    build:
+        runs-on: ubuntu-latest
+
+        steps:
+            - uses: actions/checkout@v3
+
+            - name: Use Node.js
+              uses: actions/setup-node@v3
+              with:
+                  node-version: "18.x"
+
+            - name: Build plugin
+              run: |
+                  npm install
+                  npm run build
+
+            - name: Create release
+              env:
+                  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+              run: |
+                  tag="${GITHUB_REF#refs/tags/}"
+                  
+                  gh release create "$tag" \
+                    --title="$tag" \
+                    --draft \
+                    main.js manifest.json styles.css

.gitignore

@@ -0,0 +1,22 @@
+# vscode
+.vscode 
+
+# Intellij
+*.iml
+.idea
+
+# npm
+node_modules
+
+# Don't include the compiled main.js file in the repo.
+# They should be uploaded to GitHub releases instead.
+main.js
+
+# Exclude sourcemaps
+*.map
+
+# obsidian
+data.json
+
+# Exclude macOS Finder (System Explorer) View States
+.DS_Store

.npmrc

@@ -0,0 +1 @@
+tag-version-prefix=""

.run/Debug.run.xml

@@ -0,0 +1,5 @@
+<component name="ProjectRunConfigurationManager">
+  <configuration default="false" name="Debug" type="ChromiumRemoteDebugType" factoryName="Chromium Remote" port="9222" restartOnDisconnect="true">
+    <method v="2" />
+  </configuration>
+</component>

.run/Run Obsidian.run.xml

@@ -0,0 +1,5 @@
+<component name="ProjectRunConfigurationManager">
+  <configuration default="false" name="Run Obsidian" type="NodeJSConfigurationType" application-parameters="--remote-debugging-port=9222" path-to-node="/Applications/Obsidian.app/Contents/MacOS/Obsidian" node-parameters="." working-dir="$PROJECT_DIR$">
+    <method v="2" />
+  </configuration>
+</component>

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Marcel Schaeben
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,122 @@
+# Obsidian Chord Sheets
+
+Render and work with chord sheets (**chords over lyrics**) in your vault. This plugin brings
+UltimateGuitar-like functionality into Obsidian, featuring **chord diagrams**,
+support for **guitar** and **ukulele**, **transposition**, and **autoscroll**. Works seamlessly in **edit / live preview**
+and **reading** mode. It integrates with your **theme colors** and is **customizable** to your needs.
+
+## Features
+
+### ✨ Highlight Chord Symbols
+
+Detects and highlights chord symbols in fenced code blocks marked as `"chord"`.
+
+![chord-blocks.png](docs/chord-blocks.png)
+
+[!TIP]
+When copy and pasting a chord sheet from a website, paste as plain text to preserve formatting. 
+
+### 🎼 Chord Diagrams
+
+Show chord diagrams on hover or on top of a chord block. Provides alternative fingerings for each chord. Diagrams are
+rendered locally, no API calls to an external service required.
+
+![diagram-popups.gif](docs/diagram-popups.gif)
+
+![chord-overview.gif](docs/chord-overview.gif)
+
+### 🎸 Choose Your Instrument
+
+Supports guitar and ukulele for rendering the chord diagrams. Instrument can be set globally or specified per chord block.
+
+![change-instrument.gif](docs/change-instrument.gif)
+
+### 📝 Seamless Editing
+
+Allows seamless editing of chords and lyrics in *live preview / edit* mode while keeping chord symbol
+highlighting and chord diagram rendering active, without needing to switch the fenced block to source view. This is
+achieved by implementing a CodeMirror editor extension for rendering instead of a code block post processor.
+
+### 🔄 Transpose Songs
+
+Transpose songs up and down with a click or an editor command.
+
+![transpose.gif](docs/transpose.gif)
+
+### 📜 Autoscroll
+
+Scroll down as you play with configurable speed.
+
+![autoscroll.gif](docs/autoscroll.gif)
+
+### 🌈 Uses Theme Colors
+
+| Minimal dark                               | Minimal bright                                 | AnuPpuccin bright                                    |
+|--------------------------------------------|------------------------------------------------|------------------------------------------------------|
+| ![minimal-dark.png](docs/minimal-dark.png) | ![minimal-bright.png](docs/minimal-bright.png) | ![anuppuccin-bright.png](docs/anuppuccin-bright.png) |
+
+
+### ⌨️ Editor Commands
+
+Access all features using dedicated editor commands with support for keyboard shortcuts.
+
+![editor-commands.png](docs/editor-commands.png)
+
+*Note*: The keyboard shortcuts in the screenshot are just for illustration. Shortcuts are empty by default 
+and need to be set in Obsidian settings after installing the plugin. 
+
+### 📱Mobile Support
+
+Works well on mobile. Bring up chord diagram popups by tapping on the chord symbols.
+Can be a bit fiddly in _edit / live preview_ mode because tapping on a chord positions the caret 
+there which will bring up the keyboard. Prefer using _reading_ mode on mobile.
+
+### ⚙️ Configurability
+
+* Hide certain **UI elements** (instrument and transpose controls, chord diagrams, autoscroll button) for _edit / live preview_ mode, _reading_ mode, or both. 
+* Adjust **chord diagram size** and the **default instrument** 
+* Customize the block **"language" specifier** (e.g. start a chord block with ```` ```tab````  instead of ```` ```chords````)
+
+## Development
+
+- Clone this repo.
+- `npm i` to install dependencies
+- `npm run dev` to start compilation in watch mode.
+
+This repo contains **run / debug configurations** for JetBrains IDEs (such as WebStorm). You will
+need to adapt the _Run Obsidian_ configuration to the path of your Obsidian installation and set the 
+working directory to the path where you cloned this repo.
+
+To start a development and debug session with supports for breakpoints etc.:
+
+1. Run the **Run Obsidian** configuration in **debug** mode. This will start Obsidian with the `--remote-debugging-port=9222` parameter which enables
+Chrome remote debugging on port 9222.
+2. Run the **Debug** configuration which attaches the IDE to Obsidian.
+3. Run the **dev** configuration in **debug** mode which starts the development server.
+
+## Manually installing the plugin
+
+- Copy over `main.js`, `styles.css`, `manifest.json` to your vault `VaultFolder/.obsidian/plugins/your-plugin-id/`.
+
+## Credits
+
+This plugin uses:
+
+- [Vexchords](https://github.com/0xfe/vexchords) for rendering chord diagrams.
+- [tonal](https://github.com/tonaljs/tonal) for parsing chord symbols.
+- [chords-db](https://github.com/tombatossals/chords-db) for ukulele and guitar fingerings.
+
+## Inspiration / Alternatives
+
+- [Scales and Chords](https://github.com/egradman/scales-chords#readme)
+	- Highlights chord symbols over lyrics in fenced code blocks
+	- Shows chord diagrams on click that are fetched through an external web service
+- [Obsidian Chord Lyrics](https://github.com/nevernotmove/obsidian-chordlyrics#readme)
+	- Highlights chord symbols over lyrics in fenced code blocks
+	- Maintains chord / lyrics relationships when line wrapping, good for reading chord sheets on your phone
+- [Obsidian Markdown Chords](https://github.com/dnotes/obsidian-markdown-chords)
+	- Renders chords in the ChordPro-inspired [*markdown-it-chords*](https://dnotes.github.io/markdown-it-chords/) (bracketed chords in lyrics) format in fenced code blocks
+	- Optional rendering of chord diagrams above lyrics
+	- Fingering needs to be specified explicitly as part of the chord symbol
+- [Obsidian jTab](https://github.com/davfive/obsidian-jtab)
+	- Renders tabs and chord diagrams in [*jTab*](https://jtab.tardate.com/) format in fenced code blocks 

chord-db/chord-db.d.ts

@@ -0,0 +1,11 @@
+import { ChordDB } from './chord-db';
+
+declare module "chord-db/guitar.json" {
+    const content: ChordDB;
+
+}
+
+declare module "chord-db/ukulele.json" {
+    const content: ChordDB;
+
+}

chord-db/chord-db.ts

@@ -0,0 +1,41 @@
+export interface ChordDB {
+	main: Main;
+	tunings: Tunings;
+	keys: string[];
+	suffixes: string[];
+	chords: Chords;
+}
+
+
+export interface Chords {
+	[key: string]: ChordDef[];
+}
+
+export interface ChordDef {
+	key: string;
+	suffix: string;
+	positions: Position[];
+}
+
+
+export interface Position {
+	frets: number[];
+	fingers: number[];
+	baseFret: number;
+	barres: number[];
+	midi: number[];
+	capo?: boolean;
+}
+
+export interface Main {
+	strings: number;
+	fretsOnChord: number;
+	name: string;
+	numberOfChords: number;
+}
+
+export interface Tunings {
+	standard: string[];
+}
+
+export default ChordDB;