Skip to content

Commit 327d0ec

Browse files
rogeriopradojrogeriopradoj
authored
Merge pull request #12 from CadeOLeo/11-corrigir-contagem-da-versão-do-léo-está-com-1-dia-a-menos
11 corrigir contagem da versão do léo está com 1 dia a menos
2 parents 67ec711 + a20f9c4 commit 327d0ec

File tree

375 files changed

+1851
-195554
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

375 files changed

+1851
-195554
lines changed

‎.gitignore‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
# Dependency directories
2+
node_modules/
3+
bower_components/
4+
5+
# IDE/Editor files
6+
.idea/
7+
.vscode/
8+
*.swp
9+
*.swo
10+
.DS_Store
11+
12+
# Logs
13+
logs
14+
*.log
15+
npm-debug.log*
16+
yarn-debug.log*
17+
yarn-error.log*
18+
19+
# Runtime data
20+
pids
21+
*.pid
22+
*.seed
23+
*.pid.lock
24+
25+
# Coverage directory used by tools like istanbul
26+
coverage/
27+
28+
# Optional npm cache directory
29+
.npm
30+
31+
# Optional eslint cache
32+
.eslintcache
33+
34+
# Optional REPL history
35+
.node_repl_history
36+
37+
# Output of 'npm pack'
38+
*.tgz

