I have left Microsoft and this blog is no longer under my control. All of the content should remain for some time however and any new updates can be found at http://davedev.net.
-Dave, September 2013
OneNote is one of my favorite Microsoft Office applications and an amazing note taking tool. I use it constantly to take screen shots of websites or applications, quick dictation, to-do lists, and even some sketching/doodles (via my Tablet’s pen). One of the goals of the OneNote Team was to bring that note taking application to all three screens (PC, Cloud and Phone). With the release of Windows Phone 7 that goal became a reality and we can now sync notes between all three screens. Changes made on the phone will be available on our desktop and changes made on our desktop will show up in a web browser. If you haven’t checked out the free Office Web Applications yet you owe it to yourself to take a peek. Office Web Applications are part of SharePoint, are available when editing or viewing any Office document on your Skydrive as well as through other services like Docs.com and Office Live Workspace.
What I don’t think we have done a good job of is actually exposing this functionality on Windows Phone 7 easily. I had a conversation just last night with someone who was adamant about Windows Phone 7 not being able to cloud sync One Note Documents yet. This prompted me to write this blog post in hopes I can make it easier for you as well.
When we first open up the Office Hub we are presented with a list of shortcuts to our most recently used OneNote Documents. You can also tap and hold on these shortcuts to pin them to your start experience on the phone (I use this for quick to-do or shopping lists). What is not obvious at first is you need to hit the All icon to get to the rest of your documents and open up the syncing option. In the below screenshot you will notice I have just created a quick OneNote document called DaveDev and I am now going to click on the All icon.
This will take you to a list of Pages in your current Notebook. Windows Phone 7 only has one Notebook by default where all of your Pages will be stored. When we enable syncing however we will start to pull down all Notebooks from the Cloud. This means we can select these other Notebooks and create Pages in them right on the phone. So while we cannot create Notebooks directly on the phone we can integrate with them existing ones. If we bring up the full Application Bar we will notice a Refresh icon. Go ahead and click that now.
You will be asked to confirm that you want to begin syncing OneNote with your Skydrive. What Skydrive would that happen to be? When you created/entered your Windows Live ID into the phone you were automatically given 25 gigabytes of free storage in the cloud (what a nice present eh?). Office Documents on Windows Phone 7 are integrated with your Windows Live ID so it will take care of everything for you. Exactly the same way the Zune Marketplace and X-Box Live integration works. Go ahead and confirm that you want to enable Skydrive sync.
You will now be notified during the process of the sync status. First it will connect up to Windows Live and then it will set up a default notebook (Unfiled Notes) if it does not already exist.
Now that we have enabled sync you will notice some changes. First, all of your notes will now include the SkyDrive Folder (Personal) and OneNote Notebook (Unfiled Notes) they have been synced to. You will also notice a Notebooks option that is now available.
Swiping the screen to the left or clicking on Notebooks will take you to the new Notebooks screen. This screen will display the status of all your Notebooks currently located in Skydrive as well as their Sync status.
Notice too that you now have the ability within each Note to sync immediately back to your Skydrive. Clicking on the Refresh icon will kick off this process for you.
So now we have One Note running on our Windows Phone 7 device and we have One Note running on our Windows 7 PC. But, let’s say we are out, maybe over at a friends house, and we need to pull up a quick One Note document. I told you our stuff is in the cloud so we should be able to get to it from any Web Browser, right? Of course!
Simply point your browser to Windows Phone Live and you will be presented with a bunch of functionality for your phone. This is really where your cloud integration comes alive! X-Box Live achievements, avatar customizations, contacts, calendar, phone tracking, photos as well as our newly synced OneNote documents are accessible here. Simply click on the View All link under OneNote and you will be taken directly into the OneNote Web App.
Like all of the Office Web Apps the One Note Web App is full featured and even includes the familiar Office Ribbon. Notice along the top you can see the current Skydrive folder my Notebooks are synced under (Personal Web). This is the same folder we saw displayed on our Windows Phone 7 device. On the left pane you can now navigate between all of your notebooks and their included pages. Opening up my newly synced document will display it in the editor on the write and any changes here will save back to the desktop and my phone.
Hopefully this eliminated any confusion you might have had around enabled Cloud sync for Office One Note documents on your Windows Phone 7 Device. Although we only do this for OneNote today we have already announced a free Windows Phone 7 update later this year that will sync your Excel, PowerPoint and Word documents as well. These documents will be able to sync back to your Skydrive like we have shown here in addition to the already existing SharePoint functionality.
Dream It. Build It.
The power to build smart, visually stunning games and applications is right in your hands with Windows Phone 7. Want to see what's under the hood? You are invited to join your local Microsoft Developer Evangelists for an inside look at the Windows Phone 7 platform. You'll learn how to harness the strength of Silverlight and XNA to create compelling user experiences with rich, multi-media content. We'll also outline the new distribution and revenue opportunities Windows Phone 7 and the Windows Marketplace offer to web, game, mobile and interactive developers and application publishers.
Morning Sessions: · Introduction to Windows Phone Development and the WP7 platform · Building Windows Phone 7 Applications with Silverlight · Building Windows Phone 7 Applications using XNA Lunch (included) Afternoon Sessions: · Monetizing Your Apps with Marketplace · Windows Phone 7 Services · Light Up Windows Phone 7
Amplify your creativity, productivity and profits with Windows Phone 7 – and don't miss these full-day sessions in your local area. This is an exclusive, advance invitation for our preferred customers, so register today and save your seat.
Windows Phone Garage| 6pm - 9pm As one of our most valued customers, we'd also like to invite you to a special Windows Phone Garage for mobile application developers following the Firestarter from 6-9 pm. This hands-on workshop will feature one-on-one proctoring from Microsoft and community experts. It's the perfect opportunity to design and implement that cool new app you've been dreaming about, so bring your ideas and get ready to code.To learn more about the Phone Garage event or to register, click on an event city near you. Hurry, space is limited!
If you can dream it, you can build it with Windows Phone 7.
For more information or to register, visit > www.msdnevents.com/firestarter OR CALL 1-877-MSEVENT
Windows Phone 7 Firestarter Events run from 9am - 5pm
To register, select a city
Seating for the live event is limited, so register today.
Windows Phone Garage Events run from 6pm - 9pm
Had a great time at VSLive last week, some really good dialog went on both during and after the session.
It was good to see so many people in the session as well. I know how hard it can be to get up on that second day first session before the caffeine kicks in.
You can grab all my slides and source code off my Skydrive here. Feel free to reuse. I have had a couple requests about the tips I gave that day (expression shortcuts, visual studio extenders, VSM editing, etc). Looks like it really hit home with you guys and would be of value. To that end, I am planning on putting together a document I'll post up here that will include these things. Kind of a "Expression Studio for Dummies Developers" guide so stayed tuned for that. The days of mindless, laborious code are over for us my friends. Expression shall save us from our "enterprise" project managers and usher in a new glorious day of the web developer. We can make great user experiences too! <1-0-1> (Binary High Five)
The Skydrive folder is broken up into three parts. The first one, VSNY08_Isbitski.pptx, is the PowerPoint slides.
The second file, Isbitski-VSLive-Code.zip, contains all the code we did together in Blend, Encoder and Visual Studio 2008. It is broken up as follows.
The VSLive folder contains the Expression Blend/VS Silverlight2 Project (remember it will load just fine in both). Here is where we showed off how to use the Blend Interface. We started by creating a nice black space background and then added a glowing orange sun flare in the bottom. Yes, I'm a SciFi geek! Start with some fun, sprinkle on some UI Tips, and then go straight to the meal of storyboards, brushes (gradients and how to change the direction fill), reflections, transforms and events. I also showed how you can save anything right in Blend to be a XAML resource. We did this for our color gradient and Blend took care of saving it to the XAML file as well as making it available in the UI to choose from.
Next up is the Expression Encoder 2 output folder where we recorded a live video of me on stage and then through in some markers to fire off events later. We also showed off how EVERYTHING in xaml is an element, even video, so we can use the same reflection trick (scalar transform) when it comes to video as well. The lighting was a little dark on stage that day and so I look like a floating head.
The VSLive-FunWithVideo folder contains the Blend/VS Silverlight2 Project where we took the video we encoded and had some fun with it.
Here is where we created our own control based off one of the out of box buttons. We then added events by clicking in the properties of the button in blend and having it stub out that attribute in the xaml. This enables you to stub out all the events in the xaml itself for later editing in the codebehind. They wind up looking like this in the code.
This was also a great example of how video is just an element in xaml and in order to play it we only need to call a Play or Pause event. We can also get information about that stream to decide if it is buffered, playing, etc. We then edited the buttons actually look and feel using the new VSM (Visual State Manager) in Blend 2.5.This let us make the button change to a nice white light when moused over as well as having it slowly fade back to black (0.3 secs with the slider control) when we moved away.
Since we made sure to save this control's styling as a resource in Blend again we were able to "skin" any new controls by telling them to use the BlackButtonStyle.
Lastly, we showed off how easy it is to capture the markers we embedded in the video stream. We did this by adding the event through Visual Studio (instead of Blend this time) and then set a debug point to handle the event.
We could put any type of code into this event, make the video shrink in size for example or move ui elements off or on to the stage, it is very powerful!
Next, the VSLiveIntegration and VSLiveIntegration_Web folders showed how you can easily add Silverlight content to your existing ASP.NET investments.
We started off by using the ASP.NET AJAX Web Control that allows us to place Silverlight content onto this page. We also discussed how to deploy Silverlight applications to your existing webforms. In this example we only need one file, the VSLIVEINTEGRATION.XAP (Xaml Application), which we opened to show it was just your standard zipfile. We then went old school and added a standard ASP.NET Listbox control that enabled Postbox. Wow did it take us back to see that listbox posting the full page to the server every time we clicked. =)
Lastly, I showed showed off some of the new extender support in VS2008 by adding a DropDownShadow AJAX control to the existing ASP.NET Listbox. ASP.NET Web Controls, ASP.NET AJAX Controls and Silverlight all in one place living happily together.
To wrap things up we had some fun with Silverlight DeepZoom. You can grab that zipfile off the Skydrive here.
We started running off a full screen DeepZoom project I had created the night before. The only modifications I had made to the DeepZoom composer output was to change the resolution to 1024x768 from the default 800x600. In this project we start off looking at a beautiful view of the Brooklyn bridge. As we zoom in close we see a bill posted. Upon further inspection we notice that it is the VSLive brochure and if we zoom in closer it has info on my session. We then opened up the project in DeepZoom Composer (Aug 4 build) and added a new image ourselves that we were able to zoom in on. Unlike previous builds of the composer where I had to code my own, the Aug 4 build will actually generate all the code you need to do the mouse handling.
Extra credit for anyone who can spot my daughters riding on the golfcart. =)
Hopefully after this session (or reading this post) you have a better idea of how easy it is to create some compelling RIA experiences using Silverlight. Even if you do not come from a designer background it is worth checking out Expression Studio. The frustrating days of having to CODE an interface our boss/users will love are over. We can now DRAW it. Have fun!
This question has come up a couple times recently during my presentations and I wanted to point a potential snag you may hit. In order for Silverlight to run Out of the Browser (OOB) it needs to have an xml manifest file included in your project.
The file looks like this…
You can have this file created for you by setting the option inside the Silverlight Project properties window. Pulling up the properties will give you two new options to select. The problem is that Visual Studio will not automatically generate this file for you until you click on the “Out-Of-Browser Settings” button. It is not enough to just click the check box to enable out of the browser.
So if you are scratching your head and wondering why your getting that nifty manifest file missing error go back in and be sure to click the button so it generates it for you.
Clicking on the OOB Settings button will give you a bunch of options where you can set the information the window will display and when you hit OK it will generate the file for you.
That is really all there is to it to enable the OOB functionality in your application. As long as users already have the Silverlight 3 plug-in they can run both in and out of the browser. No additional installation or frameworks are needed. Simply going to a page with an OOB enabled Silverlight control will give the user a new option to install locally when they right click on the control.
Clicking install will bring up an installation window with the option of creating a shortcut on your desktop or start menu.
It is important to point out that this does not change the security model of Silverlight either. It is still completely sandboxed as it would be running in the browser. If your users have additional questions there is a “More Information” link on the installation prompt that will take them to a Microsoft site with details about what “Outside the Browser” means for them.
The application can now be run both from your website as well as a stand alone application. If the user ever wants to remove the local application they need only right click anywhere in the stand alone application or the Silverlight control on the webpage and select “Remove this application”. Eliminating any need to go to “Add/Remove Programs” through the setup panel in Windows.
You can also download updated documentation for how to check whether your application has been installed yet locally, is running or out of the browser, as well as if network connectivity is present.