Monday, March 1, 2010
Clicking on a search result redirects to a bad page!
Thursday, February 11, 2010
Configuring IIS - challenges
Sunday, July 6, 2008
Understanding Deep Zoom - Part 7
Check out MSDN for a more detailed explanation on Deep Zoom File Formats. I had earlier mentioned the same idea in my first two posts.
Saturday, June 21, 2008
Understanding Deep Zoom - Part 6
The SparseImageTool.exe now generates dzc_output.xml file instead of items.bin file. The other output files that are generated are
dzc_output_file
dzc_output_images
Metadata.xml
Metadata.xml has the metadata information about all the images. These include the x,y position and height, width of the images. The earlier versions of the Deep Zoom Composer flattened the images on the artboard as a JPEG image. The upgraded version allows flattening the images in PNG format as well.
Check out the Expression Team Blog for more detailed information on What's new in the upgraded version of Deep Zoom Composer.
Sunday, June 15, 2008
Understanding Deep Zoom - Part 5
My last post was on using Deep Zoom Composer.
Notice that now I have selected "Export Images and Silverlight Project". You get
When "View Project Folder" is clicked,
Deep Zoom Composer generates code for the Deep Zoom Collection. It adds Web for hosting the Silverlight control. The ClientBin folder now has the Deep Zoom generated images and the SparseImageSceneGraph.xml file.
The Deep Zoom Image can be accessed using MultiScaleImage control in Silverlight. It is accessed in XAML as
<MultiScaleImage Source="GeneratedImages/dzc_output/items.bin" Height="440" x:Name="msi" />
The Deep Zoom Composer adds a button named "Randomize". This is used to randomly arrange the images in a grid. Notice that there is no dependence on Javascript code here. All the events are in managed code. The MouseWheelHelper class had methods to handle MouseWheel event for the MultiScaleImage. Zooming is provided based on the movement of the mouse wheel direction. The Mouse Wheel event is called by the browser and not by Silverlight. The Worker method initialises a new instance that listens to the mouse wheel events fired by the HTML document.
The MouseMove event saves the current position and pans to the new position when mouse is dragged. The MouseLeftButtonDown saves the inital dragOffset and currentPosition in case the user pans. It is the MouseLeftButtonUp that zooms into the image in case the user is not completing a pan. It also resets the mouse. MouseWheelHelper(msi).Moved zooms in or out depending on the mouse wheel direction.
ArrangeIntoGrid method arranges the images into a grid provided they are all of same size. It gets a randomised list of images and arranges them into a grid of 4 columns. The number of rows is calculated based on number of images in the collection. Hit on F5 and you should see a grid of images into which you can zoom in and out. You can pan the images as well. In addition, you can hit on Randomize button to rearrange the images in a different fashion.
There! This should get one started on programming more functionality using this wonderful technology.
Have fun coding! :-)
Saturday, June 14, 2008
Understanding Deep Zoom - Part 4
I had been blogging on Deep Zoom, but there's no entry on how to use Deep Zoom Composer. So in this blog entry, I am going to take you through the usage of Deep Zoom Composer.
Note: I have still not used the most recent version of Deep Zoom Composer (0.9.000.3)....the one that was released along with Silverlight 2 Beta 2. This blog entry corresponds to the previous version of Deep Zoom Composer. I don't think it is available online. You can get it from here. I will blog on this update to the Deep Zoom Composer in my next post.
On successful install and on starting up the screen looks like this
For generating a Composition or a Collection, you need to go through 3 steps:
- Import
- Compose
- Export
Import stage involves adding as many images as you want.
Compose stage is where you work on the art board. The images can be placed anywhere depending on the requirement.
The last step involves exporting as a Collection or as a Composition.
Notice that Deep Zoom Composer allows you to choose between a Composition or a Collection. Also, it allows selection of Output type. Selecting "Export Images and Silverlight Project" generates a Visual Studio Project accompanying the Collection or Composition. We will deal with this in next blog entry. Selecting "Export Images" will generate the Output folder containing images along with the Composition or Collection.
There! Deep Zoom Image is now ready for use in a Silverlight project. If you had selected "Export Images", then you will have to code explicitly for MouseWheel movement. Check out Scott Hanselman's blog for code.
You can get the Deep Zoom Composer User guide from here.
Not got the idea yet? Check out http://memorabilia.hardrock.com/ for a live example and then come back.
Back? Now this is technology right! Wow!
Understanding Deep Zoom - Part 3
My previous post was on Collection and Composition. Let's try and understand the tool that generates a collection or a composition.
Deep Zoom Composer has a tool named SparseImageTool.exe that is used to produce the final composition or collection. It can be accessed from command prompt as
C:\Program Files\Microsoft\Deep Zoom Composer\SparseImageTool.exe
Giving the above command generates the usage pattern for the tool
The basic usage pattern is SparseImageTool.exe <command> <SceneGraphFileName> [parameters]
where command could be CreateCollection or CreateDeepZoomImage
SceneGraphFileName is path for the SceneGraphFile.xml file
[parameters] refers to a list of other parameters that this application can take.
The SceneGraphFile.xml file has information about the images (width, height, position as x,y co-ordinates), aspect ratio and ZOrder for all images. This is generated by Deep Zoom Composer prior to calling SparseImageTool.exe.
Is it possible to access this tool programmatically? Well, let's try doing so. First, we need to create an XML file that looks similar to SceneGraphFile.xml that is generated by the Deep Zoom Composer.
The XML file looks like this:
<?xml version="1.0" encoding="utf-8"?>
<SceneGraph Version="1">
<AspectRatio>1</AspectRatio>
<SceneNode>
<FileName>C:\Folder\Pic1.JPG</FileName>
<x>0</x>
<y>0</y>
<Width>1</Width>
<Height>1</Height>
<ZOrder>0</ZOrder>
</SceneNode>
<SceneNode>
<FileName>C:\Folder\Pic2.JPG</FileName>
<x>0</x>
<y>0</y>
<Width>1</Width>
<Height>1</Height>
<ZOrder>1</ZOrder>
</SceneNode>
</SceneGraph>
Now, let's create a C# Console Application (I think you can try doing the same using VB as well...but am not sure).
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Diagnostics;
using System.Resources;
namespace deepzoomscenario1
{
class Program
{
static void Main(string[] args)
{
Process p = new Process();
p.StartInfo.FileName = "C:\\Program Files\\Microsoft\\Deep Zoom Composer\\SparseImageTool.exe";
p.StartInfo.Arguments = @"CreateCollection ""C:\\Users\\S.Preethi\\Desktop\\Folder\\test source.xml"" ""C:\\Users\\S.Preethi\\Desktop\\Folder\\result.sdc"" /XML";
p.StartInfo.CreateNoWindow = true;
p.StartInfo.UseShellExecute = false;
p.StartInfo.WindowStyle = ProcessWindowStyle.Hidden;
p.EnableRaisingEvents = true;
p.Start();
p.WaitForExit();
}
}
}
The folder contents before running the program is
Running the Console Application
Final output
Notice that the result folder has an XML file items.xml. The updated version allows generation of an XML file as against a Binary file in the previous version. We can now work with this XML file with ease. We can use this XML file to randomly position the images and do a lot of other things (Translation: More ideas coming soon).
The above operation can be done from Command Prompt as well.
SparseImageTool.exe CreateCollection "C:\Users\S.Preethi\Desktop\Folder\test source.xml" "C:\Users\S.Preethi\Desktop\Folder\result.sdc" /XML
Note: The extension .sdc has to be given correctly. Otherwise, the tool doesn't generate a collection.