Warning: include(/home/185104/domains/s185104.gridserver.com/html/wp-content/plugins/wp-synhighlight/object.php): failed to open stream: No such file or directory in /nfs/c06/h05/mnt/185104/domains/tommaitland.net/html/wp-config.php on line 42

Warning: include(): Failed opening '/home/185104/domains/s185104.gridserver.com/html/wp-content/plugins/wp-synhighlight/object.php' for inclusion (include_path='.:/usr/local/php-5.6.21/share/pear') in /nfs/c06/h05/mnt/185104/domains/tommaitland.net/html/wp-config.php on line 42
Tom Maitland http://tommaitland.net Creates digital things at Streetline Media. WordPress developer. Web designer. Communicates for UN Youth Australia. Thu, 21 Nov 2013 10:53:37 +0000 en-US hourly 1 https://wordpress.org/?v=4.6.4 Debounced, delayed or throttled model updates in Angular 1.2+ http://tommaitland.net/2013/11/debounced-delayed-throttled-model-updates-angular-1-2/ http://tommaitland.net/2013/11/debounced-delayed-throttled-model-updates-angular-1-2/#respond Thu, 21 Nov 2013 10:52:58 +0000 http://tommaitland.net/?p=399 The Angular JS 1.2 update significantly changed how Angular JS handles event binding. The update meant that debouncing/delaying/throttling directives like ngAmpereDebouce or error out. Googling around for updated solutions didn’t yield much so I mashed together a nice solution using some code from this StackOverflow question. All resulted in this – a debounce/delay/throttled model update script […]

The post Debounced, delayed or throttled model updates in Angular 1.2+ appeared first on Tom Maitland.

]]>
The Angular JS 1.2 update significantly changed how Angular JS handles event binding. The update meant that debouncing/delaying/throttling directives like ngAmpereDebouce or error out. Googling around for updated solutions didn’t yield much so I mashed together a nice solution using some code from this StackOverflow question. All resulted in this – a debounce/delay/throttled model update script for Angular JS 1.2+.

The directive delays Angular model updates until an input stops changing for 1000ms, it will also push an update on blur.

The post Debounced, delayed or throttled model updates in Angular 1.2+ appeared first on Tom Maitland.

]]>
http://tommaitland.net/2013/11/debounced-delayed-throttled-model-updates-angular-1-2/feed/ 0
6 Months in the Making, This is Base http://tommaitland.net/2013/11/6-months-making-base/ http://tommaitland.net/2013/11/6-months-making-base/#respond Tue, 05 Nov 2013 10:28:45 +0000 http://tommaitland.net/?p=387 I’m not really sure how to do these launch posts. I wondered if I should be all grandiose, “this will change the way you web” style. Revolutionary. Best thing since the last best thing since sliced bread. Base isn’t really that. It’s changed the way I work, but it’s just a humble little project I’ve put […]

The post 6 Months in the Making, This is Base appeared first on Tom Maitland.

]]>
I’m not really sure how to do these launch posts. I wondered if I should be all grandiose, “this will change the way you web” style. Revolutionary. Best thing since the last best thing since sliced bread.

Base isn’t really that. It’s changed the way I work, but it’s just a humble little project I’ve put together with some of the brilliant minds at Agency.

Base is a grid system, wrapped in a simple CSS framework. It is responsive from the ground up, intelligent, flexible and so powerful. It’s compiled with LESS, properly semantic with no presentational or grid classes and with no fat. In the 6 months I’ve been using it in various forms I’ve never had to overwrite a single line of CSS, only changes and additions.

You can read about it, try it out, and download it at base.gs, or just go straight to the GitHub repo. We’re currently at Version 1.0.1, it’s not perfect yet but it’s production ready. Bugs, features or issues should all go up on GitHub.

The framework emerged out of a frustration with Bootstrap, but not one that is unique to Bootstrap. Every grid system I have ever used or seen is class based. Compiled or not, you lay your grid using a supposedly semantic system that will often look like .col-8, .col-4, .offset-2. You’re left with ugly HTML that completely forgets the whole purpose of CSS as HTML-independent styles. You want to change the width of some boxes on a page? Can’t do that in the CSS, you’ve got to go into the DOM and change the class everywhere that you need it changed.

A few of the LESS/SCSS flavoured frameworks include Bootstrap ship with a mixin to create columns which is great because you’re styles are where they need to be. These mixins are never responsive, and therefore not very useful for any contemporary website.

Base is attempts to resolve this. It is a LESS framework (though easily ported to SCSS if anyone’s keen) with a .column() mixin that sets column number, offset and padding. Those columns are created within a layout file, and compiled responsively. It’s a semantic grid that is automatically responsive. Using it is so easy.

To make it a full replacement for Bootstrap in Agency’s process we bundled it with a sensible reset. Styles for everything you need to start a site quickly, but without the visual bloat of a UI framework.

I’m going to leave it there. I think Base is really great but I’d love your thoughts by email or on Twitter. I hope other people also find it useful.

The post 6 Months in the Making, This is Base appeared first on Tom Maitland.

]]>
http://tommaitland.net/2013/11/6-months-making-base/feed/ 0
Introducing Carousel http://tommaitland.net/2013/08/introducing-carousel/ http://tommaitland.net/2013/08/introducing-carousel/#comments Thu, 08 Aug 2013 02:35:16 +0000 http://tommaitland.net/?p=365 Today I’m super excited to release my second open source project, Carousel. It’s just another jQuery carousel/slideshow plugin, but I think it’s damn versatile and have loved using it over the past few months as it’s been in development. Demos, docs and downloads are at carousel.io, but read on for the full lowdown. Why another […]

The post Introducing Carousel appeared first on Tom Maitland.

]]>
Today I’m super excited to release my second open source project, Carousel. It’s just another jQuery carousel/slideshow plugin, but I think it’s damn versatile and have loved using it over the past few months as it’s been in development.

Demos, docs and downloads are at carousel.io, but read on for the full lowdown.

Why another carousel plugin?

There are some incredible, powerful Carousel plugins out there. Flexslider, Nivo Slider and Amazing Slider are a few that come to mind, and they’re great when you want to create a traditional image slider with wicked animations. Start moving other types of content or customising styles and you’re having a harder time.

Carousel is the opposite – it sets up great functionality without much on top. It’s autonomous, not needing specific classes or DOM. The bundled CSS/LESS is for functionality only (no themes) and the script is a mere 5kb. It’s also responsive, without relying on JavaScript.

What can it do?

A lot! Image slideshows, content carousels, fading fullscreen backgrounds, paged forms, mini presentations. Anything that involves moving between different screens, carousel can power. I’ve already been using it for web apps to move through welcome screens, and for mini paged donation forms.

You’ve got access to a full API to control what the carousel does, there’s no limit on where navigation needs to be, or what form it needs to take.

Gimme docs!

Everything is up at carousel.io or check out the GitHub repository. It’s still a 0.9 release, though 1.0 is not far away.

Happy to provide limited support through GitHub, and let me know about any issues you come across!

The post Introducing Carousel appeared first on Tom Maitland.

]]>
http://tommaitland.net/2013/08/introducing-carousel/feed/ 1
Yep, Another Blog Design http://tommaitland.net/2013/06/yep-another-blog-design/ Wed, 26 Jun 2013 08:12:47 +0000 http://tm.dev/?p=289 I last did a redesign of this blog when I ‘launched’ it in April 2012, the old version lasted a year which isn’t so bad! This new look is very basic and still very much a work in progress. I wanted to focus more on type, and take the cruft I had on the sidebar […]

The post Yep, Another Blog Design appeared first on Tom Maitland.

]]>
I last did a redesign of this blog when I ‘launched’ it in April 2012, the old version lasted a year which isn’t so bad! This new look is very basic and still very much a work in progress.

I wanted to focus more on type, and take the cruft I had on the sidebar away to focus on my content. No one was clicking on any of those things anyway.

Let me know what you think.

The post Yep, Another Blog Design appeared first on Tom Maitland.

]]>
Restrict Page Parents updated to 1.1.1 http://tommaitland.net/2013/06/restrict-page-parents-updated-to-1-1-1/ Tue, 18 Jun 2013 13:54:05 +0000 http://tommaitland.net/?p=246 Just pushed up a minor update to the Restrict Page Parents plugin that fixes a rare issue that would hide the parent dropdown for users even when they weren’t restricted. It should be in the automatic updater now. This version also adds official support for WordPress 3.6 (whenever that’s coming out). As always, email me […]

The post Restrict Page Parents updated to 1.1.1 appeared first on Tom Maitland.

]]>
Just pushed up a minor update to the Restrict Page Parents plugin that fixes a rare issue that would hide the parent dropdown for users even when they weren’t restricted. It should be in the automatic updater now.

This version also adds official support for WordPress 3.6 (whenever that’s coming out). As always, email me with bugs!

The post Restrict Page Parents updated to 1.1.1 appeared first on Tom Maitland.

]]>
If you ever need to style a form… http://tommaitland.net/2013/06/if-you-ever-need-to-style-a-form/ Sun, 16 Jun 2013 09:25:10 +0000 http://tommaitland.net/?p=242 I'm in the middle of creating a comprehensive CSS reset and styling for a new development framework and ended up creating a form with every HTML form element.. ever. Yes that means all the input types, and the new fancy HTML5 elements.

