Fat Folder Design | PHP

September 17, 2011July 31, 2014

CSS minifier and color changer

Sometimes you want to be able to compress your stylesheet without having to worry about having a working version and a minified version that are separate, or going back and reflowing your minified version every time you want to make a change. Sometimes you want to be able to change a color without having to go through and find the then thousands times you used to and change them all my hand (even with a fancy find/replace command). In that case it’s time to get some scripting involved, I’ve done this in the past, with a more advanced version that also included allt he linked images as data URIs, but that truly is overkill and can really slow down a style sheet process with large images in it. My original version was also much slower overall relying on <code>str_ireplace()</code> instead of a much neater regular expression. So when I was taksed with making a new version for a different site I figues it’d be best to more it as compact and fast as possible> After some tinkering and playing around with regular expressions (regexpal.com is a great place to do that BTW) I came up with this:

<!--?php 
function colorize($v){
	//whatever code you use to turn variable $v into color $c, very dependent on your specific implementation.
	return $c;
}
header("Content-type: text/css");
$css = file_get_contents('style.css');
$css = preg_replace('~/\*.*\*/|\n|\t|(?<=:)\s+|(?<={)\s+|(?<=})\s+|(?<=,)\s+|\s+(?=;)|\s+(?={)|\s+(?=})~sU','',preg_replace_callback('~#[A-F0-9a-f]{3,8}(?=;/\*#([\d\w\s]+)(:(.+))?#\*/)~U','colorize',$css));
echo $css;
?-->

<!--?php

function colorize($v){

//whatever code you use to turn variable $v into color $c, very dependent on your specific implementation.

return $c;

}

header("Content-type: text/css");

$css = file_get_contents('style.css');

$css = preg_replace('~/\*.*\*/|\n|\t|(?<=:)\s+|(?<={)\s+|(?<=})\s+|(?<=,)\s+|\s+(?=;)|\s+(?={)|\s+(?=})~sU','',preg_replace_callback('~#[A-F0-9a-f]{3,8}(?=;/\*#([\d\w\s]+)(:(.+))?#\*/)~U','colorize',$css));

echo $css;

?-->

Snipplr: http://snipplr.com/view/58764/css-minifier-and-color-replaces/

