Skip to content

Commit

Permalink
Divide content into pages, add sidebar, tailwind
Browse files Browse the repository at this point in the history
  • Loading branch information
@hnasheralneam
hnasheralneam committed Jun 23, 2024
1 parent 8ee74d9 commit 8030b25
Show file tree
Hide file tree
Showing 11 changed files with 861 additions and 119 deletions.
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules/
package-lock.json
Empty file added development/changelog.md
View file
Empty file.
40 changes: 40 additions & 0 deletions development/todo.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
// ==========================================
// Ideas and Plans
// ==========================================

// Recommend commonly used tasks based on time and location
// Filter through suggestions as you type
// Group tasks by catogory (custom color, used for charts)
// Add settings to export
// Rename tasks
// Switch to digit.js
// Days since activity should be calculated before adding to array item, by subtracting .01, multiplied by 1.1 for each consecutive week distant
// Show graph for when tasks were done

/*
== Things that are broken ==
// Multiple tabs mess with save
// I suppose the hacky way I remove spaces is a problem

== Settings ==
// Setting to continue tasks when tab is closed
// Option that adding new tasks completes previous (for one-direction workflow)
// Option for charts to show tasks in progress

== Visual ==
// Only show most recent in completed tasks
// Task color is black on first added tasks
// Dark theme
// Sequoia theme

== Automate activites ==
Automated activites will have a set schedule time, which can be repeated, when it will alert you, and you can choose to start/delay/ignore the activity (call reminders?)
*/


For activity log, which you will use today to log your activity, work on the web version for now, not styling or anything but actuall functionallity, then work on mobile. Right now i was thinking that we could store a) time started, which will work as first unpaused time, b) time ran, c) time last paused, and d) time closed, stored only for decorative purposes not calculation. use the last unpaused time every second to calc change to thing for load effect, but have time only calculated and added when clock is paused.



