Daniel Insley

This is my personal blog. I enjoy mountain biking, gaming, music, and playing around with new technology. I currently work for Viviti.

Blog posts in General

Viviti Navigation Component Hover Menus

Posted on April 16, 2009 at 03:25PM

Recently there have been some customers that have been asking if there's anyway to have javascript hover menus for their navigation on their Viviti websites. During the last release we've made the jQuery Superfish plugin available on your websites so that it's easy to get it working with as little work as possible.

In order to activate the hover menus for all of your navigation components you can follow the directions on the Viviti wiki page titled, Creating Navigation Component Hover Menus.

Markaby and Rails 2.3.2

Posted on April 16, 2009 at 10:08AM

I just pushed up some fixes to my Github repo for use with 2.3.2.

The changes made are not backwards compatible with older versions of rails. If you're using an older version of rails and are following my repository you should not upgrade to this version unless you're updating to the latest version of rails.

http://github.com/dinsley/markaby/tree/master

If anyone finds any problems, just let me know.

SWFUpload and Flash 10

Posted on October 20, 2008 at 09:39AM

With the recent release of Flash 10 by Adobe, a change in security regarding FileReference.browse broken SWFUpload. The details of the security changes are out lined at the following address: 

http://www.adobe.com/devnet/flashplayer/articles/fplayer10_security_changes_02.html#head3

Any existing content that invokes a browse dialog box using FileReference.browse or File Reference.download outside of an event triggered by user interaction will need to be updated. The dialog box now has to be invoked directly through a button, keyboard shortcut, or another event directly initiated by the user on the flash video.

If you're using a image button for your 'File selection' link, you'll need to add the following to your SWFUpload instance settings:

      button_image_url: "../images/buttons/add_files.png",
      button_width: "80",
      button_height: "30",
      button_placeholder_id: "swfuploadContainer"

The button image should be formatted as Active, Hover, Click, and Disabled states. An example is included in the samples/buttons directory from SWFUpload trunk:

If you're just using a text link for triggering the selectFiles dialog, you can just use the following settings:

      button_text: "Select files for upload",
      button_placeholder_id: "swfuploadContainer"

The button_placeholder_id specified will be replaced with the flash object that is not the selectFiles link.

You'll need the latest version of SWFUpload in order to make these changes. You can checkout the latest version by issuing the following command:

svn checkout http://swfupload.googlecode.com/svn/swfupload/trunk/ swfupload

Native OS X gitk clone

Posted on September 12, 2008 at 01:47PM

GitxGithub is currently featuring an awesome native OS X gitk clone. The application matches most of the feature set of gitk as far as I can see, and it also loads up the repositories quite a bit faster.

I'll definitely be using this instead of gitk from now on. You can download the latest stable release by clicking here, or take a look at the project page on by visiting http://github.com/pieter/gitx/wikis.

Javascript debugging in Internet Explorer

Posted on May 26, 2008 at 09:25PM

We're just coming up to finishing a two week iteration of mostly browser compatibility fixes on Viviti, mostly for Internet Explorer. I've poked around quite a bit trying to find anything that even comes close to the glory that is Firebug for Internet Explorer, but I've come up empty handed for the most part. I did find some useful software that can help your Javascript debugging crusades in Internet explorer, I'll outline the test setup and javascript debugging tools below!

Testing enviroment setup

I'm using Virtualbox for my Virtual machine, it's free, seems pretty stable, and is available on a variety of platforms. I'm using it on my Linux box at work, and my iMac at home without any problems. Next up is getting all those different versions of Internet Explorer! The following website has a handy package called Multiple IE that will install all the different versions of IE that you may, or may not want to support. Finally, I have Fiddler installed on there. I've found it particularly useful in debugging the HTTP response and request headers of AJAX requests.

Javascript debugging tools

Normally when a javascript error occurs it would be nice to know what file and line it happened on. The best thing I've found to track that down in Internet Explorer (as well as provide some handy basic debugging functionality) is Visual Web Developer Express 2008. Unfortunately this free version of the Visual Studio debugging isn't actually intended for use on projects created outside of it. Fortunately it is possible to use it on outside projects using the steps outlined on berniecode.com's How to debug javascript with Visual Web Developer Express blog post.

Lastly, there is some Firebug functionality that you can get in Internet Explorer. Firebug Lite supplies the ability to access basic console functions that are pretty handy for debugging (it beats alerting!). The only downside is that Firebug Lite is actually a javascript file that must be included while you're actually doing your debugging. Just don't forget to remove it when you're done!

Conclusion

Leave a comment if you have any other 'must have' tools for Javascript debugging in Internet Explorer, or have any questions about the above software!

TinyMCE button labels

Posted on April 8, 2008 at 02:02PM

While working on getting TinyMCE configured for viviti.com, we found that some of the buttons in TinyMCE weren't exactly clear in what they were intended for. We decided that we'd need to put a label beside the buttons we felt needed more explanation. There wasn't that many changes needed to get this functionality in there, and it actually looks pretty good.