If you ever need to do form styles for a project this may be useful as a foundation to work the styles off. Click through for the code.

The post If you ever need to style a form… appeared first on Tom Maitland.

]]>
I’m in the middle of creating a comprehensive CSS reset and styling for a new development framework and ended up creating a form with every HTML form element.. ever. Yes that means all the input types, and the new fancy HTML5 elements.

If you ever need to do form styles for a project this may be useful as a foundation to work the styles off. Code here.

The post If you ever need to style a form… appeared first on Tom Maitland.

]]>
Some Thoughts on iOS 7 http://tommaitland.net/2013/06/some-thoughts-on-ios-7/ http://tommaitland.net/2013/06/some-thoughts-on-ios-7/#respond Wed, 12 Jun 2013 23:09:25 +0000 http://tommaitland.net/?p=236 This year is my first year in the iOS Developer Program, and the first year I’ve been able to download the new iOS Beta as it came out at WWDC, so I thought celebrate the occasion by penning down some initial thoughts on iOS 7. Let’s start with the good. iOS 7 is so different. […]

The post Some Thoughts on iOS 7 appeared first on Tom Maitland.

]]>
This year is my first year in the iOS Developer Program, and the first year I’ve been able to download the new iOS Beta as it came out at WWDC, so I thought celebrate the occasion by penning down some initial thoughts on iOS 7.

Let’s start with the good.

iOS 7 is so different. Apple has changed how intuitive – almost human – the interface feels. iOS 7 is an extremely bizarre contrast of a stripped back, flat interface filled with the tiniest of details. New animations, visual cues, little signals that make the phone feel different.

They start at the lock screen, which by the way is the most beautiful part of the whole phone. Clicking the lock button fades in the backlight, the wallpaper subtly fades in, spreading across the screen with a very slight zoom. It made me want to keep clicking that lock button.

Swiping to unlock brings in the icons in a smooth fall onto the home screen, pushing them down reveals the search (it no longer has its own screen), pulling up from the bottom reveals Control Centre and the top reveals Notification Centre. They’re nice, if a little plain. Control Centre is ridiculously useful.

Opening an app has changed as well. A zoom and spread provides an app with more context within the virtual space of the phone. It’s icon expands but rather than expanding over other icons like iOS 6 and down, those icons spread as the app expands – the difference is remarkable.

These subtle touches continue throughout Apple’s core apps. They create a virtual space for the flat skin of iOS 7 to operate. The 3D tiles in Safari, the slight movement of the wallpaper, the parallax of the icons respective to their tile in the app switcher, the bounce up of Control Centre, the zoom and fade of modals, the way a message drops down and meets it’s bubble.

These animations make iOS 7 fun, and boy does it need a little fun – because that’s where the new operating system falls down. I showed my updated phone to my sister (who is not at all techy). She flicked through a few apps, opened up Calendar, Music, Messages. Her reaction was the same as mine.

Lock screen: “Oh that’s nice”

Interface: “It’s all a bit plain”

Thoughts on the flat design fad aside, when you strip back all the interface and replace it with white broken up by a few thinly drawn icons, it feels very plain. It feels unfinished. It’s not sparse and simple, it doesn’t simplify complexity because the original iOS ‘look’ wasn’t complex. It’s stark, dry, dull.

Good design triggers emotions (which is why my thoughts on this are only as valid as the nexts), white sparse ‘flat’ screens don’t make you feel happy or good. They feel utilitarian and brutally productive. Lets take Calendar as an example. You open the app and see the days of the week in a slightly off-white bar. Below is your day, blocked out, segmented out with thin lines and numbers. Text links mark the navigation at the bottom.

It’s an interface where you want to add your event and get out as quickly as possible. Message’s squished speech bubbles suffer the same fate.

I think there was so much potential for Apple to bring in these lovely interactions but still add a splash of colour, and draw out the starkness of thin text on solid white. The colour scheme iOS 7 introduces is nice, it’s vibrant, fun, youthful. It just needed to go beyond those icons and into their apps.

A day and a half certainly isn’t adequate time to judge the time, care and passion Apple designers have put into this iOS release. I don’t think iOS 7 is a bad release, I just don’t think it’s as nice as it could’ve been and that’s a shame. I also wonder how long until we get bored of flat design. It is extremely restrictive for the looks designers can create, and before too long everything will begin to look too familiar and too similar and we’ll be restless for more. I seriously doubt this iOS experience will last as long as the last.

For now I’ll roll back to iOS 6, the beta is extremely buggy. It will be great to see iOS 7 in all it’s polished glory (with hopefully an iPhone 5S) in September.

