Book flip (page turn) effect using jQuery

I found this implementation of the book flip using jQuery (no flash). At first I couldn't find where the page images were, until I realized they're all in a single image, and they're doing the background repositioning technique to switch pages.
(There are several demo pages over the tutorial steps; see the final demo here.)

Free fonts

Found some free fonts at Font River.

Leaves

Do not stand downwind of the bag when bagging leaves.

Notebook video cards

Comparison of graphics cards at Notebookcheck.com.

Making IE6 from Virtual XP Mode access host IIS sites

Need to setup the Microsoft Loopback adapter.

1. Install the loopback adapter on Windows 7. Some more info here.
2. Configure IPv4 settings on the loopback adapter on the host. A quote from this thread:
   "To be able to communicate between the host and guest, give both the loopback adapter on the host and the NIC in the vm IP addresses which are in the same subnet. For example you could make them 192.168.21.1 and 192.168.21.2 with netmask of 255.255.255.0."
   My settings on my host has a static IP Of 192.168.131.200 and submask 255.255.255.0.
3. On the virtual pc, set 2 network adapters, one for Shared NAT, the 2nd for the Loopback Adapter.
4. On the virtual pc, set the loopback connection's TCP/IP properties to use a static IP.
   My settings on my virtual pc has a static IP of 192.168.131.201 and submask 255.255.255.0.

I can now access host sites on my virtual pc using the host's loopback IP (e.g., http://192.168.131.200/mysite).

