jQuery Mobile Carousel - Sencha Style

So it has been a common question on the jQuery mobile forums about how one could actually recreate the Sencha style carousel.

I have quickly whipped up a carousel plugin for jQuery and jQuery mobile that uses the iPad jQuery UI touch plugin to capture mobile touch events.

This plugin works and has been tested on Chrome 9.0.597.19 beta (Mac), Safari 5.0.2 (Mac), FireFox 3.6, 4 (Mac)

Demo: http://jsfiddle.net/blackdynamo/yxhzU/
Source Code (Git): https://github.com/blackdynamo/jQuery-Mobile-Carousel

jQuery Mobile - Programmatic Page Transitions Pt. 2

In my post jQuery Mobile - Programmatic Page Transitions Pt. 1 I answered a question in how one can programmatically navigate using jQuery mobile and select their page transitions. Now that jQuery Mobile 1.0a2 is out, some additional methods and utilities have been added.

You can find the additions here: jQuery Methods and Utilities

You no longer need to create a dom element and click it to cause a page navigation with a specified transition. The jQuery team has provided us with a new method to cause a page navigation.

jQuery Mobile - Swipe Up, Down, Left, Right

jQuery Mobile natively provides us with the ability to capture the swipeleft and swiperight. It does not however offer us swipeup and swipedown out of the box. Adapting what the jQuery team has done for swipeleft and swiperight, we are able to create and capture those events in the same manner. See the following code to implement swipeup and swipedown:
Note: I have now moved the plugin to GitHub so if anyone wants to collaborate, they are more than welcome.

jQuery Mobile - Programmatic Page Transitions Pt. 1

Working a few weeks now with jQuery mobile, I find myself loving it more and more. Today I came across an issue though. How would I mimic the action clicking a link. Why would I want to do this do you ask? Well in jQuery mobile, you can specify the link and the transition you would like to navigate to as long as it is an element on the page. jQuery mobile then handles the click on those buttons and links to make sure that they cause the proper transitions. What if you don't want a button to cause the transition?

With some initial digging, I came across the fact that jQuery mobile watches the hashchange event. This event is fired when the location.hash ends up changing. I found this and was like perfect!



Voila! Programatically changing pages and jQuery navigating for me. Unfortunately this wasn't good enough. How do I make page transitions happen other than "slide"?

More digging occurred and a simple solution arose. jQuery mobile actually exposes a new method called ajaxClick. This is a jQuery.fn extension method. How we can use this to solve the problem of programatically transitioning is as follows:

How To: Remove Halo/Highlight Around Dom Elements

Now that I have started developing mobile applications and jumping into the jQuery Mobile space, I have really started to notice an irritation for the Halo/Highlight around elements on an Html page.

jQuery Mobile makes good use of this feature, but sometimes it appears when you do not want it to. To remove glowing halos or highlights from elements on the dom, use the following simple css:

selector{
outline: none 0px;
}

IE9 breaks Cufon!

Yes it is true. Cufon breaks in the new beta release for IE9. The Cufon team has been quick to find a fix for the problem. Please see their fixes here to find out how!

Ektron and IE9 Support

As we all know, IE9 beta 1 was released a few days ago. We have to give Microsoft a thumbs up for producing a somewhat decent upgrade to their all known terrible browser. Unfortunately this release, although in beta, causes some usability issues with the Ektron workarea. These usability issues can be fixed however, temporarily. You can modify the workarea aspx files to force IE9 to render in IE8 or IE7 mode. Simply add the following to the pages in the head.



You may also post any concerns you may have at the Ektron blog here

Windows VPN equals no Internet connection

Doing some side work for a company, I have been granted VPN access. I am to connect to the VPN using the built in Windows VPN connection client instead of a third party tool such as Cisco.

Once I entered all my credentials, I attempted to connect to the VPN...voila!! I connected without a hitch...or so I thought. I went to check my mail once connected to the VPN and Gmail was having difficulties connecting. WTF?! I can't connect to Google either. I disconnect from the VPN and everything is back to normal. This is kind of unacceptable, but there is a solution. Follow the steps on this blog to solve the issue: http://www.rickglos.com/post/Work-VPN-kills-Internet-connection.aspx

