AJAX Snippety a tlačítka zpět a vpřed

buff

Zdravím. Skoro jasné z předmětu. Je možné používat v aplikaci snippety a jejich invalidaci zasíláním signálů a zachovat přitom funkčnost historie prohlížení v browseru? Má představa je, že například v programu fifteen by tlačítko Zpět mělo vrátit na pozici před posledním posunitím kostky, nikoliv na složenou krávu. (Hledal jsem a nenacházím, stačí mě případně „někam“ poslat.) Díky

Editoval buff (10. 7. 2009 20:45)

Ondřej Mirtes

Pro tuto funkčnost by bylo třeba, aby Nette (či pouze jQuery) nějak spolupracovalo se signály pomocí řetězce za znakem # v adrese. Jelikož se ale tato část řetězce nezasílá na server, musely by být ty adresy dvojí – s # v případě zapnutého JavaScriptu v prohlížeči a ?signal-parametr=X#do=signal v případě vypnutého.

Tato funkčnost se mi líbila, ale nevím, na koho se pro implementaci odvolávat :o)

phx

Fifteen si svuj aktualni stav posila v GETu bez JS. A pokud by bylo JS aktivni tak by stacilo aby si za # ukladala nejaky text ve kterem by v podstate zakodovala GET parametry.

Principielne mi to je jasny, ale osobne si na provedeni netroufam. Ja a JS nejsme moc velici kamaradi.

PetrP

Možná třeba něco jako toto:
http://plugins.jquery.com/…uery_history

$.History.bind(function(state){
	state = decodeURIComponent(state);
	$.get(state);
});

$('.ajax').click(function () {
	$.History.go(encodeURIComponent(this.href));
	return false
});

ale ukládá to celou adresu za # což není uplně košér.

// EDIT Proč nefunguje /-- js

Editoval PetrP (11. 7. 2009 22:23)

buff

Díky za odpovědi!

LastHunter:

Tato funkčnost se mi líbila, ale nevím, na koho se pro implementaci odvolávat :o)

No, zdá se, že tušíš jak na to. Takže… (?) ;-)

PetrP: Vypadá to zajímavě, a přiznám se, že si nejsem úplně jistý, jak to funguje. Ale pokud tomu rozumím správně, tak to není úplně dobře. Pokud bych měl na stránce více snippetů, a:

kliknutím na odkaz změnil snippet A
kliknutím na odkaz změnil snippet B
kliknutím na odkaz změnil snippet A
přešel v historii na bod 1 (přímo, bez mezikroku 2)

Tak bych měl ve stavu 4 jiný snippet B než ve stavu 1, přestože jsem chtěl být ve stavu 1. Pletu se?

Ale rozhodně díky za tip, možná mi to bude úplně stačit takhle! Hmmm, a proč celá adresa za # není košer?

Editoval buff (11. 7. 2009 23:56)

PetrP

Zkus popsat nějaké reálné použití, tedy co je A a B, a kliknutí na jednotlivé odkazy. Snažil jsem se něco vymyslet a nějak my selhává představivost.

Jinak cela adresa za # není v první řadě hezká, a pak by to mohlo mít hypoteticky problém s IE6 kde je adresa omezena na 255 znaku (nebo tak nějak).

LastHunter napsal(a):

Pro tuto funkčnost by bylo třeba, aby Nette (či pouze jQuery) nějak spolupracovalo se signály pomocí řetězce za znakem # v adrese. Jelikož se ale tato část řetězce nezasílá na server, musely by být ty adresy dvojí – s # v případě zapnutého JavaScriptu v prohlížeči a ?signal-parametr=X#do=signal v případě vypnutého.

V js nevíš jak máš poskládat adresu, protože routování máš v php. Takže jak by si z #do=signal skládal getovej dotaz? (+ i další pripadny parametry)

A dvojí zárověň by byt nemohly: potrebujes nejakou adresu odeslat jako ajax get pozadavek, a neco ulozit za #. Nejde odeslat ajaxem i #. a stejne tak nemuzes v prohlížeči zmenit něco jineho než #.

Editoval PetrP (12. 7. 2009 1:39)

buff

PetrP napsal(a):

Zkus popsat nějaké reálné použití, tedy co je A a B, a kliknutí na jednotlivé odkazy. Snažil jsem se něco vymyslet a nějak my selhává představivost.

Nad příkladem jsem neuvažoval, šlo mi o obecnou správnost toho přístupu. Zkusím to, ale obávám se, že mě napadne jen nějaká pitomost: ;-)

A ~ seznam článků z nějaké rubriky
B ~ článek

Výchozí stav, máme zobrazen seznam článků rubriky Z domova a článek Záplavy ustupují.

Kliknutím na odkaz Domácí zvířata v seznamu rubrik se změní snippet se seznamem článků. (ale zůstává zobrazený článek Záplavy ustupují)
Kliknutím na odkaz Jak nakrmit nemocnou kočku v seznamu článků se změní zobrazený článek.
Kliknutím na odkaz Ze zahraničí v seznamu rubrik se změní snippet se seznamem článků.
V historii vyberu stránku „o dvě zpět“, měl bych se tedy dostat do stavu po 1.

A pokud tomu rozumím dobře (což není jisté, nestudoval jsem to důkladně), tak výsledkem bude

A = seznam článků rubriky Domácí zvířata
B = článek Jak nakrmit nemocnou kočku

což se liší od stavu po 1. Pletu se?

PetrP

No v takovyhle připadech musi url 100% reprezentovat stav aplikace

{snippet A}
	{foreach $model->getObsahRubriky($presenter->rubrika) as $content}
	{if $content->isRubrika)}
		<a class="ajax" href="{link this 'id'=>$id,'rubrika'=>$content->name">$content->text}</a>
	{else}
		<a class="ajax" href="{link this 'id'=>$content->id">{$content->text}</a>
	{/if}
	{/foreach}
{/snippet}
{snippet B}
	<h1>{$model->getClanek($id)->nadpis}</h1>
	{$model->getClanek($id)->text}
{/snippet}

class ClanekPresenter extends BasePresenter
{
	/** @persistent */
	public $rubrika;

	public function renderDefault($id)
	{
		$this->template->id = $id;
		if ($this->isAjax)
		{
			$this->invalidateControl('A');
			$this->invalidateControl('B');
		}
	}
}

Neni to ideální protože se pokaždé překleslí oba snipety, nadruhou stranu potrebuju udrzovat aktualni odkazy.

/clanek/1/

Kliknutím na odkaz Domácí zvířata v seznamu rubrik se změní snippet se seznamem článků. (ale zůstává zobrazený článek Záplavy ustupují)

/clanek/1/?rubrika=Domácí zvířata

Kliknutím na odkaz Jak nakrmit nemocnou kočku v seznamu článků se změní zobrazený článek.

/clanek/5/?rubrika=Domácí zvířata

Kliknutím na odkaz Ze zahraničí v seznamu rubrik se změní snippet se seznamem článků.

/clanek/5/?rubrika=Ze zahraničí

V historii vyberu stránku „o dvě zpět“, měl bych se tedy dostat do stavu po 1.

tedy se dostanu na adresu /clanek/1/?rubrika=Domácí zvířata

Otázka je jak to vyřešit lépe. Protože se musí pokažde překleslit všechny odkazy. ;/