[dev] Code review VisualTag infantil
Catalin Francu
cata at francu.com
Wed Jul 31 12:38:57 EEST 2013
[Cc: dev]
Ok, acum am înțeles! Atunci mă bucur cu atât mai mult că te-ai prins cum să
folosești jCrop. Rămâne de văzut dacă îl vom folosi în interfața finală,
căci s-ar putea să nu mai avem nevoie să decupăm dreptunghiuri. De fapt,
lungimea textului determină lățimea dreptunghiului.
Din păcate, nu pot să rulez codul de la tine, căci îmi lipsește
visualTag.php. De-asta e mai simplu să-mi trimiți un diff. :-) Dar iată
niște observații:
- visualTag.ihtml: stilurile ar trebui separate într-un fișier css, fie
într-un fișier nou, visualTag.css, dacă va fi mult, fie în flex.css.
Flex.css este un amalgam cu tot CSS-ul din paginile de admin și am să-l
restructurez eu într-o bună zi cu soare.
- Pentru textele vizibile de utilizator, hai să folosim „etichetă” și
„etichetare”. Sună mai românește. :-) Știu că e ciudat să scriem cod cu
keywords în engleză și mesaje în română, dar există o separație destul de
clară.
- Etichetele <input ... /> se închid cu /> (ca și toate care nu vin în
pereche, ca <button>...</button>
- Nu îmi este clar unde stă modsVisualTag.php. Bănuiesc că tot în admin?
Practica noastră este să punem toată logica în visualTag.php, să nu facem
un fișier separat pentru salvare. Iar visualTag va începe fix cu aceste
if-uri pe care le ai tu, după care va continua cu codul în cazul în care nu
există parametri la salvare (pagina este încărcată prima oară).
- Dacă ai în continuare nevoie de redirectare, folosește util_redirect(). E
un pic mai deșteaptă, în special pentru că propagă mesajele de eroare
pentru utilizator.
În rest, fă-i commit. Abia aștept să mă joc cu interfața!
Cătălin
2013/7/30 Grigoroiu Marian Alexandru <grigoroiualexandru at gmail.com>
> Probabil nu am fost destul de explicit. Coordonatele nu trebuie introduse
> de către utilizator. Sub imagine am afișat coordonatele pentru a vedea care
> sunt și pentru a mă ajuta pe mine la debugging.
>
> [image: Imagini inline 1]
> Ele se actualizează automat când coordonatele selecției se modifică. Când
> utilizatorul e mulțumit de selecție, apasă pe butonul Setează Coordonatele
> și sunt preluate automat și completate câmpurile.
>
> [image: Imagini inline 2]
> Poate acum am reușit să fiu mai explicit cu imaginile. Pot încerca să fac
> și ceea ce zici tu, asta pentru un fine-tunning, dacă voluntarului nu i se
> pare ok partea cu selecția cu mouse-ul, sau la o eventuală editare a
> tagului.
>
>
> În data de 30 iulie 2013, 17:56, Catalin Francu <cata at francu.com> a scris:
>
> Salutare,
>>
>> E un început foarte bun!
>>
>> Aș vrea să trecem, ușor-ușor, spre o interfață mai ușor de folosit cu
>> mouse-ul. Anticipez că oamenii vor găsi greoaie o interfață unde trebuie să
>> introducă coordonate. În cel mai rău caz, putem folosi spinner<http://jqueryui.com/spinner/> de
>> la jQueryUI ca să facem o chestie hibridă, mouse + săgeți.
>>
>> Dar ce ziceți de designul ăsta: sub imagine sunt afișate tag-urile, unul
>> pe rând, și fiecare are două seturi de câte patru săgeți pentru mișcarea
>> poziției etichetei și a vârfului săgeții. Ceva cam așa (ASCII art):
>>
>> ^ ^
>> cornee < 223,455 > < 357,622 > [x] șterge
>> v v
>>
>> ^ ^
>> cristalin < 223,455 > < 357,622 > [x] șterge
>> v v
>>
>> Ideea e că nici nu vreau să ne omorâm cu Javascript monstruos, dar nici
>> să nu oferim o interfață prea spartană.
>>
>> Dacă pare prea complex, hai să ne vedem când puteți și tu și Radu și să o
>> batem în cuie. La mine calendarul e lejer de vineri încolo.
>>
>> Cătălin
>>
>> 2013/7/29 Grigoroiu Marian Alexandru <grigoroiualexandru at gmail.com>
>>
>>> Am făcut o interfață nu pe deplin funcțională a tăguirii. Ea arată cam
>>> așa:
>>>
>>> Se încarcă prima imagine din tabelul Visual care are 0 în coloana
>>> revised.
>>>
>>> [image: Imagini inline 1]
>>> Id-ul imaginii se încarcă automat. Sub imagine se actualizează
>>> coordonatele centrului selecției. Cu un click pe oricare dintre butoanele
>>> „setează” sunt copiate coordonatele în câmpurile alăturate. Odată salvate,
>>> tagurile vor apărea sub taguri salvate, cu opțiunea de a fi șterse.
>>>
>>> [image: Imagini inline 2]
>>> Mă gândesc și la opțiunea de editare. Odată cu click pe butonul Tăguirea
>>> este completă, imaginii i se va modifica la 1 valoarea din coloana revised
>>> și se va încărca următoarea imagine. Dacă toate imaginile au fost
>>> revizuite, va apărea mesajul:
>>>
>>> [image: Imagini inline 3]
>>>
>>> Cam atât deocamdată :D
>>>
>>> --
>>> Toate cele bune,
>>> Grigoroiu Marian Alexandru
>>>
>>> _______________________________________________
>>> Dev mailing list
>>> Dev at dexonline.ro
>>> http://list.dexonline.ro/listinfo/dev
>>>
>>>
>>
>
>
> --
> Toate cele bune,
> Grigoroiu Marian Alexandru
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://list.dexonline.ro/pipermail/dev/attachments/20130731/d09338a4/attachment-0001.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: visualTag2.png
Type: image/png
Size: 82076 bytes
Desc: not available
URL: <http://list.dexonline.ro/pipermail/dev/attachments/20130731/d09338a4/attachment-0005.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: postclick.png
Type: image/png
Size: 197388 bytes
Desc: not available
URL: <http://list.dexonline.ro/pipermail/dev/attachments/20130731/d09338a4/attachment-0006.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: preclick.png
Type: image/png
Size: 196730 bytes
Desc: not available
URL: <http://list.dexonline.ro/pipermail/dev/attachments/20130731/d09338a4/attachment-0007.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: visualTag3.png
Type: image/png
Size: 218945 bytes
Desc: not available
URL: <http://list.dexonline.ro/pipermail/dev/attachments/20130731/d09338a4/attachment-0008.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: visualTag1.png
Type: image/png
Size: 201001 bytes
Desc: not available
URL: <http://list.dexonline.ro/pipermail/dev/attachments/20130731/d09338a4/attachment-0009.png>
More information about the Dev
mailing list