gdzie jest moje ciasteczko??

Czasami nie da sie inaczej i trzeba sięgnąć po cookie. Tak właśnie było tym razem. Prosta sprawa, user wchodzi na nasz portal, to zapamiętujemy w cookie stronę od której zaczął przeglądanie naszej witryny. Napisałam sobie prosty kod, bez żadnych bibliotek (takie coś na start, żeby mieć kod do refaktoringu i testowania rozwiązania). Pod Chrome i FF działa jak złoto, pod natywną Androidową przeglądarką również.

Pokazałam rozwiazanie naszemu seniorowi. Rzucił oczkiem i podpowiedział kilka usprawnień, m.in. wykorzystanie ścieżki ze zmiennej globalnej a nie wpisywanie jej z palca (biorąc pod uwagę fakt, że to było tylko dla jednego adresu, to co różnica?). Poprawiłam, przetetsowałam. Działa.

Jako, że rozwiązanie ogólnie przeznaczone jest tylko pod przegladarki mobilne, nie przykładałam specjalnej wagi do testowania na desktopowych. Sprawdziłam na wszystkich przeglądarkach zainstalowanych na moim HTC M8 - natywna, Chrome i FF. Działa jak złoto. Chciałam sprawdzaić pod Operą mini, ale złosliwa małpa nie chciała się łączyć z serwerem dev. Poszłam po inny telefon, to działu mobilnego. Tam na jakimś Samsungu postawili mi Operę mini, która też odmówiła współpracy. Olałam sprawę i wzięłam się za testowanie pod zwykłą Operą.

No i nie działa :(. Błędem nie rzuca, ale i nie działa. No pięknie... Jeszcze koleżanka, z którą robiłam pair programming sprawdziła na swoim WindowsPhone pod IE i też nie działa. No ki diabeł? Zostawiłam jak jest. Następnego dnia rano usiadłam do debuggowania. Modern.IE stoi na Virtualboxie, wiec wzięłam IE10 na tapetę i zaczynam debuggować. Linijka po linijce... i co? I jajo... cookie sie nie zapisuje. No jak to się nie zapisuje? - prowadzę monolog w duszy debuggując dalej. Krok po kroku testując różne ustawienia doszłam dlaczego to cookie się nie zapisuje...

Składnia jest banalnie prosta: document.cookie("nazwa=wartość");. Można ją rozszerzyć o datę ważności cookie: document.cookie("nazwa=wartość; expire=data") albo o ścieżkę dla której cookie jest ważne: document.cookie("nazwa=wartość; expire=data; path=ścieżka"). I to właśnie ta ścieżka była przyczyną problemów dla Opery i IE. Używałam ścieżki pełnej, branej ze zmiennej globalnej: http://server-name.domain.com/costam/ co okazało się zupełnie niestrawne dla tych dwóch przeglądarek. Obie wymagają podania ścieżki zaczynając od /, czyli bez domeny.

Oczywiście jaśnie oświecona Opera, ani tym bardziej IE nie dały nawet pół błędu, nic. Po prostu nie zapisywały cookie...

CSS Flexible box layout module - part 7 - Conclusions and links

Conclusions

CSS flexible box layout module is an amazing tool to make web pages flexible without any calculations. It makes our containers just fit to the available space and act as we want them on different screen sizes. It will take some time as browser vendors will implement all features and we could use it without vendor prefixes. But it is worthy to wait and read about flexbox, to find callbacks for older browsers to make it ready to use as fast as possible.

Links

It doesn't make any sense to copy information from some useful sites. Please check this links and enjoy all opportunities flexbox provides!

http://www.w3.org/TR/css3-flexbox/ (official specification)

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes

http://umaar.github.io/css-flexbox-demo/

http://caniuse.com/flexbox (which browsers support flexbox)

http://css-tricks.com/using-flexbox/ (vendor prefixes tables)