You may have seen the Analog.coop site recently and found some of the easter eggs, like the grid hot keys. I loved the concept, and made a mental note to spend some time reverse engineering/rebuilding it for my own uses. Well it just so happens that the guys at Analog have released the #grid on Github, which is great because it made it easier for me to adapt the code and do some small improvements.
I’ve been working on a client project that involved some reasonable amount of SVG/VML work. In order to make my life more sane, I’ve been using Raphaël JS to do what it does best, which is provide a great API for making sexy vector graphics.
Creating ajax pagination has gotten more simple and flexible for 1.3. In 1.2 you could only use the built in Ajax pagination if you were using Prototype as your javascript library. With the addition of the JsHelper you can use any Javascript library that an engine has been implemented. My example today will be using mootools. I’ll be basing this, off of a freshly baked index view using the default core templates.
Drag resizing is a great interface interaction for web apps using panes, or window regions. Most Javascript libraries have convenient and simple methods to make drag-resizing a snap. However, what if you didn’t have a library at your disposal or were just interested in how to implement this interaction, just for the sake of knowing? Well I did just that when I implemented drag resizable panels for DebugKit 1.
While I’m a big fan of Mootools I work on a few projects using jQuery, and have recently been working on a project that needed a custom markup editor. I’m a big fan of the markItUp editor. Its a flexible and easily extensible editor, that affords a great deal of features in a small package.
Hopefully by now you’ve used DebugKit , and found it to be as useful as I do. If you’ve ever wanted to add a new panel, you can and its actually quite easy to do.
Events are the bread and butter of interactive websites. However, attaching and detaching events to the DOM can create memory leaks and performance issues due to time spent attaching events. This normally is not an issue, unless you are binding a large number of events.
If you’ve ever worked on a medium to large Ajax application, you know the headaches that Javascript can give you. On one hand you want to serve as few as possible Javascript files to users, but on the other you want to keep your sanity and work with lots of smaller files. This is where a build process comes in. It allows you to transform lots of files into one big file! You can even minify the big file for additional savings.
So much like the last one , this article is going to focus on a piece of the javascript language that I had trouble understanding, and may be a point of confusion for you. Today I’ll be looking at closures and lexical scoping. Last time, I mentioned that Javascript has more in common with functional languages, than classical languages.
My current work at CakeDC allows me to be on IRC a lot – like all day. And while I’m often quite silent during the day, I do scan through a few PHP related channels and I’ve noticed a trend of PHP developers who just don’t get Javascript. Either they don’t have the experience, or they do have experience and think its icky.
I like many webdevelopers build a lot of forms. Forms are the bread and butter of web applications, and while making forms is getting easier for developers, users often still have a hard time with them. In these circumstances it is necessary to give them a help above and beyond ‘password’.
Creating gracefully degrading Javascript and CSS is pretty simple these days. I’m sure this has been written about a million times over as well. However, I thought it would be worthwhile to share how I do it as well. Mainly, because in addition to AJAX and effects I use Javascript as a way of enabling different CSS selectors for elements.
GeSHi or the Generic Syntax Highlighter is a simple yet powerful syntax highlighter for many languages. Implemented in many CMS. When I wanted syntax highlighting for my postings I decided to implement GeSHi. I wanted to share my implementation of GeSHi as a CakePHP helper.
Well the redesign and rebuild is complete. I’ve gutted my site and rebuilt it from the ground up. There are more changes than just a shiny new design though. With this redesign I’m shifting the focus of the site around a bit as well.