« 1 2 3 4 5 »
Autor Zpráva
Kubo2
Profil
Živá ukázka

Str4wberry:
Narazil som na divné chovanie.
Keď z mobilu píšem do CSS v tvojom nástroji na živé ukážky, všetko ide hladko, až kým nechcem napísať nejaký špeciálny znak (najčastejšie začiatočnú množinovú zátvorku {). Veď sa pozri sám:



Napísal som div, ale akonáhle som k nemu chcel pripísať štýl, množinová zátvorka mi vyvolala select-text-kurzor a zablokovala klávesnicu, takže do toho potom nešlo napísať už nič ďaľšie, ani normálny text.
EDIT: Testoval som to a nefunguje to ani v sekcii (či ako to mám nazvať) pre JavaScript ani HTML.

Neviem, alebo si netrúfnem povedať, čo to môže spôsobovať, ale je to dosť otravné a hlavne obmedzujúce.
Nepredpokladám, že sa to bude dať nejak opraviť, takže sa pripájam k Chamurappiho názoru zjednodušiť spôsob zadávania pre mobily, alebo tie sekcie nahradiť obyčajnými textareami so zachovávaním odsadenia predošlého riadku + ponechať pripojený Emmet, pretože ten funguje.

BTW, používam Hacker's Keyboard, pre prípad že by táto informácia mohla byť/bola nápomocná.
// mobil
Str4wberry
Profil
Pro mobily by to asi chtělo vůbec jiné rozvržení.

Jinak zkusil jsem updatovat CodeMirror (zvýrazňovač syntaxe). Nepomohlo to náhodou?
Kubo2
Profil
Str4wberry:
Nič sa nezmenilo. CodeMirrorom to asi nebude.
Str4wberry
Profil
Tak jsem zkusil udělat to vypínání CodeMirroru. Je na to tlačítko a mobilní user-agent by mohl být přepnut rovnou. Emmet by šlo teoreticky zachovat, ale ta obyčejná varianta vyhazovala ve starších IE nějakou chybu. A nevím, jestli má cenu to zkoumat.
Kubo2
Profil
Str4wberry:
Tak jsem zkusil udělat to vypínání CodeMirroru. Je na to tlačítko a mobilní user-agent by mohl být přepnut rovnou.
Vďaka.
Už som to v mobile stihol aj otestovať, ale nejako som sem zabudol napísať. Funguje to perfektne :-)
S tým emmetom je to škoda, nejako som si ho v poslednom čase obľúbil.
Str4wberry
Profil
A to ty ukázky tak často píšete na mobilu, nebo chcete i ve velkém prohlížeči režim bez barvení (ale s Emmetem)?
Kubo2
Profil
Str4wberry:
A to ty ukázky tak často píšete na mobilu, nebo chcete i ve velkém prohlížeči režim bez barvení (ale s Emmetem)?
Keď mám byť úprimný, tak väčšinu času navštevujem diskusiu a píšem ukážky z mobilu (v škole cez prestávky), cez pracovný týždeň nemám čas zapnúť počítač, ak nejde zrovna o nejaký školský projekt alebo také niečo. Emmet sa hodí hlavne na mobile pri dlhších kódoch, pretože mi stačí napísať jeden riadok, Tab a mám hneď desať-pätnásť riadkov samplekódu (poznáš).

Na velkom monitore zvýrazňovanie asi nie je potreba vypínať, ale občas sa to hodí vypnúť, zvlášť keď mám v prehliadači otvorené štyri okná krát pár desiatok kariet, pretože zrovna vtedy to občas veľmi pekne zamrzne a prehliadač začne vyskakovať, že vraj stránka nereaguje :-)
To potom väčšinou už nevyrieši ani refresh, a pre prípad, že by sa stratil aj obsah localStorage, si musím urobiť screen, keďže kódy sa nedajú ani skopírovať.
Emmet za to predpokladám nemôže, skôr ten CodeMirror (oprav ma prosím, ak sa mýlim). Ale pre niektoré ojedinelé prípady (tým myslím fyzických návštevníkov) sa možno hodí aj tlačítko Vypnúť Emmet či niečo také. Ale naozaj iba možno.
Str4wberry
Profil
OK, tak jsem tam dal podmínku pro IE 8 a starší a jinde by tedy měl Emmet fungovat i při vypnutém barvení.
Kubo2
Profil
Str4wberry:
To je bezva, akurát teraz to (na mobile) funguje asi nasledovne:
1) Zadám p, Tab pri vypnutom editore, tak mi to pre zmenu prepne focus do políčka pre zadávanie CSS,
2) Zapnem editor, spravím to isté, funguje to. To ale nie je koniec:
3) Skúsil som aj zložitejšie konštrukcie ako p{...}+p{...}+p{Hallo Welt}, Tab a výsledok bol, že mi značná časť tej skratky ostala nedotknutá a iba z textu Hallo Welt sa mi stalo toto: Hallo <Wel></Wel>t