What this script does is pretty simple, first a function is declared, this is the function that replaces colors, if your not going to be doing that you can remove it (and the second regular expression). This it loads the file using file_get_contents, if you have multiple stylesheets you can load them all into it and places them all in the save $css variable using .= instead, then it runs the regular expressions (first one minifies, second one replaces colors (more on that in a bit) and finally it preps the output and prins it. The first regular expression is kinda long and may be hard to follow, but it removed all comments, lines breaks, and spaces when there not important to the formatting (so if you use the sigle element margin declaration <code>margin: 0px 4px 3px 10px;</code> all thos spaces will be preserved, except for that first one after the <code>:</code>). To compress the code further you could also gzip to results when it’s supported by the browser but I didn’t do it because of some strage behavior on my test machine when it comes to gzipping things, it’s on the list for the final release code though. I suppose if you wanted to take things one step further you could also search for inefficient code and replace that as well, but I didn’t include it because the software I use automatically does that (yes I was being lazy not including it but it really would have been a waste of time and made the script a lot longer in the process).

The second regular expression find specific comments placed in the code after colors and replaces them, for example it would take this:

element {
	padding: 0;
	margin: 0 10px;
	color: #000000;/*#c_t#*/
}

element {

padding: 0;

margin: 0 10px;

color: #000000;/*#c_t#*/

}

and turn it into this

element {
	padding: 0;
	margin: 0 10px;
	color: #FF0000;
}

element {

padding: 0;

margin: 0 10px;

color: #FF0000;

}

assuming that the colorize script returned red as the color. The colorize function can get the new colors however you want it to (in whatever format you want too), the can be pre-determined from an array, picked based on time of day, cookie settings, database settings. Whatever you want to do to get them should work. Personally I’m using Wordpress to save them and then pulling them back out from that, this gives you a nice page on the Wordpress backend to save the colors. This gives users a simple way to change colors on there themes without having to dirty themselves with css code (good considering most people using these themes don’t know anything about css). Best part is, if it’s missing a value it will use whatever is in the stylesheet normally, so you can still do your layout with a program that has live previews without having to refresh pages to get the php to re-run.

This could easily be expanded upon in the future, and perhaps one day I’ll have the chance to do that. It could easily be turned into something with complete customizability, even to the point of replaced border and margins, widths, padding – you name it. but for now it will just do colors as thats a good 90% of what needs to be changed. Any questions or improvements let me know in the comments.

UPDATE: I made the color catcher better and added keyword support, you can see the new version here: http://fatfolderdesign.com/400/unimportant/css-colorizer-update

September 2, 2011July 31, 2014

Simple MySQL to CSV

I needed to make a quick export earlier this week so that we could get records into another program. At first I though I’d need to find a php library to make a csv for me (to save me the time of making the script myself) but it terns out that the process couldn’t be easier. The csv format is very easy to create and really seems to follow several key rules. First, you put things in quotation marks. If it’s a number you don’t have to, but just to be safe I put everything in quotation mark (it was also easier coding wise). Second, if there is a quotation in a cell you must put another quotation before it. Finally, you must create a new line at the end of every new like (obviously), With That in mind I made this:

<!--?php 
require '../includes/init.php'; // This connects to the database
header("Content-type: text/csv");
header("Content-Disposition: attachment; filename=client_export.csv");
header("Pragma: no-cache");
header("Expires: 0");
$q=mysql_query('select * from users');
while($r=mysql_fetch_array($q)){
	foreach($r as $k =--> $v){
		if(is_numeric($k)){
			echo '"'.str_replace('"', '""', $v).'",';
		}
	}
	echo "\n";
}
?>

<!--?php

require '../includes/init.php'; // This connects to the database

header("Content-type: text/csv");

header("Content-Disposition: attachment; filename=client_export.csv");

header("Pragma: no-cache");

header("Expires: 0");

$q=mysql_query('select * from users');

while($r=mysql_fetch_array($q)){

foreach($r as $k =--> $v){

if(is_numeric($k)){

echo '"'.str_replace('"', '""', $v).'",';

}

echo "\n";

}

Snipplr: http://snipplr.com/view/58408/simple-mysql-to-csv/

The code is pretty self explanatory, just doest what you need to as mentioned in the first paragraph. I tested it (admittedly in a limited fashion) and it works great. I don’t think there could be an potential problems but as this was created in less than 5 minutes as really just a quick test I’m not sure. If anybody find anything that might cause issues let me know and I’ll expand upon it but as of now it does exactly what I created it for.

August 19, 2011July 31, 2014

Simpler, Single Loop WordPress Theme Creation

Recently I’ve been making alot of wordpress themes (just not my own) I always like to keep the files to a minimum. In wordpress, the loop.php file is the traditional one to handle displaying all the posts, pages, media, and anything else you can look at in wordpress. The official wordpress themes, and countless others, use multiple “loops”, one for the main page, one for the an individual post, and even one for the pages in some themes. This clutters up the files and generally makes things a mess. I created a simple function to call that lets me filter things instead. First, you need this in the theme functions.php file

function the_loop(){
	$GLOBALS['h']=array();
	foreach(func_get_args()as$k=>$v){
		$i++;$GLOBALS['h'][$v]=false;
	}
	require 'loop.php';
}
function display($v){
	global $h;
	if(array_key_exists($v,$h)){
		return $h[$v];
	}else{
		return true;
	}
}

function the_loop(){

$GLOBALS['h']=array();

foreach(func_get_args()as$k=>$v){

$i++;$GLOBALS['h'][$v]=false;

}

require 'loop.php';

}

function display($v){

global $h;

if(array_key_exists($v,$h)){

return $h[$v];

}else{

return true;

}

Snipplr: http://snipplr.com/view/58053/simple-single-loopphp-word-press-theme-function/

Then, instead of requiring the loop.php file in your theme index you just insert the new the_loop() function, with all of the items you want filtered out. You can use whatever arbitrary names you’d like, just use the same names in your master loop. First you call the loop like this:

the_loop('comments','meta');

1	the_loop('comments','meta');

Snipplr: http://snipplr.com/view/58053/simple-single-loopphp-word-press-theme-function/

Then you program your loop to use the display() function to determine if it’s going to show that, in the example above it would look like this:

if(display('title')){
	// Your title display code
}
if(display('meta')){
	// Your meta display code
}
if(display('content')){
	// Your content display code
}
if(display('comments')){
	// Your comments display code
}

if(display('title')){

// Your title display code

}

if(display('meta')){

// Your meta display code

}

if(display('content')){

// Your content display code

}

if(display('comments')){

// Your comments display code

}

Snipplr: http://snipplr.com/view/58053/simple-single-loopphp-word-press-theme-function/

In that case it will show the header and the content (since we didn’t tell it not to when calling the_loop() but won’t call the comments or meta because we did. Pretty simple little bit of code that saves a lot of time in the long run since now everything can be in one file and if you change something you only have to look in that same file. Thats it for now, it’s been a long week. Next week I hopefully will be starting on the new theme for this site as well as posting something a little meatier, a simple modular site system.