Yahoo! användargränssnitt Blogg (YUIBlog)

YUI Theater - Jeff Craig: "Avmystifiera Loader: Avancerad Modulkonfiguration" (31 min.)

December 16, 2011 kl 10:10 am av Ryan Grove | I Utveckling och YUI Theater | Inga kommentarer

I detta prat från YUIConf 2011, Meebo ingenjör och YUI bidragsgivare Jeff Craig ( @ foxxtrot avslöjar) allt du alltid velat veta om YUI Loader men var rädd för att fråga. Detta är ett måste-se för alla att göra prestandakritiska arbete med YUI 3.

Länkar

• Visa i HD på YouTube
• Slides
• Full YUIConf 2011 spellista på YouTube

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!

YUI: Öppettider Tors Dec 15th

December 13, 2011 kl 11:59 am av Eric Ferraiuolo | I Utveckling och Öppettider | Inga kommentarer

YUI 3.5.0 PR1

YUI 3.5.0 PR1 finns nu ! Detta är den första av tre förhandsvisning meddelanden för 3.5.0.

För detta Öppettider vi kommer att lyfta fram vad som finns i PR1 och diskutera hur du kan engagera dig för att se 3.5.0 är bergfast. Vi kommer också att be för en show-of-händer från de fantastiska utvecklare som har redan börjat använda 3.5.0 PR1 (som är på CDN ). Kom torsdag, inte fastna med handen ner :)

Även den YUI biblioteket Staging webbplats har uppdaterats med de senaste bruksanvisningar och API docs, och som svar på feedback från de senaste Öppettider , är vi nu med hjälp av vår GitHub wiki för att spåra pågående utvecklingssamtal .

Inspelning

Inspelningen är tillgänglig på YUILibrary YouTube kanal .

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!

App ramverksförändringar i YUI 3.5.0

December 12, 2011 kl 03:40 av Ryan Grove | I Utveckling | 1 kommentar

Sedan den första utgåvan av App ramprogrammet i YUI 3.4.0, har vi varit förvånad över hur snabbt det har antagits. I projekt stora och små , ​​har båda lång tid YUI användare och de som är helt ny på biblioteket har entusiastiskt med App Framework s MVC-komponenter och ge bra feedback och felrapporter. Tack!

I YUI 3.5.0 kommer App ramprogrammet får många buggfixar och några större förbättringar. Eric Ferraiuolo omfattade många av de kommande förändringarna i hans fantastiska YUIConf tal , men vi vill lyfta fram dem här också så du vet vad som kommer och vad du bör förbereda för om du planerar att uppgradera App Framework-baserad kod från 3.4.x till 3.5.0. Dessa förändringar är redan i YUI 3.5.0 PR1 , som släpptes idag, är så nu en bra tid att börja testa dem.

Y.Controller är nu Y.Router

"Controller" var ett dumt och förvirrande namn på en komponent som verkligen befattar sig mer med URL-baserad routing, särskilt med tanke på mer traditionellt controller-liknande roll som Y.View spelar. Vi har beslutat att bita ihop och byta namn på Y.Controller klassen Y.Router i 3.5.0. Y.Controller kommer att bli ett alias för att bevara bakåtkompatibilitet, men detta alias så småningom tas bort, så du bör uppdatera din kod för att referera till det nya namnet.

Ny rutt handler signatur

Metoden signatur för funktioner rutter hanteraren i Y.Router har förändrats något för att göra det mer likt Express och göra routerns API mer naturlig när den används på servern (en funktion vi arbetar på för 3.5.0).

Tidigare fick en rutt hanterarfunktion två argument: req (begäran objekt) och next (en funktion). I 3.5.0 kommer dirigera hanterar få tre argument: req , res (ett svar objekt) och sedan next .

För att uppnå bakåtkompatibilitet, den nya res är argumentet också en funktion som beter sig exakt som next , så gammaldags rutten hanterare som förväntar next som en andra arg kommer att fortsätta att fungera bra i 3.5.0. Men denna kompatibilitet shims så småningom kommer att tas bort, så inte vänta för länge med att uppdatera din kod.

Vissa egenskaper är nu attribut

Vi experimenterade med en inte-helt-YUI-liknande stil med egenskaper för konfigurerbara alternativ i App Framework komponenterna i 3.4.0, men detta visade sig vara lite förvirrande och mer än lite begränsande, eftersom fastigheter inte omfattas från förändring händelser, set och validerare som attribut gör. Så i 3.5.0, vi omvandlar många av dessa egenskaper till attribut.

Tyvärr är denna förändring inte bakåtkompatibelt, kan så befintlig kod som använder Y.Controller (numera Y.Router) eller Y.View måste uppdateras. Specifikt Y.Router är html5 , root och routes fastigheter är nu attribut och Y.View 's container , model och modelList fastigheter är nu attribut också.

Utöver detta Y.View 's container behandlar attributet nu strängvärden som CSS selektorer används för att hitta noder på sidan. I 3.4.x, antog den ett strängvärde representerad rå HTML som bör omvandlas till en nod. För att få det gamla beteendet, bara ändra inställningarna för ditt HTML strängvärden från '<div>foo</div>' till Y.Node.create('<div>foo</div>') .

Dokumentation för 3.5.0 PR1

Work-in-progress dokumentation för dessa förändringar och andra förändringar i YUI 3.5.0 PR1 finns på vår iscensättning hemsida . Här är några länkar till relevant iscensättning docs som innehåller information om App Framework deprecations i 3.5.0 och detaljer om hur du uppgraderar din kod:

• Routern
• Visa

Observera att innehållet på stage.yuilibrary.com speglar pågående arbete som pågår och kan vara ofullständig eller ens tillfälligt knäckas så vi testar nya saker. Du kommer alltid att hitta dokumentation för den senaste stabila utgåvan på vår produktionsanläggning, yuilibrary.com .

Vad är nytt?

I det här blogginlägget har jag sammanfattat de viktigaste deprecations kommer till App Framework i 3.5.0, men det finns också massor av funktionsförbättringar och under-hood buggfixar. För en komplett lista över App Framework förändringar i 3.5.0 PR1, rådfråga HISTORIK filen .

Titta även efter ett blogginlägg från Eric Soon Om Y.App, en fantastisk ny hög nivå komponent i App Framework som sveper fram URL-baserad routing och visa ledningen i en enda enkel att använda API som kommer få dig från noll till ett fungerande tillämpning på nolltid.

Vi hoppas att du älskar förhandsversion, och vi vill gärna höra från dig! Du kan skicka oss feedback på forumen , i en felrapport , på Twitter , på # Yui IRC kanal på Freenode, eller bara i kören här med en kommentar.

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!

YUI 3.5.0 PR1 är nu tillgänglig

December 12, 2011 kl 3:36 pm Allen Rabinovich | I Utveckling | Inga kommentarer

YUI 3.5.0 Förhandsgranskning Release 1 har satts in för testning och feedback från utvecklare. Du hittar den på Yahoo! CDN på yui.yahooapis.com/3.5.0pr1/build/yui/yui-min.js eller ladda ner en zip-fil om du planerar att vara värd det själv.

Den samlade förändringar som införs i PR1 finns på vår GitHub Wiki. Dessutom kan du granska listan över biljetter som lösta i den här versionen .

Work-in-progress bruksanvisningar och API docs för 3.5.0 finns på vår iscensättning webbplats, men se upp att dessa docs kan vara ofullständig eller till och med sönder, eftersom det är där vi testar nya saker. Officiell docs efter den senaste stabila versionen kan alltid hittas på vår produktionsanläggning, yuilibrary.com .

Fler ändringar kommer att införas i de kommande förhandsgranska utsläppen av YUI 3.5.0, vissa av dem är just nu i utvecklarnas egna filialer och finns för första granskning via följande pull önskemål:

• Nya DataTable Arkitektur och genomförande
• Nya knappen modulen

Att lämna felrapporter mot den här versionen, besök vår systemet felrapporteringssystem . Om du vill ge synpunkter på dessa och framtida moduler är de pågående diskussionerna om olika ämnen som rör 3.5.0 utsläpp sker på vår GitHub wiki.

Om allt går enligt planerna hoppas vi att släppa YUI 3.5.0 PR2 den 30 januari 2012. Trevlig helg!

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!

YUI Theater - Allen Rabinovich: "YUI Kalender - En studie av Bygga Moduler med Style" (47 min.)

