Musings of the Dev Minds

Using the Simplenews preview instead of Node preview

2012-01-18T15:40:00.000-08:00

Nothing like a snowy day to get you pumped to write a blog entry. Today, I am going to write about a thing we have noticed about Simplenews for Drupal 6.

Firstly, a bit of background: Simplenews is a module that allows for the management of newsletters and distribution lists. Used in conjunction Mime Mail, Simplenews Template, and Node Clone, you can build a module that not only manages newsletters and distribution lists, but also manages templates you define, send rich HTML emails, and clone previously sent issues.

All told, this is a pretty solid set up. Testing it was made much much much easier with Node Clone. But one thing that separates the men from the boys in the world of WYSIWYG email sites is how true to form the WYSIWYG is. As any web-developer will tell you, WYSIWYG stands for 'What you see is what you get" ... but not out of the box. So why not say WYSI'ntWYG? Because its just to difficult to pronounce.

Tuning a WYSIWG is an arduously iterative process of trial and error, especially in the case of email applications (because you have to send the mailer each time... which means you might even have to wait for a cron job to run).

The bug that really stood out to me was the following: the user can be afforded two conflicting previews. One is the Node preview, the other is the Simplenews preview. They looked different: the CSS specified in the Simplenews Template didn't show up in the Node preview.

Lesson learned: Remove the ability to do a node preview when using this combination of modules. It's just confusing.

As we got deeper into building functionality around Simplenews and Simplenews Template, I started wondering if there were other solutions out there. Sure enough, there are. I have not had the time to explore them but here are some ideas:

Setup recommended by the HTML Mail project - I like this project because it seems like they have stable versions up for Drupal Core 6, 7, and 8! The recommended releases of SimpleNews (at the time of writing this article) are 7.x-1.0-alpha2 (2011-Dec-24) and 6.x-2.0-alpha3 (2012-Jan-07).
Guidelines as recommended by Tim Slavin's post from 12/21/2011 entitled "How To Code HTML Email Newsletters". Very thorough overview of the various tools people use to look at emails, common bugs and fixes, and available resources & standards documents.

The Benefits of WURFL

2011-12-23T15:50:00.000-08:00

When making a website you can be pretty sure that most browsers are going to be reading the same language (HTML and Javascript). You can also assume that you will only need to test in a reasonable amount of browsers for testing. When making a mobile website on the other hand there is a lot of fragmentation of mobile device technology. Some devices may be expecting HTML, but others may be better for WML, HDML, or XHTML mobile profile. Not only that but different devices will interact differently with client side scripting, have different screen sizes, and handle only certain image formats. How you render an object (like a text box) may look very different depending on what browser you use. Only if there was something that made it work on all known devices...

WURFL! WURFL (Wireless Universal Resource FiLe) is a Device Description Repository. This means it holds data about the capabilities about many mobile devices. It then uses that data to allow the developer to use abstractions of page elements that will be converted to the specific markup needed for the user's device. The end results being everyone viewing the website mostly sees the same content the way, you the developer, want to show it. In addition to this the developer can have the website display certain content depending on the device (or type of device) the user is using.

There is plenty of documentation on how to learn this technology. Check it out...

Introduction to WURFL - MobiForge created a nice easy introduction to how to use WURFL at the most basic level

WURFL PHP Guide - How to use the WURFL PHP framework

WURFL .NET Guild - How to use the WURFL ASP.NET framework

WURFL Java Guide - How to use the WURFL Java framework

WURFL Devices and and Capabilities Document - For each device WURFL holds over 500 capabilities broken up in to 30 group. This documents explains them all.

Lets us know your experiences in WURFL in the comments. Also, do you have any other documentation that you have found useful?

QA Ruminations

2011-12-20T12:48:00.000-08:00

I am not just an engineer, nor am I just a tester, nor just a checker. I am the guy that ensures that we can confidently affirm that the web-applications we make at BIS measure up to a standard of excellence. Not 'the standard of excellence' - but a standard of excellence that is unique to each project. Each project offers our team a new set of circumstances to contextualize the development efforts we put forth. It is my job to suss out each new context, and build a way of diagnosing the extent to which the web application or site we make is adequately prepared to inhabit that context it was built for.

This is possibly the most interesting job on the planet.

Below is a video I watched this weekend. Its a 99 minute lecture from the eminent buccaneer scholar & software testing guru James Bach. It is marvelous. Say what you will about his qualms with the ISTQB - this guy is no charlatan. I see great value in his work. His testing methodologies are thought provoking and original, and his style of team-play is awesome.

SQL Reporting Services: Visibility Expressions

2011-12-16T13:31:00.000-08:00

A nice feature about SQL Reporting Services is that it allows you to display or hide content depending on the data that you are displaying on the report. For example, let's say you are displaying a report and each data item can have a comment associated with it (which is retrieved from a database), but you only want to show comments that don't have an empty string.

To make this happen perform the following steps in the reports layout mode:

1) On the control you wish to set the visibility, right click on it and select "Properties".

2) A dialog box will come up. Click on the Visibility tab.

3) On the "Initial Visibility" radio button list select "Expression".

4) In the textbox type in... =iif(Fields!Comments.Value <> "", false, true)

5) Press "OK".

The above expression basically says if the Field "Comments" is not an empty string then make the control visible, otherwise hide it. You can use the "Fx" button next to the expression textbox to help you create an expression using the expression tool to help you make your own expression if your trying to do something different.

You can also set a control's visibility based on another control being visible. Let's say I wanted to show another control only if the comments was showing. To do this go in to the visibility properties and select the "Visibility can be toggled by another report item" check box. Then simply select the control you wish to link it to in the "Report Item" drop down list.

Please post in the comments if you see any issues with this solution or have any questions.

Drupal Web Apps

2011-12-13T16:37:00.000-08:00

I found some great info on drupal web applications to share here.

Flash-based mobile apps can take advantage of the lightning fast AMFPHP data interface for talking to a Drupal site.

Drupal Tools for making mobile web apps:

Browser detection

WURFL - Detects mobile device capabilities.
Browscap - Detects browser type.
Mobile Plugin - Device detection and image scaling.
Mobile Tools - Browser detection, theme switching based on device type, redirection to mobile site, and other features.

Theming

Mobile - Clean theme that can be used as a custom theme base.
Mobile jQuery Theme - Utilizes jQuery Mobile framework for theming.
Nokia Mobile Theme - Contrary to its name, this theme is intended to work on all mobile devices. Its design is based on the official Nokia template.
mobile_garland - A mobile version of the Garland theme.
Adaptivetheme Mobile - A mobile subtheme for the HTML5 AdaptiveTheme.
Fusion Mobile - A Fusion Core subtheme targeted for mobile.

The native app and web app approach to using Drupal for mobile. Here's the pros and cons:

Native Mobile App		Mobile Web App
Pros	Cons	Pros	Cons
Take advantage of mobile OS features such touch screen slide and device tilt events	Only available at app marketplaces	Reduced development complexity	Features are limited to what traditional web browsers offer
App still functions when device is offline	More effort needed to deploy to multiple devices	Majority of deployment involves configuring a mobile theme and a few key modules	Not accessible if the device is offline or out of wireless range
Better performance - syncing Drupal data with app doesn't have to be done real-time	Mobile development platforms often don't deliver 100% of advanced features without having to modify native code (Objective C, Java, etc.)	Working knowledge of Drupal/HTML/CSS only	Web browsers differ considerably across devices, requiring signficant browser testing

While mobile web apps can only take advantage of browser-specific events and features, a few app development frameworks aim to make web apps function more like native apps. Blackberry's WebWorks platform offers developers a way to tap into more advanced mobile browser features specific to the Blackberry OS. Sencha Touch is the first-of-its-kind HTML5 framework that claims to make mobile web apps function more like native apps.

The Mobify Studio workflow is slick and intuitive, geared toward the average web developer. A user selects content areas from the web site that's being ported to mobile through a wizard-type interface. Mobify then outputs HTML and CSS that can be edited on-screen, offering custom template creation.

More mobile Drupal resources

Anyone know of any more Drupal mobile web app resources.

Quick JMeter Setup on Mac

2011-12-13T14:42:00.000-08:00

I found an awesome article by Zac Spitzer / fastmovingtarget on how to setup JMeter on Windows. This post explains how to do so on Mac OSX.

In summary, this initial setup will create a way for you to record all of the requests that get made when using your web-application. From here, you can save certain thread sets and run tests where multiple instances of these thread-sets are sent to your web app.

My plan is to use this to record what Selenium does, and then use that for load testing. If I use Selenium IDE to make the aforementioned Selenium routines, the redundancy is hilarious. But in all seriousness, I am really excited to pair the two of them together. I am a bit worried though about whether JMeter can keep up with Selenium...

What I am wondering is 'What benefit is there to using JMeter over Fiddler?'... probably has to do with being able to integrate JUnit tests etc more easily... but I don't know. Any comments?

First: Installation

Download JMeter. You may download the source code and build it yourself, or you may download the binaries. I just downloaded the binaries.
While on the JMeter Download page, follow the instructions provided to verify the md5 (Mac OSX Snow Leopard Server does not come with pgp, gpg, or pgpk.)

In Terminal.app

md5 jakarta-jmeter-2.5.1.zip

Click 'md5' next to the version of JMeter you downloaded. There will be a 20 character value shown, and it should match what you got in the the terminal. A quick way to check this is to just use ⌘+F in your browser and copy in your results from the terminal.

In your Finder, uncompress jakarta-jmeter-2.5.1, and drill down into the directory called 'bin'.
Open ApacheJMeter.jar

If you prefer the Terminal, use the following:
sh ./jakarta-jmeter-2.5.1/bin/jmeter.sh

Setup & Tuning-in to your web-browser

Add (via right click) a Thread group to the Test Plan 1
Add a Non Test Element > HTTP Proxy Server to the Workbench 2
Open the HTTP Proxy Server Page and change the port if required 3
Set the Target Controller to Test Plan > Thread Group on the same page 4
Configure your browser to use the Proxy Server (it's localhost) 5

Zac Spitzer recommends Firefox. This is probably the case because you can set up proxying internally to Firefox without messing around with your system settings. If you try to go 'Under the Hood' in Chrome or into Safari's 'Change Settings...' dialog, it will kick you right into your system preferences. Please note that if your workplace has a special proxy configuration already, or any other network settings that might interfere with setting this up, don't fight it: submit a ticket to IT.

⌘+,
In 'Advanced', go to your connection settings and set up your localhost as a proxy server. You can assign different ports to different protocols.

Press Start at the bottom of the page 6

Now, JMeter will record all the HTTP requests your browser makes, so make sure you have closed all the other tabs you have open. 7

Don't forget to reset your browser proxy settings! 8

You can delete any requests you don't want from the list at any time. 9

Remember to read the documentation and be careful! Make sure you know what servers will be affected by your testing, and don't jump to simple conclusions, 3-tier web apps are complex beasts. 10

1 Zac Spitzer, http://zacster.blogspot.com/2008/03/quick-howto-to-setup-jmeter.html

2 ibid. Spitzer, Zac.

3 ibid. Spitzer, Zac.

4 ibid. Spitzer, Zac.

5 ibid. Spitzer, Zac.

6 ibid. Spitzer, Zac.

7 ibid. Spitzer, Zac.

8 ibid. Spitzer, Zac.

9 ibid. Spitzer, Zac.

10 ibid. Spitzer, Zac.

How To Make MaxLength Work In An ASP.NET Multi-line Textbox

2011-12-09T15:06:00.000-08:00

You may have noticed that when you set the MaxLength property on a ASP.NET multi-line TextBox the control won't limit the number of character's that can be placed in the box. This feature works just fine when the box is a single-line TextBox but as soon as you make it multi-line you can kiss that feature goodbye. Fortunately, there is a way to fix this via Javascript.

To do this I created my own class that extended the TextBox class. I called my class "AdvancedTextBox". First I made a method within my class that will create a specific JavaScript string...

private string CreateJavaScript()

{

string javaScript = "<script type='text/javascript'>";

javaScript += "function checkLength(e, oObject, maxLength){";

javaScript += "if (oObject.value.length < maxLength)";

javaScript += "return true;";

javaScript += "else{";

javaScript += "var keyID = (window.event) ? event.keyCode : e.keyCode;";

javaScript += "if ((keyID>=37 && keyID<=40) || (keyID==8) || (keyID==46)){";

javaScript += "if(window.event)";

javaScript += "e.returnValue = true;}";

javaScript += "else{";

javaScript += "if(window.event)";

javaScript += "e.returnValue = false;";

javaScript += "else e.preventDefault();}}}</script>";

return javaScript;

}

What the javascript does is read the key pressed by the user. It will then prevent the user from typing anything in the text box if the user reaches the limit placed in the "maxLength" property. The "oObject" property is the textbox. The "e" property is the event.

Now we need the TextBox to call this JavaScript method anytime a key is pressed when typing in the TextBox. Add the following code to the OnPreRender event of your page...

this.Page.ClientScript.RegisterClientScriptBlock(this.Page.GetType(), "AdvancedTextBoxScript", CreateJavaScript());

this.Attributes.Add("onkeydown", "javascript:checkLength(event, this, " + this.MaxLength + ");");

There you go! The max length property will now work with your TextBox if you make it multi-line. The only issue you may have is that if the user types really really fast (like mashing keys). The JavaScipt will slow down the input from being placed in the box.

If you find any issues or have any questions please feel free to post in the comments. Also, I would appreciate any criticism if you have found a better way to do this.

Tools For Building Your Mobile Site

2011-12-02T14:00:00.000-08:00

Your not alone in making your mobile website. There are a lot of excellent tools out there to make your life easier. Over the years many good APIs have come out which will help make you more efficient as a developer and allow you to make a high performing mobile site for your users. Here are some API's you should check out...

jQuery Mobile (http://jquerymobile.com/)

Touch-optimized HTML-5 based jQuery Web framework

Sencha Touch (http://www.sencha.com/products/touch)

Mobile Ext JS framework. Instead of enhancing preexisting HTML it creates its own DOM based objects. For developers that like to technologies like Java and Flex will like how this how the development feels with this framework.

jQTouch (http://jqtouch.com/)

Well documented jQuery plugin for mobile web developement for iPhone and Android. Attempts to emulate the iPhone experience with mobile website. Be warned that transitions can be look jumpy and have delays if your not careful.

The M Project (http://www.the-m-project.net/)

HTML5 MVC JavaScript frameworks for cross-platform mobile web applications. Comes with Expresso, a build in tool that is based on Node.JS.

52 Framework (http://www.52framework.com/)

Framework utilizing HTML5, CSS3 and JavaScript. It’s a full featured collection that allows the developer to easily add HTML5 video, rounded corners to panels, shadows, and whatnot. Examples are readily available when downloaded.

Also, here is check out this free designer to help you get started...

DHTMLX Touch Visual Designer (http://www.dhtmlx.com/touch/designer/)

Web based designer with an easy to use drag and drop interface to add controls.

And one more thing, this tool may be useful if you plan on making your website in to a mobile application...

Titanium Mobile (http://www.appcelerator.com/products/titanium-mobile-application-development/)

Tool that can be used to transfer your awesome JavaScript based website to the code needed for an application on the iPhone (Objective-C) or Android (Java).

Hope this helps. Please post in the comment any other tools you use and how they have been useful for you. Also, if you have any comments or complaints about the items listed above please let us know.

XCode 4 is not available for Snow Leopard... unless you fork over some cash

2011-11-29T14:41:00.001-08:00

I think that one of the most infuriating things about QA is the cost factor. It has been said many times that 'QA is company overhead' because it's never a sure bet that a quality assurance engineer will find any bugs, and is almost certain that they will never develop something that the company can profit on. But additionally, QA requires umpteen sandbox environments, and that gets expensive too. I really don't like being an expense.
I recently ran into this problem when I was setting up my iOS environment. After hunting around endlessly for a version of XCode that was compatible with Snow Leopard Server, installing and uninstalling it 3 times, and finally getting the whole darn thing up and running, I found that 'iOS Simulator' does not come with a version of iOS5. According to this post by Mark Hammonds of mobile.tutsplus, there has not been nearly as much documentation of the change between Safari 5.01 and Safari 5.0 as there has been in previous releases of iOS.
So, the choice seems to be: buy OSX Lion ($40) so as to get XCode 4 and the iOS5 emulator, or, buy an ADC license ($100) so you can get XCode 4 for Snow Leopard. Either way, I lose money. And in the cheaper option, I lose an entire OS & I have the fun new challenge of figuring out whether the new window UI and fullscreen UI of OSX Lion breaks site layouts (as is the case with IE7's omnipresent vertical scrollbar debacle).

Serving up XHTML

2011-11-23T08:47:00.000-08:00

It might seem OK to be serving up the same MIME type on every page of a site, but that can hurt in some cases. For most websites, authoring in HTML 4.01 is perfectly sufficient. Most of the features available in XHTML are available in good old HTML. However, some sites may wish to take advantage of the extensibility of XML, so delivering in XHTML with the correct MIME may be important.
The following table shows the recommended MIME types for serving XHTML documents:

Media Type	text/html	application/xhtml+xml	application/xml	text/xml
HTML 4	SHOULD	MUST NOT	MUST NOT	MUST NOT
XHTML 1.0 (HTML Compatible)	MAY	SHOULD	MAY	MAY
XHTML 1.0 (other)	SHOULD NOT	SHOULD	MAY	MAY
XHTML Basic	SHOULD NOT	SHOULD	MAY	MAY
XHTML 1.1	SHOULD NOT	SHOULD	MAY	MAY
XHTML + MathML	SHOULD NOT	SHOULD	MAY	MAY

So given the above information web pages can be served in one of two ways:

As XHTML with a MIME type of application/xhtml+xml to those browsers and other user agents with the proper support
As HTML with a MIME type of text/html to all other user agents, and those agents that indicate a preference for that type

By using PHP to redefine a document's header, it can be served in the appropriate manner. Any changes to the header of a document must come before anything else. By including external PHP in the first line of each document in a website, it will only be necessary to create the new header once. Changes can easily be made to accommodate new scenarios. The external PHP looks like this:

<?php
$charset = "iso-8859-1";
$mime = "text/html";
function fix_code($buffer) {
return (preg_replace("!\s*/>!", ">", $buffer));
}
if(stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml")) {
    if(preg_match("/application\/xhtml\+xml;q=([01]|0\.\d{1,3}|1\.0)/i",$_SERVER["HTTP_ACCEPT"],$matches)) {
     $xhtml_q = $matches[1];
            if(preg_match("/text\/html;q=([01]|0\.\d{1,3}|1\.0)/i",$_SERVER["HTTP_ACCEPT"],$matches)) {
             $html_q = $matches[1];
                    if((float)$xhtml_q >= (float)$html_q) {
                    $mime = "application/xhtml+xml";
 }
            }
    } else {
        $mime = "application/xhtml+xml";
            }
}
if($mime == "application/xhtml+xml") {
    $prolog_type = "<?xml version=\"1.0\" encoding=\"$charset\" ?>\n<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"en\" lang=\"en\">\n";
} else {
    ob_start("fix_code");
    $prolog_type = "<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\">\n<html lang=\"en\">\n";
}
header("Content-Type: $mime;charset=$charset");
header("Vary: Accept");
print $prolog_type;
?>

If $mime remains set to "text/html", the $fix_code function is called within an ob_start() function. This has the effect of holding the entire page in a buffer while the trailing forward slashes are removed from the code. The buffer flushes automatically when the page has finished being processed.
This has the effect of replacing instances of " />" with simply ">".

The above PHP can solve the problem of serving the wrong MIME type of a web site page. Just make sure this code or something like it is included at the beginning of each web page before any headers are sent.

In the case of using this in the Drupal environment this type of script can be used in the page.tpl.php file or settings.php.

I can think of an improvement to the above code. Possible also make real time adjustments for the language and text directions based on the user agent.

ref: Serving up XHTML with the correct MIME type

W3Fools against W3Schools: Not a foolish position

2011-11-22T17:41:00.001-08:00

When I was a fledgling web-developer, I spent a great deal of time asking Google to tell me where to learn about everything HTML and CSS. The ubiquitous 'W3Schools' became a familiar site. It made it into the Most Often Visited list in my browsers (after Facebook and Slipsum). Notice I didn't link to W3Schools...

However, I ran across W3Fools while I was reading Paul Irish's blog entry about the ominous threat that IE's yearly release schedule poses for web development (particularly the QA department). I read through this beautiful site's scathing critiques of W3Schools and was forever changed.

For future reference here (quoted from w3fools.com) is what should be done:

WHAT SHOULD BE DONE

W3Schools should consider wikifying their content so the community could self-correct and keep the information up-to-date. Today, they do not even allow you to submit corrections on a page. They should.
You should learn from (and recommend) these more reputable sources:
- Opera Web Standards Curriculum covers the basics of web standards-based design in HTML and CSS.
- Google's HTML, CSS, and Javascript from the Ground Up presents the basics of web development with video tutorials presented by Google's expert web developers.
- SitePoint is a pretty good reference for HTML, CSS and JavaScript. Their documentation always mentions feature support across different browsers, and describes known browser bugs.
- The W3C, itself, has a wiki-based general Learn page as well as an HTML element reference.
- The MDC (Mozilla's Doc Center) takes over at intermediate CSS and covers JavaScript better than anyone.
  The MDC is also a wiki (little known fact), which means we, as knowledgeable web developers, can add or change information so the pages are as effective and comprehensive as possible.
  Additionally, W3schools has the top link on Google (currently) when you search for 'browser stats'. Think about it, dear reader. The browser stats they are amassing are "collected from W3Schools' log-files, over many years" (http://www.w3schools.com/browsers/browsers_stats.asp, Nov. 22, 2011) which is, sadly, filled with log entries from noob web-developers, non-developers who are just trying to swim their way to the surface of their WYSIWYG's source tab, and some bots. If you want a really good look at what is being used on the web, check out Wikipedia's logs (Alexa global ranking: 6 (as of today) ) or StatCounter (which is unweighted as far as I know).

Mobile Standards Resources

2011-11-18T13:18:00.000-08:00

W3C has a Mobile Web Initiative specific section of their site: http://www.w3.org/Mobile/.

The resources center aggregates various tools, sites, and information related to building a better mobile presence. I am especially fond of the W3C Standards (found here: http://www.w3.org/Mobile/Specifications) which lists a number of great references such as:

Mobile Web Best Practices
Mobile Web Application Best Practices
mobileOK Basic
Device Description Repository Simple API

One key entry to the Best Practices page defines the 'basic requirement' or default to support. The default is as follows:

Usable Screen Width: 120 pixels, minimum.
Markup Language Support: XHTML Basic 1.1 delivered with content type application/xhtml+xml.
Character Encoding: UTF-8.
Image Format Support: JPEG/GIF 89a.
Maximum Total Page Weight: 20 kilobytes.
Colors: 256 Colors, minimum.
Style Sheet Support: CSS Level 1. In addition, CSS Level 2 @media rule together with the handheld and all media types.
HTTP: HTTP/1.0 or more recent HTTP/1.1.
Script: No support for client side scripting. (Do not use it).

Great mobile websites

2011-11-18T11:16:00.000-08:00

It's easy to create a mobile websites, but it's more difficult to create a great, user intuitive site that people want to keep coming back to. The key is the make the site fast, simple, and just provide the content that a mobile user wants. Some websites recently have done a fantastic job at doing this, and are great example to learn by. Below are some great lists of awesome mobile website designs:

Vivid Examples of Mobile Website Designs

Mobile Web Designs To Show You One Of Future Trends

I know, it's a lot of examples, but after glancing over them you will notice most of them have one thing in common. They are focused for a particular purpose. For example, allowing you to search for weather in your city (iWeathr) or find a burger near you (McDonald’s). The main websites have much more, but the mobile site is aimed for the person on the move. Many sites will condense the content of their big web page to a simple and easy to read format (CBS News for example). When people are on the go they want content quickly and they want it be focused on what they need while they are not at their computer desks. These are sites that people come back to again and again because they have use when the user needs information fast.

Drupal Mobile Site

2011-11-16T18:37:00.000-08:00

One of the main concerns about mobile sites are how to manage content. A page on the desktop might not be need or make sense for the mobile site. You might just want to have your mobile site contain a few pages to make the site easier to navigate. Luckily Drupal can make this processes easy. By combining Mobile Tools and Domain Access you can have a separate site for mobile while being easy to manage.

Instead of having two sites with separate logins you can have one site and when you go to post a page you choose which site it should be published on (or both). This can make managing content across both sites a breeze.

A strategy for utilizing mobile emulators in a more realistic way than using a mouse

2011-11-15T12:24:00.001-08:00

Ideally, mobile testing would be done on all of the common mobile devices, but who has the money to keep buying them and paying for data-plans? Emulators work fine, but the main gripe with using them is that you can't touch the device. A very basic feature of the mobile environment is being able to hold an I/O device, and get it to surf the web by touching its screen. You never see someone break out a mouse when they are trying to browse the web on a phone or a tablet. So, I have been racking my brain trying to figure out a good way of doing this that is as cost-effective as it is realistic.

And I think I have a good idea:

Buy a cheap multitouch interface, and use that like you would use the screen (or trackball in such cases as a Blackberry) of a smartphone with multitouch.^{1, 2}
Create desktop backgrounds that consist of a rectangle of the same dimensions as a given mobile device's active area that is centered on the screen. Annotations within this picture can be used to give further markers and blocking points for the different parts of the device so that positioning it is just a matter of visually matching/fitting it into the right slot. Switch desktops backgrounds for every device you want to test.
Create a way of marking the dimensions of your device on the multi-touch input device, so as to realistically limit the active area of the multi-touch input. This could be done by measuring and cutting out rectangles in plastic report covers and clipping/mounting them to the multi-touch input.

I can foresee that you might have to configure the mouse sensitivity to match the devices as a possible contributor to error in this testing methodology. If you can poke a hole in my idea, please please please write a comment.

¹ Some interfaces to consider might be Apple's Magic Trackpad (active area = 5.12 inches x 5.17 inches), and Wacom's Bamboo Capture (active area = 5.8" x 3.6"). Both $100 or less, a modest investment in what could be many years of fruitful testing.
²Simulating a real interaction by proxy of a tablet is not unfamiliar to me. Back when I was at the University of British Columbia, I worked in the Communication Dynamics Laboratory (under Dr. Eric Vatikiotis-Bateson and Dr. Adriano V. Barbosa). My project was to examine how people talk while they are drawing. Inspired by the interactive alignment exhibited in conversations I had with heady people over cocktail napkins, notebook paper, sharpies, and 4 colored pens, we set ourselves to the task of capturing event streams of discourses mediated by drawing. We devised a method for capturing all the tablet input (pressure, x, y, tilt, timestamp) using the linux-wacom Debian package.

Mobile Phone Emulators

2011-11-11T17:13:00.000-08:00

There is a lot of mobile phone emulators and simulators out there. To make things easier I thought I would put all the links to the good ones in one place. So here you go...

BlackBerry Smartphone Simulators

http://us.blackberry.com/developers/resources/simulators.jsp

Iphone 4 web based simulator

http://iphone4simulator.com/

Apple Xcode 4 - Includes a iPhone emulator and development tools

http://developer.apple.com/xcode/index.php

Android SDK (provides an android emulator)

http://developer.android.com/sdk/index.html

Documenation: http://developer.android.com/guide/developing/tools/emulator.html

WebOS SDK (includes an Emulator)

https://developer.palm.com/content/resources/develop/sdk_pdk_download.html

Please post in the comments if you think there any links that should be added (or even removed) from this list.

Why Indexing Is Required

2011-11-11T14:17:00.000-08:00

Most developers know that databases use data tables, stored procedures, views, and functions but indexes are often overlooked and misunderstood. Indexes are data structures that improve data retrieval from tables in a database. There are unique indexes and composite indexes, but I am not going to talk about composite indexes here as I am just introducing simple indexing concepts.

Indexes come in two flavors: clustered and non-clustered. You can only have one clustered index per table, as it is joined to the table providing sorted storage. The clustered index is the Primary Key. Non-clustered indexes are sorted and have pointers to the actual data. While they speed up data retrieval when good indexing is employed, there is overhead for maintaining indexes. Any queries that do not have a matching index definition will not use an index to speed up the data retrieval.

Let's say I have a table with 2 columns. The columns are named 'id' and 'title'. I then create an index on the 'id' column. When I search for information based upon the 'title' column, the index that I created will not be used for the query because it does not assist in finding the appropriate data.

I think it is important to provide a visual comparative in order to continue this discussion without making things more confusing.

There is a popular children's game called High-Low (or the Number Guessing Game) which requires players to try and guess the correct number with a choice from 1 to 100 while the controller person tells them whether they've guess it, or whether they are too high or too low. So in primitive symbols, the responses can be =, <, and >.

I have mapped out a binary tree to illustrate the choices available and to also introduce a 'cheat' to playing the game. A person who knows the binary search method can find the answer in 7 guesses or less EVERYTIME.

Since the elements are essentially ordered (sorted), it is possible to cut them in half by choosing a number in the middle such as 51. The controller will then let you know if you should use the left branch (you guessed too high) or the right branch (you guessed too low) to continue guessing.

Let's say the number the controller picked was 31. You would guess the following numbers based upon the above binary tree: 51, 26, 39, 32, 29, 30, 31. This would also be the longest guess length possible as it takes 7 guesses. There are 37 numbers that require you to guess 7 times, 32 numbers that require you to guess 6 times, 16 numbers that require you to guess 5 times, 8 numbers that require you to guess 4 times, 4 numbers that require you to guess 3 times, 2 numbers that require you to guess 2 times, and only 1 that would get you the answer in the first try. So, the average guess set would be 6 or 7 guesses as the combined possibilities make up almost 70% of the total possible numbers.

If you write it out in base 2, you get 2^7 or 128 possible choices. That is to say that if the game goal was to guess the number between 1 and 128, you'd still be able to guess it in 7 tries.

Applying this to indexing, when a table join is being used between 2 tables, it is always faster to create the join if there is an index that is sorted on the field that you want to use to join by. A simple select statement might be written as:

SELECT [books].[id], [books].[title], [authors].[name]

FROM [books] JOIN

[authors] ON [books].[id] = [authors].[bookId]

This statement is looking to join the books table to the authors table. The join is 'id' in books and 'bookId' in authors. In order to facilitate a faster result time, I would add an index to the books table on the 'id' column and an index on the 'bookId' column so that each of the tables have a sorted index to speed up finding the correct rows.

Since the 'id' column in the books table is it's Primary Key, the index is part of the table structure. However, for the 'bookId' column of the authors table, the index is not part of the table structure and is easier to visualize as being a different table. This new table would be similar to having a new table with 2 columns whose Primary Key is 'bookId' and has a 2nd column that references the Primary Key of the authors table.

To find the appropriate row, the query would take the count of rows in each table, divide it in half and look at the Primary Key's value in that middle row to see if it is High or Low. It would then repeat the process using the same binary search method shown above to get to the appropriate row quickly.

If each table has 128 rows in it, the resulting effect is that instead of reading all 128 rows for each table to find the match, the query only has to read 7 rows from each table. 14 is quite a bit smaller than 256.

Drupal 8, Mobile, and You

2011-11-09T16:14:00.000-08:00

Drupal 8 is well under way and major changes have already started happening. It now has an official HTML 5 doc type and core files have been moved into their own directory. One of the initiatives for Drupal 8 is being Mobile compatible. The initiative's leader, John Wilkins wrote a very good blog post outlining what he invisions for Drupal 8's mobile compatibility. You can find this post here. He covers key points about various ways Drupal could be mobile friendly, content administration on mobile devices, responsive web design, and front-end performance. He also discusses how the community can help in making a better mobile Drupal.

Some recent happenings in test-automation

2011-11-08T13:27:00.000-08:00

1) Bromine development ends.

I have been using the various flavors of Selenium over the last few months to break into test automation. One framework that really caught my eye was Bromine, which not only distributes tests to machines on your grid, but also has a brilliant interface for stubbing in functional requirements and test cases. It is a web-app written with CakePHP, is gratis (free as in beer), and as far as I know is also libre (free as in speech).

When you write test cases using Bromine, they are all organized under the requirement(s) they address. Also, you can drag your steps around within the UI, which makes it very easy to edit your test cases. These changes, however do not have any effect upon the testscript that you upload to testcase.

However, I was just notified yesterday that the development team will be dropping the project.

I really hoped to see continued development on this project because it has the potential to become a really nice integration point for devs and QA. But the more I think about it, Bromine doesn't seem to hold up to my highest hopes for test automation. There is no integrated bug tracking system... You have to refactor your existing test scripts into Bromine's Java or PHP formats... Anyhow, time will tell.

2) For all of those who have never seen it, Jason Huggins (Selenium/Google/SauceLabs) made a robot that can play Angry Birds.

Huggins. You are a legend. The future of test automation on mobile devices is looking epic. Check out this article from last month from O'Reilly (Timothy M. O'Brien, author and interviewer) or Huggins' own post on the site for his side-project, Bitbeam. (In case the YouTube embed doesn't work for you, here is the link to the interview)

Tips for making a mobile website

2011-11-04T17:35:00.000-07:00

Design:

* Use minimal navigation. Only provide what the mobile user will need.

* Limit disorientation (provide drill down menus)

* Always proved a quick way home with an easy to find home button

* User doesn't want to browse; they want to find

* Port what is relevant to a mobile user (no need to port everything)

* Keep as much brand identity as possible even with the smaller form factor

* May need to compromise on fonts that are optimized for the small

* Best to constrain users to Arial, Verdana, Georgia, Trebuchet, Times New Roman

* Make things as automatic as possible (i.e. "Remember me" option in login, Automatic filling textboxes only)

* Avoid anything that might result in fat finger mistakes (small items like radio buttons)

* Use single column layout

* Scroll vertically, not horizontally

* Utilize mobile templates (such as the ones in certain Drupal themes) if possible

* Important to allow the CMS tool to work in smaller form factors for on the go modifications to the site.

Development:

* Speed is very important. People are on the go and they want info now.

* Don't ever use popups

* Don't use flash, Silverlight or hefty AJAX

* Different mobile browsers require different meta tags

* PutCSS on the top so it loads first

* Take advantage of internet caching as much as possible

* Keep components under 25KB

* Combine static images into a single image to reduce the number of http requests

Testing:

* List the mobile devices you will support and write a test plan for each

* Need a means to test in each of those devices

* Use mobile emulators to do testing

* Testing needs to be done on native devices to find things like fat finger problems and disorientation issues

Conveniences of HTML5 Web Form types

2011-11-01T15:00:00.000-07:00

Hats off to you, Estelle Weyl, for posting your results from studying the support and behavior of HTML5 input types (shown below), and all the other great work you have done at http://www.standardista.com/html5/html5-web-forms/

WK = Webkit (tested Safari 5)
O = Opera (10.5 on Mac)
FF = Firefox (3.6.3 on Mac)
IE = Internet Explorer (IE8 on XP)

TYPE ⇒ Attribute ⇓	Text, search, url, tel	Email	Password	Dateandtime Date, Month, Week, Time	Dateandtime-local, number	range	color	Checkbox, radio	file
accept									WK, O, FF, IE
autocomplete	O	O	O	O	O	O	O
autofocus	WK, O	WK, O	WK,O	WK, O	WK, O	WK, O	WK, O	WK, O
checked								WK, O, FF, IE
disabled	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE
Form	O	O	O	O	O	O	O	O
list	WK, O	WK, O		WK, O	WK, O	WK, O	WK, O
max				O, WK	O, WK	O, WK
maxlength	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE
min				O, WK	O, WK	O, WK
multiple		FF, WK, IE							FF, WK
Name	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE
pattern	WK, O	WK, O	WK, O
placeholder	WK	WK	WK
readonly	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE
required	WK, O	WK, O	WK, O	WK, O	WK, O			WK, O	WK, O
size	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE
step				O, WK	O, WK	O, WK
checked								WK, O, FF, IE
value	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE	WK, O, FF, IE

Another example of a really useful tool put out by the Weyl is the following slideshow, which demonstrates how to implement HTML5 webforms and what results they will afford the user of a mobile device.

HTML5 Web Forms

View more presentations from estellevw

I get slightly peeved each time a form asks me for an email address but does not tell my browser to tell my mobile device to put the '@' right in front of me. Likewise, I really like using the native date pickers etc on my iPhone instead of fat-fingering at a little grid, hoping that I can touch a '15'. The mobile web is all about the little conveniences, and sites that have a heavy emphasis on forms really should take these awesome advances that HTML5 affords into consideration.

Most Popular Mobile Activities

2011-11-01T08:48:00.000-07:00

Mobile web site activity is on the rise and predicted to be even more popular in the future. Along with all the other additional tasks required to develop mobile friendly sites perhaps one of the most important is identifying how sites or apps are used when consumers are using a mobile device. By knowing this you can reduce page size and eliminate content that's not needed. By identifying mobile activities developers can create sites that are seamless whether being accessed on desktops, laptops or mobiles. I found some interesting data that has identified mobile device activities and consumer preferences . It turns out that the trend is leaning toward browsers with the exception of games and social networking:

2) US consumers prefer browser to apps for most mobile activities, according to Keynote/Adobe
• Accessing maps and directions is the no. 1 mobile activity, followed by social networking, accessing local information and reading news.
• Respondents generally favor the browser experience over downloadable mobile apps, except when it comes to games, social media, maps and music.
• Consumers report equal satisfaction levels with their browser and app experiences, and spend nearly equal amounts of time interacting with each.
• “To maximize reach, invest in a mobile-optimized web experience and look beyond a single device.” – Adobe/Keynote.

US consumers’ favorite mobile activities and preferences for accessing the activity via app or browser
Category	Participated	Prefer apps	Prefer browser
Media and Entertainment:
Social networking	76%	54%	46%
Local info	73%	46%	54%
News	68%	37%	63%
Music	63%	55%	45%
Games	61%	61%	39%
Video	56%	42%	58%
Sports	42%	33%	67%
Blogs/blogging	41%	25%	75%
Product reviews	34%	22%	78%
Travel and mapping:
Maps/directions	81%	52%	48%
Research travel	47%	25%	75%
Check travel reviews	43%	23%	77%
Check travel itinerary	39%	32%	68%
Banking and finance:
Check bank account	67%	42%	58%
Conduct bank transactions	51%	39%	61%
Budgeting	43%	44%	56%
Shopping:
For every shopping activity, including researching products and prices, reviews, promotions and purchasing products, most respondents (61-81%) preferred browser to native app.
Source: Keynote/Adobe (October 2010)		via: mobiThinking

Ext JS: Excellent choice for creating rich javascript UI

2011-10-28T09:46:00.000-07:00

If your looking to create a rich Javascript UI that is easy to develop, I think you will find Ext JS as a great option. The website has a good Example & Demos section so you can see what it can do. It also has some very good documentation and a large community backing it. At the moment we are creating a rich interface for users to view a folder structure in a file tree, load files, and check them for errors. The interface feels seamless just like you are using a windows application and it didn't take very long to program at all. We highly recommend checking out this framework out if you are planning on doing anything like this in your JavaScript development.

Lytro light-field cameras

2011-10-26T14:13:00.000-07:00

Lytro introduced their light-field cameras recently. What is so amazing about these cameras is they are able to take in more information than a normal camera. This allows the focus on the photos to change after it has been taken. This also allows for 3D photos. Click here to read more, or Click here to see photos in action. I am very excited on the implications this has for web design such as 3D photo galleries or the ability to create multiple pieces of art from a single photo.

Drupal to Mobile

2011-10-24T22:49:00.000-07:00

I've heard a lot of different opinions on what to use for Drupal Mobile compatibility. There are some choices out there but the best solution so far seems to be using mobile_tools and fusion_mobile themes. For now there are some instructions to follow:

Installation

Download Fusion from http://drupal.org/project/fusion
Download Fusion Mobile from http://drupal.org/project/fusion_mobile
Install the Skinr module: http://drupal.org/project/skinr
Follow the instructions in the README to build your own Fusion Mobile theme

Mobile theme switching

We recommend the Mobile Tools module to switch to your mobile theme when a mobile device is detected: http://drupal.org/project/mobile_tools

Removing Time From SQL Datetime

2011-10-21T09:25:00.001-07:00

Recently I had to run a SQL query where I had to compare datetime columns, but only needed compared the date, not the time. This can be done easily by making the datetimes all have the same time of midnight when you compare them. The following statement will get a column (in this case "enddate") and return it with the time of midnight:

SELECT Convert(DATETIME, convert(varchar, endDate, 112))

What is happening is it's converting the datatime to varchar keeping only the date then converting it back to a datetime which will give it a midnight time by default. If you do this to the all datetime variables or columns you are trying to compare, then the times will not be a factor since they will all be the same.

Wordpress on Android

2011-10-20T17:16:00.000-07:00

Mobile phones are stepping into a new era. I have been using mobile phones for a number of years, but until recently, doing really functional tasks on the web have been restricted by a lack of proper toolsets.

Enter the WordPress app for the [insert your type here] phone.

You can install the app on your phone and not only read WordPress blogs, but manage your own as well.

http://android.wordpress.org/
http://blackberry.wordpress.org/
http://ios.wordpress.org/
http://nokia.wordpress.org/

If you are a developer you may be looking for a little more than just an app to install. They have a developer section which provides information as well as access to the svn repository. If you join their development team you can get read/write access to the repository, but anonymous access is allowed for read only access for each phone type:

http://android.svn.wordpress.org/
http://blackberry.svn.wordpress.org/
http://ios.svn.wordpress.org/
http://nokia.svn.wordpress.org/

Given the popularity of WordPress, this feature is sure to drive additional offerings from other projects across the web.

The Roots of Siri: AI on the iPhone

2011-10-18T13:07:00.001-07:00

I have been following the press surrounding Siri, the new digital assistant that comes with the iPhone 4S. It seems like a fabulous tool, and I am looking forward to what its users can teach it 'in the wild'. However, I have noticed a palpable gap in the press coverage: Siri's roots. So, here is my modest attempt to gather some of the strands.

I suppose that the most fun thing to begin with is a video:

So over 20 years ago, Apple made this wonderful video/commercial (which eerily hits the date 2011 on the nose) that exhibits this concept of the 'Knowledge Navigator' (which was purportedly written up in former CEO John Scully's book Oddesey) that had the natural-language processing capabilities of a butler/digital-librarian. The ease of use that is acted out in this video may prove to be a good benchmark for Apple's UX team, and certainly an interesting thing to bat around while armchair-philosophizing about Turing Tests and The Singularity.

The name Siri, is derived from SRI: Stanford Research Institute originally, SRI International once it had to officially declare non-affiliation with Stanford University during wartime in the 1970s. Among the many amazing to come out of SRI (prototypes of the computer mouse and ARPANET under Doug Englebart, LaTeX under Donald Knuth, vaccines for SARS and avian flu... the list goes on) was the DARPA funded CALO (under the PAL framework). This is reported to be one of the largest artificial intelligence projects ever launched.

CALO stands for Cognitive Assistant that Learns and Organizes, and this is what Siri is designed to do. Like many AI applications that initially had a lot of funding because the DOD saw promising uses for soldiers, CALO-cum-Siri has been transformed from tool to toy.

Siri, Corp. split off from SRI and was bought by Apple a few years ago. The rest is history.

Some questions we have about Siri:

What languages are supported?
Will Siri be crippled behind the Great Firewall?
Can Siri be taught to eavesdrop?
How well can Siri differentiate between situations when a user is and is not addressing it?

All four of these questions have pretty important implications for product quality, privacy, machine learning, and human-computer-interactions. I am looking forward to seeing the user base grow.

Javascript fiddle

2011-10-17T17:06:00.000-07:00

I stumbled on the javascript fiddler site (jsfiddle) and really like it. This is another place to develop and test against any javascript framework without getting lost in an avalanche of files and folders.
It's amazing that all the frameworks like jQuery Dojo, Prototype and you name it along with every possible version in one location.
This is laid out nicely as four windows to insert your HTML, CSS, javascript code and a test frame to try it out. Another great thing about this site is the ability to add external reference paths to other javascript sources.

Unit testing your Javascript code

2011-10-14T15:19:00.000-07:00

The Dojo javascript toolkit has a great solution for unit testing your JavaScript code. It's called D.O.H. (Dojo Objective Harness). We have been using this lately to unit test a JavaScript framework we have been building and it has been working out very well. It even contains a GUI runner that allows you to easily test any test suites you create. The testing framework works a lot like nunit so for those of you that use that for other projects you may find this a very easy tool to learn.

You can get more details about D.O.H. at http://dojotoolkit.org/reference-guide/util/doh.html

You can download the Dojo toolkit at http://dojotoolkit.org/

CSS3 Pie

2011-10-12T09:13:00.000-07:00

Right now is an exciting yet frustrating time for the web right now. We have exciting new technologies (HTML5 and CSS3) that are out there for use but we can't use readily yet due to compatibility issues. IE7 & 8 are holding the web back and will be for quite a few more years. There is some help on this front though, CSS3 Pie allowing developers to use certain CSS3 tags in IE.

At the moment it only includes support for

border-radius
box-shadow
border-image
multiple background images
linear-gradient as background image

There are still some issues with z-indexes (since it actually creates a new html object) but overall I have been very happy with it and plan to continue using it.

Mozilla plans for silent releases of Firefox in 2012

2011-10-11T15:00:00.000-07:00

Following in the stead of Google Chrome, Mozilla as announced (in a fittingly quiet way) that they are working on a few things to stay out of their users' faces while continuing on with their 6-week release schedules. By January of 2012 (at which point we will be approximately at Firefox 10) they hope to not only update silently, but also to have enough infrastructure in place so that add-on developers are not left surprised or scrambling to update the version number the add-on is compatible with.

Sources:

Move object ownership in SQL Server using Automatic Script Creation Technique

2010-02-04T13:52:00.000-08:00

While these instructions should work in SQL Server 2000, they are specific to SQL Server 2005.

Make sure to set 'Query' >> 'Results To' >> 'Results to Text' from the Query Menu or by clicking the 'Results to Text' icon on the 'SQL Editor' toolbar.

Run the following query in SQL Server:

DECLARE @newOwner nvarchar(128)
DECLARE @currentOwner nvarchar(128)
SET @newOwner = 'user1'
SET @currentOwner = 'dbo'

SELECT 'EXEC sp_changeobjectowner ' + [sysobjects].[name] + ', ' + @newOwner + CHAR(13) + CHAR(10) + 'GO'
FROM [sysobjects] JOIN
[sysusers] ON
[sysusers].[uid] = [sysobjects].[uid]
WHERE xtype IN ('p','v','u','fn','tf') AND
[sysusers].[name] = @currentOwner
ORDER BY [sysobjects].[name]

Copy the Results of this query to a new query window and execute the query. Notice that the 'Go' statement is required for this to work properly, and we have to put it on it's own line. Char(13) and Char(10) make up a hard return in Windows. VB users may be familiar with vbCrLf which is the Visual Basic equivalent. It stands for Carriage Return and Line Feed.

ADO.NET Connection Pooling in ASP.NET Applications and MAX connection

2010-01-12T11:19:00.000-08:00

Connection Pooling Basics

Opening a database connection is a resource intensive and time consuming operation. Connection pooling increases the performance of Web applications
by reusing active database connections instead of creating a new connection with every request. Connection pool manager maintains a pool of open database connections. When a new connection requests come in, the pool manager checks if the pool contains any unused connections and returns one if available. If all connections currently in the pool are busy and the maximum pool size has not been reached, the new connection is created and added to the pool. When the pool reaches its maximum size all new connection requests are being queued up until a connection in the pool becomes available or the connection attempt times out.

Connection pooling behavior is controlled by the connection string parameters. The following are four parameters that control most of the connection pooling behavior:

* Connect Timeout - controls the wait period in seconds when a new connection is requested, if this timeout expires, an exception will be thrown. Default is 15 seconds.
* Max Pool Size - specifies the maximum size of your connection pool. Default is 100. Most Web sites do not use more than 40 connections under the heaviest load but it depends on how long your database operations take to complete.
* Min Pool Size - initial number of connections that will be added to the pool upon its creation. Default is zero; however, you may chose to set this to a small number such as 5 if your application needs consistent response times even after it was idle for hours. In this case the first user requests won't have to wait for those database connections to establish.
* Pooling - controls if your connection pooling on or off. Default as you may've guessed is true. Read on to see when you may use Pooling=false setting.

Closing your connections

When you intend to close your database connection, you want to make sure that you are really closing it. The following code looks fine yet causes a connection leak:

SqlConnection conn = new SqlConnection(myConnectionString);
conn.Open();
doSomething();
conn.Close();

If doSomething() throws an exception - conn will never get explicitly closed. Here is how this can be corrected:

SqlConnection conn = new SqlConnection(myConnectionString);
try
{
conn.Open();
doSomething(conn);
}
finally{

conn.Close();
}
or
using (SqlConnection conn = new SqlConnection(myConnectionString))
{
conn.Open();
doSomething(conn);
}

Did you notice that in the first example we called conn.Close() explicitly while in the second one we make the compiler generate an (implicit) call to conn.Dispose() immediately following the using block? The C# using block guarantees that the Dispose method is called on the subject of the using clause immediately after the block ends. Close and Dispose methods of Connection object are equivalent. Neither one gives you any specific advantages over the other.

When returning a connection from a class method - make sure you cache it locally and call its Close method. The following code will leak a connection:

OleDbCommand cmd new OleDbCommand(myUpdateQuery, getConnection());

intres = cmd.ExecuteNonQuery();
getConnection().Close();
// The connection returned from the first call to getConnection() is not being closed. Instead of closing your connection, this line creates a new one and tries to close it.

If you use SqlDataReader, OleDbDataReader, etc., close them. Even though closing the connection itself seems to do the trick, put in the extra effort to close your data reader objects explicitly when you use them.

Last but not the least, never Close or Dispose your connection or any other managed object in the class destructor or your Finalize method. This not only has no value in closing your connections but also interferes with the garbage collector and may cause errors

JavaScript inheritance

2010-01-06T14:15:00.000-08:00

JavaScript inheritance

Function() is the class in JavaScript; A new class “myobject” is declared as below

function myobject() {

this.containedValue = 0;

this.othercontainedValue = 0;

this.anothercontainedValue = 0;

}

And creating new object is simple OOP

var mything = new myobject();

Now you can access myobject properties as

alert(Mything.containedValue);

Or change the value

Mything.containedValue=25;

You could also now write this:
myobject.prototype.newContainedValue = someValue;

This will cause all instances of class myobject will have the property newContainedValue with value someValue.

Object with method (without using prototype)

function mycircle(x,y,r) {

this.xcoord = x;

this.ycoord = y;

this.radius = r;

this.retArea = getTheArea; //see this has a reference to a method below.

//This next line uses an alternative syntax

this.retCirc = function () { return ( Math.PI * this.radius * 2 ); };

this.mvBy = mvCclBy;

}

function getTheArea() {

return ( Math.PI * this.radius * this.radius );

}

function mvCclBy(xDis,yDis) {

this.xcoord += xDis;

this.ycoord += yDis;

}

var testcircle = new mycircle(3,4,5);

testcircle.mvBy(2,3);

window.alert( 'The area of the circle is ' + testcircle.retArea() );

window.alert( 'The circumference is ' + testcircle.retCirc() );

Object with method (using prototype)

function mycircle(x,y,r) {

this.xcoord = x;

this.ycoord = y;

this.radius = r;

}

Mycircle.prototype.getTheArea=new function() {

return ( Math.PI * this.radius * this.radius );

}; //remember the; at the end

Sub-classes and class inheritance
Example

To jump right into it, following is a sample showing inheritance between two classes:

function Mammal(name){

this.name=name;

this.offspring=[];

}

Mammal.prototype.haveABaby=function(){

var newBaby=new Mammal("Baby "+this.name);

this.offspring.push(newBaby);

return newBaby;

} ;

Mammal.prototype.toString=function(){

return '[Mammal "'+this.name+'"]';

} ;

Cat.prototype = new Mammal(); // Here's where the inheritance occurs

Cat.prototype.constructor=Cat; // Otherwise instances of Cat would have a constructor of Mammal

function Cat(name){

this.name=name;

}

Cat.prototype.toString=function(){

return '[Cat "'+this.name+'"]';

}

var someAnimal = new Mammal('Mr. Biggles');

var myPet = new Cat('Felix');

alert('someAnimal is '+someAnimal); // results in 'someAnimal is [Mammal "Mr. Biggles"]'

alert('myPet is '+myPet); // results in 'myPet is [Cat "Felix"]'

myPet.haveABaby(); // calls a method inherited from Mammal

alert(myPet.offspring.length); // shows that the cat has one baby now

alert(myPet.offspring[0]); // results in '[Mammal "Baby Felix"]'
Using the .constructor property

Look at the last line in the above example. The baby of a Cat should be a Cat, right? While the haveABaby() method worked, that method specifically asks to create a new Mammal. While we could make a new haveABaby() method for the Cat subclass like this.offspring.push(new Cat("Baby "+this.name)), it would be better to have the ancestor class make an object of the correct type.

Every object instance in JS has a property named constructor that points to its parent class. For example, someAnimal.constructor==Mammmal is true. Armed with this knowledge, we can remake the haveABaby() method like this:

Mammal.prototype.haveABaby=function(){

var newBaby=new this.constructor("Baby "+this.name);

this.offspring.push(newBaby);

return newBaby;

}

...

myPet.haveABaby(); // Same as before: calls the method inherited from Mammal

alert(myPet.offspring[0]); // Now results in '[Cat "Baby Felix"]'
Calling 'super' methods

Let's extend the example now so that when baby kittens are created, they 'mew' right after being born. To do this, we want to write our own custom Cat.prototype.haveABaby() method, which is able to call the original Mammal.prototype.haveABaby() method:

Cat.prototype.haveABaby=function(){

Mammal.prototype.haveABaby.call(this);

alert("mew!");

}

The above may look a little bit bizarre. Javascript does not have any sort of 'super' property, which would point to its parent class. Instead, you use the call() method of a Function object, which allows you to run a function using a different object as context for it. If you needed to pass parameters to this function, they would go after the 'this'.

Click event Does not work in FF

2009-12-17T11:38:00.000-08:00

You have an HTML code like this

a href="#" id="LinkClick" onclick="javascript:alert('test')" >click me

click me

and you want to call click event using Javascript

var element=document.getElementById('LinkClick');
element.click();

this approach works fine with IE, but with FF, it cannot recognize the .click method for some reason.

The code below solves this issue.

*********************************************************

var ie = (navigator.appName.indexOf("Internet Explorer") !=-1) ? true: false;
if(!ie) //if it is FF .. add a new click event manually
{
HTMLElement.prototype.click = function()
{
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);

this.dispatchEvent(evt);
}
}
//now call the click event
var element=document.getElementById('LinkClick')
element.click();

***********************************************************

SQL Server Data Types and Their .NET Framework Equivalents

2009-12-09T10:32:00.000-08:00

The following table lists Microsoft SQL Server data types, their equivalents in the common language runtime (CLR) for SQL Server in the System.Data.SqlTypes namespace, and their native CLR equivalents in the Microsoft .NET Framework.

SQL Server data type	CLR data type (SQL Server)	CLR data type (.NET Framework)
uniqueidentifier	SqlGuid	Guid
bit	SqlBoolean	Boolean
tinyint	SqlByte	Byte
smallint	SqlInt16	Int16
int	SqlInt32	Int32
bigint	SqlInt64	Int64
smallmoney	SqlMoney	Decimal
money	SqlMoney	Decimal
numeric	SqlDecimal	Decimal
decimal	SqlDecimal	Decimal
real	SqlSingle	Single
float	SqlDouble	Double
smalldatetime	SqlDateTime	DateTime
datetime	SqlDateTime	DateTime

Reading Web Config files while Unit testing

2009-12-09T08:10:00.000-08:00

In setting up the testing of core module that need to read from web.config custom settings group.

On my test project selected the properties page.

Click on the settings tab:

Click the link to auto generate a app.config file

Open the app.config file to edit:
Add the section group and type of System.Configuration.ClientSettingsSection

And copy the web.config sections and the keys to the app.config. The application will now be able to read these values while testing

Winsxs Problems

2009-11-11T15:56:00.000-08:00

Wanted to upgrade my visual studio 2008 and ran into the problem of winsxs taking up all the space on my harddrive. Fortunately the physical drive was split in two. Instance of vista 64 was on partion 1 but was the c: drive. The partion 0 had the old OS which I don't use and had already copied off. So I used gPartion to merge the two partions. Forgetting that the boot record might be on D: it was.

So the drive would not boot. I tried to use the Vista disk to recover bootmgr. The repair would not see the drive as bootable. Used the Vista install disk to locate bootsect it did under Boot. Still no luck.

Finally realized that the drive was not marked as a system drive. So using DISKPART on the install disk to set the active partion. Reboot. Set bootsect again then run the repair on the start disk which rewrote the bootmgr.

System boots now and I can log in. Ran chkdisk on start up.

Silverlight Prism V2

2009-11-08T15:11:00.000-08:00

Worked thru the SilverLight Prism v2 demo for news aggreator.
Extended it with a searh of Bing news.

First sign up for a Bing API ID

Add new project :
Add class for Bing new;

namespace NewsAggregator.Bing
{
/// <summary>
/// Defines the properties in Bing search result
/// </summary>
public class Bing
{
          public string Title {get;set;}
        public Uri HrefLink {get;set;}
          public string Source {get;set;}
          public string Snippet {get;set;}
          public DateTime StoryDate {get;set;}
          public bool Breaking {get;set;}
}

}

Add Class for the Bing Module that inherits from IModule of Microsoft.Practices.Composite.Modularity

namespace NewsAggregator.Bing
{
public class BingModule : IModule
{

IUnityContainer _container;
IRegionManager _regionManager;

public BingModule(IUnityContainer container, IRegionManager regionManger)
{
_container = container;
_regionManager = regionManger;

}

public void Initialize()
{
_container.RegisterType<IBingService, BingService>(new ContainerControlledLifetimeManager());
_regionManager.RegisterViewWithRegion("ResultsRegion", typeof(BingSearchResultsView));
}
}
}

Add User Control BingSearchResultView

namespace NewsAggregator.Bing
{
public partial class BingSearchResultsView : UserControl
{

public BingSearchResultsView(BingSearchResultsViewModel model)
{
InitializeComponent();
DataContext = model;
}
}
}

The Xaml should have a Title Text box and snippet text box Bind them to the corresponding property.

<Grid x:Name="LayoutRoot" Background="White">

<ListBox x:Name="BingList" Style="{StaticResource BingList}" ItemsSource="{Binding Bings}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">

<TextBlock Text="{Binding Title}" Margin="5" Style="{StaticResource TitleBlock}"/>

<TextBlock Text="{Binding Snippet}" Margin="3" />

<Line Stroke="DarkOrchid" Width="300"></Line>

<HyperlinkButton NavigateUri="{Binding Source}" Content="{Binding Title}" TargetName="_new"></HyperlinkButton>

</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

</Grid

Add Class BingService inherits from IBingService interface

namespace NewsAggregator.Bing
{
public class BingService : IBingService
{
string ApiID = "Insert your API ID here";
XNamespace ns = http://schemas.microsoft.com/LiveSearch/2008/04/XML/news;
#region IBingService Members

public void BeginSearch(string searchQuery, Action<System.Collections.Generic.IEnumerable<Bing>> SearchCompleteCallback)
{
WebClient BingClient = new WebClient();

Uri BingUri = new Uri(string.Format("http://api.search.live.net/xml.aspx?Appid={0}&query={1}&sources=news", ApiID, searchQuery));

BingClient.DownloadStringCompleted += (sender, e) => SearchCompleteCallback(BuildList(e));

BingClient.DownloadStringAsync(BingUri);

}

private IEnumerable<Bing> BuildList(DownloadStringCompletedEventArgs e)
{
if (e.Error != null)
{
return new List<Bing>() { new Bing() { Title = e.Error.InnerException.Message } };
}

XDocument xmlResults = XDocument.Parse(e.Result);

var newBings = from elem in xmlResults.Descendants(ns + "NewsResult")
select new Bing()
{
Title = ((string)elem.Element(ns + "Title")).Trim(),
HrefLink = new Uri(((string)elem.Element(ns + "Url")).Trim()),
Source = ((string)elem.Element(ns + "Source")).Trim(),
Snippet = ((string)elem.Element(ns + "Snippet")).Trim(),
StoryDate = DateTime.Now,
Breaking = false,
};

return newBings;

}

#endregion

}

}
namespace NewsAggregator.Bing

{

public interface IBingService

{

void BeginSearch(string searchQuery, Action<IEnumerable<Bing>> SearchCompleteCallback);

}

}

The Interface BingService

namespace NewsAggregator.Bing
{
public interface IBingService
{
void BeginSearch(string searchQuery, Action<IEnumerable<Bing>> SearchCompleteCallback);
}
}

JAD (JAva Decompiler)

2009-11-05T11:42:00.001-08:00

Jad (JAva Decompiler) is a decompiler for the Java programming language. Jad provides a command-line user interface to extract source code from class files. A graphical user interface for Jad is JadClipse which is a plugin to the Eclipse IDE.

The domain name used by the official website expired on 02/25/2009.

The most recent version of JAD says it supports only Java versions 45.3, 46.0 and 47.0, not Java 5.

What's new in IE 8: DOM Storage

2009-11-03T10:06:00.000-08:00

When you store information for a particular user, it is customary to use either cookies for prolonged storage, or session variables to short-term. In HTML 5 this is a feature called DOM Storage and makes it possible to store information in a different way. Cookies can eg be 4 kb or a maximum of 20 values, but with DOM Storage you can store up to 10MB on the client, making it possible to store information other than in the past have been able to do.

It is just like the past to save the session or permanently. For the session so used Session Storage and more permanent local storage. They have the same methods, but only stores information in different ways.. All information is stored as strings, so we want to use such dates or different types of speech, we must typa of variables before use.

Storage object contains these methods:

* Clear: Removes all values from a storage-object.
* GetItem: Retrieving the value of the current key.
* SetItem: Sets a value for the current key.
* RemoveItem :Removes the value with the current key.
* Key: Returns the key for that particular index. R
* Length:Retrieving the number of values that are saved.

Both the Local Storage and Session Storage can use these methods.

To use these, we can bring value directly on the object:

localStorage.firstname = 'Michael';
alert (localStorage.firstName);

This shows an alert box with "Michael". This shows an alert box with "Michael".

Do we want to remove this particular value, we can then use the removeItem:

localStorage.removeItem ( 'firstname');

Thus, we can in a very simple way to store large amounts of data, in a manner reminiscent of cookies and session variables.

Halloween 2009

2009-10-30T14:03:00.000-07:00

Halloween potluck 2009 @ Topia Technology

Halloween potluck 2009 @ Topia Technology

Flex Resources Event Listner clean up

2009-10-29T10:18:00.000-07:00

When using addEventListener, set useWeakReference=true.

Objects should be eligible for GC if the only active reference is an event listener.

Web addresses may adopt non-English characters

2009-10-26T11:14:00.000-07:00

The Internet may be getting friendlier for a significant chunk of the world. A proposal is up for a vote to let Web addresses use non-English characters.

The proposed change (PDF), known as Internationalized Domain Names (IDNs), will allow the use of non-Latin characters in the entire address. Currently, such characters are allowed only in part of the address. IDNs will let people who write in Chinese, Korean, or Arabic use their own languages to surf the Web, and is expected to jump-start Internet use in many regions across the globe.

ICANN, the Internet Corporation for Assigned Names and Numbers, which is responsible for managing domain names on the Net, will review the historic, hot-button proposal on Friday at its six-day 36th International Public Meeting in Seoul. If approved, IDNs could kick in as early as mid-2010.

"This is an extremely important meeting for ICANN, since the IDN program is moving one step closer to reshaping the global Internet landscape," ICANN CEO Rod Beckstrom said in a statement. "In Seoul, we plan to move forward to the next step in the internationalization of the Internet, which means that eventually people from every corner of the globe will be able to navigate much of the online world using their native language scripts."

IDNs are not a new concept. They've been debated for at least a decade. Some doubted whether such a system could work. But countries like China have taken the lead in pushing for this change.

Of the 1.6 billion Internet users worldwide, more than half use languages with character sets other than Latin. Beckstrom sees the change as necessary, not just now, but for the future as Internet use continues to grow.

One of the challenges behind IDNs has been the use of translation technology to convert one character set to another to deliver the right address. But ICANN seems to have covered that base.

"We're confident that it works because we've been testing it now for a couple of years," Peter Dengate Thrush, chairman of ICANN's board, said in a statement. "And so we're really ready to start rolling it out."

src: http://news.cnet.com/8301-1023_3-10382873-93.html

Adobe launches BrowserLab...

2009-10-26T08:13:00.000-07:00

Adobe launches BrowserLab...

Adobe launched a free site recently named BrowserLab. It renders webpages in various browsers, for a side-by-side comparison, without having all of the browsers installed on your machine.

The rendered pages are just images, so you can not test how a page functions by clicking links or buttons, but it is a good tool to compare CSS and get that tightened down.

You need to sign up for an account, but it is free to use.
It includes all the browsers BIS supports, including IE6 and Mac browsers.

Check it out...
https://browserlab.adobe.com/index.html#

Flex: Mouse Move Event and Slow Rendering

2009-10-19T11:09:00.000-07:00

In flex, if you using Mouse move event to redraw anything .. You might have experienced very slow rendering .

eg:

this.addEventListener(MouseEvent.MOUSE_MOVE, redraw);

and

public function redraw(anything:Object=null):void{
//draw something here
this.graphics.clear();
this.graphics.lineStyle(3, 0x000000);
this.graphics.moveTo(startPoint.x, startPoint.y);
this.graphics.lineTo(endPoint.x, endPoint.y);
this.scaleTextInput.x = centerPoint.x;
this.scaleTextInput.y = centerPoint.y;

}

The Above code results very slow rendering ...

Solution:

Use Event.ENTER_FRAME event instead? Although more resource intensive than the mouse move event, you should receive considerably more updates per second, allowing the mouse to appear more responsive to the user:

Eg:

this.addEventListener(Event.ENTER_FRAME, redraw); instead of

this.addEventListener(MouseEvent.MOUSE_MOVE, redraw);

and You are good to go ..Happy Flexing

Generating long, high-quality random passwords is not simple. So here is some totally random raw material, generated password

2009-10-19T11:07:00.001-07:00

Generating long, high-quality random passwords is
not simple. So here is some totally random raw
material, generated just for YOU, to start with.

go to

https://www.grc.com/passwords.htm

SQL Reporting Services Parameter sniffing

2009-10-16T11:02:00.000-07:00

If your Stored procedure runs fast in SQL server management studio but takes forever to run from Visual studio while using Reporting Services. Then you are the victim of “Parameter Sniffing” Problem.

Original query:

create proc newProc
{

@name varchar(200)

}

as

select name from nametable where name=@name ..

go

Solution:

Don’t use stored procedure parameter directly to the Query:

Create a local variable with same type and assign parameter to that variable.

create proc newProc
{
@name varchar(200)
}

@declare @newName varchar(200)

set @newname=@name

as

select name from nametable where name=@newname

go

To Box Or Not To Box

2009-10-16T10:36:00.000-07:00

Boxing is a term that means that a copy of a value type is stored in the managed heap and the address is assigned to an object as a reference type. Boxed values do not reference the original values and are therefore deep copies, so to speak.

Unboxing is a term that means the object is dereferenced and the value is stored on the stack (for local variables). Thereby reversing the boxing that occurred.

This type of behavior is handled by the compiler and can be noticeably slower on large or numerous collections. Passing a value type to a function that takes an object can create the boxing effect.

So, in fact, boxing is not necessarily a planned action on the part of the programmer.

Incidentally, in Generics, it is possible to avoid boxing in many cases that would not have been forthright before.

Case in point, take a look at this code:

List<int> intList = new List<int>(); intList.Add(3); Console.WriteLine(intList[0]);

ArrayList arrayList = new ArrayList(); arrayList.Add(3); Console.WriteLine((int)arrayList[0]);

Here’s the MSIL code equivalent:

IL_0000: nop IL_0001: newobj instance void class [mscorlib]System.Collections.Generic.List`1::.ctor() IL_0006: stloc.0 IL_0007: ldloc.0 IL_0008: ldc.i4.3 IL_0009: callvirt instance void class [mscorlib]System.Collections.Generic.List`1::Add(!0) IL_000e: nop IL_000f: ldloc.0 IL_0010: ldc.i4.0 IL_0011: callvirt instance !0 class [mscorlib]System.Collections.Generic.List`1::get_Item(int32) IL_0016: call void [mscorlib]System.Console::WriteLine(int32) IL_001b: nop

IL_001c: newobj instance void [mscorlib]System.Collections.ArrayList::.ctor() IL_0021: stloc.1 IL_0022: ldloc.1 IL_0023: ldc.i4.3 IL_0024: box [mscorlib]System.Int32 IL_0029: callvirt instance int32 [mscorlib]System.Collections.ArrayList::Add(object) IL_002e: pop IL_002f: ldloc.1 IL_0030: ldc.i4.0 IL_0031: callvirt instance object [mscorlib]System.Collections.ArrayList::get_Item(int32) IL_0036: unbox.any [mscorlib]System.Int32 IL_003b: call void [mscorlib]System.Console::WriteLine(int32) IL_0040: nop IL_0041: ret

Notice the difference for the generic list that uses int in that it does not use box/unbox in the MSIL code, whereas the generic list that uses object does (IL_0024 & IL_0036).

BISC dev team thoughts

2009-10-16T09:43:00.000-07:00

This a simple resource for our Dev team to share our hard learned knowledge with each other and the world.

The devs include Deepak, Pat, Rick, Scott and Tim each will be posting thought tips and tricks we've gleened from our daily work producing Web applications.