Contact Greg Thompson

x Cancel
posted 1 year ago

Simple all CSS login form for CodeIgniter Project

Here's the login for for a personal project I'm working on built on CodeIgniter. It's going to be a simple FTP/File Management platform. What do you think of the palette? CSS is handled by LESS.js for easy skinning and theming.

Here's the login for for a personal project I'm working on built on CodeIgniter. It's going to be a simple FTP/File Management platform. What do you think of the palette? CSS is handled by LESS.js for easy skinning and theming.

posted 1 year ago

My finished responsive site (beta)

http://www.thegregthompson.com

I've finally finished my responsive site. It's currently up but not "finished". I'm waiting to have my copy reviewed by a copywriter and presumably fixed :). If your wondering, majority of my work has been with NDAs so I have almost nothing to show (alot of work with other agencies and pharma) so my goal was to really highlight skills and personality. Let me know what you think, I'd LOVE suggestions!

posted 1 year ago

IOS5 touchevents javaScript / jQuery

                1.a
======================
if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
    $("#main_nav a").bind('touchstart', function () {
        console.log("touch started");
    });

2.a
=====================
<ul>
<li><a href = "link">One</a></li>
<li><a href = "link">Two</a></li>
<li><a href = "link">Three</a>
<ul>
<li><a href = "link">sub One</a></li>
<li><a href = "link">sub Two</a></li>
</ul>
</li>
<li><a href = "link">Four</a></li>

3.a
======================

//Original events for desktop/non-mobile devices
$('#main_nav > li > a').bind('mouseenter', jsddm_open);
$('#main_nav > li').bind('mouseleave',  jsddm_timer);


//test for existance of device
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {   
 

//bind the touchstart event to the link element
 $("#main_nav > li > a").bind('touchstart', function(e){

//test to see if the sub menu is visibile, If not show sub menu, if it is visible, grab link from the a tag and navigate there.	 
$vis = $(this).parent().find('ul').css('visibility');
	 
if ($vis == "visible"){
	
	 var el = $(this);
    var link = el.attr('href');
    window.location = link;

//test to see if the element has a sub menu, if it has no sub menu react normally and go to link
} else if($(this).parent().find('ul').attr('class')){

//most important! disable the click on the link so it wont redirect you	 
	 e.preventDefault();

//show sub menu
	 ddmenuitem = $(this).parent().find('ul').css('visibility', 'visible');
	}
	  
	  
    });
	
//this was just for testing
	  $(".menu li a").bind('touchend', function(){
        console.log("touch ended");
    });
	
}                
Raw

Ok so recently I noticed that iOS has changed all of their touchevent reactions when it comes to the mobile browser. I know we used to all add that quick fix code before, something like

moved to 1.a above

Which worked perfectly fine. It seems now that they tried to over fix the problem and made it so that when you click an element it automatically triggers it's event, not it's hover/mouseenter. I ran into this issue when a site I created had a navigation that used jquery for it's dropdowns had a top level nav element that was also a link. The markup was something like...

moved to 2.a above

And what was happening was that when I'd click "Three" on the iPad which normally would trigger my "mouseenter" event it was triggering the default click event which was sending me to the specified link. This made having the drop down below it impossible. I googled forever and found nothing so what I did is written in the code (3.a)... But ultimately is there an easier/cleaner solution to this or are we all just on hold until there is? I did notice that pure CSS dropdowns work normally but lose the sweet jQuery pizazz

posted 1 year ago

Instagram API help

Hello, needing some Instagram API help here. So what I want to create is a small (6 photo) feed on my site to show my Instagram photos. I've been pulling my hair out for a day and a half A. trying to find something that works and B. Not completely depend on someone elses service. I've basically tried to make use of this article/class mauriciocuenca.com/blog/2011/02/instagram-api-implementation-in-php/ but where I'm lost is that every time I need to enter the long authorization URL just to see anything otherwise I get an error. How do I make this so that a random user can go to my site and view my pictures. This Authorization/Access-Token stuff has me confused! thanks!

posted 1 year ago

Updated: Responsive portfolio site

I've uploaded the update to the responsive site i've been developing/designing. It makes use of HTML5 & CSS along with some small jquery libraries like fittext.js and a twitter feed aggregator.

I've uploaded the update to the responsive site i've been developing/designing. It makes use of HTML5 & CSS along with some small jquery libraries like fittext.js and a twitter feed aggregator.