[PHP]Simpelste manier om gehele pagina-refresh te voorkomen?

[Captain Pervert]

Ik ben bezig met een text-based RPG, in PHP. Het is een bestaande game, die ik herschrijf/vertaal/uitbreid etc.

Nou is het zo dat iedere actie (lopen naar noorden, zuiden, oosten westen, maar ook 'attack', 'run away', 'spell' etc) werkt met een button of link, waarna de hele pagina refresht.
De layout om het spel heen is echter redelijk groot, en opgebouwd in een grote table. Iedere keer zo'n paginarefresh is dus onnodig traag en hinderlijk. Kan niet alleen de cel waarin de game staat gerefresht worden? Of op zijn minst de rest van de pagina 'onthouden'?

Moet alles compleet herschreven worden in DHTML of Ajax, of zijn er stukjes code daarvan die je zo kan copypasten?

[ Voor 15% gewijzigd door Captain Pervert op 17-01-2008 19:50 ]

[SchizoDuckie]

Maak je 'main content' een iframe, en geef elke knop die iframe als target ?

[benoni]

Captain Pervert schreef op donderdag 17 januari 2008 @ 19:49:
Moet alles compleet herschreven worden in DHTML of Ajax, of zijn er stukjes code daarvan die je zo kan copypasten?

Pfoeh... daar kun je eigenlijk geen goed op geven zonder de bestaande code bestudeerd te hebben, denk ik. Als je bijvoorbeeld een vaste achtergrond hebt met vaste tekstblokken, dan kun je met een paar simpele Javascript functies de boel refreshen met Ajax.


In hoeverre is het trouwens text-based? Loopt er wel een achtergrond mee? Heb je wat aan de Javascript code van www.klauterland.nl? Dat is een projectje van mij, de code is niet compleet maar de order ligt even stil, en ik was net gebleven bij het automatisch aanvullen van de scenery afbeeldingen met behulp van Ajax...

Addit
Stukje voorbeeldcode erbij (ook makkelijk op 't web te vinden voor wie zoekt, maar deze is wel handig om mee te testen want 't geeft commentaar over de voortgang):

JavaScript:

    function ajax(query, obj) {
        var xmlHttp;
        var url = "http://hierismijnwebsite.nl/slices/?content=html&" + query;
        var put = (typeof(obj) == "string") ? document.getElementById(obj) : obj;
        // The 'obj' above can be an object ID or a Javascript object reference
        put.innerHTML = "<li>Opening request...<\/li>";

        try {
            // Firefox, Opera 8.0+, Safari
            xmlHttp = new XMLHttpRequest();
        }
        catch (e) {
            // Internet Explorer
            try {
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e) {
                try {
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                }
                catch (e) {
                    alert("Your browser does not support AJAX!");
                    return false;
                }
            }
        }

        xmlHttp.onreadystatechange = function() {
            var state = xmlHttp.readyState;

            switch (state) {
                case 1:
                    put.innerHTML = "<li>Loading...<\/li>";
                break;
                case 2:
                    put.innerHTML = "<li>Loading... complete.<\/li>";
                break;
                case 3:
                    put.innerHTML = "<li>Processing...<\/li>";
                break;
                case 4:
                    put.innerHTML = "<li>Processing... complete<\/li>";
                    if (xmlHttp.status == 200) {
                        put.innerHTML = xmlHttp.responseText;
                    }
                    else {
                        alert("Problem retrieving data:" + xmlHttp.statusText);
                    }
                break;
            }
        }

        xmlHttp.open("GET", url, true);
        xmlHttp.send(null);
    }

HTML:

    <form onsubmit="ajax('input=' + this.elements['user_input'].value, 'output'); return false;">
        <input type="text" name="user_input" />
        <input type="submit" value="submit" />
    </form>
    <ul id="output">
        <li>Tik een tekst druk op enter.</li>
    </ul>

Deze dumpt trouwens HTML in de 'result' container, dat is een vrij botte methode maar wel simpel.

[ Voor 75% gewijzigd door benoni op 17-01-2008 21:40 ]

[DiLDoG]

Misschien is het handig om een javascript library te gebruiken. Hij hoeft dan alles toch maar 1x te laden, en hiermee kan je heel makkelijk data naar de server versturen en weer ophalen.

Ik heb wel goeie ervaringen met Mootools. (En Ext JS voor als je nog wat meer nodig hebt)

[MrDummy]

