-
Notifications
You must be signed in to change notification settings - Fork 0
175 lines (163 loc) · 13 KB
/
planets.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
name: planets
on:
push:
paths:
- 'majortom/planets/pictures/**'
- 'majortom/planets.html'
workflow_dispatch:
jobs:
update-planets-html:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v2
- name: Generate planets.html
run: |
echo "Generating planets.html..."
echo '<!DOCTYPE html><html lang="en">' > majortom/planets.html
echo '<head>' >> majortom/planets.html
echo ' <meta charset="UTF-8">' >> majortom/planets.html
echo ' <meta name="viewport" content="width=device-width, initial-scale=1.0">' >> majortom/planets.html
echo ' <title>planets</title>' >> majortom/planets.html
echo ' <link rel="stylesheet" href="https://brunurb.github.io/majortom/main.css">' >> majortom/planets.html
echo ' <link rel="stylesheet" href="https://brunurb.github.io/majortom/planets/jquery.mosaic.css">' >> majortom/planets.html
echo ' <link rel="icon" href="https://brunurb.github.io/mooo/assets/img/favicon.ico">' >> majortom/planets.html
echo ' <style>' >> majortom/planets.html
echo ' body { background-color: #142936; color: #92cfbf; margin: 0; font-family: Arial, Helvetica, sans-serif; }' >> majortom/planets.html
echo ' #myMosaic { margin: 20px 0 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; }' >> majortom/planets.html
echo ' #myMosaic img { border: none; max-width: calc(100% / 8); height: auto; cursor: pointer; }' >> majortom/planets.html
echo ' h1 { text-align: center; color: #e8e6eb; margin: 40px 0 -10px; font-size: 18px; font-family: "Arial", sans-serif; text-transform: uppercase; }' >> majortom/planets.html
echo ' #overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: none; z-index: 1000; justify-content: center; align-items: center; }' >> majortom/planets.html
echo ' #overlay.show { display: flex; }' >> majortom/planets.html
echo ' .overlay-content { display: flex; justify-content: center; align-items: center; max-width: 90%; max-height: 90%; position: relative; }' >> majortom/planets.html
echo ' #overlay img { max-width: 100%; max-height: 100%; display: block; }' >> majortom/planets.html
echo ' #close { position: absolute; top: 20px; right: 30px; font-size: 40px; color: white; cursor: pointer; }' >> majortom/planets.html
echo ' button { position: fixed; top: 50%; transform: translateY(-50%); background-color: rgba(0, 0, 0, 0.5); color: white; border: none; font-size: 30px; cursor: pointer; z-index: 1001; }' >> majortom/planets.html
echo ' #prevBtn { left: 20px; }' >> majortom/planets.html
echo ' #nextBtn { right: 20px; }' >> majortom/planets.html
echo ' </style>' >> majortom/planets.html
echo '</head>' >> majortom/planets.html
# Adding the header with new menu
echo '<body>' >> majortom/planets.html
echo ' <header>' >> majortom/planets.html
echo ' <ul class="navbar-top">' >> majortom/planets.html
echo ' <li id="nav-company">' >> majortom/planets.html
echo ' <a href="https://brunurb.github.io">brunurb</a>' >> majortom/planets.html
echo ' </li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/">Home</a></li>' >> majortom/planets.html
echo ' <li class="dropdown">' >> majortom/planets.html
echo ' <a href="#">About ▼</a>' >> majortom/planets.html
echo ' <ul class="dropdown-menu">' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/mooo/index.html">About</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/web">links</a></li>' >> majortom/planets.html
echo ' <li><a href="mailto:eargdu3d5@mozmail.com">Contact</a></li>' >> majortom/planets.html
echo ' </ul>' >> majortom/planets.html
echo ' </li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/">Portfolio</a></li>' >> majortom/planets.html
echo ' <li><a href="https://old.reddit.com/r/brunurb/" target="_blank">Blog</a></li>' >> majortom/planets.html
echo ' <li class="dropdown">' >> majortom/planets.html
echo ' <a href="#">Works ▼</a>' >> majortom/planets.html
echo ' <ul class="dropdown-menu">' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/mooo">Presentations</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/prettymaps">prettymaps</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/sketchup">sketchup</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/vectors">vectors</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/web">Website 2</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/shortcuts">Shortcuts</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/startpage">Startpage</a></li>' >> majortom/planets.html
echo ' </ul>' >> majortom/planets.html
echo ' </li>' >> majortom/planets.html
echo ' <li class="dropdown">' >> majortom/planets.html
echo ' <a href="#">8BIT ▼</a>' >> majortom/planets.html
echo ' <ul class="dropdown-menu">' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/astronaut">astronauts</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/spaceships">spacecrafts</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/controls">controls</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/planets">planets</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/917">917</a></li>' >> majortom/planets.html
echo ' <li><a href="https://brunurb.github.io/majortom/">majortom</a></li>' >> majortom/planets.html
echo ' </ul>' >> majortom/planets.html
echo ' </li>' >> majortom/planets.html
echo ' </ul>' >> majortom/planets.html
echo ' </header>' >> majortom/planets.html
# Add the title
echo '<h1>Anata-tachi no kichi wa subete watashi-tachi no mono da</h1>' >> majortom/planets.html
# Mosaic images generation
echo ' <main>' >> majortom/planets.html
echo ' <div id="myMosaic">' >> majortom/planets.html
ls majortom/planets/pictures | grep -E '\.jpeg$|\.jpg$|\.gif$|\.svg$|\.png$|\.webp$' | while IFS= read -r img; do
echo "<img src='https://brunurb.github.io/majortom/planets/pictures/${img// /%20}' alt='Gallery Image' data-full='https://brunurb.github.io/majortom/planets/pictures/${img// /%20}' class='thumbnail' onclick='showImage(this.dataset.full)' />" >> majortom/planets.html
done
echo ' </div>' >> majortom/planets.html
# Overlay section with navigation arrows
echo ' <div id="overlay" onclick="closeOverlay(event)">' >> majortom/planets.html
echo ' <div class="overlay-content">' >> majortom/planets.html
echo ' <span id="close">×</span>' >> majortom/planets.html
echo ' <img id="overlay-image" src="" alt="Full Size Image" />' >> majortom/planets.html
echo ' <button id="prevBtn" onclick="showPrevious(event)">❮</button>' >> majortom/planets.html
echo ' <button id="nextBtn" onclick="showNext(event)">❯</button>' >> majortom/planets.html
echo ' </div>' >> majortom/planets.html
echo ' </div>' >> majortom/planets.html
echo ' </main>' >> majortom/planets.html
# Footer
echo ' <footer>' >> majortom/planets.html
echo ' <p>© 2024 brunurb</p>' >> majortom/planets.html
echo ' </footer>' >> majortom/planets.html
# Include jQuery and custom scripts
echo ' <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>' >> majortom/planets.html
echo ' <script type="text/javascript">' >> majortom/planets.html
echo ' document.addEventListener("DOMContentLoaded", function() {' >> majortom/planets.html
echo ' let currentIndex = 0;' >> majortom/planets.html
echo ' const imagesArray = [...document.querySelectorAll("#myMosaic img")];' >> majortom/planets.html
echo ' function showImage(src) {' >> majortom/planets.html
echo ' const overlay = document.getElementById("overlay");' >> majortom/planets.html
echo ' const overlayImage = document.getElementById("overlay-image");' >> majortom/planets.html
echo ' overlayImage.src = src;' >> majortom/planets.html
echo ' currentIndex = imagesArray.findIndex(img => img.dataset.full === src);' >> majortom/planets.html
echo ' overlay.classList.add("show");' >> majortom/planets.html
echo ' }' >> majortom/planets.html
echo ' function showPrevious(event) {' >> majortom/planets.html
echo ' event.stopPropagation();' >> majortom/planets.html
echo ' currentIndex = (currentIndex - 1 + imagesArray.length) % imagesArray.length;' >> majortom/planets.html
echo ' showImage(imagesArray[currentIndex].dataset.full);' >> majortom/planets.html
echo ' }' >> majortom/planets.html
echo ' function showNext(event) {' >> majortom/planets.html
echo ' event.stopPropagation();' >> majortom/planets.html
echo ' currentIndex = (currentIndex + 1) % imagesArray.length;' >> majortom/planets.html
echo ' showImage(imagesArray[currentIndex].dataset.full);' >> majortom/planets.html
echo ' }' >> majortom/planets.html
echo ' function closeOverlay(event) {' >> majortom/planets.html
echo ' if (event.target.id === "overlay" || event.target.id === "close") {' >> majortom/planets.html
echo ' const overlay = document.getElementById("overlay");' >> majortom/planets.html
echo ' overlay.classList.remove("show");' >> majortom/planets.html
echo ' }' >> majortom/planets.html
echo ' }' >> majortom/planets.html
echo ' const images = document.querySelectorAll("#myMosaic img");' >> majortom/planets.html
echo ' images.forEach(image => {' >> majortom/planets.html
echo ' image.addEventListener("click", function() {' >> majortom/planets.html
echo ' showImage(this.dataset.full);' >> majortom/planets.html
echo ' });' >> majortom/planets.html
echo ' });' >> majortom/planets.html
echo ' const overlay = document.getElementById("overlay");' >> majortom/planets.html
echo ' overlay.addEventListener("click", closeOverlay);' >> majortom/planets.html
echo ' const closeButton = document.getElementById("close");' >> majortom/planets.html
echo ' closeButton.addEventListener("click", closeOverlay);' >> majortom/planets.html
echo ' document.getElementById("prevBtn").addEventListener("click", showPrevious);' >> majortom/planets.html
echo ' document.getElementById("nextBtn").addEventListener("click", showNext);' >> majortom/planets.html
echo ' window.addEventListener("keydown", function(event) {' >> majortom/planets.html
echo ' if (event.key === "ArrowLeft") {' >> majortom/planets.html
echo ' showPrevious(event);' >> majortom/planets.html
echo ' } else if (event.key === "ArrowRight") {' >> majortom/planets.html
echo ' showNext(event);' >> majortom/planets.html
echo ' }' >> majortom/planets.html
echo ' });' >> majortom/planets.html
echo ' });' >> majortom/planets.html
echo ' </script>' >> majortom/planets.html
echo '</body></html>' >> majortom/planets.html
- name: Commit changes
run: |
git config --local user.email "github-actions@github.com"
git config --local user.name "GitHub Action"
git add majortom/planets.html
git commit -m "Regenerate majortom/planets.html for mosaic gallery with overlay and fixed navigation arrows" || echo "No changes to commit"
git push origin master # Make sure this matches your main branch