Skocz do zawartości
nowy_user

HTML5 i przycisk "wstecz"

Rekomendowane odpowiedzi

Hej tworzę sobie dla rozluźnienia gierkę w module HTML5 (gm 1.4) i mam jeden problem. Korzystając ze smartfona i otwierając gierkę na stronce, bardzo łatwo jest nieopatrznie kliknąć przycisk wstecz (ten wbudowany w telefonie, w prawym dolnym rogu urządzenia) i stracić cały zapis gry . Czy jest jakiś sposób, aby zablokować taką możliwość, albo aby pojawił się pop-up w stylu: “Czy na pewno chcesz cofnąć stronę? “Albo coś w tym stylu? Podejrzewam, że nie , bo to już zależy od oprogramowania telefonu, ale warto zapytać.  Innym sposobem byłoby zapisanie stanu gry, i nawet niechcący klikniemy sobie wstecz, to szybko moglibyśmy pwrócić do poprzedniego momentu, ale problemem jest to, że gierkach htmll5 nie można zapisać stanu gry :(

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

function myConfirmation() {
    return 'Are you sure you want to quit?';
}

window.onbeforeunload = myConfirmation;

 

Nawet nie musisz tego robić jako rozszerzenie JSowe do gry, tylko po prostu dać w kodzie strony w tagu <script>.

 

No i w grach HTML5 można zapisać grę, bodaj jako plik .ini i wtedy dane lądują w localstorage.

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Niestety kod nie działa, wpisałem go do sekcji <script> do strony index.html (tej która jest tworzona przy generowaniu gry w HTMLu), następnie wrzuciłem na serwer i cóż... wciskam wstecz i normalnie przechodzi mi do wcześniejszej storny. 

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

@nowy_user wkleiłem to właśnie w konsolę na gmclanie w tym temacie forum i zadziałało, więc coś robisz źle. Może sprawdź logi w konsoli właśnie? btw. czym jest sekcja <script> ? tagów script na stronie może być wiele, nie ma jednej sekcji.

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Hmm no to nie wiem co jest nie tak, przedstawiam poniżej kod:

 

 

<!DOCTYPE html>
<html lang="en">




    <head>
        <!-- Generated by GameMaker:Studio http://www.yoyogames.com/gamemaker/studio -->
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta http-equiv="pragma" content="no-cache"/>
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name ="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
        <meta charset="utf-8"/>

        <!-- Set the title bar of the page -->
        <title>Created with GameMaker: Studio</title>

        <!-- Set the background colour of the document -->
        <style>
            body {
              background: #000000;
              color:#cccccc;
              margin: 0px;
              padding: 0px;
              border: 0px;
            }
            canvas {
                      image-rendering: optimizeSpeed;
                      -webkit-interpolation-mode: nearest-neighbor;
                      -ms-touch-action: none;
                      margin: 0px;
                      padding: 0px;
                      border: 0px;
            }
            :-webkit-full-screen #canvas {
                 width: 100%;
                 height: 100%;
            }
            div.gm4html5_div_class
            {
              margin: 0px;
              padding: 0px;
              border: 0px;
            }
            /* START - Login Dialog Box */
            div.gm4html5_login
            {
                 padding: 20px;
                 position: absolute;
                 border: solid 2px #000000;
                 background-color: #404040;
                 color:#00ff00;
                 border-radius: 15px;
                 box-shadow: #101010 20px 20px 40px;
            }
            div.gm4html5_cancel_button
            {
                 float: right;
            }
            div.gm4html5_login_button
            {
                 float: left;
            }
            div.gm4html5_login_header
            {
                 text-align: center;
            }
            /* END - Login Dialog Box */
            :-webkit-full-screen {
               width: 100%;
               height: 100%;
            }
        </style>
    </head>

    <body>
        <div class="gm4html5_div_class" id="gm4html5_div_id">
            <!-- Create the canvas element the game draws to -->
            <canvas id="canvas" width="1511" height="850">
               <p>Your browser doesn't support HTML5 canvas.</p>
            </canvas>
        </div>

        <!-- Run the game code -->
        <script type="text/javascript" src="html5game/f1_3.js?NWHAC=158296150">   </script>



        <script>window.onload = GameMaker_Init;</script>

<script> function myConfirmation() {
    return 'Are you sure you want to quit?';
}