Als je niet zo handig bent in JS, dan kan ik alternatief ajax aanbevelen zolang je de security in gaten houdt. Ik maak al met succes gebruik van alternatief ajax en het is niet moeilijk om te programmeren. Door bijna multitasking in alternatief ajax (het draait over meerdere php files) is het ook geschikt voor online games.

Of normale Ajax ook deze mogelijkheden biedt moet ik even kijken... Ik heb nog niet daarin verdiept.

[Bosmonster]

MrDummy schreef op vrijdag 18 januari 2008 @ 09:28:
Als je niet zo handig bent in JS, dan kan ik alternatief ajax aanbevelen zolang je de security in gaten houdt. Ik maak al met succes gebruik van alternatief ajax en het is niet moeilijk om te programmeren. Door bijna multitasking in alternatief ajax (het draait over meerdere php files) is het ook geschikt voor online games.

Of normale Ajax ook deze mogelijkheden biedt moet ik even kijken... Ik heb nog niet daarin verdiept.

Alternatief ajax?

[SchizoDuckie]

Ja, vertel wat is alternatief ajax en waarom is het zo listig met security?

* SchizoDuckie benieuwd

[sky-]

MrDummy, Ajax is nogsteeds Javascript hoor.

[MrDummy]

sky- schreef op vrijdag 18 januari 2008 @ 10:43:
MrDummy, Ajax is nogsteeds Javascript hoor.

Klopt, maar het maakt geen gebruik van HttpRequest, ondanks javascript gaat het iets anders in het ophalen gegevens. Het werkt ook als een Ajax, dus dynamisch pagina's aanpassen met nieuwe data. Dit is tweede methode en wordt door originele bedenker 'Alternatief Ajax' genoemd.

Er is enig security nodig omdat heel verkeer via HTML url doorgegeven wordt, en daar kunnen kwaadwillenden daaraan wat knoeien.

[ Voor 13% gewijzigd door MrDummy op 18-01-2008 11:38 ]

[Ro3lm]

MrDummy schreef op vrijdag 18 januari 2008 @ 11:37:
[...]

Klopt, maar het maakt geen gebruik van HttpRequest, ondanks javascript gaat het iets anders in het ophalen gegevens. Het werkt ook als een Ajax, dus dynamisch pagina's aanpassen met nieuwe data. Dit is tweede methode en wordt door originele bedenker 'Alternatief Ajax' genoemd.

Er is enig security nodig omdat heel verkeer via HTML url doorgegeven wordt, en daar kunnen kwaadwillenden daaraan wat knoeien.

Kunt ge hiervan een voorbeeld geven?

[Bosmonster]

Ik ken wel 'alternatief ajax' zoals jij beschrijft, maar dat is in mijn boekje meer 'ouderwets ajax'. Bijvoorbeeld middels een i-frame en gegenereerde javascript-calls

Zo deed ik het ooit voordat ajax een naam had.

[ Voor 12% gewijzigd door Bosmonster op 18-01-2008 11:42 ]

[Toolskyn]

MrDummy schreef op vrijdag 18 januari 2008 @ 11:37:Er is enig security nodig omdat heel verkeer via HTML url doorgegeven wordt, en daar kunnen kwaadwillenden daaraan wat knoeien.

Waarom denk je dat dat object 'httprequest' wordt genoemd? Beveiliging is sowieso nodig, met tools als Firebug kun je sowieso alles aanpassen wat je maar wil. Daar brengt AJAX echt geen verschil in.

[SchizoDuckie]

MrDummy schreef op vrijdag 18 januari 2008 @ 11:37:
[...]

Klopt, maar het maakt geen gebruik van HttpRequest, ondanks javascript gaat het iets anders in het ophalen gegevens. Het werkt ook als een Ajax, dus dynamisch pagina's aanpassen met nieuwe data. Dit is tweede methode en wordt door originele bedenker 'Alternatief Ajax' genoemd.

Er is enig security nodig omdat heel verkeer via HTML url doorgegeven wordt, en daar kunnen kwaadwillenden daaraan wat knoeien.

Heb je misschien ook een link naar dit revolutionaire spul?

[MrDummy]

SchizoDuckie schreef op vrijdag 18 januari 2008 @ 12:28:
[...]

Heb je misschien ook een link naar dit revolutionaire spul?

http://www.phpit.net/arti...p-without-xmlhttprequest/
Hier begint het.