‎MIGRATION.md‎

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
# Migration Plan: Modernizing CadeOLeo!Ver
2+
3+
This document outlines the plan to modernize the project's frontend stack, moving away from Bower to modern tools and practices.
4+
5+
## Why Migrate?
6+
7+
- Bower is deprecated and no longer recommended
8+
- Modern tools offer better performance and developer experience
9+
- Current dependencies are outdated and have security issues
10+
- Better browser support and features in newer versions
11+
12+
## Migration Steps
13+
14+
### Phase 1: Setup Modern Build Tools
15+
16+
1. Replace Bower with npm/Yarn
17+
18+
```bash
19+
npm init -y
20+
npm install vite --save-dev
21+
```
22+
23+
2. Setup Vite
24+
25+
```json
26+
// package.json
27+
{
28+
"scripts": {
29+
"dev": "vite",
30+
"build": "vite build",
31+
"preview": "vite preview"
32+
}
33+
}
34+
```
35+
36+
3. Create Vite config for GitHub Pages
37+
38+
### Phase 2: Dependency Updates
39+
40+
Current -> Modern Alternative:
41+
42+
- `bootstrap@3` -> `bootstrap@5`
43+
44+
```bash
45+
npm install bootstrap@5
46+
```
47+
48+
- `jquery` -> Remove (not needed with Bootstrap 5)
49+
- `moment.js` -> `day.js`
50+
51+
```bash
52+
npm install dayjs
53+
```
54+
55+
- `bootswatch` -> Bootstrap 5 themes
56+
- `flags` -> SVG flags or emoji flags
57+
- Custom fonts -> Google Fonts / Bootstrap Icons
58+
- `share-button` -> Web Share API + fallback
59+
60+
### Phase 3: Code Modernization
61+
62+
1. Convert to ES Modules
63+
64+
```javascript
65+
import { daysUntil } from './lib/days.js';
66+
import { format } from 'dayjs';
67+
```
68+
69+
2. Use modern JavaScript features
70+
- Template literals
71+
- Arrow functions
72+
- Async/await
73+
- Optional chaining
74+
75+
3. Update CSS
76+
- Use CSS Grid/Flexbox
77+
- CSS Custom Properties
78+
- Modern selectors
79+
80+
4. Enhance PWA
81+
- Workbox instead of sw-precache
82+
- Better offline experience
83+
- Modern manifest features
84+
85+
## Breaking Changes
86+
87+
Some features will change:
88+
89+
1. Drop support for IE11
90+
2. Require modern browser features:
91+
- ES Modules
92+
- CSS Grid
93+
- Web Share API (with fallback)
94+
95+
## Proposed Timeline
96+
97+
1. Setup modern tools (1-2 days)
98+
2. Migrate dependencies (2-3 days)
99+
3. Update JavaScript (2-3 days)
100+
4. Update CSS (1-2 days)
101+
5. Testing and fixes (2-3 days)
102+
103+
## How to Help
104+
105+
1. Review the migration plan
106+
2. Test in different browsers
107+
3. Report issues
108+
4. Suggest improvements
109+
110+
## References
111+
112+
- [Vite Guide](https://vitejs.dev/guide/)
113+
- [Bootstrap 5 Migration](https://getbootstrap.com/docs/5.0/migration/)
114+
- [Modern JavaScript Features](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide)
115+
- [Web Share API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Share_API)

‎README.md‎

Lines changed: 99 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,109 @@
1-
# https://cadeoleo.github.io
1+
# CadeOLeo!Ver
22

3-
#CadeOLeo2015 #CadeOLeo
3+
[CadeOLeo!Ver](https://cadeoleo.github.io) is a versioning schema for your little ones.
44

5-
## Build
5+
## Development
66

7-
Currently for [PWA (Progressive Web Apps)](https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/) we use service workers and W3C web manifests.
7+
### Prerequisites
88

9-
Originally, in order to generate W3C web manifests, we use: https://realfavicongenerator.net/ and to generate service workers file: https://github.com/GoogleChromeLabs/sw-precache.
9+
- Node.js (LTS version recommended)
10+
- npm
11+
- Bower (`npm install -g bower`)
1012

13+
### Installation
14+
15+
```bash
16+
# Install npm dependencies (for development)
17+
npm install
18+
19+
# Install Bower dependencies (for frontend)
20+
bower install
21+
```
22+
23+
### Testing
24+
25+
The project includes automated tests to validate date calculations and versioning:
26+
27+
```bash
28+
# Run test suite
29+
npm test
1130
```
31+
32+
The tests validate:
33+
34+
- Correct calculation of days until next birthday
35+
- Date handling across different timezones
36+
- Edge cases (birthday today, after birthday)
37+
38+
### Running Locally
39+
40+
After installing dependencies, you can:
41+
42+
1. Open `index.html` in your browser
43+
2. Use the date picker to calculate versions
44+
3. Check Leo's version and countdown
45+
46+
## Progressive Web App (PWA)
47+
48+
This project is built as a [Progressive Web App](https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/), providing offline functionality and app-like experience.
49+
50+
### Service Worker
51+
52+
The service worker handles caching of assets for offline use:
53+
54+
- JavaScript files (including modules)
55+
- CSS and images
56+
- HTML templates
57+
- Third-party dependencies (moment.js, bootstrap, etc.)
58+
59+
To update the service worker cache:
60+
61+
```bash
62+
# Install sw-precache globally (if not already installed)
1263
npm install -g sw-precache
64+
65+
# Generate/update service worker
1366
sw-precache --config=sw-precache-config.js --verbose
1467
```
1568

16-
Now, using as <http://www.manifoldjs.com/generator> as well.
69+
The cache configuration is in `sw-precache-config.js`. When adding new static assets:
70+
71+
1. Add the file path to `staticFileGlobs` in `sw-precache-config.js`
72+
2. Regenerate the service worker
73+
3. Commit both `sw-precache-config.js` and `service-worker.js`
74+
75+
### Web Manifest & Assets
76+
77+
For PWA installation support:
78+
79+
- Web Manifest: `manifest.json` defines app metadata
80+
- Icons: Generated using [Real Favicon Generator](https://realfavicongenerator.net/)
81+
- Additional features: Added via [PWA Builder](https://www.pwabuilder.com/)
82+
83+
### Offline Support
84+
85+
The app works offline after the first visit:
86+
87+
1. Service worker caches all essential assets
88+
2. Date calculations work without network
89+
3. Previously loaded versions are available
90+
4. New visits require connectivity
91+
92+
## Building & Deployment
93+
94+
The project is hosted on GitHub Pages and requires:
95+
96+
1. All static assets committed to the repository
97+
2. Service worker updated when assets change
98+
3. Web manifest kept in sync with app version
99+
100+
## Contributing
101+
102+
1. Fork the repository
103+
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
104+
3. Install dependencies (`npm install`)
105+
4. Make your changes
106+
5. Run tests to ensure everything works (`npm test`)
107+
6. Commit your changes
108+
7. Push to your branch
109+
8. Open a Pull Request

‎assets/javascripts/lib/days.js‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
(function (root, factory) {
2+
if (typeof module === 'object' && module.exports) {
3+
// Node / CommonJS
4+
module.exports = factory(require('moment'));
5+
} else {
6+
// Browser global
7+
root.CadeOLeoDays = factory(root.moment);
8+
}
9+
}(this, function (moment) {
10+
11+
function daysUntilNextBirthday(birthday) {
12+
return daysUntilNextBirthdayGivenNow(birthday, moment.utc());
13+
}
14+
15+
function daysUntilNextBirthdayGivenNow(birthday, nowMoment) {
16+
var b = moment.utc(birthday).startOf('day');
17+
18+
var now = moment.utc(nowMoment).startOf('day');
19+
20+
var thisYear = now.year();
21+
22+
var birthdayThisYear = moment.utc(thisYear + '-' + b.format('MM') + '-' + b.format('DD'), 'YYYY-MM-DD').startOf('day');
23+
var birthdayNextYear = moment.utc(birthdayThisYear).add(1, 'year').startOf('day');
24+
25+
var hadBirthdayThisYear = birthdayThisYear.isBefore(now);
26+
27+
var daysUntilNextBirthday = 0;
28+
29+
if (hadBirthdayThisYear) {
30+
daysUntilNextBirthday = birthdayNextYear.diff(now, 'days');
31+
} else {
32+
daysUntilNextBirthday = birthdayThisYear.diff(now, 'days');
33+
}
34+
35+
return daysUntilNextBirthday;
36+
}
37+
38+
return {
39+
daysUntilNextBirthday: daysUntilNextBirthday,
40+
daysUntilNextBirthdayGivenNow: daysUntilNextBirthdayGivenNow
41+
};
42+
43+
}));

‎assets/javascripts/main.js‎

Lines changed: 8 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,16 @@
11
(function(){
22
var leoBirthday = new Date(document.getElementById('leo-birthday').getAttribute('data-leo-birthday'));
33

4-
function daysUntilNextBirthday(birthday) {
5-
var daysUntilNextBirthday = 0;
6-
7-
var birthday = new moment.utc(birthday);
8-
9-
var thisYear = (new moment().year());
10-
11-
var birthdayThisYear = new moment(
12-
thisYear + '-' + birthday.format('MM') + '-' + birthday.format('DD'),
13-
'YYYY-MM-DD'
14-
);
15-
var birthdayNextYear = new moment(birthdayThisYear).add(1, 'year');
16-
17-
var hadBirthdayThisYear = birthdayThisYear.isBefore(moment());
18-
19-
// console.log({birthday});
20-
// console.log({thisYear});
21-
// console.log({birthdayThisYear});
22-
// console.log({birthdayNextYear});
23-
// console.log({hadBirthdayThisYear});
24-
25-
if (hadBirthdayThisYear) {
26-
daysUntilNextBirthday = birthdayNextYear.diff(
27-
moment(),
28-
'days'
29-
);
30-
} else {
31-
daysUntilNextBirthday = birthdayThisYear.diff(
32-
moment(),
33-
'days'
34-
);
35-
}
36-
37-
// console.log({daysUntilNextBirthday});
38-
39-
return daysUntilNextBirthday;
40-
41-
4+
// Use shared days helper (CadeOLeoDays). Support require() in environments that have it.
5+
var DaysHelper = (typeof require === 'function') ? require('./lib/days') : (window.CadeOLeoDays || {});
6+
7+
var leoDaysUntilNextBirthday = 0;
8+
if (DaysHelper && typeof DaysHelper.daysUntilNextBirthday === 'function') {
9+
leoDaysUntilNextBirthday = DaysHelper.daysUntilNextBirthday(leoBirthday);
10+
} else if (window.CadeOLeoDays && typeof window.CadeOLeoDays.daysUntilNextBirthday === 'function') {
11+
leoDaysUntilNextBirthday = window.CadeOLeoDays.daysUntilNextBirthday(leoBirthday);
4212
}
4313

44-
var leoDaysUntilNextBirthday = daysUntilNextBirthday(leoBirthday);
45-
4614
var today = new Date();
4715

4816
var v = CadeOLeo.Ver.v(leoBirthday, today);

0 commit comments

Comments
 (0)