YUI Version 0.12.1 Released

December 18, 2006 at 10:32 am by Eric Miraglia | In Development | 3 Comments

Version 0.12.1 of the Yahoo User Interface Library (YUI) was released this morning. This minor update focuses on bugs and issues raised since 0.12.0; no new features are introduced in this release.

Among the improvements you’ll notice in 0.12.1 include significant performance boosts for Slider when used in Firefox, particularly when the Slider’s DOM elements are deeply nested in the DOM.

Download YUIYUI version 0.12.1 is available for download now from SourceForge.

Share and extend: Bookmark with Yahoo! My Web | Bookmark with del.icio.us | digg it! | reddit!

Screencast: Jon Chambers of Thinkature on Developing with YUI

December 14, 2006 at 5:14 pm by Eric Miraglia | In Development, YUI Implementations, YUI Theater | 5 Comments

Jon Chambers, co-founder of Thinkature Co-founder Jon Chambers of YCombinator startup Thinkature has built one of the most ambitious YUI implementations to-date, a multiparty collaborative ideation space that includes whiteboarding, text/voice chat, and much more; TechCruch reviewed Thinkature’s approach to visual collaboration in this November 2006 article. Jon Skyped in to give us a tour of the Thinkature interface and to talk about the role YUI played in the product’s development. The screencast was recorded on my Mac in Sunnyvale with Jon in Boston while we shared control of a sample Thinkature workspace.

You’ll find many YUI components (including Event, Connection Manager, Drag & Drop and Animation) being put to work in the Thinkature application.

Related URLs:

Screencast:

For the optimal viewing experience, download the full-resolution screencast and view it in QuickTime Player. The embedded version below is scaled down for lower-bandwidth connections and plays within Yahoo! Video’s Flash-based player.

More videos on YUI and frontend engineering can always be found in the YUI Theater.

Share and extend: Bookmark with Yahoo! My Web | Bookmark with del.icio.us | digg it! | reddit!

Using YUI with the Yahoo! Maps AJAX API

December 14, 2006 at 12:32 pm by Eric Miraglia | In Development | 3 Comments

A YUI Forum contributor noted this week that he had encountered a slight hitch when including YUI components on the same page with the versatile (and well-documented) Yahoo! Maps AJAX API written by Yahoo! engineer Mirek Grymuza. The root of the issue is that the highest-level Maps AJAX API file seeks to include some YUI components on its own; this can cause problems if you’re already including those components for your own application.

A future release of the Maps AJAX API will resolve this issue seamlessly; in the meantime, it’s easy to use the Maps AJAX API with your own YUI implementation.

The Workaround

  1. Don’t use the Maps AJAX API’s base include file (e.g., http://api.maps.yahoo.com/ajaxymap?v=3.4&appid=YourAppId). We’ll replicate all of its steps here.
  2. Include all the YUI files that serve as dependencies for the Maps AJAX API. These are:

    The recommended approach here is to include the combined utilities.js file that ships with the YUI distribution (in the build/utilities directory). This file will provide all of the above components in a single aggregate file (along with Connection Manager) which weighs just 18.1KB gzipped on the wire. (More on YUI and pageweight; more on why reducing http requests is a Very Good Thing.)

  3. The Maps AJAX API’s base include file, which we’re omitting, does three things:
    1. Includes the necessary YUI components — you’ve done that already.
    2. Sets a global variable, YMAPPID, to the value of your application ID for the Yahoo! Maps API.
    3. Includes an additional script file, the current version of which is:
      http://us.js2.yimg.com/us.js.yimg.com/lib/map/js/api/ymapapi_3_4_1_5.js

    Once you have the necessary YUI pieces on the page, you need to take these next two steps yourself.

The Code:

<!–load YUI from your own install folder if possible; otherwise:–>
<script type="text/javascript" src="http://us.js2.yimg.com/us.js.yimg.com/lib/common/utils/2/utilities_2.1.0.js"> </script>

<!–set your application ID variable:–>
<script type="text/javascript">
var YMAPPID = "YourAppId";
</script>

<!–Include core Maps AJAX API script:–>
<script type="text/javascript"
src="http://us.js2.yimg.com/us.js.yimg.com/lib/map/js/api/ymapapi_3_4_1_7.js"></script>

The Result

Now you’re set to use the Maps AJAX API per its getting started guide and advanced documentation. That allows you to go above and beyond slickrock in Moab, Utah…



…with just a few lines of CSS, HTML, and JavaScript:

<style type="text/css">
#mapContainer { height: 300px;
width: 100%;
}
</style>

<div id="mapContainer"></div>