To je fakt zvláštne chovanie.

Pozn.: Tú zložitejšiu konštrukciu som si musel napísať s vypnutým editorom a po zapnutí mi to urezalo posledný znak.
Chamurappi
Profil
Reaguji na Str4wberryho:
Teď mají <textarea> v Exploreru 7 nějakou divnou výšku.

A to ty ukázky tak často píšete na mobilu
V mobilních prohlížečích nejsou JS konzole, ani Firebugy. Na rychlé pokusy se to tedy hodí i v telefonu.
Momentálně mi v mobilním Exploreru 9 nevyjíždí ani klávesnice a v mobilním Exploreru 10 sice psát můžu, ale neaktualizuje se výsledek.
Str4wberry
Profil
Reakce na Kuba2:
Hm, zvláštní. Ten Emmet na jecas.cz ve stejném prohlížeči funguje?


Reakce na Chamurappiho:
Výška byla bez barvení kódu, myslím, divná vždycky. Teď to jen umocňuje to barevné pozadí.

Nelichotivá situace v mobilních Explorerech nastala hned po možnosti vypnutí barvení, nebo až teď při připojení Emmetu?
Kubo2
Profil
Str4wberry:
Nie, nefunguje ani tam. Najpr som mal podozrenie, že sa emmet z nejakého dôvodu nenačítal, ale po reloade sa nič nezmenilo. Úplne rovnaké chovanie, iba hodí focus a odroluje ma to k inému inputu.
Chamurappi
Profil
Krom standardního režimu by v HTML bloku mohl jít zapínat i <meta name="viewport" content="width=device-width">.

Občas si říkám, že by se hodila nějaká indikace, že se výsledek po poslední úpravě skutečně přegeneroval (protože některé změny třeba jsou neočekávaně neviditelné). Ale nic chytrého mě nenapadá, asi je to jedno.


Reaguji na Str4wberryho:
Nelichotivá situace v mobilních Explorerech nastala hned po možnosti vypnutí barvení, nebo až teď při připojení Emmetu?
Netuším, v mezidobí jsem na to z mobilu nekoukal.

„Neplánuješ zavést i nějaký způsob, jak uloženou ukázku dodatečně editovat či smazat?“
Je takový problém uložit kód znovu?
Není, ale zbytečně ti tím obsazuji adresy. Navíc si ty chybné verze někdo může zobrazit.
Šlo by to udělat tak, že dokud uložený kód nemá přiděleného referera, mohl by ho autor dalším ukládáním v témže prohlížeči přepisovat (v nějakém hidden poli by bylo vygenerované heslo).
Str4wberry
Profil
Krom standardního režimu by v HTML bloku mohl jít zapínat i <meta name="viewport" content="width=device-width">.
Dobrý nápad. Přidal jsem. Pojmenoval jsem to jako „Mobilní zobrazení“, což je sice zavádějící, ale nic lepšího, co by se pod režim vešlo, mě nenapadlo.

Šlo by to udělat tak, že dokud uložený kód nemá přiděleného referera, mohl by ho autor dalším ukládáním v témže prohlížeči přepisovat (v nějakém hidden poli by bylo vygenerované heslo).
1) Adres je dost. Pokud dobře počítám, tak i při současném růstu užívání budou následujících 10 let stále identifikátory čtyřmístné. Krom toho se můžou neorefererované a nenavštěvované ukázky časem smazat a jejich URL se může recyklovat.
2) Aby nešlo chybné ukázky zobrazit, musely by se přepisovat. Což by zrušilo současné primitivní versováním, kdy se dají starší podoby kódu vylovit z historie prohlížeče. Musely by se tedy asi zavést jakési uživatelské profily, čímž se mi zatím nechce kod.djpw.cz komplikovat.
Chamurappi
Profil
Reaguji na Str4wberryho:
Dobrý nápad. Přidal jsem.
Děkuji.

