add feature to customize date formatting
This commit is contained in:
parent
2d2e380673
commit
0514ce5eb8
8 changed files with 110 additions and 9 deletions
|
|
@ -8,6 +8,7 @@ import { MediaType } from '../../utils/MediaType';
|
|||
export class MALAPI extends APIModel {
|
||||
plugin: MediaDbPlugin;
|
||||
typeMappings: Map<string, string>;
|
||||
apiDateFormat: string = 'YYYY-MM-DDTHH:mm:ssZ'; // ISO
|
||||
|
||||
constructor(plugin: MediaDbPlugin) {
|
||||
super();
|
||||
|
|
@ -115,7 +116,7 @@ export class MALAPI extends APIModel {
|
|||
image: result.images?.jpg?.image_url ?? '',
|
||||
|
||||
released: true,
|
||||
premiere: new Date(result.aired?.from).toLocaleDateString() ?? 'unknown',
|
||||
premiere: this.plugin.dateFormatter.format(result.aired?.from, this.apiDateFormat) ?? 'unknown',
|
||||
streamingServices: result.streaming?.map((x: any) => x.name) ?? [],
|
||||
|
||||
userData: {
|
||||
|
|
@ -146,7 +147,7 @@ export class MALAPI extends APIModel {
|
|||
image: result.images?.jpg?.image_url ?? '',
|
||||
|
||||
released: true,
|
||||
premiere: new Date(result.aired?.from).toLocaleDateString() ?? 'unknown',
|
||||
premiere: this.plugin.dateFormatter.format(result.aired?.from, this.apiDateFormat) ?? 'unknown',
|
||||
streamingServices: result.streaming?.map((x: any) => x.name) ?? [],
|
||||
|
||||
userData: {
|
||||
|
|
@ -176,8 +177,8 @@ export class MALAPI extends APIModel {
|
|||
image: result.images?.jpg?.image_url ?? '',
|
||||
|
||||
released: true,
|
||||
airedFrom: new Date(result.aired?.from).toLocaleDateString() ?? 'unknown',
|
||||
airedTo: new Date(result.aired?.to).toLocaleDateString() ?? 'unknown',
|
||||
airedFrom: this.plugin.dateFormatter.format(result.aired?.from, this.apiDateFormat) ?? 'unknown',
|
||||
airedTo: this.plugin.dateFormatter.format(result.aired?.to, this.apiDateFormat) ?? 'unknown',
|
||||
airing: result.airing,
|
||||
|
||||
userData: {
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ import { MediaType } from '../../utils/MediaType';
|
|||
export class OMDbAPI extends APIModel {
|
||||
plugin: MediaDbPlugin;
|
||||
typeMappings: Map<string, string>;
|
||||
apiDateFormat: string = 'DD MMM YYYY';
|
||||
|
||||
constructor(plugin: MediaDbPlugin) {
|
||||
super();
|
||||
|
|
@ -142,7 +143,7 @@ export class OMDbAPI extends APIModel {
|
|||
|
||||
released: true,
|
||||
streamingServices: [],
|
||||
premiere: new Date(result.Released).toLocaleDateString() ?? 'unknown',
|
||||
premiere: this.plugin.dateFormatter.format(result.Released, this.apiDateFormat) ?? 'unknown',
|
||||
|
||||
userData: {
|
||||
watched: false,
|
||||
|
|
@ -173,7 +174,7 @@ export class OMDbAPI extends APIModel {
|
|||
released: true,
|
||||
streamingServices: [],
|
||||
airing: false,
|
||||
airedFrom: new Date(result.Released).toLocaleDateString() ?? 'unknown',
|
||||
airedFrom: this.plugin.dateFormatter.format(result.Released, this.apiDateFormat) ?? 'unknown',
|
||||
airedTo: 'unknown',
|
||||
|
||||
userData: {
|
||||
|
|
@ -199,7 +200,7 @@ export class OMDbAPI extends APIModel {
|
|||
image: result.Poster ?? '',
|
||||
|
||||
released: true,
|
||||
releaseDate: new Date(result.Released).toLocaleDateString() ?? 'unknown',
|
||||
releaseDate: this.plugin.dateFormatter.format(result.Released, this.apiDateFormat) ?? 'unknown',
|
||||
|
||||
userData: {
|
||||
played: false,
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import { MediaType } from '../../utils/MediaType';
|
|||
export class SteamAPI extends APIModel {
|
||||
plugin: MediaDbPlugin;
|
||||
typeMappings: Map<string, string>;
|
||||
apiDateFormat: string = 'DD MMM, YYYY';
|
||||
|
||||
constructor(plugin: MediaDbPlugin) {
|
||||
super();
|
||||
|
|
@ -109,7 +110,7 @@ export class SteamAPI extends APIModel {
|
|||
image: result.header_image ?? '',
|
||||
|
||||
released: !result.release_date?.comming_soon,
|
||||
releaseDate: new Date(result.release_date?.date).toLocaleDateString() ?? 'unknown',
|
||||
releaseDate: this.plugin.dateFormatter.format(result.release_date?.date, this.apiDateFormat) ?? 'unknown',
|
||||
|
||||
userData: {
|
||||
played: false,
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import { MediaType } from '../../utils/MediaType';
|
|||
|
||||
export class WikipediaAPI extends APIModel {
|
||||
plugin: MediaDbPlugin;
|
||||
apiDateFormat: string = 'YYYY-MM-DDTHH:mm:ssZ'; // ISO
|
||||
|
||||
constructor(plugin: MediaDbPlugin) {
|
||||
super();
|
||||
|
|
@ -72,7 +73,7 @@ export class WikipediaAPI extends APIModel {
|
|||
id: result.pageid,
|
||||
|
||||
wikiUrl: result.fullurl,
|
||||
lastUpdated: new Date(result.touched).toLocaleDateString() ?? 'unknown',
|
||||
lastUpdated: this.plugin.dateFormatter.format(result.touched, this.apiDateFormat),
|
||||
length: result.length,
|
||||
|
||||
userData: {},
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ import { YAMLConverter } from './utils/YAMLConverter';
|
|||
import { MediaDbFolderImportModal } from './modals/MediaDbFolderImportModal';
|
||||
import { PropertyMapping, PropertyMappingModel } from './settings/PropertyMapping';
|
||||
import { ModalHelper, ModalResultCode, SearchModalOptions } from './utils/ModalHelper';
|
||||
import { DateFormatter } from './utils/DateFormatter';
|
||||
|
||||
export default class MediaDbPlugin extends Plugin {
|
||||
settings: MediaDbPluginSettings;
|
||||
|
|
@ -22,6 +23,7 @@ export default class MediaDbPlugin extends Plugin {
|
|||
mediaTypeManager: MediaTypeManager;
|
||||
modelPropertyMapper: PropertyMapper;
|
||||
modalHelper: ModalHelper;
|
||||
dateFormatter: DateFormatter;
|
||||
|
||||
frontMatterRexExpPattern: string = '^(---)\\n[\\s\\S]*?\\n---';
|
||||
|
||||
|
|
@ -39,6 +41,7 @@ export default class MediaDbPlugin extends Plugin {
|
|||
this.mediaTypeManager = new MediaTypeManager();
|
||||
this.modelPropertyMapper = new PropertyMapper(this);
|
||||
this.modalHelper = new ModalHelper(this);
|
||||
this.dateFormatter = new DateFormatter();
|
||||
|
||||
await this.loadSettings();
|
||||
// register the settings tab
|
||||
|
|
@ -46,6 +49,7 @@ export default class MediaDbPlugin extends Plugin {
|
|||
|
||||
this.mediaTypeManager.updateTemplates(this.settings);
|
||||
this.mediaTypeManager.updateFolders(this.settings);
|
||||
this.dateFormatter.setFormat(this.settings.customDateFormat);
|
||||
|
||||
// add icon to the left ribbon
|
||||
const ribbonIconEl = this.addRibbonIcon('database', 'Add new Media DB entry', () => this.createEntryWithAdvancedSearchModal());
|
||||
|
|
@ -563,6 +567,7 @@ export default class MediaDbPlugin extends Plugin {
|
|||
async saveSettings(): Promise<void> {
|
||||
this.mediaTypeManager.updateTemplates(this.settings);
|
||||
this.mediaTypeManager.updateFolders(this.settings);
|
||||
this.dateFormatter.setFormat(this.settings.customDateFormat);
|
||||
|
||||
await this.saveData(this.settings);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,12 +7,14 @@ import PropertyMappingModelsComponent from './PropertyMappingModelsComponent.sve
|
|||
import { PropertyMapping, PropertyMappingModel, PropertyMappingOption } from './PropertyMapping';
|
||||
import { MEDIA_TYPES } from '../utils/MediaTypeManager';
|
||||
import { MediaTypeModel } from '../models/MediaTypeModel';
|
||||
import { fragWithHTML } from '../utils/Utils';
|
||||
|
||||
export interface MediaDbPluginSettings {
|
||||
OMDbKey: string;
|
||||
sfwFilter: boolean;
|
||||
useCustomYamlStringifier: boolean;
|
||||
templates: boolean;
|
||||
customDateFormat: string;
|
||||
|
||||
movieTemplate: string;
|
||||
seriesTemplate: string;
|
||||
|
|
@ -50,6 +52,7 @@ const DEFAULT_SETTINGS: MediaDbPluginSettings = {
|
|||
sfwFilter: true,
|
||||
useCustomYamlStringifier: true,
|
||||
templates: true,
|
||||
customDateFormat: 'L',
|
||||
|
||||
movieTemplate: '',
|
||||
seriesTemplate: '',
|
||||
|
|
@ -165,6 +168,23 @@ export class MediaDbSettingTab extends PluginSettingTab {
|
|||
});
|
||||
});
|
||||
|
||||
new Setting(containerEl)
|
||||
.setName('Date format')
|
||||
.setDesc(fragWithHTML("Your custom date format. Use <em>\'YYYY-MM-DD\'</em> for example.<br>" +
|
||||
"For more syntax, refer to <a href='https://momentjs.com/docs/#/displaying/format/'>format reference</a>.<br>" +
|
||||
"Your current syntax looks like this: <b><a id='dateformat-preview' style='pointer-events: none; cursor: default; text-decoration: none;'>" +
|
||||
this.plugin.dateFormatter.getPreview() + "</a></b>"))
|
||||
.addText(cb => {
|
||||
cb.setPlaceholder(DEFAULT_SETTINGS.customDateFormat)
|
||||
.setValue(this.plugin.settings.customDateFormat === DEFAULT_SETTINGS.customDateFormat ? '' : this.plugin.settings.customDateFormat)
|
||||
.onChange(data => {
|
||||
const newDateFormat = data ? data : DEFAULT_SETTINGS.customDateFormat;
|
||||
this.plugin.settings.customDateFormat = newDateFormat;
|
||||
document.getElementById('dateformat-preview').innerHTML = this.plugin.dateFormatter.getPreview(newDateFormat); // update preview
|
||||
this.plugin.saveSettings();
|
||||
});
|
||||
});
|
||||
|
||||
containerEl.createEl('h3', { text: 'New File Location' });
|
||||
// region new file location
|
||||
new Setting(containerEl)
|
||||
|
|
|
|||
70
src/utils/DateFormatter.ts
Normal file
70
src/utils/DateFormatter.ts
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
// obsidian already uses moment, so no need to package it twice!
|
||||
// import { moment } from 'obsidian'; // doesn't work for release build
|
||||
// obsidian uses a namespace-style import for moment, which ES6 doesn't allow anymore
|
||||
const obsidian = require('obsidian');
|
||||
const moment = obsidian.moment;
|
||||
|
||||
export class DateFormatter {
|
||||
toFormat: string;
|
||||
localeString: string;
|
||||
|
||||
constructor() {
|
||||
this.toFormat = 'YYYY-MM-DD';
|
||||
// get locale string (e.g. en, en-gb, de, fr, etc.)
|
||||
this.localeString = new Intl.DateTimeFormat().resolvedOptions().locale;
|
||||
}
|
||||
|
||||
setFormat(format: string): void {
|
||||
this.toFormat = format;
|
||||
}
|
||||
|
||||
getPreview(format?: string): string {
|
||||
const today = moment();
|
||||
today.locale(this.localeString);
|
||||
|
||||
if (!format) {
|
||||
format = this.toFormat;
|
||||
}
|
||||
|
||||
return today.format(format);
|
||||
}
|
||||
|
||||
/**
|
||||
* Tries to format a given date string with the currently set date format.
|
||||
* You can set a date format by calling `setFormat()`.
|
||||
*
|
||||
* @param dateString the date string to be formatted
|
||||
* @param dateFormat the current format of `dateString`. When this is `null` and the actual format of the
|
||||
* given date string is not `C2822` or `ISO` format, this function will try to guess the format by using the native `Date` module.
|
||||
* @returns formatted date string or null if `dateString` is not a valid date
|
||||
*/
|
||||
format(dateString: string, dateFormat?: string): string | null {
|
||||
if (!dateString) {
|
||||
return null;
|
||||
}
|
||||
|
||||
let date: moment.Moment;
|
||||
|
||||
if (!dateFormat) {
|
||||
// reading date formats other then C2822 or ISO with moment is deprecated
|
||||
if (this.hasMomentFormat(dateString)) {
|
||||
// expect C2822 or ISO format
|
||||
date = moment(dateString);
|
||||
} else {
|
||||
// try to read date string with native Date
|
||||
date = moment(new Date(dateString));
|
||||
}
|
||||
date.locale(this.localeString); // set local locale definition for moment
|
||||
} else {
|
||||
date = moment(dateString, dateFormat, this.localeString);
|
||||
}
|
||||
|
||||
// format date (if it is valid)
|
||||
return date.isValid() ? date.format(this.toFormat) : null;
|
||||
}
|
||||
|
||||
private hasMomentFormat(dateString: string): boolean {
|
||||
const date = moment(dateString, true); // strict mode
|
||||
return date.isValid();
|
||||
}
|
||||
}
|
||||
|
|
@ -135,6 +135,8 @@ export function markdownTable(content: string[][]): string {
|
|||
return table;
|
||||
}
|
||||
|
||||
export const fragWithHTML = (html: string) => createFragment(frag => (frag.createDiv().innerHTML = html));
|
||||
|
||||
export function dateToString(date: Date): string {
|
||||
return `${date.getMonth() + 1}-${date.getDate()}-${date.getFullYear()}`;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue