Nothing Insightful

  • Archive
  • RSS

Repository Updates

iOS Theme for jQuery Mobile

Good news! I’ve just pushed some major changes for my iOS jQuery Mobile theme. It now works with jQuery Mobile 1.1.0, which was a bit of a struggle. It also forced me to do some major code cleanup, delivering cross browser gradients and various enhancements I had been putting off.

A full list of changes and resolved bugs follows:

  • Supports jQuery Mobile 1.1.0 (this was a nightmare)
  • Code cleanup more strictly obeys my coding conventions
  • All gradients and effects are now cross browser compatible (Issue #2)
  • Updated slider toggle to iOS 5 style (Issue #7)
  • Got dialogs looking as close to native as possible considering jQuery Mobile doesn’t support overlayed dialogs (they’re standalone pages) (Issue #3)

The changes have introduced a few minor visual quirks relating to the .ui-focus box shadows etc, but hopefully these will be rectified in the near future.

 


jQuery Gantt

I made some minor code changes, but the most important thing here was the addition of documentation. The original creator didn’t provide any, so hopefully this makes a bit more sense. I’m sure I’ve missed something here and there (holidays?), but I’ll fix that up as we go.

The changes:

  • Added documentation and better demo with bootstrap popovers
  • Works with latest jQuery 1.7.2
  • Merged pull request for “undefined error”, thanks Nathan Colgate.
  • Code and folder cleanup
 

Front End Development Guidelines

The page now passes HTML5 validation. Apparently some people care about this.

 
    • #iOS
    • #jQuery
    • #jQuery Mobile
    • #Gantt
    • #plugin
    • #design
    • #front ent dev
    • #guidelines
    • #css
    • #html
    • #iphone
  • 4 weeks ago
  • Comments
  • Permalink
  • Share
I’ve just pushed some pretty hefty changes to the jQuery.Gantt project I’ve been developing with lately. I tried some other Gantt libraries, but they were either dependant upon ExtJS, no longer maintained or just didn’t play nicely with my pre-existing code. 
I settled on jQuery.Gantt, but there were a few things I found that really kept it from being an accessible, front-end developer friendly resource. For instance, you could previously only specify a URL as a data source, and not a local object. I needed to pre-parse another JSON feed before plugging it into the chart. There were also some conflicts when using the Twitter bootstrap, and the inability to place attributes on the Gantt bars meant no sexy popovers like below.

A lengthy list of changes follows:
Reduced conflicts with Twitter Bootstrap by name-spacing styles
Source now accepts data from a local object, not just a JSON call  
Can now extend data properties on to bars for use with Bootstrap popovers etc.
Code is now “use strict”
Fixed a couple of errors resulting from “use strict”
Various English translations: renamed months and days to english, hollydays/holidays
Redesigned buttons and slider with CSS3 and an image sprite
Modified category colours and styles
Made chart 100% width so it responds to parent container width
Began enforcing front end dev guidelines such as double quotations (but singles on HTML strings), triple equals comparison and using spans instead of hyperlinks for JavaScript interactivity
Updated demo page doctype to HTML5
Moved body styles from stylesheet to page to reduce style conflicts
 
Pop-upView Separately

I’ve just pushed some pretty hefty changes to the jQuery.Gantt project I’ve been developing with lately. I tried some other Gantt libraries, but they were either dependant upon ExtJS, no longer maintained or just didn’t play nicely with my pre-existing code. 

I settled on jQuery.Gantt, but there were a few things I found that really kept it from being an accessible, front-end developer friendly resource. For instance, you could previously only specify a URL as a data source, and not a local object. I needed to pre-parse another JSON feed before plugging it into the chart. There were also some conflicts when using the Twitter bootstrap, and the inability to place attributes on the Gantt bars meant no sexy popovers like below.

A lengthy list of changes follows:

  • Reduced conflicts with Twitter Bootstrap by name-spacing styles
  • Source now accepts data from a local object, not just a JSON call  
  • Can now extend data properties on to bars for use with Bootstrap popovers etc.
  • Code is now “use strict”
  • Fixed a couple of errors resulting from “use strict”
  • Various English translations: renamed months and days to english, hollydays/holidays
  • Redesigned buttons and slider with CSS3 and an image sprite
  • Modified category colours and styles
  • Made chart 100% width so it responds to parent container width
  • Began enforcing front end dev guidelines such as double quotations (but singles on HTML strings), triple equals comparison and using spans instead of hyperlinks for JavaScript interactivity
  • Updated demo page doctype to HTML5
  • Moved body styles from stylesheet to page to reduce style conflicts

 

    • #jQuery
    • #Gantt
    • #Resourcing
    • #Charting
    • #CSS3
    • #JavaScript
    • #HTML5
    • #Git
    • #GitHub
  • 5 months ago
  • 40
  • Comments
  • Permalink
  • Share

About

My name is Tait Brown, and I'm a Melbourne-based UI designer and a front end developer. I like to make stuff.

taitbrown@gmail.com

Me, Elsewhere

  • taitems on Dribbble
  • taitems on Forrst
  • @taitems on Twitter
  • taita_cakes on Last.fm
  • Linkedin Profile
  • taitems on github

Twitter

loading tweets…

  • RSS
  • Random
  • Archive
  • Mobile

Effector Theme by Carlo Franco.

Powered by Tumblr