nic lepšího, co by se pod režim vešlo, mě nenapadlo
Což takhle „Mobilní <meta>“? Přišlo by mi to takové doslovnější. Neznalá osoba stejně nebude vědět, co to je, takhle by to pochopila alespoň ta znalá.

Když lidé odkazují na ukázky z diskuse, tak (zatím jen v sandboxu) se sice umí vytáhnout <title> ukázky, ale málokoho napadne ho dovnitř HTML bloku vyplnit. Nebylo by dobré při ukládání nějak ponouknout uživatele k tomu, aby ukázku pojmenoval? Na mě by to určitě zabralo.

Párkrát se mi stalo, že jsem instinktivně zmáčkl Ctrl+S, protože jsem na to zvyklý z jiných editorů, kam píšu zdrojáky, ale uložit ukázku na server jsem rozhodně nechtěl. Co jsem tak procházel po sobě uložené ukázky, možná nejsem jediný, kdo nechtěně ukládá. Kdyby vyskočil prompt tázající se na <title>, vyřešilo by to i tohle (ačkoliv jak říkáš, zaplnění adres nehrozí).


Teď jsem vyrobil zajímavou živou ukázku :-)
Někdy zkusím, co je potřeba upravit, aby to fungovalo v mých telefonech.
Str4wberry
Profil
Proběhl menší update.

1) Počet alertů, které se mohou najednou vypsat, je omezen na 10, aby nezaplnily celou stránku.

2) Byla přidána funkce „Načíst URL“. Co dělá? Stáhne HTML kód zadané stránky a hodí do něj <base href>, který zajistí načtení obrázků/stylů/skriptů. Potom je možné ke stránce přidat standardním způsobem další CSS/JS (vloží se až na konec, aby se daly pohodlněji přebíjet styly). Živá ukázka.

3) Napadlo mě vytvořit režim, kde půjde (drag & drop) přesouvat všechny prvky na stránce pro pohodlné a rychlé testování různých rozvržení. Tento režim se dá vyvolat přidáním dalšího spojovníku za adresu. Diskuse JPW. Je to jen prototyp a nevím, jestli ho nechám. Nápad vypadal lépe než realisace.

Jsem si vědom, že současné rozhraní vypadá dost nehotově. Plánuji někdy vytvořit vysouvací menu.
Chamurappi
Profil
Poslední dobou narážím na docela vážné potíže s kompatibilitou:
1) Už delší dobu nefunguje aktualizace výsledku v Exploreru 8 a včera jsem zjistil, že nefunguje ani v devítce (dříve jsem se domníval, že jde o lokální problém jednoho PC), takže v těchto prohlížečích je to úplně nepoužitelné.
2) V jedenáctce se mi při zapnutém barvení občas stává, že při přepnutí z adresního řádku do jednoho z bloků nedostává blok skutečný focus. Kurzor se zdánlivě přesune tam, kam jsem klikl, hezky tam ta jeho napodobenina bliká, ale když začnu psát, píšu dál do adresního řádku.
3) V této ukázce si (minimálně) v Explorerech 10 a 11 neodpovídají viditelný a označovaný kód. Vidím zalomení v src jinde, než ve skutečnosti je, takže při pokusu o zkopírování adresy kopíruji něco úplně jiného.

Celkově vzato mi tamní obarvovač syntaxe docela dost pije krev, včetně doplňování uvozovek a závorek (třeba přepsat u atributu uvozovky na apostrofy je docela fuška). Při vypnutém obarvování je ve všech prohlížečích prakticky nemožné psát do JS bloku, protože jakmile se v kódu zjistí JS chyba, začnou se stornovat všechny klávesnicové události. V Exploreru 8 nejde při vypnutém barvení psát do žádného z bloků nikdy.


Reaguji na Str4wberryho:
Byla přidána funkce ‚Načíst URL‘.
Na první pohled jsem nevěděl, čím zadanou adresu potvrdit. Moc se mi nezamlouvá, že se načtená stránka rovnou i uloží jako živá ukázka — většinou si ji asi člověk načte proto, aby v ní udělal nějaké úpravy, takže to prvotní uložení bude nejspíš vždy zbytečné.
Mám se ještě zabývat nacucávacím bookmarkletem, který jsem začal tvořit v létě, nebo považuješ tento druh načítání za dostatečný? U svého nacucávacího bookmarkletu jsem plánoval i možnost nahradit texty za lorem ipsum, taková schopnost by se hodila asi i u té tvé funkce. Krom <base> bys do HTML mohl přidávat i zákaz indexování.