- create easy way to add time later (set start finish times, length)
- make seperate array for completed elements to avoid reload checking
170 changes: 93 additions & 77 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,96 +1,112 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!--
Activity Log project by Hamza Nasher-Alneam
**Pre-release**
When I fix the current problems, it'll be ready for version 0.1.0!
== New Features ==
Suggestions
-->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#222">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="styles/tailwind.css">
<link rel="stylesheet" href="styles/styles.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<title>Activity Log</title>
</head>
<body>
<section>
<fieldset>
<legend>Completed Tasks</legend>
<p class="activitiesCompleted">No activities are finished</p>
<div class="completedActivities"></div>
</fieldset>
<fieldset>
<legend>Tasks in progress</legend>
<p class=activityProgressing>No tasks in progress</p>
<div class="activitiesProgressing"></div>
</fieldset>
</section>
<section>
<fieldset>
<legend>Start a new activity</legend>
<input class="newActivity" onkeyup="textentered()" type="text" placeholder="your new activity...">
<button class="newActivityBtn" onclick="newActivity()" disabled>Start new activity</button>
<br>
<h2>Suggestions</h2>
<div class="suggestions"></div>
</fieldset>
<fieldset>
<legend>Stats</legend>
<canvas id="myChart"></canvas>
<hr>
<p class="avgtimetxt">Average & total time for each activity</p>
<div class="avgtime"></div>
</fieldset>
</section>
<section>
<fieldset class="settingsblock">
<legend>Settings</legend>
<div class="settingsections">
<h2 class="settingHeaderTxt">Clear save</h2>
<p>Wipe the local save. Clearing your browser cookies will do this too.</p>
<button onclick="clearSave()">Clear save</button>
<body class="bg-gray-200">
<div class="nav bg-gray-100">
<div class="nav-icon hover:shadow-md flex" onclick="displayPage('main')">
<span class="material-symbols-rounded">home</span>
</div>
<div class="nav-icon hover:shadow-md flex" onclick="displayPage('stats')">
<span class="material-symbols-rounded">bar_chart</span>
</div>
<div class="nav-icon hover:shadow-md flex" onclick="displayPage('history')">
<span class="material-symbols-rounded">history</span>
</div>
<div class="nav-icon hover:shadow-md flex" onclick="displayPage('settings')">
<span class="material-symbols-rounded">settings</span>
</div>
</div>
<div class="content-parent">
<div class="content shadow-sm">
<div class="page main page-active">
<div class="grid grid-cols-2">
<fieldset>
<legend>Start a new activity</legend>
<input class="newActivity" onkeyup="textentered()" type="text" placeholder="your new activity...">
<button class="newActivityBtn" onclick="newActivity()" disabled>Start new activity</button>
<br>
<h2>Suggestions</h2>
<div class="suggestions"></div>
</fieldset>
<fieldset>
<legend>Tasks in progress</legend>
<p class=activityProgressing>No tasks in progress</p>
<div class="activitiesProgressing"></div>
</fieldset>
</div>
</div>
<hr class="settingsDivider">
<div class="settingsections">
<h2 class="settingHeaderTxt">Export save</h2>
<p>Exports save in universal JSON format.</p>
<p>Note that save will not include settings</p>
<input class="exportdata" value="" type="text" style="display: none">
<button onclick="exportSave()">Export save</button>
<div class="page stats">
<fieldset>
<legend>Stats</legend>
<canvas id="myChart"></canvas>
<hr>
<p class="avgtimetxt">Average & total time for each activity</p>
<div class="avgtime"></div>
</fieldset>
</div>
<hr class="settingsDivider">
<div class="settingsections">
<h2 class="settingHeaderTxt">Import save</h2>
<p>Imports a save. If you mess with the export, it's your fault if it breaks.</p>
<button onclick="importSave()">Import save</button>
<div class="page history">
<fieldset>
<legend>Completed Tasks</legend>
<p class="activitiesCompleted">No activities are finished</p>
<div class="completedActivities"></div>
</fieldset>
</div>
<hr class="settingsDivider">
<div class="settingsections">
<h2 class="settingHeaderTxt">Collapse Options</h2>
<p>Choose how to collapse your completed tasks:</p>
<button onclick="saveCollapseSettings()">Save settings</button>
<section class="collapsesettingsparent">
<div>
<input type="radio" id="long" name="collapsesettings" value="long">
<label for="long">Long</label>
<div class="page settings">
<fieldset class="settingsblock">
<legend>Settings</legend>
<div class="settingsections">
<h2 class="settingHeaderTxt">Clear save</h2>
<p>Wipe the local save. Clearing your browser cookies will do this too.</p>
<button onclick="clearSave()">Clear save</button>
</div>
<div>
<input type="radio" id="short" name="collapsesettings" value="short" checked>
<label for="short">Short</label>
<hr class="settingsDivider">
<div class="settingsections">
<h2 class="settingHeaderTxt">Export save</h2>
<p>Exports save in universal JSON format.</p>
<p>Note that save will not include settings</p>
<input class="exportdata" value="" type="text" style="display: none">
<button onclick="exportSave()">Export save</button>
</div>
<div>
<input type="radio" id="none" name="collapsesettings" value="none">
<label for="none">None</label>
<hr class="settingsDivider">
<div class="settingsections">
<h2 class="settingHeaderTxt">Import save</h2>
<p>Imports a save. If you mess with the export, it's your fault if it breaks.</p>
<button onclick="importSave()">Import save</button>
</div>
</section>
<hr class="settingsDivider">
<div class="settingsections">
<h2 class="settingHeaderTxt">Collapse Options</h2>
<p>Choose how to collapse your completed tasks:</p>
<button onclick="saveCollapseSettings()">Save settings</button>
<section class="collapsesettingsparent">
<div>
<input type="radio" id="long" name="collapsesettings" value="long">
<label for="long">Long</label>
</div>
<div>
<input type="radio" id="short" name="collapsesettings" value="short" checked>
<label for="short">Short</label>
</div>
<div>
<input type="radio" id="none" name="collapsesettings" value="none">
<label for="none">None</label>
</div>
</section>
</div>
</fieldset>
</div>
</fieldset>
</section>
</div>
</div>
</body>
<script src="main.js"></script>
<script src="scripts/main.js"></script>
<script src="scripts/changePage.js"></script>
</html>
15 changes: 15 additions & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
{
"name": "activity-log",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"tailwind": "npx tailwindcss -i ./styles/tailwind.config.css -o ./styles/tailwind.css --watch"
},
"author": "",
"license": "ISC",
"description": "",
"devDependencies": {
"tailwindcss": "^3.4.4"
}
}
4 changes: 4 additions & 0 deletions scripts/changePage.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
function displayPage(page) {
document.querySelector(".page-active").classList.remove("page-active");
document.querySelector("." + page).classList.add("page-active");
}
37 changes: 2 additions & 35 deletions main.js → scripts/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -253,7 +253,7 @@ function createActivity(activityName, activity) {
elRestart.classList.add("continueActivity");
elRestart.classList.add(`ar${activities.indexOf(activity)}`);
elRestart.innerHTML =
"<span class='material-symbols-rounded'>replay</span>";
"<span class='material-symbols-rounded redo-activty-icon'>replay</span>";
elRestart.onclick = () => restartActivity(activityName);
controls.appendChild(elRestart);

Expand Down Expand Up @@ -346,7 +346,7 @@ function generateSuggestions() {
block.classList.add("suggestion-element")
block.innerHTML = `
<p>${el[0]}</p>
<span class='material-symbols-rounded'>replay</span>
<span class='material-symbols-rounded redo-activty-icon'>replay</span>
`;
block.onclick = () => restartActivity(el[0]);
document.querySelector(".suggestions").append(block);
Expand Down Expand Up @@ -465,36 +465,3 @@ function noSpaces(txt) {
// A valid name should start with an underscore (_), a hyphen (-) or a letter (a-z) which is followed by any numbers, hyphens, underscores, letters. A name should be at least two characters long. Cannot start with a digit, two hyphens or a hyphen followed by a number.
return encodeURI(txt.replace(/\s/g, "").replaceAll("!", "nonono").replaceAll("?", "nononono")).replaceAll("%", "WHYCSS").replaceAll(":", "uunununu").replaceAll("(", "oeunen");
}

// ==========================================
// Ideas and Plans
// ==========================================

// Recommend commonly used tasks based on time and location
// Filter through suggestions as you type
// Group tasks by catogory (custom color, used for charts)
// Add settings to export
// Rename tasks
// Switch to digit.js
// Days since activity should be calculated before adding to array item, by subtracting .01, multiplied by 1.1 for each consecutive week distant
// Show graph for when tasks were done

/*
== Things that are broken ==
// Multiple tabs mess with save
// I suppose the hacky way I remove spaces is a problem
== Settings ==
// Setting to continue tasks when tab is closed
// Option that adding new tasks completes previous (for one-direction workflow)
// Option for charts to show tasks in progress
== Visual ==
// Only show most recent in completed tasks
// Task color is black on first added tasks
// Dark theme
// Sequoia theme
== Automate activites ==
Automated activites will have a set schedule time, which can be repeated, when it will alert you, and you can choose to start/delay/ignore the activity (call reminders?)
*/
Loading

0 comments on commit 8030b25

Please sign in to comment.