8 december 2011 kl 13:02 av Ryan Grove | I Utveckling och YUI Theater | Inga kommentarer

I detta prat från YUIConf 2011, YUI ingenjör Allen Rabinovich ( @ allenr aktier) den process han brukade arkitekt och bygga den nya kalendern widgeten i YUI 3, och förklarar hur du kan använda en liknande process för att bygga dina egna widgets. Han visar också av den nya komponenten och avslöjar en smart prestanda trick som används för att påskynda rendering av flera kalendrar.

Länkar

• Visa i HD på YouTube
• Full YUIConf 2011 spellista på YouTube

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!

YUI Theater - Pat Cavit: "Automatisera Webbplats optimeringar" (32 min.)

6 december, 2011 kl 2:58 pm Ryan Grove | I Utveckling och YUI Theater | 2 kommentarer

Pat Cavit ( @ tivac ), ett gränssnitt ingenjör på ArenaNet och en aktiv YUI bidragsgivare och gemenskap medlem, anslöt oss på YUIConf 2011 för att ge detta prat på att automatisera bygg-time webbplats optimeringar som fil sammanlänkning, minimeringsmodulen, byta namn, och mer med hjälp av Ant byggverktyg.

Länkar

• Visa i HD på YouTube
• Full YUIConf 2011 spellista på YouTube

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!

I YUI 3 Gallery: Bulk Editor Widget

5 december, 2011 kl 13:01 av John Lindal | I Utveckling och YUI 3 Galleri | Inga kommentarer

Den Snabbediterare plugin för YUI 3 DataTable gör det enkelt att redigera en hel sida av poster som en atomär operation. Men ibland måste du göra ännu mer. Till exempel, du kanske att samtidigt redigera fler poster än du bekvämt får plats på en enda sida. Eller du kanske behöver stöd för att lägga till, duplicera och ta bort poster som en del av atomär operation. Eller du kanske vill visuellt gruppera områden genom att placera dem i en enda tabell cell. Den Bulk Editor widgeten stöder alla dessa möjligheter.

( Klicka på screenshot för att spela med detta exempel .)

Översikt

Den Bulk Redaktör widget består av tre komponenter:

Data source

Detta sveper en YUI DataSource och hanterar förändringar: insättningar, flyttning och ändrade värderingar.

Base widget

Detta ger den grundläggande strukturen för redigering genom att hantera poster och fält inom varje post. Härledda klasser är ansvarig för att göra varje post i en separat rad, som kan vara en div, en tbody, eller någon annan behållare.

HTML table implementation

Detta förlänger basen widget för att göra varje post i en tbody i en HTML-tabell. Kolonnen konfiguration bestämmer vilken fältet visas i varje kolumn i tabellen. En anpassad cell formateraren kan användas för att göra flera fält i en enda tabell cell.

Konfiguration

I exemplet som genererade ovanstående skärmdump har konfigurationen hållits så enkla som möjligt:

fields definierar redigerbara värdena i varje post. Standardtypen matas in. De andra giltiga typer är Välj och textarea. (Välj kräver en lista med värden.) Basic validering tillhandahålls av Form chef galleriet modul. Detta täcker alla obligatoriska fält, begränsningar längd och numeriska intervall . Mer komplexa validering kan utföras genom att ange regex eller din egen funktion ( fn ). Här är ett utdrag ur det levande exempel:

 var-områden =
 {
	 titel:
	 {
		 typ: "textarea"
	 },
	 år:
	 {
		 validering:
		 {
			 CSS: 'yiv-heltal: [1500,2100]'
		 }
	 },
	 färg:
	 {
		 typ: "Välj",
		 värden:
		 [
			 {Värde: "röd", text: 'Red'},
			 {Värde: "grön", text: 'Green'}
			 {Värde: "blå", text: 'Blue'}
		 ]
	 }
 };

Y.BulkEditDataSource kräver en instans av Y.DataSource och följande parametrar:

uniqueIdKey

Namnet på en nyckel som unikt identifierar varje post.

generateRequest

En funktion för att generera begäran parametrar för Y.DataSource . (Detta är tom i exemplet, eftersom Y.DataSource.Local alltid återgår alla data.)

extractTotalRecords

En funktion för att extrahera det totala antalet poster från Y.DataSource respons.

