',
20 | symbol: '
',
21 | shift: 5,
22 | selectionInput: 5,
23 | objectType: 'htmlFormatterSetting',
24 | },
25 | span: {
26 | des: '
',
27 | symbol: '',
28 | shift: 6,
29 | selectionInput: 6,
30 | objectType: 'htmlFormatterSetting',
31 | },
32 | img: {
33 | des: '
',
34 | symbol: '
',
35 | shift: 10,
36 | selectionInput: 38,
37 | objectType: 'htmlFormatterSetting',
38 | },
39 | a: {
40 | des: '',
41 | symbol: '',
42 | shift: 3,
43 | selectionInput: 3,
44 | objectType: 'htmlFormatterSetting',
45 | },
46 | p: {
47 | des: '',
48 | symbol: '
',
49 | shift: 3,
50 | selectionInput: 3,
51 | objectType: 'htmlFormatterSetting',
52 | },
53 | font: {
54 | des: '',
55 | symbol:
56 | '',
57 | shift: 64,
58 | selectionInput: 64,
59 | objectType: 'htmlFormatterSetting',
60 | },
61 | table: {
62 | des: '',
63 | symbol: '',
64 | shift: 7,
65 | selectionInput: 7,
66 | objectType: 'htmlFormatterSetting',
67 | },
68 | thead: {
69 | des: '',
70 | symbol: '',
71 | shift: 7,
72 | selectionInput: 7,
73 | objectType: 'htmlFormatterSetting',
74 | },
75 | tbody: {
76 | des: '',
77 | symbol: '',
78 | shift: 7,
79 | selectionInput: 7,
80 | objectType: 'htmlFormatterSetting',
81 | },
82 | tfoot: {
83 | des: '',
84 | symbol: '',
85 | shift: 7,
86 | selectionInput: 7,
87 | objectType: 'htmlFormatterSetting',
88 | },
89 | tr: {
90 | des: '',
91 | symbol: '
',
92 | shift: 4,
93 | selectionInput: 4,
94 | objectType: 'htmlFormatterSetting',
95 | },
96 | td: {
97 | des: '',
98 | symbol: ' | | ',
99 | shift: 4,
100 | selectionInput: 4,
101 | objectType: 'htmlFormatterSetting',
102 | },
103 | th: {
104 | des: '',
105 | symbol: ' | | ',
106 | shift: 4,
107 | selectionInput: 4,
108 | objectType: 'htmlFormatterSetting',
109 | },
110 | details: {
111 | des: '',
112 | symbol: ' ',
113 | shift: 9,
114 | selectionInput: 9,
115 | objectType: 'htmlFormatterSetting',
116 | },
117 | summary: {
118 | des: '',
119 | symbol: '
',
120 | shift: 9,
121 | selectionInput: 9,
122 | objectType: 'htmlFormatterSetting',
123 | },
124 | u: {
125 | des: '',
126 | symbol: '',
127 | shift: 3,
128 | selectionInput: 3,
129 | objectType: 'htmlFormatterSetting',
130 | },
131 | };
132 |
133 | export function htmlFormatter(editor: Editor, item: htmlFormatterSetting) {
134 | if (editor) {
135 | const isSelection = editor.somethingSelected;
136 | const selection = editor.getSelection();
137 | const curserStart = editor.getCursor('from');
138 | const curserEnd = editor.getCursor('to');
139 | const line = editor.getLine(curserStart.line);
140 |
141 | editor.focus();
142 |
143 | if (isSelection) {
144 | let replacment = selection.trim();
145 |
146 | editor.replaceSelection(
147 | item.symbol.substring(0, item.selectionInput) +
148 | replacment +
149 | item.symbol.substring(item.selectionInput),
150 | );
151 | editor.setCursor(curserStart.line, curserStart.ch + item.shift);
152 | } else {
153 | editor.replaceRange(item.symbol, curserStart);
154 | editor.setCursor(curserStart.line, curserStart.ch + item.shift);
155 | }
156 | }
157 | }
158 |
--------------------------------------------------------------------------------
/src/icons.ts:
--------------------------------------------------------------------------------
1 | import * as R from 'ramda';
2 | import { addIcon } from 'obsidian';
3 | import * as mdiIcons from '@mdi/js';
4 | import * as iconPaths from './iconPaths';
5 |
6 | function pathToSvg(icon: string) {
7 | return `
8 | `;
11 | }
12 |
13 | function importIconPaths() {
14 | let res = {};
15 | console.log(iconPaths);
16 | R.forEachObjIndexed((value, key, obj) => {
17 | // @ts-ignore
18 | res = R.mergeLeft(res, R.map(pathToSvg, value));
19 | }, iconPaths);
20 | return res;
21 | }
22 |
23 | export const icons: Record = {
24 | ...importIconPaths(),
25 |
26 | division: pathToSvg(mdiIcons.mdiDivision),
27 | multiplication: pathToSvg(mdiIcons.mdiCircleSmall),
28 |
29 | h1: pathToSvg(mdiIcons.mdiFormatHeader1),
30 | h2: pathToSvg(mdiIcons.mdiFormatHeader2),
31 | h3: pathToSvg(mdiIcons.mdiFormatHeader3),
32 | h4: pathToSvg(mdiIcons.mdiFormatHeader4),
33 | h5: pathToSvg(mdiIcons.mdiFormatHeader5),
34 | h6: pathToSvg(mdiIcons.mdiFormatHeader6),
35 | bold: pathToSvg(mdiIcons.mdiFormatBold),
36 | italic: pathToSvg(mdiIcons.mdiFormatItalic),
37 | strikethrough: pathToSvg(mdiIcons.mdiFormatStrikethroughVariant),
38 | codeInline: pathToSvg(mdiIcons.mdiCodeTags),
39 | codeBlock: pathToSvg(mdiIcons.mdiXml),
40 | link: pathToSvg(mdiIcons.mdiLinkVariant),
41 | mermaidBlock: pathToSvg(mdiIcons.mdiGraph),
42 | fileLink: pathToSvg(mdiIcons.mdiFileLink),
43 | image: pathToSvg(mdiIcons.mdiImage),
44 | quote: pathToSvg(mdiIcons.mdiFormatIndentIncrease),
45 | bulletList: pathToSvg(mdiIcons.mdiFormatListBulleted),
46 | numberList: pathToSvg(mdiIcons.mdiFormatListNumbered),
47 | checkList: pathToSvg(mdiIcons.mdiFormatListBulletedSquare),
48 | viewIcon: pathToSvg(mdiIcons.mdiLanguageMarkdown),
49 | underline: pathToSvg(mdiIcons.mdiFormatUnderline),
50 | menu: pathToSvg(mdiIcons.mdiMenu),
51 | expandArrowDown: pathToSvg(mdiIcons.mdiChevronDown),
52 | expandArrowUp: pathToSvg(mdiIcons.mdiChevronUp),
53 | highlight: pathToSvg(mdiIcons.mdiMarker),
54 | };
55 |
56 | export const addIcons = (): void => {
57 | Object.keys(icons).forEach((key) => {
58 | addIcon(key, icons[key]);
59 | });
60 | };
61 |
62 | /**
63 | * Convert an svg string into an HTML element.
64 | *
65 | * @param svgText svg image as a string
66 | */
67 | export const svgToElement = (key: string | number): HTMLElement => {
68 | if (key.toString().contains('.svg')) {
69 | const img = document.createElement('img');
70 | img.src = key.toString();
71 | img.style.width = '24px';
72 | img.style.height = '24px';
73 |
74 | return img;
75 | } else {
76 | const parser = new DOMParser();
77 | return parser.parseFromString(icons[key], 'text/xml').documentElement;
78 | }
79 | };
80 |
--------------------------------------------------------------------------------
/src/latexFormatter.ts:
--------------------------------------------------------------------------------
1 | import { Editor } from 'obsidian';
2 |
3 | export interface latexFormatterSetting {
4 | des: string;
5 | text: string;
6 | symbol: string;
7 | shift: number;
8 | selectionInput: number;
9 | type: string;
10 | newLine: boolean;
11 | }
12 |
13 | export const latexFormatterSettings = {
14 | inlineEquation: {
15 | des: 'inline equation',
16 | text: '$$x$$',
17 | symbol: '$$$$',
18 | shift: 2,
19 | selectionInput: 2,
20 | type: 'text',
21 | newLine: false,
22 | objectType: 'latexFormatterSetting',
23 | },
24 | equation: {
25 | des: 'equation',
26 | text: '$x$',
27 | symbol: '$$',
28 | shift: 1,
29 | selectionInput: 1,
30 | type: 'text',
31 | newLine: false,
32 | objectType: 'latexFormatterSetting',
33 | },
34 | division: {
35 | des: 'frac',
36 | text: 'division',
37 | symbol: '\\frac{}{}',
38 | shift: 6,
39 | selectionInput: 6,
40 | type: 'icon',
41 | newLine: true,
42 | objectType: 'latexFormatterSetting',
43 | },
44 | multiplication: {
45 | des: 'times',
46 | text: 'multiplication',
47 | symbol: '\\times',
48 | shift: 6,
49 | selectionInput: 6,
50 | type: 'icon',
51 | newLine: false,
52 | objectType: 'latexFormatterSetting',
53 | },
54 | sup: {
55 | des: 'superscript',
56 | text: 'xy',
57 | symbol: '^{}',
58 | shift: 2,
59 | selectionInput: 2,
60 | type: 'text',
61 | newLine: false,
62 | objectType: 'latexFormatterSetting',
63 | },
64 | div: {
65 | des: 'division',
66 | text: 'x-1',
67 | symbol: '^{-1}',
68 | shift: 5,
69 | selectionInput: 5,
70 | type: 'text',
71 | newLine: false,
72 | objectType: 'latexFormatterSetting',
73 | },
74 | sub: {
75 | des: 'subscript',
76 | text: 'xy',
77 | symbol: '_{}',
78 | shift: 2,
79 | selectionInput: 2,
80 | type: 'text',
81 | newLine: false,
82 | objectType: 'latexFormatterSetting',
83 | },
84 | pi: {
85 | des: 'pi',
86 | text: 'pi',
87 | symbol: '\\pi',
88 | shift: 3,
89 | selectionInput: 3,
90 | type: 'icon',
91 | newLine: false,
92 | objectType: 'latexFormatterSetting',
93 | },
94 | e: {
95 | des: 'e',
96 | text: 'ex',
97 | symbol: 'e^{}',
98 | shift: 3,
99 | selectionInput: 3,
100 | type: 'text',
101 | newLine: true,
102 | objectType: 'latexFormatterSetting',
103 | },
104 | exp: {
105 | des: 'exp',
106 | text: 'exp',
107 | symbol: '\\exp()',
108 | shift: 5,
109 | selectionInput: 5,
110 | type: 'text',
111 | newLine: false,
112 | objectType: 'latexFormatterSetting',
113 | },
114 | log: {
115 | des: 'log',
116 | text: 'log',
117 | symbol: '\\log()',
118 | shift: 5,
119 | selectionInput: 5,
120 | type: 'text',
121 | newLine: false,
122 | objectType: 'latexFormatterSetting',
123 | },
124 | sin: {
125 | des: 'sin',
126 | text: 'sin',
127 | symbol: '\\sin()',
128 | shift: 5,
129 | selectionInput: 5,
130 | type: 'text',
131 | newLine: true,
132 | objectType: 'latexFormatterSetting',
133 | },
134 | cos: {
135 | des: 'cos',
136 | text: 'cos',
137 | symbol: '\\cos()',
138 | shift: 5,
139 | selectionInput: 5,
140 | type: 'text',
141 | newLine: false,
142 | objectType: 'latexFormatterSetting',
143 | },
144 | tan: {
145 | des: 'tan',
146 | text: 'tan',
147 | symbol: '\\tan()',
148 | shift: 5,
149 | selectionInput: 5,
150 | type: 'text',
151 | newLine: false,
152 | objectType: 'latexFormatterSetting',
153 | },
154 | cot: {
155 | des: 'cot',
156 | text: 'cot',
157 | symbol: '\\cot()',
158 | shift: 5,
159 | selectionInput: 5,
160 | type: 'text',
161 | newLine: false,
162 | objectType: 'latexFormatterSetting',
163 | },
164 | sin2: {
165 | des: 'cos^2',
166 | text: 'sin2',
167 | symbol: '\\sin^2()',
168 | shift: 7,
169 | selectionInput: 7,
170 | type: 'text',
171 | newLine: true,
172 | objectType: 'latexFormatterSetting',
173 | },
174 | cos2: {
175 | des: 'cos^2',
176 | text: 'cos2',
177 | symbol: '\\cos^2()',
178 | shift: 7,
179 | selectionInput: 7,
180 | type: 'text',
181 | newLine: false,
182 | objectType: 'latexFormatterSetting',
183 | },
184 | tan2: {
185 | des: 'tan^2',
186 | text: 'tan2',
187 | symbol: '\\tan^2()',
188 | shift: 7,
189 | selectionInput: 7,
190 | type: 'text',
191 | newLine: false,
192 | objectType: 'latexFormatterSetting',
193 | },
194 | cot2: {
195 | des: 'cot^2',
196 | text: 'cot2',
197 | symbol: '\\cot^2()',
198 | shift: 7,
199 | selectionInput: 7,
200 | type: 'text',
201 | newLine: false,
202 | objectType: 'latexFormatterSetting',
203 | },
204 | roundBrackets: {
205 | des: 'round brackets',
206 | text: '(x)',
207 | symbol: '\\left(\\right)',
208 | shift: 6,
209 | selectionInput: 6,
210 | type: 'text',
211 | newLine: true,
212 | objectType: 'latexFormatterSetting',
213 | },
214 | squareBrackets: {
215 | des: 'square brackets',
216 | text: '[x]',
217 | symbol: '\\left[\\right]',
218 | shift: 6,
219 | selectionInput: 6,
220 | type: 'text',
221 | newLine: false,
222 | objectType: 'latexFormatterSetting',
223 | },
224 | curlyBrackets: {
225 | des: 'curly brackets',
226 | text: '{x}',
227 | symbol: '\\left\\{\\right\\}',
228 | shift: 7,
229 | selectionInput: 7,
230 | type: 'text',
231 | newLine: false,
232 | objectType: 'latexFormatterSetting',
233 | },
234 | pipeBrackets: {
235 | des: 'pipe brackets',
236 | text: '|x|',
237 | symbol: '\\left|\\right|',
238 | shift: 6,
239 | selectionInput: 6,
240 | type: 'text',
241 | newLine: false,
242 | objectType: 'latexFormatterSetting',
243 | },
244 | doublePipeBrackets: {
245 | des: 'double pipe brackets',
246 | text: '||x||',
247 | symbol: '\\left\\|\\right\\|',
248 | shift: 7,
249 | selectionInput: 7,
250 | type: 'text',
251 | newLine: false,
252 | objectType: 'latexFormatterSetting',
253 | },
254 | };
255 |
256 | export function latexFormatter(editor: Editor, item: latexFormatterSetting) {
257 | if (editor) {
258 | const isSelection = editor.somethingSelected;
259 | const selection = editor.getSelection();
260 | const curserStart = editor.getCursor('from');
261 | const curserEnd = editor.getCursor('to');
262 | const line = editor.getLine(curserStart.line);
263 |
264 | editor.focus();
265 | if (isSelection) {
266 | let replacment = selection.trim();
267 |
268 | editor.replaceSelection(
269 | item.symbol.substring(0, item.selectionInput) +
270 | replacment +
271 | item.symbol.substring(item.selectionInput),
272 | );
273 | editor.setCursor(curserStart.line, curserStart.ch + item.shift);
274 | } else {
275 | editor.replaceRange(item.symbol, curserStart);
276 | editor.setCursor(curserStart.line, curserStart.ch + item.shift);
277 | }
278 | }
279 | }
280 |
--------------------------------------------------------------------------------
/styles.css:
--------------------------------------------------------------------------------
1 | /* Sets all the text color to red! */
2 | .nav-action-button {
3 | color: var(--text-muted);
4 | cursor: pointer;
5 | padding: 0px;
6 | margin: 5px;
7 | border-radius: 4px;
8 | }
9 |
10 | .nav-action-text-button {
11 | color: var(--text-muted);
12 | cursor: pointer;
13 | padding: 5px;
14 | margin: 4px;
15 | border-radius: 4px;
16 | text-align: center;
17 | border: 1px solid;
18 | }
19 | .nav-action-text-button.is-active {
20 | background-color: var(--interactive-accent);
21 | color: var(--text-on-accent);
22 | }
23 | .nav-action-text-button.is-active:hover {
24 | color: var(--text-on-accent);
25 | }
26 | .nav-action-text-button:hover {
27 | color: var(--text-accent);
28 | }
29 |
30 | .color-icon {
31 | color: var(--text-muted);
32 | cursor: pointer;
33 | width: 16px;
34 | min-width: 16px;
35 | max-width: 16px;
36 | height: 16px;
37 | min-height: 16px;
38 | max-height: 16px;
39 | margin: 3px;
40 | display: inline-block;
41 | border-radius: 4px;
42 | }
43 |
44 | .command-list-view-row {
45 | display: flex;
46 | }
47 | .command-list-view-container {
48 | min-width: 60px;
49 | display: flex;
50 | }
51 |
52 | .command-list-view-icon {
53 | height: 24px;
54 | max-height: 24px;
55 | border: 1px solid gray;
56 | margin-right: auto;
57 | }
58 |
59 | .command-list-view-text {
60 | padding-left: 12px;
61 | color: #c7254e;
62 | }
63 |
--------------------------------------------------------------------------------
/testings.md:
--------------------------------------------------------------------------------
1 |
2 | ## How to use the hotkey ALT+Q
3 |
4 | ``` json
5 | {
6 | "id": "obsidian-markdown-formatting-assistant-plugin",
7 | "name": "Markdown Formatting Assistant",
8 | "version": "0.4.0",
9 | "minAppVersion": "0.15.6",
10 | "description": "This Plugin provides a simple Editor for Markdown, HTML and Colors and in addition a command interface. The command interface facilitate a faster workflow.",
11 | "author": "Reocin",
12 | "authorUrl": "https://github.com/Reocin/obsidian-markdown-formatting-assistant-plugin",
13 | "isDesktopOnly": false
14 | }
15 | ```
16 |
17 |
18 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "baseUrl": ".",
4 | "inlineSourceMap": true,
5 | "inlineSources": true,
6 | "module": "ESNext",
7 | "target": "es5",
8 | "allowJs": true,
9 | "noImplicitAny": true,
10 | "moduleResolution": "node",
11 | "importHelpers": true,
12 | "lib": [
13 | "dom",
14 | "es5",
15 | "scripthost",
16 | "es2015"
17 | ]
18 | },
19 | "include": [
20 | "**/*.ts"
21 | ]
22 | }
23 |
--------------------------------------------------------------------------------
/versions.json:
--------------------------------------------------------------------------------
1 | {
2 | "0.1.0": "0.10.9",
3 | "0.1.1": "0.10.9",
4 | "0.1.2": "0.10.9",
5 | "0.2.0": "0.10.9",
6 | "0.2.1": "0.10.9",
7 | "0.2.2": "0.10.9",
8 | "0.3.0": "0.10.9",
9 | "0.3.1": "0.12.4",
10 | "0.3.2": "0.12.4",
11 | "0.4.0": "0.15.6",
12 | "0.4.1": "0.15.6"
13 | }
14 |
--------------------------------------------------------------------------------