Karsten Januszewski on 'silverlight'

Interview With Effective UI

Karsten Januszewski — Tue, 06 May 2008 16:16:00 GMT

Effective UI has put together a site called the User Interface Resource Center. They were kind enough to interview me about WPF, Silverlight, Expression and more. As they put it:

In the 2008 whitepaper “The New Iteration,” Karsten Januszewski teams up with Jaime Rodriguez to spotlight what Microsoft has dubbed the XAML revolution. Based on interviews with early Windows Presentation (WPF) and Silverlight users, Januszewski drills into emerging Microsoft technologies and explores how the designer/developer collaborative process is undergoing change. But, what's the bigger picture? Why is Microsoft investing so heavily in UI Technologies? What are the business benefits that will drive adoption in a field traditionally dominated by rivals? These questions and others are answered here.

You can read the full article here or download the interview.

Patches for Video.Show()

Karsten Januszewski — Wed, 19 Mar 2008 18:29:00 GMT

I uploaded three patches to Codeplex for Video.Show():

1. Creating a dual server configuration to offload video processing
2. Running the Video Processing Service as an NT Service
3. Enabling anonymous uploading and commenting

All three of these patches were used for the implementation of Video.Show() up at http://pulse.sxsw.com. You can download them here: http://www.codeplex.com/videoshow/SourceControl/PatchList.aspx.

One other lesson learned with Video.Show(): don't forget to add the various codecs that you want to support when you configure the encoding server. At first, we were perplexed why .mp4 files kept failing and then realized we didn't have QuickTime installed on the box.

Jeroen Wijering's Silverlight Player For Audio/Video

Karsten Januszewski — Mon, 17 Mar 2008 20:22:00 GMT

Up at the SxSW Music Showcasing Artists page, a person can browse the over 1700 artists that performed. Most of the artists have submitted a track or two that you can listen to right from the site. Being curious, I right-clicked the audio player used on the site and discovered it was by Jeroen Wijering. I went to his site and discovered that he also has a Silverlight player as well. It is dubbed as a WMV player, but it certainly could be used to play .mp3s or .asx playlist files. What I like is how easy he makes it for a person to incorporate the player into a website. Nice.

Pulse: Silverlight 1.0 Mash Up For SxSW

Karsten Januszewski — Sun, 09 Mar 2008 18:20:00 GMT

Announcing Pulse, which I worked on in conjunction with Frog Design for SxSW Interactive. It is an interactive online community hub for the 2008 SXSW Interactive Festival, keeping users up-to-date on the latest event discussions, videos, and news. The site features premium content from SXSW, including video clips from keynotes and discussion panels, as well as user-generated videos, Flickr images, and social networking content. At the same time, aggregators from Technorati and del.icio.us comb the Internet for relevant information, keeping the site as dynamic as the event it celebrates.

Of course, couldn't help but to do some ego twittering:

Speaking of ego twittering, I saw a fair amount of ego twittering at MIX08 with Flotzam too:

And speaking of Twitter, I'm doing a lot of twittering here at SxSW. Twitter really makes sense at conferences. So, if you are down at SxSW and twittering, let me know: I'm looking for people to follow who are at the conference.

Back to Pulse: Hat's off to the Frog guys for writing a really cool website that is an example of doing AJAX programming with Silverlight. For the video upload and display, we used Video.Show. We are actually running Video.Show in a multi server configuration, which I had to tweak some code to get working. I also turned the video processing application, which was a console app, into an actual NT Service that runs on the encoding server. Another thing I did to the code was remove the requirement to log in for uploading videos or commenting on videos. Now you can do all that anonymously. I will add all of these changes to the codeplex project, although probably not until after SxSW.

Tweaking The Expression Encoder Templates To Turn Off AutoPlay

Karsten Januszewski — Tue, 11 Dec 2007 18:14:00 GMT

James Clarke turned me on to the fact that modifying the Expression Encoder templates is trivial. I tweaked the AudioGrey template to turn off autoplay and changed the default volume. Of course, one could even take this further and really modify the templates, which Tim Heuer has a great post on. So, this makes for a streamlined workflow for getting audio (or video) onto your blog. The pieces of the puzzle:

Expression Encoder

Silverlight Streaming Publishing Plug-in

Silverlight Streaming Account

Windows Live Writer

Silverlight Streaming Live Writer Plug-in

The net result: here's the audio player playing my composition hill.climb embedded in this blog post:

Silverlight Streaming for Audio Files

Karsten Januszewski — Mon, 10 Dec 2007 23:34:00 GMT

So, I've been playing with Ableton Live recently as my digital audio workstation. It is great software -- fantastic UI and awesome features as far as integration audio and midi. There's much power in this tool.