Sedan exempel används Y.DataSource.Local , totalRecordsReturnExpr krävs också. Detta OGNL uttryck anger var i svaret för att lagra det totala antalet poster. (Observera att extractTotalRecords läser detta värde.)

 var ds = new Y.BulkEditDataSource (
 {
	 DS: raw_ds och
	 uniqueIdKey: 'id',
	 generateRequest: function () {},
	 totalRecordsReturnExpr: '. meta.totalRecords',
	 extractTotalRecords: funktion (svar)
	 {
		 återgå response.meta.totalRecords;
	 }
 });

Y.HTMLTableBulkEditor kräver datakällan fältet konfiguration, och kolonnen konfiguration. I kolumnen konfigurationen är nyckeln fältnamnet, om du inte anger en anpassad formateraren. Etiketten används som kolonn titeln. Här är ett utdrag ur det levande exempel:

 var-kolonner =
 [
	 {
		 knapp: "kryssrutan"
		 etikett: "<input type="checkbox" id="select-all" />"
		 formateraren: function (o)
		 {
			 var markeringar = '<input type="checkbox" class="record-select" id="{id}" />';
			 o.cell.set (innerHTML ", Y.Lang.sub (markup,
			 {
				 id: this.getRecordId (o.record)
			 }));
		 }
	 },
	 {Nyckel: "Titel", etikett: 'Titel'},
	 {Nyckel: "år", etikett: "År"}
	 {Nyckel: "color", etikett: "Color '}
 ];

(Observera att den levande exempel definieras en mindre utvidgning av Y.HTMLTableBulkEditor att hantera kryssrutan kolumn.)

Du kan också skicka en instans av Y.Paginator till Y.BulkEditDataSource . Detta visas i en separat, mer komplicerat levande exempel .

Lokala vs fjärrdatakällor

När beslut fattas om att använda en lokal eller en avlägsen datakälla, måste du noga överväga kompromisser. Den uppenbara trade-off är att en lokal datakälla är snabbare när det paginating, men den initiala sidan laddas kommer att ta längre tid och det kräver mer minne på klienten.

Den Bulk Editor widget ställer ytterligare kompromisser, dock.

Första måste YUI DataSource återgå oföränderliga data. Detta sker automatiskt för lokala datakällor, men kan vara svårt att genomföra för avlägsna datakällor. Du måste låsa rader i din databas tabell för den tid huvuddelen redigeringen om mer än en användare får ändra dem.

För det andra påverkar valet mellan lokala och fjärrdatakällan hur du får spara uppgifterna. När du använder en lokal datakälla kan du göra best effort sparande, dvs spara alla giltiga poster till servern, ta bort dem från den lokala datakälla, och tillåter användaren att fokusera på de poster som har ogiltiga värden. När du använder en fjärrkontroll datakälla oföränderlighet kravet endast tillåter dig att göra allt eller inget sparande, dvs kan uppgifterna endast sparas efter all data är giltig.

Verkliga användningsfall

Den ursprungliga motivationen för Bulk Editor widgeten var att låta efterbearbetning av en uppladdad kalkylblad. Att införa en efterbehandling steg tar bort behovet av tabellexemplen värden att vara perfekt. Fel kan flaggas och fast i bulk Editor widgeten istället för att förkasta hela uppladdningen. Dessutom kan bearbeta på servern gör bäst gissning tilldelning av ytterligare värden som krävs för varje post, och användaren kan kontrollera och åtgärda dessa extra värden innan du sparar. Detta förenklar initiala skapandet av kalkylbladet.

I detta scenario är en fjärrdatakälla det bästa valet. Den uppladdade data lagras i en skråma utrymme och är därför garanterad oföränderliga, eftersom ingen annan användare kan se det. "Allt eller inget" sparande är lämpligt: ​​När alla fel har rättats, lagringen är atomär, precis som en vanlig uppladdning operation.

Om författaren: John Lindal ( @ jafl5272 på Twitter) är en av de ledande ingenjörerna som konstruerar den grund på vilken Yahoo! APT är byggd. Tidigare arbetade han på Yahoo! Publisher Network.

Hitta konversationer: Bloglines | technorati

Dela och utöka: Bokmärke med Del.icio.us | Digg it! | reddit!