Merge branch 'master' into release

Author: mProjectsCode

README.md

@@ -28,6 +28,7 @@ For more examples see the `exampleVault` folder.
 - `select` a select input field, only for code blocks
 - `multi_select` a multi-select input field, only for code blocks
 - `date` a date input field
+- `date_picker` a date picker
 
 #### Arguments
 - `class(class_name)` adds a css class to the input field
@@ -36,9 +37,10 @@ For more examples see the `exampleVault` folder.
 - `maxValue(value)` only for slider, sets the max value
 - `option(value)` only for (multi-)selects, adds an option to the select
 - `title(value)` only for (multi-)selects, adds a title to the select input
+- `alignRight` only for date picker, aligns the date picker popup to the right of the input field
 
 ### How to install
-You must manually download the zip archive from the latest release here on GitHub.  
+You can eiter download it directly through Obsidian's plugin page or you can manually download the zip archive from the latest release here on GitHub.  
 After downloading, extract the archive into the `.obsidian/plugins` folder in your vault.
 
 The folder structure should look like this:

exampleVault/.obsidian/plugins/obsidian-meta-bind-plugin/main.js

@@ -1,7 +1,7 @@
 {
 	"id": "obsidian-meta-bind-plugin",
 	"name": "Meta Bind Plugin",
-	"version": "0.2.1",
+	"version": "0.3.0",
 	"minAppVersion": "0.14.0",
 	"description": "This plugin can create input fields inside your notes and bind them to metadata fields.",
 	"author": "Moritz Jung",

exampleVault/.obsidian/plugins/obsidian-meta-bind-plugin/manifest.json

@@ -121,7 +121,7 @@ option(option d)
 ):other note#multi-select]
 ```
 
-Lorem ipsum dolor sit amet, `INPUT[date():other note#date]` consectetur adipiscing elit. Pellentesque sit amet porttitor arcu. Quisque scelerisque dolor augue, et posuere nulla bibendum nec. `INPUT[date():other note#date]` Curabitur sed rhoncus nisl. Maecenas nisi justo, viverra vel tempus vel, hendrerit at metus. `INPUT[date_picker:other note#date]`  asdasd asdasdasd
+Lorem ipsum dolor sit amet, `INPUT[date():other note#date]` consectetur adipiscing elit. Pellentesque sit amet porttitor arcu. Quisque scelerisque dolor augue, et posuere nulla bibendum nec. `INPUT[date():other note#date]` Curabitur sed rhoncus nisl. Maecenas nisi justo, viverra vel tempus vel, hendrerit at metus. `INPUT[date_picker():other note#date]`  asdasd asdasdasd
 
 asdasd
 

exampleVault/examples.md

@@ -1,9 +1,9 @@
 ---
-title: asdasds sdf sasdfnosdijn  sdaskdjasbokbfosdasdasdasd asd asdasda f
-select: option b
+title: asdasds sdf sasdfnosdijn  sdaskdjasbokbfosdasdasdasd asd asd
+select: option a
 multi-select:
-  - option b
+  - option a
   - option c
-date: Monday, June 4th 2029
+date: Wednesday, June 6th 2029
 time: 19:20
 ---

exampleVault/other note.md

@@ -1,7 +1,7 @@
 {
 	"id": "obsidian-meta-bind-plugin",
 	"name": "Meta Bind Plugin",
-	"version": "0.2.1",
+	"version": "0.3.0",
 	"minAppVersion": "0.14.0",
 	"description": "This plugin can create input fields inside your notes and bind them to metadata fields.",
 	"author": "Moritz Jung",

manifest.json

@@ -1,6 +1,6 @@
 {
 	"name": "obsidian-meta-bind-plugin",
-	"version": "0.2.1",
+	"version": "0.3.0",
 	"description": "This plugin can create input fields inside your notes and bind them to metadata fields.",
 	"main": "main.js",
 	"scripts": {

package.json

@@ -0,0 +1,16 @@
+import {AbstractInputFieldArgument} from './AbstractInputFieldArgument';
+import {InputFieldArgumentType, InputFieldType} from '../parsers/InputFieldDeclarationParser';
+
+export class AlignRightInputFieldArgument extends AbstractInputFieldArgument {
+	identifier: InputFieldArgumentType = InputFieldArgumentType.ALIGN_RIGHT;
+	allowedInputFields: InputFieldType[] = [
+		InputFieldType.DATE_PICKER,
+	];
+	value: boolean = true;
+	requiresValue: boolean = false;
+	allowMultiple: boolean = false;
+
+	parseValue(valueStr: string): void {
+		this.value = (valueStr.toLowerCase() === 'true');
+	}
+}

src/inputFieldArguments/AlignRightInputFieldArgument.ts

@@ -6,6 +6,7 @@ import {MinValueInputFieldArgument} from "./MinValueInputFieldArgument";
 import {MaxValueInputFieldArgument} from "./MaxValueInputFieldArgument";
 import {OptionInputFieldArgument} from "./OptionInputFieldArgument";
 import {TitleInputFieldArgument} from "./TitleInputFieldArgument";
+import {AlignRightInputFieldArgument} from './AlignRightInputFieldArgument';
 
 
 export class InputFieldArgumentFactory {
@@ -22,6 +23,8 @@ export class InputFieldArgumentFactory {
 			return new OptionInputFieldArgument();
 		} else if (argumentIdentifier === InputFieldArgumentType.TITLE) {
 			return new TitleInputFieldArgument();
+		} else if (argumentIdentifier === InputFieldArgumentType.ALIGN_RIGHT) {
+			return new AlignRightInputFieldArgument();
 		} else {
 			throw new MetaBindParsingError(`unknown argument \'${argumentIdentifier}\'`);
 		}

src/inputFieldArguments/InputFieldArgumentFactory.ts

@@ -12,6 +12,8 @@
 	export let dateFormat: string = 'dddd, MMMM Do YYYY';
 	export let dateChangeCallback: (date: Moment) => void;
 
+	export let alignRight: boolean;
+
 	let date: number;
 	let month: number;
 	let year: number;
@@ -68,7 +70,6 @@
 	.date-picker {
 		position:      absolute;
 		top:           35px;
-		left:          0;
 		display:       inline-block;
 		background:    var(--background-secondary);
 		border-radius: var(--meta-bind-plugin-border-radius);
@@ -134,7 +135,7 @@
 	</div>
 	{#if showDatePicker}
 		<div class="date-picker-close-layer" on:click={() => showDatePicker = false}></div>
-		<div class="date-picker">
+		<div class="date-picker" style="{alignRight ? 'left: auto; right: 0;' : 'right: auto; left: 0;'}">
 			<div class="date-picker-header">
 				<button class="month-switch-button" on:click={prevMonth}>Prev</button>
 				<div class="date-picker-header-text">