|
172 | 172 | </div> |
173 | 173 |
|
174 | 174 | <div class="spixi-holder-40"></div> |
175 | | - <div id="lockModal" class="spixi-modal"> |
176 | | - <!-- Modal content --> |
177 | | - <div class="modal-content"> |
178 | | - |
179 | | - <div class="spixi-modal-text"> |
180 | | - *SL{settings-lock-confirm-text} |
181 | | - </div> |
182 | | - |
183 | | - <hr class="spixi-separator noheightmargins fullwidth" /> |
184 | | - <div class="spixi-modal-footer"> |
185 | | - <div class="spixi-modal-close">*SL{settings-cancel}</div> |
186 | | - |
187 | | - <div id="confirmlock" class="spixi-modal-confirm">*SL{settings-confirm}</div> |
188 | | - |
189 | | - </div> |
190 | | - |
191 | | - </div> |
192 | | - </div> |
193 | | - |
194 | | - |
195 | 175 |
|
196 | 176 | <hr class="spixi-separator-main" /> |
197 | 177 | <div class="spixi-textsection-holder spixi-textsection-header"> |
|
293 | 273 |
|
294 | 274 | </div> |
295 | 275 |
|
| 276 | + <!--Unsaved Changes Modal--> |
| 277 | + <div class="new-modal-wrapper" id="unsavedChangesModal" style="display: none;"> |
| 278 | + <div class="new-modal-container"> |
| 279 | + <!--<i class="fa fa-user-times modal-remove-icon"></i>--> |
| 280 | + <div class="new-modal-texts"> |
| 281 | + <span class="label-lg">*SL{settings-unsaved-changes-modal-title}</span> |
| 282 | + <span class="body-sm">*SL{settings-unsaved-changes-modal-subtitle}</span> |
| 283 | + </div> |
| 284 | + <div class="new-modal-buttons"> |
| 285 | + <div class="spixi-flat-button label-sm" onclick="document.getElementById('unsavedChangesModal').style.display = 'none';"> |
| 286 | + *SL{settings-cancel} |
| 287 | + </div> |
| 288 | + <div class="spixi-flat-button label-sm button outline" |
| 289 | + onclick="location.href = 'ixian:back';"> |
| 290 | + *SL{settings-confirm} |
| 291 | + </div> |
| 292 | + </div> |
| 293 | + </div> |
| 294 | + </div> |
| 295 | + |
296 | 296 | <script type="text/javascript"> |
| 297 | + var nickname = ""; |
| 298 | + var settingsChanged = false; |
| 299 | + |
297 | 300 | var deleteWalletModal = document.getElementById('deleteWalletModal'); |
298 | 301 | var deleteAccountModal = document.getElementById('deleteAccountModal'); |
299 | 302 | var deleteHistoryModal = document.getElementById('deleteHistoryModal'); |
300 | 303 | var deleteDownloadsModal = document.getElementById('deleteDownloadsModal'); |
301 | | - var lockModal = document.getElementById('lockModal'); |
| 304 | + var unsavedChangesModal = document.getElementById('unsavedChangesModal'); |
302 | 305 |
|
303 | 306 | var lockSwitch = document.getElementById("lockSwitch"); |
304 | 307 |
|
| 308 | + function onBack() { |
| 309 | + if (settingsChanged) { |
| 310 | + unsavedChangesModal.style.display = "flex"; |
| 311 | + } else { |
| 312 | + location.href = "ixian:back"; |
| 313 | + } |
| 314 | + } |
305 | 315 |
|
306 | 316 | document.getElementById("backbtn").onclick = function () { |
307 | | - location.href = "ixian:back"; |
| 317 | + onBack(); |
308 | 318 | } |
309 | 319 |
|
310 | 320 | document.getElementById("savebtn").onclick = function () { |
|
343 | 353 | else if (event.target == deleteDownloadsModal) { |
344 | 354 | deleteDownloadsModal.style.display = "none"; |
345 | 355 | } |
346 | | - else if (event.target == lockModal) { |
347 | | - lockModal.style.display = "none"; |
| 356 | + else if (event.target == unsavedChangesModal) { |
| 357 | + unsavedChangesModal.style.display = "none"; |
348 | 358 | } |
349 | 359 | } |
350 | 360 |
|
351 | 361 | document.getElementsByClassName("spixi-modal-footer")[0].onclick = function () { |
352 | 362 | deleteAccountModal.style.display = "none"; |
353 | 363 | } |
354 | 364 | document.getElementsByClassName("spixi-modal-footer")[1].onclick = function () { |
355 | | - lockModal.style.display = "none"; |
356 | | - } |
357 | | - document.getElementsByClassName("spixi-modal-footer")[2].onclick = function () { |
358 | 365 | deleteWalletModal.style.display = "none"; |
359 | 366 | } |
360 | | - document.getElementsByClassName("spixi-modal-footer")[3].onclick = function () { |
| 367 | + document.getElementsByClassName("spixi-modal-footer")[2].onclick = function () { |
361 | 368 | deleteHistoryModal.style.display = "none"; |
362 | 369 | } |
363 | | - document.getElementsByClassName("spixi-modal-footer")[4].onclick = function () { |
| 370 | + document.getElementsByClassName("spixi-modal-footer")[3].onclick = function () { |
364 | 371 | deleteDownloadsModal.style.display = "none"; |
365 | 372 | } |
366 | 373 |
|
367 | 374 |
|
368 | 375 | document.getElementById("avatar").onclick = function () { |
| 376 | + settingsChanged = true; |
369 | 377 | location.href = "ixian:avatar"; |
370 | 378 | } |
371 | | - |
| 379 | + |
372 | 380 | function loadAvatar(avatar_path) { |
373 | 381 | avatar_path = avatar_path.replace(/\/g, '\\'); |
374 | 382 |
|
|
378 | 386 | } |
379 | 387 |
|
380 | 388 | function setNickname(nick) { |
| 389 | + nickname = nick; |
381 | 390 | document.getElementById("nicknameInput").value = nick; |
382 | 391 | } |
383 | 392 |
|
|
390 | 399 | } |
391 | 400 | } |
392 | 401 |
|
393 | | - function setLanguage(lang) |
394 | | - { |
| 402 | + function setLanguage(lang) { |
395 | 403 | document.getElementById("SelectedLanguage").innerHTML = lang; |
396 | 404 | } |
397 | 405 |
|
398 | | - function changeLanguage(langEl) |
399 | | - { |
400 | | - document.getElementById('LanguageDropDown').style.display='none'; |
| 406 | + function changeLanguage(langEl) { |
| 407 | + settingsChanged = true; |
| 408 | + document.getElementById('LanguageDropDown').style.display = 'none'; |
401 | 409 | setLanguage(langEl.innerHTML); |
402 | 410 | location.href = "ixian:language:" + langEl.getAttribute("lang-data"); |
403 | 411 | return false; |
|
413 | 421 | } |
414 | 422 |
|
415 | 423 | function changeAppearance(appEl) { |
| 424 | + settingsChanged = true; |
416 | 425 | document.getElementById('AppearanceDropDown').style.display = 'none'; |
417 | 426 | var attr = appEl.getAttribute("app-data"); |
418 | 427 | setAppearance(attr); |
|
428 | 437 | lockSwitch.className = "spixi-switch off"; |
429 | 438 | } |
430 | 439 | } |
431 | | - |
| 440 | + |
432 | 441 | lockSwitch.onclick = function () { |
| 442 | + settingsChanged = true; |
433 | 443 | if (lockSwitch.classList.contains("off")) { |
434 | | - lockModal.style.display = "block"; |
435 | | - |
| 444 | + lockSwitch.className = "spixi-switch"; |
| 445 | + location.href = "ixian:lock:on"; |
436 | 446 | return; |
437 | 447 | } |
| 448 | + lockSwitch.className = "spixi-switch off"; |
438 | 449 | location.href = "ixian:lock:off"; |
439 | 450 | } |
440 | | - document.getElementById("confirmlock").onclick = function () { |
441 | | - lockModal.style.display = "none"; |
442 | | - lockSwitch.className = "spixi-switch"; |
443 | | - location.href = "ixian:lock:on"; |
444 | | - } |
445 | | - |
446 | 451 |
|
| 452 | + document.getElementById("nicknameInput").onblur = function () { |
| 453 | + if (nickname != document.getElementById("nicknameInput").value) { |
| 454 | + settingsChanged = true; |
| 455 | + } |
| 456 | + } |
447 | 457 | </script> |
448 | 458 | </body> |
449 | 459 | </html> |
0 commit comments