Merge pull request #13 from SuperChamp234/dev

Version 0.9.15

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "obsidian-habitica-integration",
 	"name": "Habitica Sync",
-	"version": "0.9.7",
+	"version": "0.9.15",
 	"minAppVersion": "0.9.12",
 	"description": "This plugin helps integrate Habitica user tasks and stats into Obsidian",
 	"author": "Leoh and Ran",

package.json

@@ -31,6 +31,7 @@
     "node-fetch": "^3.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
+    "react-emoji-render": "^1.2.4",
     "react-tabs": "^3.2.2"
   }
 }

src/view/App.tsx

@@ -1,17 +1,30 @@
 import * as React from "react";
 import { Notice } from "obsidian";
-import { getStats, scoreTask } from "./habiticaAPI"
+import { getStats, scoreTask, makeCronReq } from "./habiticaAPI"
 import Statsview from "./Components/Statsview"
 import Taskview from "./Components/Taskview"
 
 class App extends React.Component<any,any> {
-    username = ""
+    private _username = "";
-    credentials = ""
+    public get username() {
+        return this._username;
+    }
+    public set username(value) {
+        this._username = value;
+    }
+    private _credentials = "";
+    public get credentials() {
+        return this._credentials;
+    }
+    public set credentials(value) {
+        this._credentials = value;
+    }
     constructor(props: any) {
         super(props)
         this.username = this.props.plugin.settings.userID
         this.credentials = this.props.plugin.settings.apiToken
         this.state = {
+            needCron: false,
             isLoaded: false,
             user_data: {
                 profile: {
@@ -20,18 +33,48 @@ class App extends React.Component<any,any> {
                 stats: {
                     hp: 0,
                     lvl: 0,
-                }
+                },
+                lastCron: "",
             },
             todos: [],
             dailys: [],
             habits: [],
         }
-        this.handleChangeTodos = this.handleChangeTodos.bind(this)
+        this.handleChangeTodos = this.handleChangeTodos.bind(this);
-        this.handleChangeDailys = this.handleChangeDailys.bind(this)
+        this.handleChangeDailys = this.handleChangeDailys.bind(this);
-        this.handleChangeHabits = this.handleChangeHabits.bind(this)
+        this.handleChangeHabits = this.handleChangeHabits.bind(this);
-
+        this.runCron = this.runCron.bind(this);
 
     }
+    CheckCron(lastCron: string) {
+        let cronDate = new Date(lastCron);
+        let now = new Date();
+        if (cronDate.getDate() != now.getDate() || (cronDate.getMonth() != now.getMonth() || cronDate.getFullYear() != now.getFullYear())) {
+            return(
+                <div className="cron">
+                    <div id="cronMessage"> Welcome back! Please check your tasks for the last day and hit continue to get your daily rewards. </div>
+                    <button onClick={this.runCron}>Continue</button>
+                </div>
+            );
+        }
+        else {
+            console.log("Cron is up to date");
+            return null
+        };
+    }
+    async runCron() {
+        console.log("running cron");
+        try {
+            let response = await makeCronReq(this.username, this.credentials);
+            this.setState({
+                needCron: false,
+            })
+        } catch (error) {
+            console.log(error);
+            new Notice("There was an error running the cron. Please try again later.");
+        }
+        this.reloadData();
+    }    
     async reloadData() {
         try {
 			let response = await getStats(this.username, this.credentials);
@@ -40,6 +83,7 @@ class App extends React.Component<any,any> {
 				new Notice('Login Failed, Please check credentials and try again!');
 			}
 			else {
+                console.log(result);
 				this.setState({
 					isLoaded: true,
 					user_data: result,
@@ -115,6 +159,7 @@ class App extends React.Component<any,any> {
     }
 
     render(){
+        let content = this.CheckCron(this.state.user_data.lastCron);
         if(this.state.error)
             return(<div className="loading">Loading....</div>)
         else if(!this.state.isLoaded)
@@ -124,6 +169,7 @@ class App extends React.Component<any,any> {
                 <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
                 <Statsview user_data={this.state.user_data} />
                 <Taskview data={this.state.tasks} handleChangeTodos={this.handleChangeTodos} handleChangeDailys={this.handleChangeDailys} handleChangeHabits={this.handleChangeHabits}/>
+                {content}
                 </div>
             );
         }

src/view/Components/Taskview/Dailiesview/DailyItem.tsx

@@ -1,10 +1,11 @@
+import Emoji from "react-emoji-render";
 import * as React from "react";
 
 function DailyItem(props: any) {
     return (
         <div className="todo-item" id={props.id}>
             <input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed}/>
-            <p>{props.daily_text}</p>
+            <p><Emoji text={props.daily_text}></Emoji></p>
         </div>
     )
 }

src/view/Components/Taskview/Habitsview/HabitItem.tsx

@@ -1,3 +1,4 @@
+import Emoji from "react-emoji-render";
 import * as React from "react";
 
 function HabitItem(props: any) {
@@ -6,7 +7,7 @@ function HabitItem(props: any) {
             <button className="habit-plus" id={"plus"+props.id} onClick={props.onChange}>
                 +{props.upCount}
             </button>
-            <p className="habit-text">{props.habit_text}</p>
+            <p className="habit-text"><Emoji text = {props.habit_text}></Emoji></p>
             <button className="habit-minus" id={"mins"+props.id} onClick={props.onChange}>
                 -{props.downCount}
             </button>

src/view/Components/Taskview/TodoItem.tsx

@@ -1,10 +1,11 @@
+import { Emoji } from 'react-emoji-render';
 import * as React from "react";
 
 function TodoItem(props: any) {
     return (
         <div className="todo-item" id={props.id}>
             <input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed}/>
-            <p>{props.todo_text}</p>
+            <Emoji text = {props.todo_text}></Emoji>
         </div>
     )
 }

src/view/Components/Taskview/Todoview/TodoItem.tsx

@@ -1,10 +1,11 @@
+import Emoji from "react-emoji-render";
 import * as React from "react";
 
 function TodoItem(props: any) {
     return (
         <div className="todo-item" id={props.id}>
             <input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed}/>
-            <p>{props.todo_text}</p>
+            <p><Emoji text ={props.todo_text}></Emoji></p>
         </div>
     )
 }

src/view/habiticaAPI.ts

@@ -6,7 +6,7 @@ export async function getStats(username: string, credentials: string){
         method: 'GET',
         headers: {
             "Content-Type": "application/json",
-            "x-client": username.concat("-testAPI"),
+            "x-client": "278e719e-5f9c-43b1-9dba-8b73343dc062-HabiticaSync",
             "x-api-user": username,
             "x-api-key": credentials,
         },
@@ -20,7 +20,20 @@ export async function scoreTask(username: string, credentials: string, taskID: s
         method: 'POST',
         headers: {
             "Content-Type": "application/json",
-            "x-client": username.concat("-testAPI"),
+            "x-client": "278e719e-5f9c-43b1-9dba-8b73343dc062-HabiticaSync",
+            "x-api-user": username,
+            "x-api-key": credentials,
+        }
+    })
+    return(response)
+}
+export async function makeCronReq(username: string, credentials: string){
+    const url = "https://habitica.com/api/v3/cron";
+    const response = fetch(url, {
+        method: 'POST',
+        headers: {
+            "Content-Type": "application/json",
+            "x-client": "278e719e-5f9c-43b1-9dba-8b73343dc062-HabiticaSync",
             "x-api-user": username,
             "x-api-key": credentials,
         }

styles.css

@@ -23,7 +23,7 @@
 .habit-text {
   text-align: center !important;
   padding: 0px;
-  width: 80px;
+  width: 50%;
   margin-right: 20px;
 }
 
@@ -149,3 +149,33 @@ input[type=checkbox]:focus {
 .react-tabs__tab-panel--selected {
   display: block;
 }
+ul li:not(.task-list-item)::before {
+  content: "•";
+  color: transparent;
+  display: inline-block;
+  width: 1em;
+  margin-left: -1em;
+  padding: 0;
+  font-weight: bold;
+  text-shadow: 0 0 0.5em transparent;
+}
+body > div.app-container.is-left-sidedock-collapsed.is-right-sidedock-collapsed > div.horizontal-main-container > div > div.workspace-split.mod-horizontal.mod-right-split > div.workspace-tabs > div.workspace-leaf > div > div.view-content > div > div.cron > button {
+  margin: auto;
+  margin-bottom: 5px;
+}
+.cron {
+  display: inline-grid;
+  justify-content: center;
+  text-align: center;;
+  margin-top: 5px;
+  margin-left: 10%;
+  margin-right: 10%;
+  margin-bottom: 10px;
+  background-color: var(--background-secondary-alt);
+  border-radius: 10px;
+}
+#cronMessage {
+  margin: 20px;
+  margin-bottom: 10px;
+  color: var(--text-normal)
+}