Yahoo! User Interface Blog (YUIBlog)

Yui er at ansætte

April 29, 2011 kl 12:58 af Jenny Donnelly | I Udvikling , Frontend Engineering Jobs på Yahoo | 2 Kommentarer

Vi leder efter en højtstående frontend-ingeniør til at deltage i Yui hold! Du skal være ekspert i at JavaScript og velbevandret i forskellige front-end teknologier. Du elsker at løse komplekse problemer på en massiv skala, ved, hvad det tager at designe robuste og intuitivt API'er, og omfavne den bedste praksis af performance, sikkerhed, tilgængelighed og brugervenlighed. Du har også gode kommunikationsevner, besidder stor sans for detaljer, og er uafhængige og ressourcestærke.

Minimum Job Kvalifikationer:

• Expert-niveau JavaScript, HTML og CSS færdigheder.
• Dokumenteret erfaring bygning genbrugelige JS komponenter, der er modulopbygget, højtydende og vedligeholdes.
• En passion for byggeri og evangelisering et verdensklasse front-ende bibliotek, der påvirker millioner af mennesker hver dag.
• Kendskab til open-source software-projekter, især Yui.
• Computer Science grad eller tilsvarende erhvervserfaring.

Preferred Job Kvalifikationer:

• Påvist dybde af ekspertise på et eller flere front-end domæner såsom mobil, performance, server-side JavaScript eller internationalisering.

Hvis dette lyder som dig, så send dit cv og dække brev til Yui-job (at) yahoo-inc (dot) com.

Om Yahoo!

Tænk på at påvirke 1 ud af hver 2 personer online - i innovative og fantasifulde måder, der er unikt Yahoo!. Vi gør bare, at hver eneste dag, og du kan også. Efter alt, er det store tænkere som dig, der vil skabe den næste generation af internettet oplevelser for forbrugere og annoncører over hele kloden. Nu er det tid til at vise verden, hvad du har. Sæt dine ideer til at arbejde for over en halv milliard mennesker.

Yahoo! Inc. er en lige muligheder arbejdsgiver. For mere information eller for at søge alle vores åbninger besøg venligst http://careers.yahoo.com .

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!

Annoncerer Yui Compressor 2.4.6

April 26, 2011 kl 10:09 af Stoyan Stefanov | I Udvikling , ydeevne | 10 Kommentarer

Vi er glade for at annoncere den umiddelbare tilgængelighed af version 2.4.6 af Yui Compressor . Denne version indeholder primært opdateringer relateret til kompressorens håndtering af CSS minification og introducerer batch behandling af flere filer med en enkelt kommando.

CSS minification

Højdepunkter kan nævnes:

• Fast utallige fejl, der bryder kompressor og / eller de resulterende minified filer.
• Tilføjet dokumentation på, hvad præcis minifier gør, og også som CSS hacks det tolererer.
• Der er en JavaScript-havn CSS min i tilfælde er det mere egnet til din byggeprocessen. Her er også en test, web-UI , der bruger JavaScript-port, hvor man kan eksperimentere med minifier.
• Et betydeligt antal nye tests tilføjet (men du kan tilføje endnu mere ).
• Sikker håndtering af nogle CSS-funktioner, der får mere vedtagelse såsom medier forespørgsler og CSS3 transformationer.

Batchbehandling

En anden velkommen tilføjelse til Kompressoren er, at den nu kan håndtere partier af filer. Dette kan reducere den tid, din byggeprocessen tager, især hvis du har et stort antal filer til minify.

For eksempel følgende kommandoer minify alle .js og .css filer og skrive minified filer med en "-min.css" suffiks.

  $ Java-jar yuicompressor.jar-o '. Css $:-min.css' *. css
 $ Java-jar yuicompressor.jar-o '. Js $:-min.js' *. js 

Takket gå ud at Stephen Woods og Flickr holdet for denne funktion!

Links

Yui Compressor 2.4.6 er tilgængelig for umiddelbar downloades . Du er velkommen til at hjælpe os ud ved at indgive en bug eller anmodning om funktion , skriver flere test , forking koden eller deltage i samtalen .

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!

Retning-venlige Navigation Bar

April 25, 2011 kl 9:12 af Thierry Koblentz | I CSS 101 , Udvikling | 4 Kommentarer

Jeg har for nylig kom på tværs af en vandret navigations menu med højrestillet links. Som man kunne forvente, det var en liste element med float:right og listen elementer med float:left . Selv om der er noget galt med denne tilgang, det inspirerede mig til at benytte denne lejlighed til at drøfte direktionalitet til layout.