window.onbeforeunload = myConfirmation;
</script>

    </body>
</html>

Tutaj dodałem ten kod prawie na samym końcu, ale próbowałem też na samym początku i bez skutku... :( 

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Ale sprawdziłeś konsolę ? Mi to działa nawet jak zrobiłem plik .html który nie ma nic innego poza:

 

image.png

 

i wtedy wstecz albo zamknięcie karty pokazuje

image.png

 

 

Edit: na stackoverflow piszą, ze na chrome androidowym nie działa onbeforeunload, ale onunload

spróbuj wiec zrobić w tej ostatniej linijce:

window.onunload = window.onbeforeunload = myConfirmation;

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Mi też działa, jak nie ma tam GMowej gry, też ten pop-up się pojawia. Problem gdy kod chcę umieścić w pliku index stworzynym przez GMa, wtedy przeglądarka nie reaguje na ten kod :(

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

przeczytaj jeszcze mój edit na górze

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

ale ja testuję nawet na chromie desktopowym i jest to samo, gdy kod jest wpisany do pustego pliku indexu, to pop-up jest, jak wpisuje kod do pliku index z całym inwentarzem wygenerowanym przez GMa, to wtedy pojawia się problem i okienko się nie wyświetla

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Robiłem testy, niestety ale ten kod:

 

      <!-- Run the game code -->
        <script type="text/javascript" src="html5game/f1_mobile.js?NLHYB=419161947"></script>
        <script>window.onload = GameMaker_Init;</script>

 

 

sprawia, że kod z wyświetlającym się okienkiem nie pojawia  się przy kliknięciu wstecz... czy mam jakieś alternatywy dla tego rozwiązania?

 

Pozdrawiam,

nowy_user

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

a wpisz w konsoli window.onbeforeunload i sprawdź co jest przypisane. Może być tak, że GM nadpisuje tę funkcję, ale wtedy wystarczy jakiś setTimeout() i po sprawie. Albo dodać tego unloada jednak z GMa, jako rozszerzenie.

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

@gnysek , sprawdziłem konsolę, mam coś takiego :   

image.thumb.png.5ad87935a1926d4e3bfd7354fc259384.png

 

Rzeczywiście dopisało do </script>  == $0   . Co to może oznaczać?

 

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

To jest źródło strony, nie konsola.

 

image.png

 

Taki jest przykładowy wynik w konsoli. A taki gdy funkcja jest przypisana:

 

image.png

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

hm.. otworzyłem konsolę, i wpisałem window.onbeforeunload, wyszło coś takiego:

 

image.png.bcdccf5ec3239f140be9b93493822529.png

 

 

 

Jak dla mnie to losowy ciąg znaków, ale może Gnysek ty coś więcej tu widzisz?

  • Lubię (+1) 1

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

No czyli GM przypisuje swój event. A spróbuj tak:

 

<script>
function myConfirmation() {
    return 'Are you sure you want to quit?';
}

function setOBU() {
    window.onbeforeunload = myConfirmation;
}

setTimeout(setOBU, 1000);
</script>

 

To po 1 sekundzie od załadowania strony powinno przypisać funkcję. Ewentualnie spróbuj też setInterval - to będzie ciągle co 1 sekundę nadpisywać funkcję gdyby GM też to robił.

 

(losowy ciąg to wynik obfuskacji kodu przez GMa, który zmienne i funkcje zamienia na krótkie unikalne stringi (najczęściej kolejne litery alfabetu).

  • Super (+1) 1

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Wygląda na to, że działa! obyło się bez setInterval - samo setTimeout wystarczyło:) Wielkie dzięki za pomoc! Teraz już nikt nie wyłączy mojej aplikacji przypadkowo :)

 

pozdrawiam

nowy_user

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Dlatego sugerowałem dodać to bezpośrednio jako rozszerzenie do gry w HTML5 i odpalać na jej początku. Wtedy będzie 100% pewności.

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach

Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto

Tylko zarejestrowani użytkownicy mogą komentować zawartość tej strony.

Zarejestruj nowe konto

Załóż nowe konto. To bardzo proste!

Zarejestruj się

Zaloguj się

Posiadasz już konto? Zaloguj się tutaj.

Zaloguj się tutaj

  • Przeglądający   0 użytkowników

    Brak zarejestrowanych użytkowników, przeglądających tę stronę.

×