Addon: Harmonious Color v1.0

[tomyeah]

-- Addon: Harmonious Color v1.1 --

Description:

This pixelpost addon analyses the image displayed in your image_template.html for example.
It will select the color with the Hue value that occurs the most in the image.
The output will be 3 hex color values, a "dark" one for big background areas, a "normal" color for smaller areas and a "bright" color for fonts.
If you don't like the automatically picked colors, just go into the admin panel and look in the "edit" tab of the corresponding image.
Here you can modify the 3 colors to your needs.


Requirements:

1.) Pixelpost 1.6 or later

2.) This plugin expects that the image folder is "/images" (pixelpost default setting)


Installation:

1.) Extract the file "admin_harmonious.php" into the "/addons" folder of your pixelpost installation.

2.) Create a folder "/cache" in your pixelpost base directory (its the same place with the other pixelpost folders "addons", "admin", "includes", ...)

3.) CHMOD the folder "/cache" to "777" for write access


Usage:

The following tags can be used within your pixelpost template:

/* these tags give you a hex color value beginning with # (for example #ffffff)*/
<HARMONIOUS_DARK>
<HARMONIOUS_NORMAL>
<HARMONIOUS_BRIGHT>

/* these tags give you a hex color value without # in the first place (for example ffffff)*/
<HARMONIOUS_DARK_CLEAN>
<HARMONIOUS_NORMAL_CLEAN>
<HARMONIOUS_BRIGHT_CLEAN>


User-Modifications of the "admin_harmonious.php":

1.) Lines 251 to 269 define the brightness[1] and saturation[2] levels for the 3 output colors.


For users of the old admin panel modification from v1.0:

Just delete the modified "images_edit.php" in the "/admin" folder and revert your old "images_edit.phpold" to "images_edit.php".
Delete the old "harmonious.php" in the "/addons" folder.


For questions and suggestions email to: harmonious(at)tomyeah.com

Download: harmonious_color_v1.1.zip (8KB) (Last Update: 19.5.2007)

With the help from schonhose's magical fingers it was possible to merge the old admin panel mod and the harmonious addon into one single file. this makes the installation easier and is bullet proof for further pixelpost updates.

[chaoss3]

This is so absolutely awesome, and I'd love to implement on my own site, but I'm a bit unskilled when it comes to putting things like this into action. Where would I place these tags to get this to work? Thanks for the help...and the add on I've been looking for for almost a year! Great work.

[codepoit]

Thanks, Tom! I can't wait until I have some time to implement this on my site!

[witty]

Cool, awesome, cool !!!

I guess the tags won't work when used in CSS file? They didn't for me anyway. I had to add style tags to the head of my various templates. Is this by design or the only way to do it... or am I missing something?

Thanks!


-Witty

[greentraveler]

Originally Posted by witty

Cool, awesome, cool !!!

I guess the tags won't work when used in CSS file? They didn't for me anyway. I had to add style tags to the head of my various templates. Is this by design or the only way to do it... or am I missing something?

Thanks!


-Witty

Same thing here...but it's an AWESOME addition to PP! Thanks.

[codepoit]

I haven't updated the code of my site in quite some time, but unless something has changed with v1.6, PP tags have never worked in the CSS file. PP tags are to be used in the template HTML files.

Someone please correct me if I'm wrong...

[jaywilliams+]

The easiest way would be to add some inline css into the page header, like so:

<style type="text/css" media="screen">
body{
	background-color: <HARMONIOUS_DARK>;
	color: <HARMONIOUS_BRIGHT>;
}
</style>

You could set all of the nitty-gritty info in an external css file.
Just use the inline for colors only.

[greentraveler]

Originally Posted by jaywilliams

The easiest way would be to add some inline css into the page header, like so:

<style type="text/css" media="screen">
body{
	background-color: <HARMONIOUS_DARK>;
	color: <HARMONIOUS_BRIGHT>;
}
</style>

You could set all of the nitty-gritty info in an external css file.
Just use the inline for colors only.

That's what works for me.

[tomyeah]

@greentraveler: hey, it seems to work on your site its good to see that my chunky code works on other sites too

@chaoss3: maybe i'll release a whole theme using this addon ... im currently using it on my site. but its not ready ... xhtml validation stuff and so. you can use this addon in general in your "image_template.html" of your template folder, whereever you see a hex color value like #345678 or so. you just replace the whole color with one of my tags ... thats it

regards, tom.

[dakwegmo+]

Nice work tomyeah I got it working on my site, but the color complements for many of my photos turn out to be purple and pink which makes my blog look very girly. I think I need to go shoot some photos with less girly colors.