You can play around with the example page here. It works for both the advanced and simple themes of TinyMCE, and for the default theme. I haven't gotten it working under the o2k7 skin yet due to the way the background is done for the buttom images.

In order to add a label to a specific button you just need to do add label to the associative array parameter of your createButton call:

cf.createButton('cleanup', { title : 'simple.cleanup_desc', cmd : 'mceCleanup', label : 'Cleanup Code' })

 

I've modified the editor_template_src.js of the advanced theme to allow the fourth element of the controls associative array (starts on line 16) to be set as the label. So if you'd like to set the new document button to have a label you'd need to change it to read:

controls : {
  bold : ['bold_desc', 'Bold'],
  italic : ['italic_desc', 'Italic'],
  underline : ['underline_desc', 'Underline'],
  ... ( Skipping the displaying of alot of them so it doesn't take up too much space)
  newdocument : ['newdocument_desc', 'mceNewDocument', null, null, 'New Document'],
  blockquote : ['blockquote_desc', 'mceBlockQuote']
}

The second and third indexes of each control item are being used to set the ui and the value values. I'm not totally sure what those two options are for, but in order to provides backwards compatibility I'm using the forth index.

Once I have the patch working with the o2k7 skin I'll submit it to the TinyMCE sourceforge and hopefully it'll get merged into their next release.

If anyone wants the patch file in the meantime, feel free to shoot me an email at dinsley [at] gmail.com.

Installing Git on CentOS 4.6

Posted on March 29, 2008 at 06:29PM

I currently have a VPS that has CentOS installed and went to install Git via Yum, but it didn't seem to have it in the default repos. I've tracked down the following repos and you just need to follow the steps below and git will be installed in a snap:

 $ sudo touch /etc/yum.repos.d/atrpms.repo /etc/yum.repos.d/dag.repo

And then you need to copy the following repository definitions into their respective files:

[atrpms]
name=ATrpms for Enterprise Linux $releasever - $basearch
baseurl=http://dl.atrpms.net/el$releasever-$basearch/atrpms/stable
enabled=0
gpgcheck=1
gpgkey=http://ATrpms.net/RPM-GPG-KEY.atrpms

[dag]
name=Dag
enabled=0
baseurl=http://dag.freshrpms.net/redhat/el4/en/$basearch/dag
http://ftp.heanet.ie/pub/freshrpms/pub/dag/redhat/el4/en/i386/dag/
gpgcheck=1
gpgkey=http://dag.wieers.com/packages/RPM-GPG-KEY.dag.txt

Once this is done all you'll have to run is the following command and git will be installed:

$ yum --enablerepo=dag --enablerepo=atrpms install git

Ruby standard out piping problems on Ubuntu

Posted on March 29, 2008 at 06:25PM

I've been having problems where the output of binaries was not being redirected properly from within Ruby when invoked as followed:

  >> `ls -l &> /dev/null`
  => "total 4 drwxr-xr-x 2 dinsley dinsley 4096 2007-05-08 20:00 Peepcode - Rest"

If the shell supports this piping convention, it should return the following:

  >> `ls -l &> /dev/null`
  => ""

Ubuntu currently ships with the '/bin/sh' symbolic link pointing to '/bin/dash' with the reasoning that it executes scripts somewhat faster than bash. There are some drawbacks to this. One of these is that stdout redirection of output from the binary will not be redirected to /dev/null if redirecting it via &>, as it isn't supported in dash.

To fix this, all you need to do is remove the existing symbolic link to dash and replace it with a link to bash instead:

  $ sudo rm /bin/sh
  $ sudo ln -s /bin/bash /bin/sh

TinyMCE syntax highlighted code editor

Posted on March 29, 2008 at 02:01PM

We're currently using the super-improved TinyMCE version 3.0rc1, which apparently has gone through an entire rewrite for the 3.0 release. Aside from making TinyMCE incredibly faster and more efficient, they also implemented an awesome API for easily creating plugins. I decided to test the new API out with an improved code editor that utilizes Codepress.

Image

You can click on the above screenshot to see it in action. I've packed the full Codepress download into the plugin. There was some minor modifications made to the Codepress javascript for styling the iframe, but you should be able to easily drop in an upgraded version without too much of a problem.

I've only been able to test this in Firefox 2.0.0.11, so if you have any problems with any other browsers please leave a comment and I'll try and sort them out. There's only really one other thing I'd like to add to the plugin and that's the ability to wrap the text. There's currently a feature request on Sourceforge for code wrapping inside of Codepress, so maybe I'll poke around and see if I can implement it and submit a patch back to them.

For any problems with the code editor itself, you should contact the authors of Codepress. If there's any problems with the plugin itself then feel free to leave a comment.

The plugin will only work with 3.0rc1 or greater.

Download: advcode_0.1.tar.gz

Displaying all 9 posts


powered by viviti

danielinsley.com