I recently composed a piece called "Hill Climb" and wanted to make it available to the world via Silverlight. I used the audio template from Expression Encoder and have the whole deal hosted on Silverlight Streaming. I would have used the Silverlight Streaming Publishing Plug-in, but the problem I discovered is that the templates generated by Expression Encoder always auto-play the media upon page load. There's no way to toggle that from the UI, which means I had to go tweak the auto-play parameter in the generated StartPlayer.js file. So, I couldn't use the plug-in, but rather zipped up the files and posted them to Silverlight streaming myself, adding the player to my blog on the right column.

If you'd like to see the workflow including the plug-in, check out this post, which has a good tutorial.

Flotzam Web Now Happy In Firefox

Karsten Januszewski — Thu, 15 Nov 2007 05:27:00 GMT

Well, I resolved one bug at least and determined why Flotzam Web wasn't happy in Firefox: I didn't explicitly give the <div>

tag which contained Silverlight a height or width. IE seems to be okay with this, but Firefox is decidedly not. So, by giving the

a classname and then adding a style for that class with a width and height, Firefox is happy.

Now on to my other bugs...

Flotzam Web: Databinding and Templates in Silverlight 1.0

Karsten Januszewski — Fri, 09 Nov 2007 22:39:00 GMT

I've been playing with porting Flotzam to Silverlight 1.0 and have an intial prototype working. (Emphasis on prototype -- read, not ready for primetime yet. If anyone wants to help fix some of the bugs listed below let me know.) I figured I'd share it out nonetheless. You can see it running here and download the source here.

I'm pretty excited by the prospect of the architecture I've put together. The crux is that I've created a serverside templating infrastructure that's compliant with WPF's XML Databinding syntax. My goals were to reuse as much of the WPF model as possbile, but on the server.

I initially went down a path of actually instantiating WPF on the server, but pulled back from that for a couple reasons. First, and most importantly, WPF wants to be in a Single Threaded Apartment (STA). One can force this to happen by adding the ASPCOMPAT directive to your .aspx pages, but the scalability implications are severe. These scalability problems might be avoided by doing some multithreading, which I started to explore, but then ran out of energy. I also had some trickiness in getting the ContentPresenter to behave, which sidelined that approach as well. (You can see my initial explorations of the architecture in the xaml.aspx file.)

I then went down a different path, inspired by Laurence Moroney and Joshua Allen. Laurence started me off thinking about templating based on his MSDN sample that does some clever things with server side generation of XAML based on an RSS feed. I liked where Laurence was going as did Joshua, who took this idea to the next level in a prototype he wrote that uses XMLReader and XMLWriter for doing templating. (For some reason, he never blogged about this but he hooked me up with his code, nonetheless. Being an ex-Web data PM, he knows how to sling infosets around, which came in real handy.) I took his code, which is a more generic templating model as opposed to Laurence's custom sample and extended it to support the WPF databinding syntax (aka {Binding XPath=/foo}), as opposed to the custom databinding syntax Joshua had come up with.

Note on the code Joshua wrote: he has this class called MiniCache, which he uses to store elements and attribute values in a dictionary, because he was working under the constraint of SL 1.1 not having an XMLDocument or XPathNavigator. However, as I'm running this on the server, I don't have this constraint. A big TODO for this code is to replace his dictionary implementation with one that uses XMLNode and XPath.

Using Joshua's code with a few modifications, I was able to reuse my WPF datatemplate within Silverlight 1.0!

Here's the basic architecture:

The action begins in my global.asax, which populates the ASP.NET Application object with an initial set of content. In datamodel.Fetch(), I grab the latest Twitter timeline and use it to generate my flotzams.

public void Fetch() { WebClient client = new WebClient(); Stream data = client.OpenRead("http://www.twitter.com/statuses/public_timeline.xml"); XmlReader twitterItems = XmlReader.Create(data); int idx = 0; while (twitterItems.ReadToFollowing("status")) { MiniCache twitterItem = new MiniCache(twitterItems.ReadSubtree()); XmlReader template = XmlReader.Create(server.MapPath("temp4.xaml")); string XamlContent = twitterItem.ProcessTemplate(template, idx.ToString()); if (null == application.Get(idx.ToString())) application.Add(idx.ToString(), XamlContent); else { application.Lock(); application[idx.ToString()] = XamlContent; application.UnLock(); } template.Close(); idx++; } twitterItems.Close(); client.Dispose(); }

The code in Fetch() is pretty darned straight forward, which is what I like about the architecture. I'm basically just walking the nodes from the Twitter feed, merging them with my template (temp4.xaml), which came from Blend. Once I have the resulting XAML, I stick it in the Application object.

I'm not going to go into the code of the MiniCache, because the idea is that is encapsulated sufficiently so as to be black box. However, I did do some things that customized it. In particular, I created my own syntax to pull of the equivalent of databinding functions. You can dig into the code to see what I did.