Agile: Boards? Walls? Can't put anything on the wall?

Working at various places you come across certain departments that have rules that do not make sense. Well maybe they make sense but they might not make sense to you. One of the places I worked had a strong restriction on putting things up on the wall. Working in an Agile environment entails using TONS of wall space. From iteration walls to burn(down)/(up) charts and even design flats, walls are necessary.

One day I walked in the morning and saw that someone had actually written on the wall. Insert vulgarity !!! Whoever did that is gonna get it. I was actually quite excited to find out who would soon receive the impeding doom. After some closer inspection, I was excited to see that the writing wasn't actually on the wall, but on white board styled paper that was stuck to the wall. At this point I was interested in how it would actually stick to the wall. Static. Static is the magic that makes it all work. The sheets stick to the wall and paper/stickies stick to the sheets. No tape. Amazing.





Smart Sheets a simple dynamic white board replacement. "They're your whiteboard, communication, brainstorming, artwork, doodlepad and advertising vehicle all rolled up in one!"

NivoSlider: A jQuery Image Gallery (Slider) Plugin

NivoSlider by Gilbert Pellegrom is an incredible plugin for providing a transitioning slideshow or slider to your visitors. Highly customizable with tons of options and transition effects, this is a must have plugin. The gap between what Flash can do over Javascript is shrinking on a daily basis.

Basic Example:

Dynamic Breadcrumbs?!

Have you ever been in a situation where one of the business requirements were breadcrumbs? Most people would answer yes. The funny thing is everyone you talk to, doesn't really have a good solution to handling the little trail of bread.

My current situation was a little more challenging in the sense that I needed dynamic breadcrumbs that would work for fixed pages as well as Cms controlled pages. Cms pages that use Url aliasing. Attempts to use .Net server code to build the breadcrumbs were successful until Url aliasing was involved.

The solution. A jQuery plugin. I searched for two days for a viable solution to dynamic breadcrumbs. Unfortunately there weren't any that I could find. The internet was however, littered with breadcrumb plugins that make your breadcrumbs look cool, of have funky drop down menus. None of them dynamically built a simple trail automatically.

I decided to write my own plugin called: jQuery Dynamic Breadcrumbs!

Creative? I know. Sometimes I even amaze myself. The project is hosted on Google code at jQuery Dynamic Breadcrumbs

The basic idea is using a nicely formatted folder structure/url aliasing. Creating a Url that is easy for a visitor to understand should be more than enough of an indicator that you don't need breadcrumbs, but some people just love the things.

Underused C# feature: string.Format and custom formatters

There are developers out there who get classified as being lazy. I got called being a lazy developer when adding an Extension method to decimal types to convert to some Html formatted string.

Example:


This makes the code look clean and is pretty simple to understand for any other developer to come in later and know what is being done. The problem is that other developers may consider this abuse or misuse of Extension methods. "Why should a decimal know how to convert itself into a certain type of string?"

Enter the string.Format method and a custom formatter. string.Format can take in any argument, a format, and custom formatter, then return you the string equivalent for that argument. Although I agree that this is a more appropriate approach that doesn't make it a cleaner solution. In my opinion only.

You would make the call like this:


Although it works and is the proper solution in this case, it's ugly.

I am open to other solutions to this scenario, so if you have a good solution please post in the comments.

Here is a full example of how to implement a custom formatter to use with string.Format.

Test Class (MS Test):


Custom formatter implementation example:

Javascript delegate and extending jQuery with a delegate method

Delegate function:



If you are using jQuery, you can extend a method to the jQuery object to use throughout your application. Below I create a jQuery delegate extension method plugin:



An example of somewhere you would use the delegate method:



EAVB_ZZVSGDKQRZ

Developing MonoTouch applications in Visual Studio

I have been playing with MonoTouch and haven't gotten all too far. I get the concepts of the XIB files and the C# is your typical syntax. My concerns are a lot with productivity. Keyboard shortcuts, refactoring, addons like ReSharper, etc. Those things become a crutch when you are hammering out work for clients and you need to do it fast.

