Michael Hartmayer - Portfolio

The 125k Challenge

Michael Hartmayer — Wed, 20 Jan 2010 04:20:37 +0000

This is a new thing I’m working on. My goal is to make $125,000 in one year, using only my own projects. Check it out!

Official Website: http://www.125kchallenge.com/
YouTube: http://www.youtube.com/125kchallenge/
Twitter: http://www.twitter.com/125kchallenge/

Share and Enjoy:

Working on New Portfolio Theme!

Michael Hartmayer — Fri, 04 Dec 2009 23:14:06 +0000

Working on a new theme for my Portfolio! The theme I’m currently using is just something I grabbed off some site, to get my portfolio up and running. Now that I have time to rework it, I’m putting a little extra time and effort into it. So far my process has been to create a wire frame of the elements, and markup some basic functionality (I created an asset list document to work from, before creating the wires). This will make designing a whole lot easier and permit me to only have to worry about the “pretty factor”, since I’ve already mapped out my functionality and flow.

Check out my progress:

Wireframes (Layout):

Wireframe (Layout + Navigation Example):

Designing the Background:

( I’ve already got grid lines in place to make sure everything will work with 960px. width )

More Background Work + Some Layout:

Trying to find a good way to present the navigation:

Started Filling in the Content UI:

Continued:

Share and Enjoy:

IE6 / IE7 jQuery Fix: Anchor Image Clickable Area

Michael Hartmayer — Fri, 25 Sep 2009 18:45:31 +0000

IE6 and IE7 both experience a problem in which images inside of block elements inside of anchors lose their click ability. Here’s an example:

 href="rss-icon.png">
	 style="display:block; width:100px; height:100px;">
		 src="someImage.png" />
	>
>

Every area of the link remains click-able except for the surface consumed by someImage.png. (Note, this problem will not show in IE8, or FF)

Here’s a very small jQuery plugin I wrote to fix this particular issue.

(function($){
	$.fn.fixClick = function() {
		return this.each(function(){
			$(this)
				.css({cursor:'pointer'})
				.click(function(){
					window.location.href = $(this).attr('href'); 
				});
		});
	}
})(jQuery);

Simply select your target element(s) and use this plugin to make the entire anchor click-able again. Here’s an example:

$(document).ready(function(){
   $('a').fixClick();
});

Share and Enjoy:

Scripting for Smarties : Application Portability 101

Michael Hartmayer — Wed, 23 Sep 2009 17:42:15 +0000

Here’s the first ‘tutorial’-esque video that I’ve published in my new Channel Scripting for Smarties.

Enjoy~

Share and Enjoy:

PHP Database Class

Michael Hartmayer — Thu, 10 Sep 2009 17:09:36 +0000

I just recently wrote a brand new Database class to add to my PHP library. The old one was starting to get stale. This class is capable of taking advantage of the Singleton design pattern.


 
/**
 * @author Michael Hartmayer (michaelhartmayer[at]gmail.com)
 * @copyright 2009
 */
 
	class Db {
 
		static $ref;				// Database Resource
 
		private $user 	= 'root';		// Username
		private $pass 	= '';			// Password
		private $host 	= 'localhost';		// Host
		private $db 	= 'test';		// Database
 
		private $err 	= array();		// Error Log
		private $errHalt = true;		// Toggle: Halt on DB Error?
 
		static $q;				// Last Query
		static $r;				// Last Results
 
		static $singleton;
 
		public function Db() {
			return true;
		}//endMethod
 
		public function getInstance() {
			if(!self::$singleton)
				self::$singleton = new self;
 
			return self::$singleton;
		}//endMethod
 
		public function setUser($i) {
			$this->user = $i;
			return true;
		}//endMethod 
 
		public function setPass($i) {
			$this->pass = $i;
			return true;
		}//endMethod
 
		public function setHost($i) {
			$this->host = $i;
			return true;
		}//endMethod
 
		public function setDb($i) {
			$this->db = $i;
			return true;
		}//endMethod
 
		public function setAll($h,$u,$p,$d) {
			$this->host = $h;
			$this->user = $u;
			$this->pass = $p;
			$this->db = $d;
			return;
		}//endMethod
 
		public function doConnect(){
			if(!empty($this->ref))
				$this->doDisconnect();
 
			if(!$this->ref = @mysql_connect($this->host,$this->user,$this->pass))
				return $this->dbErr(mysql_error());
 
			if(!@mysql_select_db($this->db,$this->ref))			
				return $this->dbErr(mysql_error($this->ref));
 
			return true;
		}//endMethod
 
		public function doDisconnect() {
			if(empty($this->ref)) return false;
 
			mysql_close($this->ref);
			$this->ref = null;
 
			return true;
		}//endMethod
 
		public function getRef() { 
			return($this->ref);
		}//endMethod
 
		public function dbSet($q) {
			$this->q = $q;
			if($this->r=@mysql_query($this->q,$this->ref)) 
				return true;
 
			return $this->dbErr(mysql_error($this->ref));
		}//endMethod
 
		public function dbGet($q,$type='') {
 
			switch($type) {
				case 'STR':
					$resultType = MYSQL_ASSOC;
					break;
				case 'INT':
					$resultType = MYSQL_NUM;
					break;
				default:
					$resultType = MYSQL_BOTH;
					break;
			}
 
			$this->q = $q;
			if(!$this->r = mysql_query($this->q,$this->ref)) 
				return $this->dbErr(mysql_error($this->ref));
 
			$resultArr = array();
			while($makeDbArr = mysql_fetch_array($this->r,$resultType)) {
				$resultArr[] = $makeDbArr;
			}//endWhile
 
			return $resultArr;
		}//endMethod
 
		public function dbCount($table, $matchPartialQuery='') {
			$this->q = "SELECT COUNT(*) AS 'COUNT' FROM `$table` $matchPartialQuery;";
			if($this->r = $this->dbGet($this->q))
				return $this->r[0]['COUNT'];
 
			return $this->dbErr(mysql_error($this->err));
		}//endMethod
 
		private function dbErr($err) {
			if(empty($err)) return false;
 
			$this->err[] = $err;
 
			if($this->errHalt==true) {
				echo ">> System has halted on Db Error. 
";
				echo ">> Error Log:

";
				print_r($err);
				exit;	
			}
 
			return err;
		}//endMethod
 
		public function strClean($str) {
			return mysql_real_escape_string($str,$this->ref);
		}//endMethod
 
	}//endClass
 