Udgifterne til flydende elementer

Flyder har intet begreb om direktionalitet, at de ikke virker som inline-elementer eller tabelkolonner (for hvilke dir attribut er en magisk kugle). Med flåd, skal forfatterne gennemføre en mekanisme til at "bytte" værdier, når det interface ændringer ( ltr vs rtl ).

Så i stedet for at bruge float , kan forfatterne til fordel inline-block . Her er et simpelt eksempel:

 ul { text-align: end; text-align: right\9; *text-align: right; } li { display: inline; } a { display: inline-block; padding: 5px 15px; margin: 0 5px; } 

Bemærk, at brug af " \ 0 "(uden mellemrum) i stedet for" \9 "ville tage sig af Opera, men kan ikke være så fremtidssikret som" \9 "(kun IE).

Da denne demo side viser, i Chrome, Safari og Firefox på inline-block teknik gør layoutet skrive-tilstand afhængig (retningen af flowet svarer til den værdi af dir attribut, eller den oprindelige værdi, hvis ingen retning er angivet). For andre UA s, og på grund af IE manglende støtte til den attribut vælgeren (dvs. html[dir="rtl"] ), har brug for forfattere til at tilføje en krog i opmærkningen at tage højde for ændringen af retning. For eksempel, for fuld A-grade kompatibilitet:

For flyderen teknik:

 .rtl ul { float: left; } .rtl ul li { float: right; } 

Til inline-block teknik:

 .rtl ul { text-align: left\9; /* IE8/9 */ *text-align: left; /* IE5/6/7 */ } 

text-align: start | end

I modsætning til left og right , start og end er ved at skrive-tilstand afhængig af søgeord. På engelsk, start kort til left og end kort til right . Under påberåbelse af start og end i stedet for left og right giver nogle browsere til at gøre det bytte ( ltr / rtl ) automatisk.

Forskelle mellem browsere og teknikker

I browsere, der ikke understøtter " start / end "(IE, Opera)

float teknik: swapping retning ændrer ikke noget

inline-block teknik: swapping retning ændrer ikke justeringen af ​​menuen, men links vises i den rigtige rækkefølge

I browsere, der understøtter " start / end "(Chrome, Safari, Firefox)

float teknik: swapping retning ændrer ikke noget

inline-block teknik: swapping retning er nok til at skifte retning både i menuen og links

Det er det! Næste gang du er nødt til at typografielementer vandret, skal du huske at give display:inline-block og display:table en prøve.

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!

Yui 3 "Building Blocks, moduler og programmer" Workshop kommer til Portland, og gratis!

April 19, 2011 kl 15:32 af Luke Smith | I Udvikling , Yui Events | 6 Kommentarer

Yui, sammen med Yahoo! Developer Network , er glade for at sponsorere en gratis Yui 3 "Building Blocks, moduler og programmer" Workshop på søndag, 1 maj, 2011 i Portland, Oregon. Dette er en fantastisk måde at kick-off din tid på JSConf , men du behøver ikke en JSConf billet til at deltage i workshoppen. Alle er inviteret til dette gratis arrangement!

Jeg får følgeskab af andre Yahoo! Gonzalo Cordero for en hel dag af hands-on træning, hvor du vil lære hvordan man opbygger stateful klasser, plugins og widgets ved hjælp af Yui 3 infrastruktur komponenter, pakke dem ind i genbrugelige moduler, og samle dem til en simpel applikation. Formiddagen klasse vil fokusere på, hvad de byggesten (såsom Base og Widget) har at tilbyde, og hvornår og hvordan du bruger dem. Om eftermiddagen vil klassen komme ind i mere avancerede klasse konfigurationer, opsætning af Loader til at kombinere din hostede moduler, og etablering af ansøgning controllere til at relatere dine forskellige modul klasser og API'er via brugerdefinerede begivenheder.

Pladsen er begrænset, så reserver din plads i dag på http://training.bocoup.com/PreJSConf-2011/

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!

Hurtig redigeringstilstand for Yui 3 DataTable

April 19, 2011 kl 03:20 af John Lindal | I Udvikling , Yui 3 Galleri | 1 Kommentar

Selvom Yui 3 DataTable har endnu ikke inline-redigering af de enkelte celler, er det relativt enkelt at implementere Quick Edit mode. Det QuickEdit plugin for DataTable i Yui 3 Galleri gør, at alle de synlige værdier i en DataTable, der skal redigeres på samme tid.

