Skip to content

Commit 1f6295f

Browse files
author
Flavio Aiello
committed
Initial commit
0 parents  commit 1f6295f

17 files changed

+353
-0
lines changed

‎.gitignore

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
_site/
2+
.sass-cache/
3+
.jekyll-cache/
4+
.jekyll-metadata
5+
# Ignore folders generated by Bundler
6+
.bundle/
7+
vendor/
8+
9+
# System files
10+
.DS_Store
11+
Thumbs.db
12+
ehthumbs.db
13+
Icon?
14+
._*

‎CNAME

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
app.tirkio.com

‎LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2024 Tirkio
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
# TiRKiO Frugal
2+
3+
**TiRKiO Frugal** is a Progressive Web Application (PWA) designed for personal finance management. The app provides a seamless and native-like experience for users, combining the power of Framework7, Firebase, Jekyll, and GitHub Pages. Hosted on [app.tirkio.com](https://app.tirkio.com), this application enables users to track and manage their finances effectively.
4+
5+
---
6+
7+
## **Features**
8+
9+
- **PWA Functionality**:
10+
- Installable on mobile and desktop devices.
11+
- Works offline with cached resources.
12+
- **Native-Like UI**:
13+
- Built with Framework7 for a polished iOS/Android experience.
14+
- **Firebase Integration**:
15+
- Authentication for secure access.
16+
- Cloud Firestore for storing and retrieving financial data.
17+
- **Responsive Design**:
18+
- Fully functional on mobile, tablet, and desktop devices.
19+
20+
---
21+
22+
## **Technology Stack**
23+
24+
1. **Frontend**:
25+
- [Framework7](https://framework7.io/): Native-like UI components.
26+
- [Jekyll](https://jekyllrb.com/): Static site generator.
27+
2. **Backend**:
28+
- [Firebase](https://firebase.google.com/): Authentication and Firestore database.
29+
3. **Hosting**:
30+
- [GitHub Pages](https://pages.github.com/): Free and easy static site hosting.
31+
32+
---
33+
34+
## **Project Structure**
35+
36+
tirkio-finance/
37+
├── _layouts/ # Jekyll layouts
38+
│ └── default.html # Main layout file
39+
├── assets/
40+
│ ├── css/
41+
│ │ └── style.css # Custom styles
42+
│ ├── js/
43+
│ │ ├── firebase.js # Firebase configuration and logic
44+
│ │ └── service-worker.js # Service worker for offline support
45+
├── index.html # Main entry point
46+
├── manifest.json # PWA manifest
47+
├── ...
48+
49+
50+
---
51+
52+
## **Setup and Installation**
53+
54+
### **1. Clone the Repository**
55+
bash
56+
git clone https://github.com/tirkio/app.tirkio.com.git
57+
cd app.tirkio.com
58+
59+
60+
### **2. Firebase Setup**
61+
1. Go to [Firebase Console](https://console.firebase.google.com/) and create a project.
62+
2. Set up Authentication (e.g., Email/Password or Google Sign-In).
63+
3. Enable Cloud Firestore.
64+
4. Replace firebase.js configuration with your Firebase project credentials.
65+
66+
javascript
67+
const firebaseConfig = {
68+
apiKey: "YOUR_API_KEY",
69+
authDomain: "YOUR_PROJECT_ID.firebaseapp.com",
70+
projectId: "YOUR_PROJECT_ID",
71+
storageBucket: "YOUR_PROJECT_ID.appspot.com",
72+
messagingSenderId: "YOUR_SENDER_ID",
73+
appId: "YOUR_APP_ID"
74+
};
75+
76+
77+
### **3. Deploy to GitHub Pages**
78+
1. Push the project to a GitHub repository.
79+
2. Go to the repository’s **Settings > Pages** and enable GitHub Pages.
80+
3. Set the branch to main and folder to /root.
81+
4. Your app will be live at https://github.com/tirkio/app.tirkio.com.git.
82+
83+
---
84+
85+
## **Offline Support**
86+
- The app uses a service worker (service-worker.js) to cache essential resources and enable offline functionality.
87+
88+
---
89+
90+
## **Contributing**
91+
92+
We welcome contributions to enhance the app. To contribute:
93+
1. Fork the repository.
94+
2. Create a feature branch: git checkout -b feature-name.
95+
3. Commit your changes: git commit -m 'Add feature'.
96+
4. Push to the branch: git push origin feature-name.
97+
5. Open a Pull Request.
98+
99+
---
100+
101+
## **License**
102+
103+
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.
104+
105+
---
106+
107+
## **Contact**
108+
109+
For any questions or feedback, feel free to reach out on GitHub.

‎_includes/navbar.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<div class="toolbar tabbar-icons toolbar-bottom">
2+
<div class="toolbar-inner">
3+
<a href="/wealth.html" class="tab-link tab-link-active">
4+
<!-- iOS Icon -->
5+
<i class="icon f7-icons if-not-md">money_dollar_circle_fill</i>
6+
<!-- Material Design Icon -->
7+
<i class="icon material-icons md-only">attach_money</i>
8+
<span class="tabbar-label">Vermögen</span>
9+
</a>
10+
<a href="/provisions.html" class="tab-link">
11+
<!-- iOS Icon -->
12+
<i class="icon f7-icons if-not-md">money_euro_circle_fill</i>
13+
<!-- Material Design Icon -->
14+
<i class="icon material-icons md-only">euro</i>
15+
<span class="tabbar-label">Rückstellungen</span>
16+
</a>
17+
<a href="/assets.html" class="tab-link">
18+
<!-- iOS Icon -->
19+
<i class="icon f7-icons if-not-md">chart_bar</i>
20+
<!-- Material Design Icon -->
21+
<i class="icon material-icons md-only">bar_chart</i>
22+
<span class="tabbar-label">Anlagen</span>
23+
</a>
24+
<a href="/retirement.html" class="tab-link">
25+
<!-- iOS Icon -->
26+
<i class="icon f7-icons if-not-md">building_2_fill</i>
27+
<!-- Material Design Icon -->
28+
<i class="icon material-icons md-only">business</i>
29+
<span class="tabbar-label">Vorsorge</span>
30+
</a>
31+
</div>
32+
</div>

‎_layouts/default.html

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico">
7+
<link rel="manifest" href="/manifest.json" />
8+
<link rel="stylesheet" href="https://unpkg.com/framework7/framework7-bundle.min.css" />
9+
<link rel="stylesheet" href="https://unpkg.com/framework7-icons/css/framework7-icons.css">
10+
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
11+
<script src="/assets/js/app.js"></script>
12+
<script src="https://unpkg.com/framework7/framework7-bundle.min.js"></script>
13+
<title>{{ page.title }}</title>
14+
</head>
15+
<body>
16+
<div class="page dark">
17+
<div class="navbar">
18+
<div class="navbar-bg"></div>
19+
<div class="navbar-inner sliding">
20+
<div class="title">{{ page.title }}</div>
21+
<div class="right">
22+
<a class="link" @click=${togglePosition}>X
23+
</a>
24+
</div>
25+
</div>
26+
</div>
27+
{% include navbar.html %}
28+
<div class="tabs">
29+
<div class="page-content tab tab-active" id="tab-1">
30+
<div class="block">
31+
{{ content }}
32+
</div>
33+
</div>
34+
</div>
35+
</div>
36+
<script>
37+
if ('serviceWorker' in navigator) {
38+
navigator.serviceWorker.register('/assets/js/service-worker.js')
39+
.then(() => console.log('Service Worker Registered'));
40+
}
41+
</script>
42+
</body>
43+
</html>

‎assets.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
layout: none
3+
title: Anlagen
4+
---
5+
6+
<p>Content for Anlagen goes here.</p>

‎assets/images/favicon-192x192.png

6.45 KB
Loading

‎assets/images/favicon-512x512.png

15.2 KB
Loading

‎assets/images/favicon.ico

15 KB
Binary file not shown.

‎assets/js/app.js

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
// app.js
2+
3+
// Initialize Framework7
4+
const app = new Framework7({
5+
root: '#app',
6+
theme: 'auto', // Automatically sets the theme based on the platform (iOS or Material Design)
7+
routes: [
8+
{ path: '/wealth.html', pageName: 'wealth' },
9+
{ path: '/provisions.html', pageName: 'provisions' },
10+
{ path: '/assets.html', pageName: 'assets' },
11+
{ path: '/retirement.html', pageName: 'retirement' },
12+
],
13+
});
14+
15+
// Event Listener for Tab Navigation
16+
document.addEventListener('DOMContentLoaded', () => {
17+
const tabs = document.querySelectorAll('.tab-link');
18+
19+
tabs.forEach((tab) => {
20+
tab.addEventListener('click', (event) => {
21+
event.preventDefault();
22+
23+
const activeTab = document.querySelector('.tab-link-active');
24+
if (activeTab) activeTab.classList.remove('tab-link-active');
25+
tab.classList.add('tab-link-active');
26+
27+
// Load the content dynamically
28+
const href = tab.getAttribute('href');
29+
fetchContent(href);
30+
});
31+
});
32+
});
33+
34+
// Function to Fetch and Load Tab Content Dynamically
35+
function fetchContent(url) {
36+
fetch(url)
37+
.then((response) => {
38+
if (!response.ok) throw new Error(`Error fetching ${url}: ${response.statusText}`);
39+
return response.text();
40+
})
41+
.then((html) => {
42+
const contentBlock = document.querySelector('.page-content');
43+
contentBlock.innerHTML = html;
44+
})
45+
.catch((error) => console.error('Error loading content:', error));
46+
}
47+
48+
// Function to Handle Dark/Light Mode Toggle
49+
function toggleDarkMode() {
50+
const body = document.querySelector('body');
51+
body.classList.toggle('dark');
52+
}
53+
54+
// Attach toggle event to navbar action
55+
document.querySelector('.navbar .link').addEventListener('click', toggleDarkMode);

‎assets/js/service-worker.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
const cacheName = 'tirkio-cache-v1';
2+
const resourcesToCache = [
3+
'/',
4+
'/wealth.html',
5+
'/provisions.html',
6+
'/assets.html',
7+
'/retirement.html',
8+
'/assets/css/style.css',
9+
'/assets/images/favicon-192x192.png',
10+
'/assets/images/favicon-512x512.png'
11+
];
12+
13+
self.addEventListener('install', (event) => {
14+
event.waitUntil(
15+
caches.open(cacheName).then((cache) => {
16+
return cache.addAll(resourcesToCache);
17+
})
18+
);
19+
});
20+
21+
self.addEventListener('fetch', (event) => {
22+
event.respondWith(
23+
caches.match(event.request).then((response) => {
24+
return response || fetch(event.request);
25+
})
26+
);
27+
});

‎index.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
layout: default
3+
title: Home
4+
---
5+
6+
<h1>Welcome to My Jekyll PWA</h1>
7+
<p>Use the menu below to navigate through the app.</p>

‎manifest.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"name": "Tirkio Finance",
3+
"short_name": "Tirkio",
4+
"start_url": "/",
5+
"display": "standalone",
6+
"background_color": "#ffffff",
7+
"theme_color": "#333333",
8+
"icons": [
9+
{
10+
"src": "/assets/images/favicon-192x192.png",
11+
"sizes": "192x192",
12+
"type": "image/png"
13+
},
14+
{
15+
"src": "/assets/images/favicon-512x512.png",
16+
"sizes": "512x512",
17+
"type": "image/png"
18+
}
19+
]
20+
}

‎provisions.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
layout: none
3+
title: Rückstellungen
4+
---
5+
6+
<p>Content for Rückstellungen goes here.</p>

‎retirement.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
layout: none
3+
title: Vorsorge
4+
---
5+
6+
<p>Content for Vorsorge goes here.</p>

‎wealth.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
layout: none
3+
title: Vermögen
4+
---
5+
6+
<p>Content for Vermögen goes here.</p>

0 commit comments

Comments
 (0)