<script type="text/javascript">
(function() {
// Create a lat/lon object
var myPoint = new YGeoPoint(38.589162,-109.534018);
// Create a map object
var map = new YMap(document.getElementById(’mapContainer’));
// Add a pan control
map.addPanControl();
// Add a slider zoom control
map.addZoomLong();
// Add map type control
map.addTypeControl();
// set type to SAT
map.setMapType(YAHOO_MAP_HYB);
// Display the map centered on a latitude and longitude
map.drawZoomAndCenter(myPoint, 5);
})();
</script>

Piece of cake, right? Grab your bike, and I’ll meet you there.

Notes:

  1. This method spells out an explicit version number for the Maps AJAX API script (3_4_1_7 as of today), whereas using the API directly allows the API authors to increment that version automatically.
  2. This approach suggests using different (newer) versions of YUI components than are currently tested and QA’d by the Yahoo! Maps team for use with the Maps AJAX API. Therefore, this approach pairs scripts that are presumed compatible but that have not been QA’d together.
  3. We expect to obsolete this approach with a subsequent release of the Maps AJAX API.

Share and extend: Bookmark with Yahoo! My Web | Bookmark with del.icio.us | digg it! | reddit!

Video: Lars Knoll and George Staikos on KHTML and WebKit

December 11, 2006 at 1:01 pm by Eric Miraglia | In Development, YUI Theater | 18 Comments

Lars Knoll and George Staikos, KDE/Konqueror DevelopersOn Friday, Lars Knoll and George Staikos from the KHTML project visited Yahoo! to give a talk on the history of KHTML and Konqueror and the connection between those projects and Apple’s open-source WebKit (which was built upon KHTML and announced in January of 2003 as the foundation of Apple’s Safari browser). We learned a great deal about this decade-long project, including remarkable tidbits such as:

  • KHTML was the first non-IE browser engine to support languages whose writing does not run left-to-right;
  • WebKit has been selected by Adobe to power the rendering engine in the Apollo project
  • Konqueror developers are considering implementing WebKit as the rendering engine for the next version of Konqueror, replacing KHTML (this would, as George points out, provide more of a bug-for-bug compatibility between Safari and Konqueror).

Lars took us through the early history of the project and George through the current landscape. The outlook for WebKit is bright, with Apple having done a great deal of work and the KDE, WebKit, and Konqueror communities strong and active.

YUI engineer Nate Koechley brought a camera along for the presentation, and although the video is rough we’re continuing our policy of making this kind of content available as broadly as we can. If you’re interested in the current state of KHTML/WebKit, we think you’ll find the presentation interesting. Thanks particularly to Lars and George for the visit and for letting us share the video publicly.

Video (26 min.):

This video can be viewed using the embedded player above or directly on Yahoo! Video.

Note to Yahoo! Video users: Thanks largely to user feedback, the Yahoo! Video team has reconfigured its player from a streaming mode to a progressive mode. That means that you can go to the clip’s Yahoo! Video page, pause the movie, and let the whole file download before beginning to watch — reducing the occurrence of buffering interruptions. The embedded player continues to use the streaming mode, so if you’re having trouble with any YUI videos using the embedded player try visiting the Yahoo Video site directly…and keep sending them feedback if you have any issues at all.

More videos about YUI and frontend engineering can be found in the YUI Theater.

Share and extend: Bookmark with Yahoo! My Web | Bookmark with del.icio.us | digg it! | reddit!

Screencast: Aptana Founder Paul Colton Demos YUI Support in the Aptana IDE

December 8, 2006 at 12:31 pm by Eric Miraglia | In Development, YUI Theater | 8 Comments

Paul and Ingo of AptanaAptana founder Paul Colton and CTO Ingo Muschenetz dropped by Yahoo yesterday for lunch and to talk about the Aptana IDE (which also functions as an Eclipse plugin. We asked Paul to sit down and give us a quick tour of Aptana, which was one of the first IDEs to feature rich code-completion and documentation integration for the YUI Library. We recorded this short (7 min.) webcast featuringing the highlights of the interface and its YUI support.

Related URLs:

Screencast:

For the optimal viewing experience, download the 640×480 screencast and view it in your QuickTime Player. The embedded version below is scaled down for lower-bandwidth connections and plays within Yahoo! Video’s Flash-based player.

Share and extend: Bookmark with Yahoo! My Web | Bookmark with del.icio.us | digg it! | reddit!

Hosted by Yahoo!

Copyright © 2007 Yahoo! Inc. All rights reserved. Privacy Policy - Terms of Service

Powered by WordPress on Yahoo! Web Hosting.