http://www.oxyscripts.com/item-1155.html
Zelfde, met meer code.
Ajax doen zonder XMLHttpRequest dus.
Je kan dingen doen die met XMLHttpRequest niet mogelijk is.

[ Voor 7% gewijzigd door MrDummy op 18-01-2008 12:43 ]

[SchizoDuckie]

MrDummy schreef op vrijdag 18 januari 2008 @ 12:42:
[...]

http://www.phpit.net/arti...p-without-xmlhttprequest/
Hier begint het.

http://www.oxyscripts.com/item-1155.html
Zelfde, met meer code.
Ajax doen zonder XMLHttpRequest dus.
Je kan dingen doen die met XMLHttpRequest niet mogelijk is.

Zoals??? Ik denk dat je je eerst even verder moet gaan inlezen op het XMLHttpRequest en wat daar allemaal mee mogelijk is voordat je je laat inspireren door een vaag artikel wat iets aanraadt als fallback als zelfs activex niet werkt Alles wat die gast hier laat zien is ook mogelijk met xmlhttp en nog meer zelfs ook (kan jij vanuit een hidden frame xml uitlezen? Callbacks aan onerror hangen, etc?

Plus, je gaat heel irritant *click* *click* *click* horen in IE zodra er een request afgeschoten wordt (á la hotmail 'classic')

Ik vind 't een beetje een vaag ding en ik zou het dan ook anderen niet aanraden om het op deze manier te doen, behalve misschien als fallback als je écht geen activex dingen aan kan maken. (maar dan nog zou ik iframes gebruiken)

[ Voor 8% gewijzigd door SchizoDuckie op 18-01-2008 13:22 ]

[Bosmonster]

MrDummy schreef op vrijdag 18 januari 2008 @ 12:42:
[...]

http://www.phpit.net/arti...p-without-xmlhttprequest/
Hier begint het.

http://www.oxyscripts.com/item-1155.html
Zelfde, met meer code.
Ajax doen zonder XMLHttpRequest dus.
Je kan dingen doen die met XMLHttpRequest niet mogelijk is.

Ah, had ik het toch goed, mn good old iframe 'ajax'

Door de vele nadelen van deze methode is juist xmlhttprequest zo populair geworden. Het doet alles wat je met deze 'alternatieve' (lees: 'ouderwetse') methode kunt bereiken en meer. En dan nog op een veel nettere manier ook.

[ Voor 21% gewijzigd door Bosmonster op 18-01-2008 13:26 ]

[MueR]

Hmm.. een MUD via http. Lijkt me niet handig. De vertraging die je gaat hebben is aannoemelijk groter dan via de standaard telnet achtige interfaces, tenzij je zo vaak gaat pollen dat de load weer aannoemelijk groter wordt op zowel je server als de client.

[MrDummy]

Ik zal xmlhttprequest wat meer bestuderen, maar ik heb al sites mee gebouwd op de basis van andere methode, wat jullie oud noemen.
Bijvoorbeeld www.vdsluisvakanties.nl is daarop gebouwd met dynamische delen. Zie bijvoorbeeld de bezettingskalender. Er is geen iframe truc.

Met de engine script kan men eenvoudig delen van de pagina refreshen met goed gebouwde scripts.

[Verwijderd]

nja, dat alternatieve ajax was zo'n 8 jaar geleden wel de manier om xmlhttp (wat toen overigens ook nog geen ajax heettte) in andere browsers dan IE5. In die zin was het dus wel een alternatief.

[MrDummy]

Ja, het is oude script, in de tijd gemaakt waar xmlhttprequest nog niet standaard was in elke browser.
Nu is dat standaard onderdeel, en dus is de alternatief script eigenlijk verouderd.
Maar dat hoeft niet zeggen dat het nog te moeilijk is om te bouwen. Het werkt nog steeds goed, al is het minder geschikt voor druk bezette sites. Met alleen engine.js inladen is geheel eenvoudig om beetje dynamisch te maken. Zo heb ik heden toch sites kunnen maken met oude script.

[Captain Pervert]

De eerste reply was al raak

Ik heb het gedaan met

code:

<iframe width="100%" id="mainframe" src="main.php" frameborder="0" height="800" marginheight="0" marginwidth="0">
<BASE TARGET="mainframe">
</iframe>

Ik kende die hele iframe eigenlijk niet zo goed... Ik associeerde het met frames, en dat is een beetje 1998. Samen met die base target werkt het echt perfect.

[SchizoDuckie]

Dat was idd de simpelste oplossing glad to help