Tento režim se dá vyvolat přidáním dalšího spojovníku za adresu.
Nebylo by lepší zvolit jiný znak? Když budeš přidávat další a další režimy, budou adresy s mnoha spojovníky nehezké. Navíc některé redakční systémy nahrazují dva spojovníky za typografickou pomlčku.

Nápad vypadal lépe než realisace.
To věřím. Asi by tomu pomohl nějaký druh mřížky, při načtení by se mohly omrknout hrany elementů a pak by se k těmto původním pozicím hran mohly přetahované elementy přichytávat. A nebo ještě jiná věc — když člověk přetahuje element ve skoro vodorovném nebo skoro svislém směru, mohl by se úhel posunu zaokrouhlit.
nemeja
Profil
Str4wberry:
3) Po přetažení jakéhokoliv prvku, v tvé ukázce, se mi po onmouseup přesměruje na originální stránku - IE11.0.2 a FF29.0a1 - Opera, Safari a ani Chrome tento problém nemají.
Str4wberry
Profil
Reakce na Chamurappiho:
Celkově vzato mi tamní obarvovač syntaxe docela dost pije krev, včetně doplňování uvozovek a závorek (třeba přepsat u atributu uvozovky na apostrofy je docela fuška).
Přepsat uvozovky by byla fuška právě bez něj. :–) S ním stačí původní uvozovky vymazat, označit text, který se má oapostrofovat, a zmáčknout apostrof. Hotovo.

Ta nekompatibilita mě taky štve. Zkusím vytvořit čistou a funkční variantu bez barvení.

Moc se mi nezamlouvá, že se načtená stránka rovnou i uloží jako živá ukázka — většinou si ji asi člověk načte proto, aby v ní udělal nějaké úpravy, takže to prvotní uložení bude nejspíš vždy zbytečné.
Proč ti pořád vadí to zbytečné ukládání? :–) Na disk se toho vejde dost a kdyby ne, tak není problém nepoužívané ukázky odstranit.

Mám se ještě zabývat nacucávacím bookmarkletem, který jsem začal tvořit v létě, nebo považuješ tento druh načítání za dostatečný?
Nevím, osobně bookmarklety nepoužívám (obtížně se synchronisují napříč prohlížeči).

Nebylo by lepší zvolit jiný znak?
Bylo. Ale další spojovník mě napadl jako první a byl jednoduchý na realisaci. Pokud bych tuto funkci uznal za užitečnou, změní se to na něco lepšího.


Reakce na nemeju:
To je asi problém použitého zvýrazňovače (CodeMirror). Třeba to opraví.
juriad
Profil
Str4wberry:
Jsem paranoidní a ve svém IDE každých pár sekund / pár řádek zmáčknu Ctrl+S. A jelikož se kod.djpw.cz blíží pokročilému editoru, občas se neudržím a uložím několikrát nefunkční (nedopsanou) ukázku.

Občas ukládám nedokončenou ukázku proto, abych se podíval pořádně na nové stránce a ne v malém iframu, který občas Firebug nedobře prochází (někdy odmítá hledat element a musím strom rozbalovat ručně).
Str4wberry
Profil
Však to medle ničemu nevadí. (Tedy Chamurappimu z nějakého důvodu ano.)

Snad možná by se uložení mohlo provádět AJAXem, aby neresetovalo umístění cursoru, funkci zpět a podobně.
Chamurappi
Profil
Reaguji na Str4wberryho:
S ním stačí původní uvozovky vymazat, označit text, který se má oapostrofovat, a zmáčknout apostrof.
Já označím uvozovku, zmáčknu apostrof a vznikne mi uvozovka obalená dvěma apostrofy, obojí označené => musím označit uvozovku a apostrof a smazat je. Během této akce se mi pochopitelně řádku přebarví na něco jiného a odsune se, takže se mi hůř hledá druhá uvozovka, u které pak absolvuji stejné martýrium.

