PolyPaw/habitica-sync
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement subtasks view and settings option,

Browse source 
clean up CSS
This commit is contained in:
ransurf 2022-01-13 12:47:36 -08:00
parent 0ac05ef6d3
commit 916236db5d
13 changed files with 257 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/main.ts
View file

@ -6,6 +6,7 @@ interface HabiticaSyncSettings {
userID: string
apiToken: string
showTaskDescription: boolean
showSubTasks: boolean
}
const DEFAULT_SETTINGS: Partial<HabiticaSyncSettings> = {
userID: "",

12
src/settings.ts
View file

@ -50,6 +50,18 @@ export class HabiticaSyncSettingsTab extends PluginSettingTab {
await this.plugin.saveSettings();
})
});
new Setting(containerEl)
.setName("Show Sub-Tasks")
.setDesc("Updates require pane re-opening")
.addToggle(cb => {
cb
.setValue(this.plugin.settings.showSubTasks)
.onChange(async (isEnable) => {
this.plugin.settings.showSubTasks = isEnable;
await this.plugin.saveSettings();
})
});
}
}

3
src/view/App.tsx
View file

@ -194,9 +194,10 @@ class App extends React.Component<any, any> {
else {
return (<div className="plugin-root">
{content}
<Statsview className ="stats-view" user_data={this.state.user_data} />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
<Taskview data={this.state.tasks} handleChangeTodos={this.handleChangeTodos} settings = {this.props.plugin.settings} handleChangeDailys={this.handleChangeDailys} handleChangeHabits={this.handleChangeHabits} handleChangeRewards={this.handleChangeRewards}/>
<Statsview user_data={this.state.user_data} />
</div>
);
}

1
src/view/Components/Statsview/index.tsx
View file

@ -4,7 +4,6 @@ export default function Index(props: any) {
return(
<div className="stats">
{/* <div id="profile-name">{props.user_data.profile.name}</div> */}
{console.log(props)}
<div className = "substats" id="hp">HP: {(props.user_data.stats.hp).toPrecision(3)}</div>
<div className = "substats" id="lvl">LEVEL: {props.user_data.stats.lvl}</div>
<div className = "substats" id="gold">GOLD: {(props.user_data.stats.gp).toPrecision(3)}</div>

5
src/view/Components/Taskview/Dailiesview/DailyItem.tsx
View file

@ -1,6 +1,7 @@
import Emoji from "react-emoji-render";
import * as React from "react";
import ReactMarkdown from "react-markdown";
import DailySubTasks from "./DailySubTasks";
function DailyItem(props: any) {
return (
@ -8,7 +9,9 @@ function DailyItem(props: any) {
<input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed} />
<div>
<p><Emoji text={props.daily_text}></Emoji></p>
<ReactMarkdown children={props.daily_notes} />
<ReactMarkdown className="description" children={props.daily_notes} />
{console.log(props.checklist)}
<DailySubTasks subtasks={props.daily_subtasks} onChange={props.onChange}></DailySubTasks>
</div>
</div>

20
src/view/Components/Taskview/Dailiesview/DailySubTasks.tsx Normal file
View file

@ -0,0 +1,20 @@
import Emoji from "react-emoji-render";
import * as React from "react";
function DailySubTasks(props: any) {
if (props.subtasks) {
const subtasks = props.subtasks.map((subtask: any) => {
return (
<div className="subtask" id={subtask.id}>
<input type="checkbox" className="checkbox" onChange={props.onChange} checked={subtask.completed} />
<p id={subtask.id}><Emoji text={subtask.text}></Emoji></p>
</div>
)
});
return subtasks
}
else {
return <div></div>
}
}
export default DailySubTasks

18
src/view/Components/Taskview/Dailiesview/index.tsx
View file

@ -8,13 +8,21 @@ export default function Index(props: any){
}
else {
const incompleteDailies = props.dailys.map((daily: any) => {
if(!daily.completed)
if (!daily.completed) {
let daily_notes = '';
let daily_subtasks = '';
if (props.settings.showTaskDescription) {
return <DailyItem key={daily.id} id={daily.id} daily_text={daily.text} daily_notes={daily.notes} onChange={props.onChange} completed={daily.completed}/>
} else {
return <DailyItem key={daily.id} id={daily.id} daily_text={daily.text} onChange={props.onChange} completed={daily.completed}/>
daily_notes = daily.notes;
}
})
if (props.settings.showSubTasks) {
daily_subtasks = daily.checklist;
}
return <DailyItem key={daily.id} id={daily.id} daily_text={daily.text}
daily_notes={daily_notes} daily_subtasks={daily_subtasks}
onChange={props.onChange} completed={daily.completed}/>
}
})
const completedDailies = props.dailys.map((daily: any) => {
if(daily.completed)
return <DailyItem key={daily.id} id={daily.id} daily_text={daily.text} daily_notes={daily.notes} onChange={props.onChange} completed={daily.completed}/>

16
src/view/Components/Taskview/Habitsview/HabitItem.tsx
View file

@ -5,15 +5,17 @@ import ReactMarkdown from "react-markdown";
function HabitItem(props: any) {
return (
<div className="habit-item" id={props.id}>
<button className="habit-plus" id={"plus" + props.id} onClick={props.onChange}>
+{props.upCount}
</button>
<button className="habit-minus" id={"mins" + props.id} onClick={props.onChange}>
-{props.downCount}
</button>
<div className="habit-button-grp">
<button className="habit-button" id={"plus" + props.id} onClick={props.onChange}>
+{props.upCount}
</button>
<button className="habit-button" id={"mins" + props.id} onClick={props.onChange}>
-{props.downCount}
</button>
</div>
<div>
<p className="habit-text"><Emoji text={props.habit_text}></Emoji></p>
<ReactMarkdown children={props.habit_notes} />
<ReactMarkdown className="description" children={props.habit_notes} />
</div>
</div>
)

10
src/view/Components/Taskview/Rewardview/RewardItem.tsx
View file

@ -3,11 +3,13 @@ import * as React from "react";
import ReactMarkdown from "react-markdown";
function RewardItem(props: any) {
return (
<div className="reward-item" id={props.id}>
<button className="reward-click" id={props.id} onClick={props.onChange}>-{props.reward_value}</button>
<div className="habit-item" id={props.id}>
<div className="habit-button-grp">
<button className="habit-button" id={props.id} onClick={props.onChange}>-{props.reward_value}</button>
</div>
<div>
<p className="reward-text"><Emoji text={props.reward_text}></Emoji></p>
<ReactMarkdown children={props.reward_notes} />
<p className="habit-text"><Emoji text={props.reward_text}></Emoji></p>
<ReactMarkdown className="description" children={props.reward_notes} />
</div>
</div>

4
src/view/Components/Taskview/Todoview/TodoItem.tsx
View file

@ -1,6 +1,7 @@
import Emoji from "react-emoji-render";
import * as React from "react";
import ReactMarkdown from "react-markdown";
import TodoSubTasks from "./TodoSubTasks";
function TodoItem(props: any) {
return (
@ -9,7 +10,8 @@ function TodoItem(props: any) {
{/* <p><Emoji text ={props.todo_text}></Emoji></p> */}
<div>
<p><Emoji text={props.todo_text}></Emoji></p>
<ReactMarkdown children={props.todo_notes} />
<ReactMarkdown className="description" children={props.todo_notes} />
<TodoSubTasks subtasks={props.todo_subtasks} onChange={props.onChange}></TodoSubTasks>
</div>
</div>
)

20
src/view/Components/Taskview/Todoview/TodoSubTasks.tsx Normal file
View file

@ -0,0 +1,20 @@
import Emoji from "react-emoji-render";
import * as React from "react";
function TodoSubTasks(props: any) {
if (props.subtasks) {
const subtasks = props.subtasks.map((subtask: any) => {
return (
<div className="subtask" id={subtask.id}>
<input type="checkbox" className="checkbox" onChange={props.onChange} checked={subtask.completed} />
<p id={subtask.id}><Emoji text={subtask.text}></Emoji></p>
</div>
)
});
return subtasks
}
else {
return <div></div>
}
}
export default TodoSubTasks

14
src/view/Components/Taskview/Todoview/index.tsx
View file

@ -8,12 +8,20 @@ export default function Index(props: any){
}
else {
const incompleteTodos = props.todos.map((todo: any) => {
if(!todo.completed) {
let todo_notes = '';
let todo_subtasks = '';
if (props.settings.showTaskDescription) {
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text} todo_notes={todo.notes} onChange={props.onChange} completed={todo.completed}/>
} else {
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text} onChange={props.onChange} completed={todo.completed}/>
todo_notes = todo.notes;
}
if (props.settings.showSubTasks) {
todo_subtasks = todo.checklist;
}
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text}
todo_notes={todo_subtasks} todo_subtasks={todo_subtasks}
onChange={props.onChange} completed={todo.completed}/>
}
})