|
| 1 | +{{- define "main" }} |
| 2 | +<section class="cn1-initializr-page"> |
| 3 | + <header class="cn1-initializr-header"> |
| 4 | + {{ partial "breadcrumbs.html" . }} |
| 5 | + <h1>{{ .Title }}</h1> |
| 6 | + {{ with .Description }}<p>{{ . }}</p>{{ end }} |
| 7 | + </header> |
| 8 | + |
| 9 | + <div class="cn1-initializr-shell"> |
| 10 | + <div id="cn1-splash" class="cn1-splash"> |
| 11 | + <img class="icon" src="/initializr-app/icon.png" alt="Initializr icon" /> |
| 12 | + <div class="cn1-loader"></div> |
| 13 | + <div class="progress-bar"> |
| 14 | + <div class="progress-bar-internal"></div> |
| 15 | + </div> |
| 16 | + <p class="cn1-splash-label">Preparing Initializr...</p> |
| 17 | + </div> |
| 18 | + <canvas width="320" height="480" id="codenameone-canvas"></canvas> |
| 19 | + </div> |
| 20 | +</section> |
| 21 | + |
| 22 | +<style> |
| 23 | +.cn1-initializr-page { |
| 24 | + max-width: 1180px; |
| 25 | + margin: 0 auto; |
| 26 | + padding: 1.25rem 1rem 2rem; |
| 27 | +} |
| 28 | + |
| 29 | +.cn1-initializr-header h1 { |
| 30 | + margin: 0.25rem 0 0.35rem; |
| 31 | +} |
| 32 | + |
| 33 | +.cn1-initializr-header p { |
| 34 | + margin: 0 0 1rem; |
| 35 | + opacity: 0.82; |
| 36 | +} |
| 37 | + |
| 38 | +.cn1-initializr-shell { |
| 39 | + position: relative; |
| 40 | + min-height: clamp(560px, 74vh, 900px); |
| 41 | + border-radius: 16px; |
| 42 | + overflow: hidden; |
| 43 | + border: 1px solid var(--border); |
| 44 | + background: radial-gradient(circle at 20% 0%, #e9f1ff 0%, #f9fbff 40%, #ffffff 100%); |
| 45 | + box-shadow: 0 14px 42px rgba(0, 0, 0, 0.12); |
| 46 | +} |
| 47 | + |
| 48 | +html.dark .cn1-initializr-shell { |
| 49 | + background: radial-gradient(circle at 20% 0%, #172236 0%, #121a2a 45%, #0d1321 100%); |
| 50 | + box-shadow: 0 20px 48px rgba(0, 0, 0, 0.48); |
| 51 | +} |
| 52 | + |
| 53 | +#codenameone-canvas { |
| 54 | + position: absolute; |
| 55 | + inset: 0; |
| 56 | + width: 100%; |
| 57 | + height: 100%; |
| 58 | +} |
| 59 | + |
| 60 | +.cn1-splash { |
| 61 | + position: absolute; |
| 62 | + inset: 0; |
| 63 | + display: grid; |
| 64 | + place-items: center; |
| 65 | + align-content: center; |
| 66 | + gap: 1rem; |
| 67 | + z-index: 2; |
| 68 | + text-align: center; |
| 69 | + padding: 2rem; |
| 70 | + color: #1d2638; |
| 71 | + background: |
| 72 | + radial-gradient(1000px 420px at 20% 0%, rgba(99, 142, 255, 0.22), rgba(99, 142, 255, 0) 65%), |
| 73 | + radial-gradient(720px 360px at 100% 100%, rgba(60, 173, 216, 0.2), rgba(60, 173, 216, 0) 65%); |
| 74 | +} |
| 75 | + |
| 76 | +html.dark .cn1-splash { |
| 77 | + color: #d8e4ff; |
| 78 | +} |
| 79 | + |
| 80 | +.cn1-splash img.icon { |
| 81 | + width: 110px; |
| 82 | + height: auto; |
| 83 | + border-radius: 18px; |
| 84 | + box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25); |
| 85 | +} |
| 86 | + |
| 87 | +.cn1-loader { |
| 88 | + width: 46px; |
| 89 | + height: 46px; |
| 90 | + border-radius: 50%; |
| 91 | + border: 3px solid rgba(49, 105, 230, 0.25); |
| 92 | + border-top-color: #3169e6; |
| 93 | + animation: cn1-spin 0.9s linear infinite; |
| 94 | +} |
| 95 | + |
| 96 | +.cn1-splash .progress-bar { |
| 97 | + display: block; |
| 98 | + width: min(340px, 75vw); |
| 99 | + height: 9px; |
| 100 | + border-radius: 999px; |
| 101 | + overflow: hidden; |
| 102 | + border: 1px solid rgba(49, 105, 230, 0.25); |
| 103 | + background: rgba(255, 255, 255, 0.7); |
| 104 | +} |
| 105 | + |
| 106 | +.cn1-splash .progress-bar .progress-bar-internal { |
| 107 | + width: 0; |
| 108 | + height: 100%; |
| 109 | + border-radius: 999px; |
| 110 | + background: linear-gradient(90deg, #2f66e4, #3dc8d1); |
| 111 | + box-shadow: 0 0 18px rgba(47, 102, 228, 0.5); |
| 112 | + transition: width 160ms ease-out; |
| 113 | +} |
| 114 | + |
| 115 | +.cn1-splash .cn1-splash-label { |
| 116 | + margin: 0; |
| 117 | + font-size: 0.95rem; |
| 118 | + opacity: 0.88; |
| 119 | +} |
| 120 | + |
| 121 | +.cn1-edit-string, .cn1-string-picker { |
| 122 | + position: absolute; |
| 123 | + background-color: transparent; |
| 124 | + z-index: 1000; |
| 125 | + box-sizing: content-box; |
| 126 | +} |
| 127 | + |
| 128 | +.cn1-native-peer { |
| 129 | + position: absolute; |
| 130 | + border: none; |
| 131 | +} |
| 132 | + |
| 133 | +.cn1-capture-dialog, |
| 134 | +.cn1-capture-preview-dialog { |
| 135 | + position: fixed; |
| 136 | + top: 10px; |
| 137 | + left: 10px; |
| 138 | + right: 10px; |
| 139 | + bottom: 10px; |
| 140 | + border: 1px solid #222; |
| 141 | + background: rgba(33, 33, 33, 0.9); |
| 142 | + z-index: 1000; |
| 143 | +} |
| 144 | + |
| 145 | +@keyframes cn1-spin { |
| 146 | + to { |
| 147 | + transform: rotate(360deg); |
| 148 | + } |
| 149 | +} |
| 150 | +</style> |
| 151 | + |
| 152 | +<script> |
| 153 | +window.cn1_debug_flags = { |
| 154 | + disableTouchstart: false, |
| 155 | + disableTouchend: false, |
| 156 | + disableHover: false, |
| 157 | + disableMouseup: false, |
| 158 | + disableMousedown: false, |
| 159 | + disableWheel: false, |
| 160 | + debugLog: false, |
| 161 | + useNativeQueue: false |
| 162 | +}; |
| 163 | + |
| 164 | +(function() { |
| 165 | + var cn1ToLoad = { |
| 166 | + "teavm/classes.js": {size: 0, loaded: false}, |
| 167 | + "style.css": {size: 4923, loaded: false}, |
| 168 | + "js/pwa.js": {size: 584, loaded: false}, |
| 169 | + "js/bootstrap.min.js": {size: 35951, loaded: false}, |
| 170 | + "js/fontmetrics.js": {size: 145730, loaded: false}, |
| 171 | + "js/upup.min.js": {size: 939, loaded: false}, |
| 172 | + "js/push.js": {size: 12310, loaded: false}, |
| 173 | + "js/jquery.min.js": {size: 84319, loaded: false}, |
| 174 | + "js/manup.js": {size: 6493, loaded: false}, |
| 175 | + "css/bootstrap-theme.min.css": {size: 19963, loaded: false}, |
| 176 | + "css/bootstrap.min.css": {size: 117305, loaded: false}, |
| 177 | + "assets/material-design-font.ttf": {size: 353892, loaded: false}, |
| 178 | + "assets/grub-css.zip": {size: 1915434, loaded: false}, |
| 179 | + "assets/barebones-css.zip": {size: 599, loaded: false}, |
| 180 | + "assets/cn1-version-numbers": {size: 41, loaded: false}, |
| 181 | + "assets/iOS7Theme.res": {size: 300158, loaded: false}, |
| 182 | + "assets/common.zip": {size: 297101, loaded: false}, |
| 183 | + "assets/idea.zip": {size: 4555, loaded: false}, |
| 184 | + "assets/tweet-css.zip": {size: 2884, loaded: false}, |
| 185 | + "assets/android_holo_light.res": {size: 114442, loaded: false}, |
| 186 | + "assets/grub-cn1libs.zip": {size: 967546, loaded: false}, |
| 187 | + "assets/tweet-pom.xml": {size: 16251, loaded: false}, |
| 188 | + "assets/vscode.zip": {size: 1024, loaded: false}, |
| 189 | + "assets/CN1Resource.res": {size: 5961, loaded: false}, |
| 190 | + "assets/kotlin-pom.xml": {size: 15565, loaded: false}, |
| 191 | + "assets/theme.res": {size: 425304, loaded: false}, |
| 192 | + "assets/tweet-src.zip": {size: 357703, loaded: false}, |
| 193 | + "assets/barebones-src.zip": {size: 1327, loaded: false}, |
| 194 | + "assets/grub-pom.xml": {size: 15778, loaded: false}, |
| 195 | + "assets/barebones-pom.xml": {size: 15843, loaded: false}, |
| 196 | + "assets/grub-src.zip": {size: 279805, loaded: false}, |
| 197 | + "assets/eclipse.zip": {size: 11898, loaded: false}, |
| 198 | + "assets/kotlin-src.zip": {size: 1507, loaded: false}, |
| 199 | + "assets/netbeans.zip": {size: 2877, loaded: false} |
| 200 | + }; |
| 201 | + |
| 202 | + window.cn1LoadedFile = function(filename) { |
| 203 | + if (filename.indexOf("?") >= 0) { |
| 204 | + filename = filename.substring(0, filename.indexOf("?")); |
| 205 | + } |
| 206 | + if (cn1ToLoad[filename]) { |
| 207 | + cn1ToLoad[filename].loaded = true; |
| 208 | + } |
| 209 | + }; |
| 210 | + |
| 211 | + var progressTimer = window.setInterval(function() { |
| 212 | + if (!window.jQuery) { |
| 213 | + return; |
| 214 | + } |
| 215 | + var splash = jQuery("#cn1-splash"); |
| 216 | + if (splash.length === 0) { |
| 217 | + clearInterval(progressTimer); |
| 218 | + return; |
| 219 | + } |
| 220 | + var bytesRequired = 0; |
| 221 | + var bytesLoaded = 0; |
| 222 | + for (var f in cn1ToLoad) { |
| 223 | + bytesRequired += cn1ToLoad[f].size; |
| 224 | + if (cn1ToLoad[f].loaded) { |
| 225 | + bytesLoaded += cn1ToLoad[f].size; |
| 226 | + } |
| 227 | + } |
| 228 | + if (bytesRequired > 0) { |
| 229 | + var pct = Math.min(100, Math.round(bytesLoaded / bytesRequired * 100)); |
| 230 | + jQuery(".progress-bar-internal", splash).css("width", pct + "%"); |
| 231 | + if (pct >= 100) { |
| 232 | + jQuery(".cn1-splash-label", splash).text("Launching Initializr..."); |
| 233 | + } |
| 234 | + } |
| 235 | + }, 180); |
| 236 | +})(); |
| 237 | +</script> |
| 238 | +<link rel="stylesheet" href="/initializr-app/css/bootstrap.min.css"> |
| 239 | +<link rel="stylesheet" href="/initializr-app/css/bootstrap-theme.min.css"> |
| 240 | +<link rel="stylesheet" href="/initializr-app/style.css"> |
| 241 | +<script src="/initializr-app/js/push.js"></script> |
| 242 | +<script>window.cn1LoadedFile("js/push.js");</script> |
| 243 | +<script src="/initializr-app/js/jquery.min.js"></script> |
| 244 | +<script>window.cn1LoadedFile("js/jquery.min.js");</script> |
| 245 | +<script src="/initializr-app/js/fontmetrics.js"></script> |
| 246 | +<script>window.cn1LoadedFile("js/fontmetrics.js");</script> |
| 247 | +<script src="/initializr-app/teavm/classes.js"></script> |
| 248 | +<script>window.cn1LoadedFile("teavm/classes.js");</script> |
| 249 | +<script> |
| 250 | + (function() { |
| 251 | + function splashMessage(msg) { |
| 252 | + var node = document.querySelector("#cn1-splash .cn1-splash-label"); |
| 253 | + if (node) { |
| 254 | + node.textContent = msg; |
| 255 | + } |
| 256 | + } |
| 257 | + if (!window.jQuery) { |
| 258 | + splashMessage("Initializr bundle is unavailable in this preview."); |
| 259 | + return; |
| 260 | + } |
| 261 | + jQuery(document).ready(function() { |
| 262 | + if (typeof window.main === "function") { |
| 263 | + window.main(); |
| 264 | + } else { |
| 265 | + splashMessage("Initializr failed to initialize."); |
| 266 | + } |
| 267 | + }); |
| 268 | + })(); |
| 269 | +</script> |
| 270 | +<script src="/initializr-app/js/bootstrap.min.js"></script> |
| 271 | +<script>window.cn1LoadedFile("js/bootstrap.min.js");</script> |
| 272 | +<script src="/initializr-app/js/upup.min.js"></script> |
| 273 | +<script>window.cn1LoadedFile("js/upup.min.js");</script> |
| 274 | +<script src="/initializr-app/js/manup.js"></script> |
| 275 | +<script>window.cn1LoadedFile("js/manup.js");</script> |
| 276 | +{{- end }} |
0 commit comments