Proč ti pořád vadí to zbytečné ukládání? :–)
Ono může být nežádoucí, aby existoval záznam. Třeba tam testuji skripty obsluhující vodíkovou bombu, nebo něco ještě víc osobního.
A i když to není nic důvěrného, přirovnal bych to k situaci, kdy si člověk při telefonování bezmyšlenkovitě čmárá kytičky na noviny a kolem něj nadšeně skáče fotograf, který si ty výkresy fotí :-)
Na druhou stranu chápu, že provozovatel služby může mít chuť syslit si všechno. Já také prvních pár let nesmazal ani bajt z toho, co bylo validováno českým validátorem :-)

V reakci na nemeju: „To je asi problém použitého zvýrazňovače (CodeMirror).
Myslím, že mluvil o té interaktivní ukázce se dvěma pomlčkami. Také se mi to tam děje, když přetahuji třeba odkazy.


Reaguji na juriada:
Občas ukládám nedokončenou ukázku proto, abych se podíval pořádně na nové stránce a ne v malém iframu
To by šlo bez ukládání udělat tak, že se na uživatelův pokyn otevře nové okno a dokument se vepíše do něj, místo do rámu.
Vedle bloku pro výsledek by mohl být také vyklápěcí panýlek s nastavováním, kde by mohla být dostupná tato funkce pro nové okno + jak jsem zmiňoval dříve, odzoomování a u Explorerů přepínač režimů. A případně i mobilní zobrazení, které by nastavilo zoom na 320px/šířka rámu.
Str4wberry
Profil
Proběhly změny.

Živá ukázka

1) Vyhodil jsem CodeMirror a nahradil ho Ace editorem. Funkčně je to skoro jako Sublime Text — je možné umístit více kursorů (psát na více míst najednou), fungují snippety, napovídání kódu, prohazování výběru přes Ctrl + T a podobně. Osobně jsem z toho nadšen.

2) V IE 9 a starších + mobilech by se Ace editor neměl načíst, ale stále by mělo jít psát do <textarea> s automatickým spouštěním.

3) Snad se povedlo opravit fungování v IE 7 a IE 8.

4) Cizí stránka se při načtení rovnou neukládá.


Reakce na Chamurappiho:
Já označím uvozovku, zmáčknu apostrof a vznikne mi uvozovka obalená dvěma apostrofy
Nový editor už tohle nedělá.

Ono může být nežádoucí, aby existoval záznam.
OK

Na druhou stranu chápu, že provozovatel služby může mít chuť syslit si všechno. Já také prvních pár let nesmazal ani bajt z toho, co bylo validováno českým validátorem :-)
Takovou chuť provozovatel nemá.
Str4wberry
Profil
5) Zkusil jsem vytvořit provisorní přepínač pro různá rozvržení (vpravo nahoře). Co na to říkáte? Mělo by se rozvržení ukládat k ukázce, nebo u uživatele?
nemeja
Profil
Str4wberry:
5) Líbí se mi to, hlavně rozvržení 3 okna vedle sebe a pod tím vykreslování :-) Ukládal bych to asi u uživatele, rád bych si to nastavil defaultně, abych to nemusel pokaždé překlikávat.
Kubo2
Profil
Str4wberry:
Osobne by som ešte prijal ďaľšie rozvrhnutie podobné tomu s veľkým oknom vpravo a HTML+CSS pod sebou vľavo, akurát narozdiel od toho by veľké okno mohlo byť vľavo a HTML+JS vpravo :-)
Str4wberry
Profil
Asi nejlepší by bylo umožnit jednotlivá okýnka pro kódy přepínat. Tj. zvolit si základní rozvržení a potom si zobrazit jen okna, která jsou potřeba.
Kubo2
Profil
Str4wberry:
zvolit si základní rozvržení a potom si zobrazit jen okna, která jsou potřeba.
To považujem za veľmi dobrý nápad, asi by to tak bolo najlepšie.
Tori
Profil
Taková drobnost - když si otevřu uloženou ukázku, písmo je nejdřív bílé na šedém pozadí, pak na chvíli problikne černé písmo na bílém, a pak se zobrazí už správně obarvený kód zpátky na šedém pozadí. Dalo by se nějak odstranit to probliknutí do bílého pozadí? Ve dne mi to nevadí, ale když je v místnosti šero, tak je to docela pecka na oči.
↓ Ano, všimla jsem si toho v Chrome. Pardon, zapomněla jsem napsat.
Str4wberry
Profil
Díky za připomínku. Používám kod.djpw.cz hlavně v Opeře, kde se to neděje. Zkusil jsem to v Chromu a je to fakt síla. Snad to půjde nějak opravit.
« 1 2 3 4 5 »

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0