?>

Share and Enjoy:

960gs Margin Mod

Michael Hartmayer — Thu, 23 Jul 2009 21:31:07 +0000

Lately I’ve been working with the marvelously easy to use and understand CSS framework, 960 Grid System. After getting started with it, I very quickly noticed that, while easy and efficient, it has a flaw. You absolutely can NOT extend your elements to end after a margin, touching the next grid element. And so, one becomes effectively shackled to having margins between any horizontally placed grid elements.

Here’s a quick Mod that I wrote that will allow you to negate that problem, without modifying the 960gs CSS itself. Also, it is important to note, that while this does allow you to push your grid class over the margin, you still can’t pull the next element back. Still, another mod could be written using the same flavor to accomplish that as well.

So, without further adieu, here it is:

960.overExtend.css

/*
 
Modifies the 960gs to allow elements to carry over
into the margins, so that they may snugly touch
the next grid over. Simply use the appropriate grid,
as you normally would, and then attach the additional
overExtend class to it, to make it over extend into
the margin. 
 
Example:
 

...

 
*/
 
/* Margin Mod 12 Col */
.container_12 .grid_1_overExtend { width:80px !important; margin-right:-10px !important; }
.container_12 .grid_2_overExtend { width:160px !important; margin-right:-10px !important; }
.container_12 .grid_3_overExtend { width:240px !important; margin-right:-10px !important; }
.container_12 .grid_4_overExtend { width:320px !important; margin-right:-10px !important; }
.container_12 .grid_5_overExtend { width:400px !important; margin-right:-10px !important; }
.container_12 .grid_6_overExtend { width:480px !important; margin-right:-10px !important; }
.container_12 .grid_7_overExtend { width:560px !important; margin-right:-10px !important; }
.container_12 .grid_8_overExtend { width:640px !important; margin-right:-10px !important; }
.container_12 .grid_9_overExtend { width:720px !important; margin-right:-10px !important; }
.container_12 .grid_10_overExtend { width:800px !important; margin-right:-10px !important; }
.container_12 .grid_11_overExtend { width:880px !important; margin-right:-10px !important; }
 
/* Margin Mod 16 Col */
.container_16 .grid_1_overExtend { width:60px !important; margin-right:-10px !important; }
.container_16 .grid_2_overExtend { width:120px !important; margin-right:-10px !important; }
.container_16 .grid_3_overExtend { width:180px !important; margin-right:-10px !important; }
.container_16 .grid_4_overExtend { width:240px !important; margin-right:-10px !important; }
.container_16 .grid_5_overExtend { width:300px !important; margin-right:-10px !important; }
.container_16 .grid_6_overExtend { width:360px !important; margin-right:-10px !important; }
.container_16 .grid_7_overExtend { width:420px !important; margin-right:-10px !important; }
.container_16 .grid_8_overExtend { width:480px !important; margin-right:-10px !important; }
.container_16 .grid_9_overExtend { width:540px !important; margin-right:-10px !important; }
.container_16 .grid_10_overExtend { width:600px !important; margin-right:-10px !important; }
.container_16 .grid_11_overExtend { width:660px !important; margin-right:-10px !important; }
.container_16 .grid_12_overExtend { width:720px !important; margin-right:-10px !important; }
.container_16 .grid_13_overExtend { width:780px !important; margin-right:-10px !important; }
.container_16 .grid_14_overExtend { width:840px !important; margin-right:-10px !important; }
.container_16 .grid_15_overExtend { width:900px !important; margin-right:-10px !important; }