( Klik på screenshot for at spille med dette eksempel .)

Oversigt

Som med Yui 2-versionen , er den centrale idé med Quick Edit-tilstand for at udskifte alle cellen formatere med nye, som befolker cellerne med form elementer, fx indtastningsfelter eller rullemenuerne. Dette gøres ved start() kaldes, bygger på den konfiguration, der er beskrevet nedenfor. Når brugeren er færdig, kan du ringe getChanges() for at få de ændrede værdier og derefter fortsætter dem. For at forlade Quick redigeringstilstand, skal du ringe cancel() . (Det er opkaldt annullere i stedet for at holde op med at minde dig om, at det skiller sig af med alle ændringer.)

Siden Hurtig redigering galleriet modul er et plugin til DataTable, skal du sætte den ind på din DataTable før du kan bruge det:

 my_table.plug (Y.Plugin.DataTableQuickEdit);

Dette gemmer plugin i qe medlem af DataTable, så du skal ringe til plugin funktioner som denne:

 my_table.qe.start ();

Konfiguration

Hurtig redigering tilføjer to nye konfiguration attributter til alle kolonner: quickEdit og qeFormatter .

Hvis en kolonne er quickEdit ejendom er defineret, vil kolonnen være redigerbare i Quick Edit mode. At acceptere alle standardindstillingerne, kan du blot indstille quickEdit:true . For mere kontrol, kan du passerer et objekt med følgende egenskaber:

formatter

Cellen formaterings, der vil gøre en passende form felt: <input type="text">, <textarea> eller <Vælg>. Som standard, cellen formateringsplugin Y.Plugin.DataTableQuickEdit.textFormatter bruges til alle celler til at producere input elementer. For at få et textarea element, konfigurere en kolonne til at bruge Y.Plugin.DataTableQuickEdit.textareaFormatter i stedet.

validation

Validering konfiguration for hvert felt i kolonnen.

css

CSS klasser encoding grundlæggende valideringsregler:

yiv-required

Værdi må ikke være tomme.

yiv-length:[x,y]

String skal være på mindst x tegn og højst y tegn. Mindst én af x og y skal angives.

yiv-integer:[x,y]

Den integer værdi skal være mindst x og højst y . x og y begge er valgfri.

yiv-decimal:[x,y]

Den decimal værdi skal være mindst x og højst y . Eksponenter er ikke tilladt. x og y begge er valgfri.

fn

En funktion, der vil blive kaldt med DataTable som dens omfang og cellens form element som argument. Returnér sand hvis værdien er gyldig. Ellers ring this.displayMessage(...) til at vise en fejl og derefter vende tilbage falsk.

msg

Et kort af typer af beskeder, der vil blive vist, når en grundlæggende eller regex valideringsregel mislykkes. Den gyldige typer er: required , min_length , max_length , integer , decimal , og regex . Der er ingen standard for type regex , så du skal angive en besked, hvis du konfigurere en regex validering. Som standard fejlmeddelelser for de andre typer er gemt i Y.FormManager.Strings (leveret af galleri-formmgr-CSS-validering ) og kan blive overskrevet og / eller lokaliseret.

regex

Regulært udtryk, at værdien skal opfylde for at være gyldige.

Nogle gange skal en ikke-redigerbar kolonne gøres forskelligt under Quick Edit mode. Det bedste eksempel er en kolonne, der indeholder et link, da navigere væk fra den side, mens der i Quick Edit mode kan være katastrofale. Hvis du vil fjerne linket under Hurtig redigering, konfigurere qeFormatter for den kolonne, der skal Y.Plugin.DataTableQuickEdit.readonlyLinkFormatter . For e-mail-adresser, brug Y.Plugin.DataTableQuickEdit.readonlyEmailFormatter . Du kan også skrive din egen brugerdefinerede, read-only Formatter. Du skal blot følge de normale regler for at konstruere en DataTable celle Formatter.

Manglende Features

På grund af en fejl i Yui 3.3.0 DataTable , det td element videre til en kolonne Formatter er faktisk fra den foregående kolonne. Dette gjorde det alt for besværligt at støtte kopiere ned, hvor en knap i første række lader dig kopiere værdien ned til alle andre rækker.

Fejlen også krævede en fuldstændig omarbejdelse af de grundlæggende Hurtig redigering celle formatere for at vende tilbage tekst i stedet for at manipulere DOM. Dette er grunden til brugerdefinerede celle formatere er ikke officielt understøttet i denne første udgivelse. Hvis du er eventyrlysten, kan du stadig bygge dem, men husk på, at du bliver nødt til at omskrive dem, herunder tilføje til støtte for kopi ned, når fejl i DataTable er fast.

Om forfatteren: John Lindal ( @ jafl5272 på Twitter) er en af de ledende ingeniører bygge det fundament, som Yahoo! APT er bygget. Tidligere arbejdede han på Yahoo! Publisher Network.

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!

Yui: Åbningstider tor 21 april

April 19, 2011 kl 01:39 af Luke Smith | I Udvikling , Open Timer | No Comments

Yui fjernbetjening Loader service

For et stykke tid nu, Reid Burke har arbejdet på en Node.js baseret tjeneste til at fremskynde processen med at beregne og anmode om modul afhængigheder i Yui 3. Han fik det temmelig tæt på knappet op på dette tidspunkt, og ønsker at dele, hvad han har og få dine ideer til hvad der ville gøre det endnu awesomer.

Problemet

For et stykke tid nu, vi har kendt, at mens virkelig praktisk for udviklere, at Y.use( modules ,...) metoden indfører en unødvendig forsinkelse i spin op tidspunktet for din implementering kode. Det viser sig, at det er en masse arbejde beregning afhængighed træer, og metadata alene kan være belastende på den samlede hukommelsesforbruget af din side. Den traditionelle metode til inkludering af Yui frø fil ( yui-min.js ), derefter bootstrapping med YUI().use(...) first fortæller Yui at indlæse Loader modul, der er belemret med afhængighed metadata for hele biblioteket i dens kilde-så har Loader beregne den komplette liste af nødvendige moduler baseret på din use(...) erklæring på klientmaskinen.

Løsningen

Remote Loader Tjenesten flytter denne beregning til serveren, hvilket gør din kode initialisere hurtigere og reducere dit websted klient hukommelse profil, fordi de metadata og Loader er ikke længere nødvendige på klientmaskinen. Det fungerer også som den combo handleren, returnere alle de koder direkte i stedet for routing igennem til yahooapis combo tjeneste (mindre netværkstrafik), og er i stand til at blive etableret på en Node.js server på dit domæne.

Planen er at have Reid demo, hvad der virker i dag, herunder nogle ret imponerende statistik fra dens brug på yuilibrary.com , åbn derefter opkaldet til feedback og anmodninger. Kom og se, hvad fremtiden af ​​Yui Loader er at ligne!

Tid & Detaljer

Vi vil være online fra 10:00 til 11:00 PDT torsdag. Forbindelsen detaljer er de samme som normalt.

1. Ringe til 1-888-371-8922 (Skype fungerer fint for ikke-amerikanske deltagere *)
2. Indtast deltageren koden 47188953 #
3. Deltag i skærmdelingssession (dette vil bede dig om at installere Adobe Connect-plugin, hvis det er første gang du bruger det)

* - Hvis Skype ikke er en mulighed, e-mail mig eller fange mig (ls_n) i # Yui IRC-kanal på freenode til et lokalt nummer.

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!

Annoncerer Yui 2.9.0

April 13, 2011 kl 17:28 af Jenny Donnelly | I Udvikling | 10 Kommentarer

Den Yui team er glade for at kunne annoncere frigivelsen af ​​Yui-version 2.9.0. Yui 2.9.0 er den sidste bug fix release på Yui 2-kode linje mærkning dets overgang til vedligeholdelse mode. Bevæger sig fremad, forventer at se udgivelser bestående af kun kritiske fejlrettelser eller rettelser til browser-kompatibilitet problemer som følge af opdateringer til browsere i GBS . Vi er virkelig glade for at bedre at fokusere vores opmærksomhed på den kommende 3.4.0 frigivelse af Yui.

For at få et indtryk af de ændringer, der indgår i Yui 2.9.0, kan du gennemgå ReadMe Digest , som sammenfatter alle de tilføjelser, som komponent udviklere til deres respektive ReadMe-filer for denne udgivelse. Du kan også se listen over billetterne fast i Yui 2.9.0 for et resumé af fejlrettelser og udvidelsesanmodninger afsluttet i denne udgivelse.

Vi vil gerne minde alle om, at når vi begynder processen med afværgende Yui 2.x, vil alle udgivne versioner fortsat være vært på Yahoos CDN og kodebase vil fortsat blive forkable på GitHub.com .

Find samtaler: Bloglines | technorati

Del og udvide: Bookmark med del.icio.us | digg det! | reddit!