(Also, I hope they update they iCloud.com interface to match iOS 7. It’s horrible, slow and could do with some TLC. Those fat buttons also make no sense when you’re not smashing them with a finger).

 

The post Some Thoughts on iOS 7 appeared first on Tom Maitland.

]]>
http://tommaitland.net/2013/06/some-thoughts-on-ios-7/feed/ 0
Now Live: Rob Livingstone Advisory http://tommaitland.net/2013/05/now-live-rob-livingstone-advisory/ Mon, 13 May 2013 13:58:56 +0000 http://www.tommaitland.net/?p=231 I’ve just launched the new website for Rob Livingstone Advisory! It’s been an absolute pleasure to create a site that is very strategically oriented, flexible and hopefully going to be a launching pad for greater things this year. The site is fully responsive, retina-ready, WordPress-powered and packed with great content. Check it out if you […]

The post Now Live: Rob Livingstone Advisory appeared first on Tom Maitland.

]]>
I’ve just launched the new website for Rob Livingstone Advisory! It’s been an absolute pleasure to create a site that is very strategically oriented, flexible and hopefully going to be a launching pad for greater things this year.

The site is fully responsive, retina-ready, WordPress-powered and packed with great content. Check it out if you get a chance.

The post Now Live: Rob Livingstone Advisory appeared first on Tom Maitland.

]]>
Restrict Page Parents Updated to 1.1.0 http://tommaitland.net/2013/04/restrict-page-parents-updated-to-1-1-0/ Mon, 22 Apr 2013 11:22:42 +0000 http://www.tommaitland.net/?p=228 I’ve just pushed up an update to Restrict Page Parents with a new feature. Version 1.1.0, now available through WordPress, lets you turn the page parent restrictions you set up on or off for each post type. Hopefully this makes the plugin even more useful! Get in touch if you find any bugs or have […]

The post Restrict Page Parents Updated to 1.1.0 appeared first on Tom Maitland.

]]>
I’ve just pushed up an update to Restrict Page Parents with a new feature. Version 1.1.0, now available through WordPress, lets you turn the page parent restrictions you set up on or off for each post type.

Hopefully this makes the plugin even more useful! Get in touch if you find any bugs or have feature ideas.

The post Restrict Page Parents Updated to 1.1.0 appeared first on Tom Maitland.

]]>
A Basic jQuery Rotator http://tommaitland.net/2013/03/a-basic-jquery-rotator/ http://tommaitland.net/2013/03/a-basic-jquery-rotator/#respond Sun, 31 Mar 2013 20:22:11 +0000 http://www.tommaitland.net/?p=219 EDIT 8/8/2013: For a full featured jQuery rotator / carousel script, check out Carousel or read my post about it. It’s much less buggy / much better than this one! There are a hundred jQuery rotator scripts online, most are ultra-powerful, doing everything a rotator could every dream to do. Here’s another one that’s super simple, lightweight and […]

The post A Basic jQuery Rotator appeared first on Tom Maitland.

]]>
EDIT 8/8/2013: For a full featured jQuery rotator / carousel script, check out Carousel or read my post about it. It’s much less buggy / much better than this one!

There are a hundred jQuery rotator scripts online, most are ultra-powerful, doing everything a rotator could every dream to do. Here’s another one that’s super simple, lightweight and easy to use.

Features:

(more “what it doesn’t do”)

  • Only has a next button (not a previous one)
  • Only changes on click
  • Has a slight fade effect
  • Adjusts height accordingly
  • Can be applied to multiple elements on a page
  • You only have to change 2 things

Usage:

Add the code below into a jQuery $(document).ready( function() { }); call. Change the two identifiers under ‘Settings’.

Code:

[codesyntax lang=”php”]

// Settings
var wrapper = '.testimonials'; // the element wrapping the rotator
var child = 'blockquote'; // the element to be rotated

// Rotate Script
$(wrapper).each( function() {

  $(this).append('<a href="#" class="next button inner">Next Testimonial</a>');
	$(this).find(child).each( function() {

		if ( $(this).is(child + ':nth-child(1)') ) {
			$(this).addClass('active');
		} else {
			$(this).hide();
		}

	});
	$(this).find('.next').click( function() {

		var $item = $(this).parent().find(child + '.active');

		if ($item.next().is(child)) {

			$item
				.removeClass('active')
				.hide()
				.next()
				.fadeIn('fast')
				.addClass('active');

			} else {

				$item
					.removeClass('active')
					.hide()
				$(this).parent().find(child + ':nth-child(1)').fadeIn('fast').addClass('active');
			}

		return false;

	});

});

[/codesyntax]

The post A Basic jQuery Rotator appeared first on Tom Maitland.

]]>
http://tommaitland.net/2013/03/a-basic-jquery-rotator/feed/ 0