With my application object filled with generated XAML content, I'm now ready to display it. I do this from default.aspx, which instantiates Silverlight. In the javascript PageLoad function I start up a timer, which makes an AJAX GET call to default2.aspx, which is where my dynamic XAML is served from:

function displayTimer(){ var webRequest = new Sys.Net.WebRequest(); webRequest.set_url("default2.aspx?tweet=" + i); webRequest.set_httpVerb("GET"); webRequest.add_completed(completedHandler); webRequest.invoke(); i = i + 1; if (i == 19) i = 0; setTimeout("displayTimer()",4000) } function completedHandler(result, eventargs) { if (result.get_responseAvailable()) { var host = document.getElementById("SilverlightPlugIn"); var xaml = host.content.createFromXAML(result.get_responseData(),true); var rootElement = host.content.findName("rootElement"); rootElement.children.add(xaml); } }

When the call completes, I use the createFromXAML method to create my Canvas object, which is then inserted at the root. Note how I pass true to the createFromXAML method so I don't have naming collisions.

The code is default2.aspx is pretty darned straight forward. It just picks out the querystring and returns the XAML, extracting it from the application object. And there you have it: a databinding infrastructure for Silverlight 1.0 based on WPF.

The bugs I'm still reckoning with:

--Firefox issues. It was working in Firefox and then at some point it broke. It seems to hang on fetching the images for the Twitter avatars from http://s3.amazonaws.com. Not sure what's going on there. I think Firefox stopped working when I added some error handling on image retrieval.

--Refresh issues. I can't figure out why my cache is not being updated. I try to update it after displaying all 20 twitters, but it seems to hang to the original 20.

--TranslateTransform and RenderTransformOrigin. I'm randomly adding these values to the Canvas, but they don't seem to be getting acknowledged by Silverlight, thus flotzams always coming in from the right to left and often landing in the same place.

The things I'd like to do:

--Pass credentials so that the data is personalized

--Add Digg, Flickr, Facebook, RSS

--Improve the MiniCache

--Show how Blend fits into this workflow

Triangulating Moonlight, Yochai Benkler and Web 2.0

Karsten Januszewski — Wed, 12 Sep 2007 23:16:00 GMT

With the recent announcement of Silverlight being released to the web and the corollary announcement that Microsoft will work with Novell to create a player, named Moonlight, for running Silverlight on Linux, there's been quite a bit of commentary, some of which can be seen on Digg and SlashDot. There are many different lenses to view this announcement with. For me, the announcement dovetails with a lot of thinking I've been doing about the Web 2.0 phenomenon and, in particular, its articulation by Yochai Benkler in The Wealth of Networks. I'm about halfway through the book (at over 500 pages it is dense). As Bruce Sterling commented at SxSW last year, it is the Das Capital of Web 2.0 -- the allusion to Adam Smith in the title shouldn't be discounted either. Invisible hand of Web 2.0 anyone?

I love Benkler's theorization of commons-based peer production. He quite elegantly unpacks the "new modes of production" that are governing the transformation of information and entertainment. But sometimes I feel his position isn't nuanced enough and becomes either too celebratory or too barbed. And Microsoft seems to always fall into the "bad guy" camp, where, for example, IBM doesn't? I don't feel that he gives Microsoft credence in being a positive force toward the "transformation of markets and freedom." Partly, this is because he wants to use open source as his shining example of how commons-based peer production works and, rhetorically, he must position Microsoft as the "other way". He never teases this out fully, a shame, and his discussion of technology disrupts his more interesting theorization on the cultural and economic consequences. In discrediting Microsoft, he ends up putting Microsoft down and not recognizing that, in fact, Microsoft is not antithetical to commons-based peer production. He falls into the very common trap of not acknowledging Microsoft as a platform company. The infrastructure required for commons-based peer production is made available by Microsoft, often for free, whether it is in the form of an operating system, a development language, a database, a web server or a blogging engine. The list could go on and on here: Popfly, Codeplex (not to mention the thousands of Windows and .NET projects on SourceForge), Windows Live and more.

And this is where Moonlight comes to mind: to me it is yet another example of how Microsoft is in fact committed to the explosion of the Web 2.0 phenomenon. Just as Microsoft embraced web services and interoperability for improved heterogeneity in the back end, Silverlight and Moonlight are acts of embracing interoperability and heterogeneity on the front end. To bring it back to Benkler, I can create my videos using Microsoft tooling and know that they will be viewable on a Mac, a Windows box or a Linux box in the browser of my choice.

Irhetoric Enters the Rhizohm

Karsten Januszewski — Mon, 06 Aug 2007 04:00:00 GMT

Welcome