diff --git a/src/css/popup.scss b/src/css/popup.scss
index 53be6b4..450b635 100644
--- a/src/css/popup.scss
+++ b/src/css/popup.scss
@@ -49,7 +49,7 @@ html {
.moco-bx-calendar {
display: flex;
justify-content: space-between;
- margin-bottom: 3rem;
+ margin-bottom: 2rem;
.moco-bx-calendar__day {
display: flex;
diff --git a/src/images/icons/stopwatch-light.svg b/src/images/icons/stopwatch-light.svg
new file mode 100644
index 0000000..d020436
--- /dev/null
+++ b/src/images/icons/stopwatch-light.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/js/components/App.js b/src/js/components/App.js
index 48f57d1..3a25b32 100644
--- a/src/js/components/App.js
+++ b/src/js/components/App.js
@@ -100,7 +100,7 @@ class App extends Component {
task_id: this.task?.value,
billable: this.billable,
hours: "",
- seconds: this.changeset.hours && new TimeInputParser(this.changeset.hours).parseSeconds(),
+ seconds: new TimeInputParser(this.changeset.hours).parseSeconds(),
description: service?.description,
tag: "",
}
@@ -110,8 +110,6 @@ class App extends Component {
componentDidMount() {
window.addEventListener("keydown", this.handleKeyDown)
- console.log(window.document.body.scrollHeight)
- console.log(window.document.body)
parent.postMessage(window.document.body.scrollHeight, "*")
chrome.runtime.onMessage.addListener(this.handleSetFormErrors)
}
diff --git a/src/js/components/Form.js b/src/js/components/Form.js
index 4a8362b..8bea598 100644
--- a/src/js/components/Form.js
+++ b/src/js/components/Form.js
@@ -2,11 +2,16 @@ import React, { Component } from "react"
import PropTypes from "prop-types"
import Select from "components/Select"
import TimeInputParser from "utils/TimeInputParser"
+import { formatDate } from "utils"
import cn from "classnames"
+import stopWatch from "images/icons/stopwatch-light.svg"
-function parseHours(hours) {
- return new TimeInputParser(hours).parseSeconds()
-}
+const StopWatch = () => (
+
+)
class Form extends Component {
static propTypes = {
@@ -32,11 +37,42 @@ class Form extends Component {
inline: true,
}
- isValid = () => {
+ isValid() {
const { changeset } = this.props
return ["assignment_id", "task_id"].map(prop => changeset[prop]).every(Boolean)
}
+ get isTimerStartable() {
+ const {
+ changeset: { hours, date },
+ } = this.props
+ const duration = new TimeInputParser(hours).parseSeconds()
+ return date === formatDate(new Date()) && duration === 0
+ }
+
+ buttonStyle() {
+ const styleMap = {
+ true: {
+ backgroundColor: "#a3a3a3",
+ border: "none",
+ borderRadius: "50%",
+ width: "60px",
+ height: "60px",
+ marginTop: "22px",
+ transition: "all 0.2s ease-in-out",
+ },
+ false: {
+ border: "none",
+ width: "50px",
+ height: "36px",
+ marginTop: "35px",
+ transition: "all 0.2s ease-in-out",
+ },
+ }
+
+ return styleMap[this.isTimerStartable]
+ }
+
handleTextareaKeyDown = event => {
const { onSubmit } = this.props
@@ -108,8 +144,13 @@ class Form extends Component {
) : null}
-