[When I tried VirtualBox, I didn't need to do all that at all (I realized this after many hours of frustrating firewall blockage). Just set the vm's network card to NAT, and that's it. No need to connect to the loopback adapter.]

Windows Virtual PC Color Depth and ClearType

To get ClearType font smoothing back on your Windows Virtual PCs:
http://winterdom.com/2009/10/windows-virtual-pc-and-cleartype

Also learned from this thread that turning off Integration Features will let you set the color quality to 32-bit (as opposed to just 16-bit when Integration Features is on), and ClearType comes back (at least on my XP vpc).

To enable 24-bit color depth on an XP virtual PC (say, for Virtual XP Mode), see Microsoft's article: HOW TO: Connect to Terminal Services with Color Resolution That Is Greater Than 256 in Windows XP
After making the change described in the how-to, close the vpc and restart it. Then inside the vpc, go to display settings and set it to 24-bit color. At this point, you can also set font smoothing to ClearType, and it looks like it works.

Monospaced fonts

I use Consolas for writing code (for the slashed zeroes). Remember to set ClearType font-smoothing for it, otherwise it looks scraggly.

Samples of monospaced typefaces.
(Also known as fixed-width or non-proportional fonts.)

Converting a physical computer into virtualPC

From the comments in this blog entry, I found these steps:

1. Clean up all the temp files and compressed files to make the image smaller.
2. Run winimage to create the vhd.
3. Use the vhd to create a new virtual PC.
4. Go through windows setup to repair the windows installation (details in the blog entry comments mentioned earlier).

I haven't tried it yet. I'll update this when I do.

Also look here: How to Convert a Physical Server to a Virtual Machine

iPhone/iPod web app development frameworks

This could be promising: developing iPhone/iPod web apps without a Mac.

Started with this article about Dashcode. At the bottom of that, a comment mentions iWebKit, which is an open source framework for building iPhone-friendly websites.

Emulators:

• Googling for “iwebkit jquery” got me this page about Sujay Dutta's iPhone application, which also mentions TestiPhone, “a web browser based simulator for quickly testing your iPhone Applications”.
• Found out about iBBDemo here. Looks like a better emulator.

Found out about another framework, iUI, here: Simulating an iPhone App: iWebKit vs iUI. That led me to jQTouch (which I had come across before without realizing what I had found):

• jQTouch - A jQuery plugin for mobile web development on the iPhone, iPod Touch ...
• jQTouch Offline Support
  
• Search results for iPhone plugins on the jQuery site ...
• Building iPhone Apps with HTML, CSS, and JavaScript by Jonathan Stark (uses jQTouch in Chapter 4)

And another framework: PhoneGap.

(edit/update on 24-jul-2010:)

• iPhone application development, step by step from OpenLaszlo Project Blog

MCMS issues: cannot run SCA

Recently had a problem with Microsoft Content Management System, where it was erroring-out on the Server Configuration Application. Kept getting this error:

Error: File /NRConfig/SCAConfigMain.asp Unexpected error. A trappable error (C0000005) occurred in an external object. The script cannot continue running.

Best thing I did was look at the System event logs. Found a couple things. There was this error:

The machine-default permission settings do not grant Local Launch permission for the COM Server application with CLSID
{0040D22F-54A1-11D1-9DE0-006097042D69}
to the user NT AUTHORITY\NETWORK SERVICE SID (S-1-5-20).

Found the resolution for that in the MCMS FAQ topic "Problems with SiteManager after installing Windows XP Service Pack 2":

1. Open Component Services, drill down to My Computer, right click and select Properties.
2. On the COM security tab, select Edit Default... for Launch and Activation permissions
3. Give the Internet Guest User Account (IUSR_... or whatever login was mentioned in the error) Launch and Local Activation permissions.

And then got this error:

DCOM got error "The service cannot be started, either because it is disabled or because it has no enabled devices associated with it. " attempting to start the service AESecurityService with arguments "-Service" in order to run the server:
{0040D22F-54A1-11D1-9DE0-006097042D69}

Turns out the AESecurityService was disabled. It's a required service for MCMS, so I enabled it (set to automatic), and started it.

And then SCA worked. Woohoo! Finally!

VirtualPC wizard goes off-screen

Every now and then, when switching from an extended-monitor environment to a single-display, you end up with windows opening off-screen. Easy enough to move those: Alt-Tab to the offending window, click Alt-Space (this opens the window's System menu), click M, and then use the arrow buttons or the mouse to move the window back into view.

Microsoft Virtual PC decided to do something like this on Vista, but this time it's on the "New Virtual Machine Wizard" window. I found you can't do Alt-Space on wizards, because there's no System menu on them. The Virtual PC Guy's Blog saved the day: edit the options file %appdata%\Microsoft\Virtual PC\Options.xml, and change the coordinates in the <new_pc> element.

Javascript to download instead of open a file

You can use Javascript to setup a link to download a file instead of opening it. Example:

<a href="#" onclick="window.open('mysite/myfolder/test.xlsx', 'Download');">Download my file</a>

For those that might have Javascript turned off, include an alternate link that has href directly going to the file's URL:

<a href="mysite/myfolder/test.xlsx">Alternate Link</a>

There's probably a combined solution that's more SEO-friendly (don't want the "#" as the href). I tried it but ended up with two popup windows. Need some research on that.

Ajax popups on Firefox

I was working on fixing an Ajax popup that wasn't displaying on Firefox. Saw that the script was erroring-out on this line:

event.cancelBubble = true;

Found the solution near the bottom of this thread.

So now the popup appears, but it shows blank on Firefox (fine on IE). The problem had to do with setting .innerText. Need to use .innerHTML or .textContent for Firefox. Got that from this thread.

iPod/iPhone app development

Some day I'll write an iPod app. I'll probably need this article:
iPhone App Development – Where to Start

Apple, Stanford Teaching iPhone Development for Free (through iTunes)

• Stanford on iTunes U

IE6 Cheatsheet

Just stumbled upon this one:
Ultimate IE6 Cheatsheet: How To Fix 25+ Internet Explorer 6 Bugs

IE6 and IE7 z-index issues

These helped me when I had issues with a menu dropdown falling below a jquery.cycle slideshow:

• Overlapping and Z-index
• Effect of z-index value to positioned elements

Javascript Minifier

An online minifier using JSMin.
I used this one before, but the link seems to be dead. Can always google for "online jsmin".

[edited 21may2010]-Hmm that minifier doesn't work anymore either. Am now using http://jscompress.com.

VS Debugger: No Source Code Available for the Current Location

When the Visual Studio debugger can't find the source for your code, it will prompt for a location. If you make the mistake of hitting "cancel" on that dialog, it will mark it down on the solution properties under "do not look for these source files". If it's not removed from that list, then the debugger will display the "No Source Code Available for the Current Location" dialog box while you pull your hair out.

This helped: MSDN article about the dialog box. (Found this reference through this forum.)

Look at the solution properties. Under "Common Properties," go to "Debug Source Files". Look in the "Do not look for these source files" box and remove the source file that it's having issues with. While you're at it, add directories as needed in the "Directories containing source code" box.

(this refers to VS2008)

Ordering stylesheets and scripts

See the Google Code article about Properly Including Stylesheets and Scripts.

If it looks like your external stylesheets aren't being recognized, try moving them before the script files.

Using CASE in WHERE clause

After much searching, I found that yes, you can use CASE expressions in the WHERE clause of a PL/SQL SELECT statement. The article titled case expressions and statements in oracle 9i provides excellent examples and even explains the impact on query plans.

Adding EXIF datestamps and IPTC info on images

This applies to JPEG images from today's digital cameras which do not stamp the date and time on photos. Uses Irfanview to add a white frame around the image and stamps information (copyright text, date, time, caption, city, state, etc.) on the bottom edge.
For more info, Google "EXIF" and "IPTC".

These notes are based on Irfanview version 4.25.

1. Download Irfanview and install. Make sure to install the plugins also.
2. Enter IPTC info for your images:
   • Open an image in Irfanview, then press "T" to go to Thumbnails view.
   • Select one or more images.
   • Press "Ctrl-I" to open the IPTC Information dialog.
   • Enter values for the Copyright, Caption, origin info, etc. Note that this information could also be used to batch-rename the photos, so put in as much info as you can. Add keywords too, which will be useful if you plan on uploading the images to the web.
     
   • Check the settings in the "Options" tab, then save your changes.
     
3. Do a batch-conversion to add the frame and the stamp:
   
   • Select one or more thumbnails and press "B" to open the Batch dialog.
     
   • Main batch conversion dialog settings:
     
     • Work as: Batch conversion
     • Output format: JPG - JPG/JPEG Format
     • Use advanced options: checked
     • Output directory for result files: set this to some folder separate from your original files folder (you will want to keep your originals as-is)
     • Select thumbnails and click the "Add" button, or click the "Add all" button.
       
   • Output format (JPEG/GIF save options)
     
     • Save quality: 100
       
     • Keep original EXIF data: checked
     • Keep original IPTC data: checked
     • Keep original JPG-Comment: checked
     • Set file size: Set this to something close to your original file size (I have it set to 4400.00 KB). This is the cool thing about using Irfanview to add datestamps/watermarks--you could get close to your original file size. I've tried other apps and they tend to add around 2Mb to the file size after watermarking.
       
   • Advanced settings:
     (You might want to save these by clicking the "Save settings" button. Note that this version of Irfanview does not save the Canvas Size settings.)
     • Canvas size: checked
     • Canvas settings:
       left=60
       right=60
       top=25
       bottom=55
       border color=white
       (This is set for images at 3:2 aspect ratio, and are meant to maintain the aspect ratio, thus the thinner top. These values are based on originals at 3648 x 2736 pixels.)
     • Add overlay text: checked
     • Add overlay text settings:
       X-Coord: 80
       Y-Coord: 0
       Width: 3500
       Height: 50
       Start Corner: Left Bottom
       Text: $I116 [$E306(%Y-%m-%d %H:%M) $I90 $I95] $I120
       Text is transparent: unchecked
       Background color: white
       Font: Calibri, Size:36
       Text alignment: Left
       (Click on "Help" to see what values are available for the Text value. Pick a font that is easy to read and that doesn't take up too much space.)
     • Miscellaneous:
       Overwrite existing files: checked
       Delete original files... : unchecked!
       Create subfolders... : checked
       Save files with original date/time: checked
       Apply changes to all pages... : checked
     • Everything else: unchecked
       
   
   
   • Click on the "Start Batch" button

See samples of the output here...

Silverlight background

Setting "BackColor" on the Silverlight control won't be enough--it still displays a white box in the beginning. Need to set "PluginBackground" also. Found this answer here.

Using TFS with VS2003

An approach moving VS2003/VSS projects to Team Foundation Server
Team Foundation Server MSSCCI Providers:

• For VS2005
• For VS2008
  

HOW TO: Change Source Control Providers If Two or More MSSCCI-Compliant Providers Are Installed

How to Switch MSSCCI Providers (shows how command line commands to switch registry settings)

Tulog

"Breathing exercises can help people fall asleep."
Mas mabilis makakatulog kung hindi hihinga.

wmode=transparent for Silverlight

For Flash, setting the "wmode" parameter to "transparent" lets dropdown lists (say, from menus) overlay the Flash, instead of getting hidden under it.

The equivalent for Silverlight is "isWindowless". (Found the answer here.)

Background positioning for <a> on IE6, IE7

Suppose you have a link button graphic that has both the off and on states (e.g., the 50 x 50px "off" image is on the top half and the 50 x 50px "on" image is on the bottom half, resulting in a 100px-tall graphic). It's easy to style the link's hover effect by changing the background-position from "left top" to "left bottom" (also needs the link to be a block element, say display:block or display:inline-block). This works great on Firefox and IE8.

Normally, this works on IE6 and IE7 also, but make sure the <a> has the "href" attribute, otherwise these browsers won't change the background position.

Version Control: Bazaar

Ended up needing some version control for my html models (instead of zipping the folder every now and then). Found that Bazaar works well for me. The TortoiseBZR windows shell extension integrates nicely with Windows Explorer.

Removing surrounding <span> from a WebControl

See the comment section of this post:
Use a different constructor:

public MyControl() : base()
{}

Can also pick a different tag instead of span:

public MyControl() : base(HtmlTextwriterTag.Div)
{}

Update: Unfortunately, setting it to HtmlTextwriterTag.Div causes a table tag to be rendered for Firefox. See this post about adaptive rendering.

VB.Net and C# comparison

Great reference comparing syntax differences between VB.Net and C#.

TFS Workspaces

Something to remember about TFS workspaces (from this Team System page):
"...only one local path can be mapped, per user, per team foundation server. Two users can't share the same filesystem path. And two different team foundation servers can't share the same filesystem path, either."

SharePoint and closing tags

Sometimes SharePoint will not see a closing tag shortcut like this:

  <div id="blahblah" />

and messes up your nice div structure.

Try adding an explicit closing tag:

  <div id="blahblah"></div>

Sending a PLAY event to the JW Player

The JW Players by longtail video are used to display a video player control on a web page. In script, you can send events to the player to programmatically load and play a video, like this:

function initWMVPlayer(objPlayer, theFile) {
objPlayer.sendEvent('LOAD', theFile);
objPlayer.sendEvent('PLAY', 'true');
}

This seemed to work when I associated it with the click event on a playlist, but sporadically. Sometimes it worked on the first click, sometimes on the 2nd click. Then I found some references (this blog and this forum) that said you always should have a delay before sending the PLAY event. So the function should look like this:

function initWMVPlayer(objPlayer, theFile) {
objPlayer.sendEvent('LOAD', theFile);
setTimeout(function() {objPlayer.sendEvent('PLAY', 'true');}, 50);
}

WSPBuilder walkthrough

WSPBuilder is a Visual Studio add-in for building Sharepoint Solution Packages (WSP). Here's a walkthrough from Tobias Zimmergren's blog.

Server Side Includes

Useful when developing initial HTML models of sites: using server side includes to cut up pieces of HTML that are shared over several pages. Note that this won't work if your page is a .html file. It has to be something like a .asp or .aspx file hosted on a web server.

• WWW FAQs: How do I include one HTML file in another?
• ASP Including Files
  

MOSS Error : The resource cannot be found

I should have looked for this earlier and saved some time:
Resolve Error : The resource cannot be found

Oh yeah, you also can't comment out @Register directives in the .master page with "<!-- -->" comment blocks. It has to be done with server-side comment blocks: "<%-- --%>". I thought I had commented-out the @Register directives for some missing controls, but turns out I didn't.

The Lagom LCD monitor test pages

Calibrate your LCD screen using the test images here.

ClearType font smoothing on Vista

Consolas is a great font for programming, because it's fixed-width and you can easily distinguish 0's and 1's. But the font looks terrible if font smoothing isn't set to "ClearType".

Steps for setting font smoothing on Vista:

1. Right-click on the desktop and select "Personalize"
2. Click on "Window Color and Appearance"
3. Click on "Open classic appearance properties for more color options"
4. On the "Appearance Settings" dialog that appears, click on the "Effects..." button
5. Place a check mark on "Use the following method to smooth edges of screen fonts"
6. Select "ClearType" on the dropdown list
7. Click OK a couple times
   

Cleaning MS Word content for authoring content managed sites

Here's a quick way to convert an MS Word document into HTML for use in authoring content managed sites.
Idea is from the Computer Tricks blog:

1. Send the .docx document as an attachment to a message to yourself using GMail.
2. Open the message.
3. Click the "View as HTML" link for the attachment.
   

Phantom border on background image repeater showing up on Firefox

On Firefox, if you ever see a strange 1px border appear at the bottom of your background image gradient (and you know it’s not on the image itself), then make sure you’re not zoomed-out (click Ctrl-0 to reset the zoom).

[I'm using Firefox 3.0.10 as of this writing.]

SharedView: Alternative to MS Live Meeting

Microsoft SharedView

Clearing floats

Clearing floats without adding an extra <div>:
CSS - Clearing floats

List of techniques for clearing floats:
Simple Clearing of Floats by Alex Walker

Cool Sites

CodEasily - Nice notebook theme. Found it while looking for JQuery plug-ins.

Combine CSS for different media

Instead of adding a separate <link> tag for the print-view stylesheet like this:

<link href="base.css" type="text/css" rel="stylesheet" />
<link href="print.css" type="text/css" rel="stylesheet" media="print" />

just add "@media" blocks at the bottom of the main stylesheet.
The bottom of base.css in the above example would then have something like this (the styles listed here are for illustration only):

@media print {
.noprint { display:none; }
.printonly { display:block; }
body { width:780px; }
}

See article on the David Walsh Blog...
Read Eric Meyer's article about using print stylesheets...

Web development tools

Firebug is a must when debugging CSS or trying out styles on the fly.

I didn't know it could also check page weight--just enable the Net panel and it will give you a table of all requests made by the page, along with stats (size and time) for each request.

Team System comparison tools

[Update 18May2013:  The links from Keith Craig's blog don't work anymore.  See this instead: Using WinMerge with TFS.]

From Keith Craig's blog:

• Using SourceGear's DiffMerge as the merge tool in Microsoft Team System
• Using WinMerge with Microsoft Team System

And diff/merge configuration details from James Manning's blog.