Merge pull request #23 from dartungar/dev

scales are now based on moods and are more accurate

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "mood-tracker",
 	"name": "Mood Tracker",
-	"version": "0.3.2",
+	"version": "0.3.3",
 	"minAppVersion": "1.1.0",
 	"description": "Track your moods & emotions easily. Visualize tracked history and browse the past entries.",
 	"author": "dartungar",

src/settings/moodTrackerSettings.ts

@@ -3,7 +3,7 @@ import { EmotionSection } from "src/entities/IEmotionSection";
 
 
 export class MoodTrackerSettings {
-    folderPath: string = "";
+    folderPath = "";
     emotionSections: EmotionSection[] = [];
     moodRatingLabelDict: { [key: number]: string };
     template: string

src/settings/settingsTab.ts

@@ -1,13 +1,11 @@
 import {
 	App,
 	ButtonComponent,
-	Component,
 	PluginSettingTab,
 	Setting,
 	TFolder,
 } from "obsidian";
 import MoodTrackerPlugin from "src/main";
-import { DEFAULT_SETTINGS } from "./moodTrackerSettings";
 import { GenericTextSuggester } from "./fileSuggester";
 import { EmotionSection } from "src/entities/IEmotionSection";
 

src/statsModal/StatsChart.svelte

@@ -1,32 +1,33 @@
 <script lang="ts">
-	import { Bar, Line } from "svelte-chartjs";
+	import { Bar } from "svelte-chartjs";
 	import { getRelativePosition } from "chart.js/helpers";
-  import { Colors } from 'chart.js';
+	import { Colors } from "chart.js";
 	import { createEventDispatcher } from "svelte";
 	import {
 		Chart as ChartJS,
 		Title,
 		Tooltip,
 		Legend,
 		LineElement,
-    BarElement,
+		BarElement,
 		LinearScale,
 		PointElement,
 		CategoryScale,
 		ChartData,
 	} from "chart.js";
 	import { IDayStats } from "src/entities/IDayStats";
+	import { DEFAULT_SETTINGS, MoodTrackerSettings } from "src/settings/moodTrackerSettings";
 
 	ChartJS.register(
 		Title,
 		Tooltip,
 		Legend,
 		LineElement,
-    BarElement,
+		BarElement,
 		LinearScale,
 		PointElement,
 		CategoryScale,
-    Colors
+		Colors,
 	);
 
 	export let data: IDayStats[] = [];
@@ -35,7 +36,9 @@
 
 	$: transformedData = transformData(data);
 
-	function transformData(rawData: IDayStats[]): ChartData<'bar', any, string> {
+	function transformData(
+		rawData: IDayStats[],
+	): ChartData<"bar", any, string> {
 		return {
 			labels: rawData.map((d) => d.date),
 			datasets: [
@@ -50,7 +53,6 @@
 		};
 	}
 
-
 	const dispatch = createEventDispatcher();
 
 	const onClick = (e: any) => {
@@ -59,16 +61,34 @@
 
 		dispatch("clickChart", dataX);
 
-    // TODO: highlight clicked element
-    const clickedElement = chartRef.getElementsAtEventForMode(e, 'nearest', { intersect: true }, true)[0].element;
-
+		// TODO: highlight clicked element
+		const clickedElement = chartRef.getElementsAtEventForMode(
+			e,
+			"nearest",
+			{ intersect: true },
+			true,
+		)[0].element;
 	};
-</script>
 
-  <Bar
-	bind:chart={chartRef}
-	data={transformedData}
-	options={{ responsive: true, onClick}}
-  />
 
+	const chartOptions = {
+		responsive: true,
+		onClick: onClick,
+		// TODO: scales based on possible mood values
+		scales: {
+			y: {
+				min: 1,
+				max: 5,
+				ticks: {
+					stepSize: 1, 
+					callback: function(val: number, _: any) {
+						// TODO: use ones from plugin settings!
+            			return DEFAULT_SETTINGS.moodRatingLabelDict[val];
+          			},
+				},
+			},
+		},
+	};
+</script>
 
+<Bar bind:chart={chartRef} data={transformedData} options={chartOptions} />