If you are a ReSharper user or anything of the sort, I am sure you have come into a situation where you have a fresh installation of Visual Studio, yet no ReSharper, your client doesn't have licenses and doesn't allow you to use yours. That is the feeling of developing with MonoDevelop and MonoTouch. Of course you finally convince them to buy some licenses, and then you get to working. Well ESCOZ has come up with that convincing part. Although I have not tried it myself, I wanted to post it for anyone else who might be interested.

(I still think it is annoying that I have to buy a Mac, just to develop iPhone/iPad apps)

Web.config files and legacy products

I've been working with a CMS product called Ektron CMS400.net for the last couple months. Well that's a lie. I haven't been using it the entire time. A lot of the time has been spent just getting the product up and running in our environment. We will save all that for maybe another post.

This post is about upgrading legacy product web.config files to work with newer technologies. This particular instance revolves around the ability to use "var" and extension methods available in .Net 3.5 in the actual inline code of an aspx page.

The scenario is that I wanted to create a wrapper extension method to string that I would pass in a string tag name and it would wrap the string with the appropriate tag based on that name. I did this and everything works when in cs files. That changed when it came to consuming the same extension method inline.

The following piece of code threw a "'System.string' does not contain a definition for 'WrapWithTag'" error:


I then did some quick Googling to find out what I could do to fix this, or even if I could. AHA! I found it. It was due to the missing lines in the web.config file. Below you will see the difference between the standard 2.0 Web.config file to a 3.5 version. (The Web.config file I was working with was a monstrosity in comparison)

.Net 2.0 Standard Web.config file:


.Net 3.5 Standard Web.config file:


The actual piece that I needed in my Web.config file was:


This piece ensured that the ASP.Net compiler would run .Net 3.5 instead of 2.0.

snipt! Where were you when I first started posting code online!

I am sure there are many tools out there to allow embedding code hosted somewhere else with cool color coding. The one I recently came across is Snipt. It is pretty simple and easy to use. If you have any others that work just as nice please comment!

MonoTouch...A .NET (C#) developers dream for building iPhone apps

I have finally got the Mac all up and running how I would like it. I think there will be a lot of changes as soon as I really start using this thing. My next steps were to get the iPhone SDK, Mono Framework, and MonoTouch installed so that I could get to making iPhone apps.

You will need to do a few things in order to start developing with MonoTouch

• Intel Based Mac running either Leopard (OSX 10.5) or Snow Leopard (OSX 10.6)
  • The iPhone SDK is only available for OSX
    
• Apple iPhone SDK 3.0+ (http://developer.apple.com/iphone/)
• The latest version of the mono framework (http://mono-project.com/Downloads)
• MonoTouch SDK
  • Licensed version: http://monotouch.net/Store
  • Trial version (If you aren't ready to sell on the app store or put to production you do not need a Licensed version. Learning MonoTouch can be done using the trial version and run on the iPhone simulator): http://monotouch.net/DownloadTrial
• Any IDE such as MonoDevelop, XCode, or any Text Editor
  • MonoDevelop: http://monodevelop.com/Download/Mac_MonoTouch

To get started with a simple "Hello World" application. See Getting started with MonoTouch on CodeSnack.

Got a mac...but it isn't mine...

I have acquired a MacBook Pro from some friends so that I can start dabbling into the iPhone dev market. I have used Mac's in the past, but not as a full time system.

Now that I have this machine, I am trying to set it up the make it as my main machine at work. The first step was HOW THE EFF do I RDP into a PC machine. The answer is quite simple, CoRD. CoRD is an RDP application that seems to be recommended as one of the better utilities to RDP.

This was the first step in getting acquainted with my Mac.

More to come...

Linq to Xml Stress!

So it has been a while since I have written anything, but the issue I just over came was enough to write home about.

My task was to parse some Xml into an object. We all love using the new ways of doing things. I chose to use Linq to Xml. Now I have been using this method for some time now, making life parsing Xml quick and easy.

The problem that I came across was if you lack the control of what that Xml will look like and it is not properly Html Encoded. Linq to Xml does not include the InnerXml property that was once available on XmlElement.

After looking through every available method and property available on the XElement, I thought my life was over and was going to be forced to hack out a solution. The latter is still somewhat true, but the hack has been nicely implemented using an extension method called InnerText.

Below is the code used to generate the InnerText solution, this being the fastest of other solutions such as using a StringBuilder