Share and Enjoy:

Alternating Styles in jQuery (Plug-In)

Michael Hartmayer — Thu, 16 Jul 2009 18:40:02 +0000

This is a little script that I wrote, that lets you easily alternate the style of repeating class elements, or w/e elements you want to select. This is particularly useful for lists, and the like.

function($){
$.fn.styleAlternation = function(aClass, bClass) {
    var i = 0;
    return this.each(function() {
        if (++i % 2 != 0 && aClass!='') {
            $(this).addClass(aClass);
        } else if(bClass!='') {
            $(this).addClass(bClass);
        }
    });
}(jQuery);

The usage is very simple. Here’s the JavaScript:

$("#awesomeTable tr").styleAlternation("cssClass1","cssClass2");

From there, all you need to do is create your CSS. Example:

.cssClass1 { background: #000; color: #444; }
.cssClass2 { background: #999; color: #333; }

Here’s a screenshot:

Share and Enjoy:

AJAX Calendar Loader Using jQuery

Michael Hartmayer — Wed, 15 Jul 2009 20:04:15 +0000

My good pal Austin needed help turning his static calendar into one that could change the month, using AJAX. The calendar itself was written in PHP. Here is the quick and easy solution I came up with for him, using jQuery:

$(document).ready(function() {
 
   // Create Date Object
   var jsDateObject = new Date();
 
   // Create Calendar Object ( Holds all your variables, etc )
   var jsCalendar = {};
       jsCalendar.currentMonth = jsDateObject.getMonth();
 
   // Controls the NEXT button
   $("#jsCalendarNext").click(function() {
      // Update Active Month
      jsCalendar.currentMonth++;
         if(jsCalendar.currentMonth>12) { jsCalendar.currentMonth=1; }
 
      // Get New Calendar
      ajaxUpdateCalendar();
   });
 
   // Controls the PREV button
   $("#jsCalendarPrev").click(function() {
      // Update Active Month
      jsCalendar.currentMonth--;
         if(jsCalendar.currentMonth<1) { jsCalendar.currentMonth=12; }
 
      // Get New Calendar
      ajaxUpdateCalendar();
   });
 
   // Use AJAX to update the Calendar
   function ajaxUpdateCalendar() {
      $.post(
         "phpCalendarLoader.php",
         { calendarMonth: jsCalendar.currentMonth },
         function(data) {
            $("#jsCalendarContainer").html(data);
         },
         "html"
      );
   }
 
});

From here, all Austin had to do was set his $month variable to $_POST['calendarMonth'];.

Share and Enjoy:

My Dad :)

Michael Hartmayer — Sun, 28 Jun 2009 09:55:41 +0000

Just got my Dad’s CD put on YouTube. Nothing fancy~

He’s been singing and composing all his life and put out two CD’s. This is a small preview of his ‘Golden Classics’ Album. For more information about the CD, please get in touch with wolfhartmayer@gmail.com

» ( Listen to More ) «

Share and Enjoy:

PHP LoadScript Class

Michael Hartmayer — Sun, 28 Jun 2009 03:46:16 +0000

This is a really handy class I wrote that loads all your scripts Server Side so that when your page loads there aren’t so many HTTP Requests. Useful if you’re trying to load 6 different js files and 4 different style sheets, or whatever. That’s 10 requests, completely gone. Just keep in mind that it dumps all your files straight into the html document- so, as long as you don’t have a problem with that, this is a great tool.

In addition, it’s really easy to add your own script types. Check out the script for details.

( Available At: PasteBin: LoadScript Class )

Usage:


   # Include Class
   include_once('class.scriptloader.php');
 
   # Instantiate
   $jsLoader = new ScriptLoader('JS');
 
   # Add Scripts
   $jsLoader->addScript('my-javascript.js');
   $jsLoader->addScript('jquery.js');
   $jsLoader->addScript('other-scripts.js');
 
   # Dump into Document
   $jsLoader->echoScripts();
?>

On a quick note, it’d probably be a lot ‘neater’ to mod-rewrite a php file to handle at least one request per script type. That way it doesn’t all get dumped straight into the page.

Something like:

RewriteRule ^script\.(.*)$ script-loader.php?type=$1 [L]

And for script-loader.php


   switch($_GET['type']) {
      case 'js':
         // Load all of the JavaScript files here
         break;
   }
?>

That way when you load something like script.js it will dump all of your java scripts into a ‘fake’ file. Just make sure to use the default $ScriptLoader->type (don’t set one when instantiating) if you are loading it from a src=”foo.bar”.

.. or something like that xD

Share and Enjoy: