http://achmadz.blogspot.com/2010/10/php-graphical-folder-size.html
Monthly Archives: November 2010
Instant transparent PNG generator v0.2
Earlier, I needed a semi-transparent png. I couldn’t be bothered to fire up Photoshop, couldn’t be bothered to steal one from another project, couldn’t find a png maker online, and yet I could be bothered to write an app to do it for me and share it with the world. F’kn stupid huh?
I’ve still not done the task I wanted it for in the first place!
The project utilises jQuery 1.4.3, jQueryUI 1.8.6 slider and Stefan Petre’s jQuery Color Picker plugin:
jQuery: The Write Less, Do More, JavaScript Library
jQuery UI – Slider Demos & Documentation
Assistance with png generation garnered from this Codecall Forum post by AfTriX
This is a first, but fully functioning, release. As such, it still requires a decent user interface, and the code needs commenting, but it’s pretty simple stuff, thanks to Jquery. The png creation (once you get it to create an initial transparent png, which is much harder than documentation would suggest) is very simple, and achieved in just a handful of lines.
[UPDATE 1321-13112010]
The interface has now been fully styled for a much more pleasant appearance, and to match the blog. It’s quite CSS3 heavy for the spankier effects, so of course looks best in an up to date browser.
[/UPDATE]
I started by collecting the libraries and jigged the directory structure to my liking:
1 |
root |- inc/ | |- js/ | |- colorpicker.js | |- css/ | | |- colorpicker.css | | |- ui-darkness/ | | |- images/ | | | |- {jQuery UI images} | | | | | |- jquery-ui-1.8.6.custom.css | | | |- images | | |- {colorpicker images} | | | |- jquery-1.4.3.min.js | |- jquery-ui-1.8.6.custom.min.js | |- png-maker/ | |- index.php | |- images/ | | |- checker.gif | | |- preview_bg.gif | | |- {other non-critical template images} | |- png.php |
First up is the form and UI – this is actually html and Javascript, but I gave the file a PHP extension for forward compatibility.
index.php
As this code contains a complete HTML page, it’s a bit difficult to include in the blog, so here it is on paste bin:
http://absolutedisaster.pastebin.com/CjCkrHBk
colorpicker.js
A small hack is required to get the colorpicker to populate the hidden form fields with RGB values – there are of course other ways to do this, but as this hack is unobtrusive, and being jQuery will fail gracefully if this version of the plugin is used anywhere else, it seems the tidiest way to do it to me.
l.28 – 34 <<
1 |
<span class="function">fillRGBFields</span> = <span class="keyword">function</span> (hsb, cal) { <span class="keyword">var</span> rgb = HSBToRGB(hsb); <span class="predefined">$</span>(cal).data(<span class="string"><span class="delimiter">'</span><span class="content">colorpicker</span><span class="delimiter">'</span></span>).fields .eq(<span class="integer">1</span>).val(rgb.r).end() .eq(<span class="integer">2</span>).val(rgb.g).end() .eq(<span class="integer">3</span>).val(rgb.b).end();}, |
l.28 – 40 >>
1 |
<span class="comment">//dMb - 12/11/2010 Hacked for PNG generator</span><span class="function">fillRGBFields</span> = <span class="keyword">function</span> (hsb, cal) { <span class="keyword">var</span> rgb = HSBToRGB(hsb); <span class="predefined">$</span>(cal).data(<span class="string"><span class="delimiter">'</span><span class="content">colorpicker</span><span class="delimiter">'</span></span>).fields .eq(<span class="integer">1</span>).val(rgb.r).end() .eq(<span class="integer">2</span>).val(rgb.g).end() .eq(<span class="integer">3</span>).val(rgb.b).end(); <span class="comment">//start modification</span> <span class="predefined">$</span>(<span class="string"><span class="delimiter">'</span><span class="content">#r</span><span class="delimiter">'</span></span>).val(rgb.r); <span class="predefined">$</span>(<span class="string"><span class="delimiter">'</span><span class="content">#g</span><span class="delimiter">'</span></span>).val(rgb.g); <span class="predefined">$</span>(<span class="string"><span class="delimiter">'</span><span class="content">#b</span><span class="delimiter">'</span></span>).val(rgb.b); <span class="comment">//end modification</span>}, |
And the second half of it is the png script
png.php
1 |
<span class="keyword">if</span>(<span class="predefined">$_SERVER</span>[<span class="string"><span class="delimiter">'</span><span class="content">HTTP_REFERER</span><span class="delimiter">'</span></span>] != <span class="string"><span class="delimiter">'</span><span class="content">http://blog.absolutedisaster.co.uk/png_maker/</span><span class="delimiter">'</span></span>){ <span class="predefined">header</span>(<span class="string"><span class="delimiter">'</span><span class="content">HTTP/1.1 403 Forbidden</span><span class="delimiter">'</span></span>); <span class="predefined">echo</span> <span class="string"><span class="delimiter">'</span><span class="content">403 Forbidden</span><span class="delimiter">'</span></span>; <span class="predefined">exit</span>;}<span class="local-variable">$w</span> = <span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">w</span><span class="delimiter">'</span></span>];<span class="local-variable">$h</span> = <span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">h</span><span class="delimiter">'</span></span>];<span class="local-variable">$r</span> = <span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">r</span><span class="delimiter">'</span></span>];<span class="local-variable">$g</span> = <span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">g</span><span class="delimiter">'</span></span>];<span class="local-variable">$b</span> = <span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">b</span><span class="delimiter">'</span></span>];<span class="local-variable">$a</span> = <span class="integer">127</span> - <span class="predefined">round</span>(<span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">a</span><span class="delimiter">'</span></span>] * <span class="float">1.27</span>);<span class="local-variable">$an</span> = <span class="predefined">round</span>(<span class="predefined">$_POST</span>[<span class="string"><span class="delimiter">'</span><span class="content">a</span><span class="delimiter">'</span></span>] * <span class="float">2.55</span>);<span class="local-variable">$png</span> = imagecreatetruecolor(<span class="local-variable">$w</span>, <span class="local-variable">$h</span>);imagesavealpha(<span class="local-variable">$png</span>, <span class="predefined-constant">true</span>);imagealphablending(<span class="local-variable">$png</span>, <span class="predefined-constant">false</span>);<span class="local-variable">$transparent</span> = imagecolorallocatealpha(<span class="local-variable">$png</span>, <span class="integer">200</span>, <span class="integer">200</span>, <span class="integer">200</span>, <span class="integer">127</span>);imagefill(<span class="local-variable">$png</span>, <span class="integer">0</span>, <span class="integer">0</span>, <span class="local-variable">$transparent</span>);<span class="local-variable">$fill</span> = imagecolorallocatealpha(<span class="local-variable">$png</span>, <span class="local-variable">$r</span>, <span class="local-variable">$g</span>, <span class="local-variable">$b</span>, <span class="local-variable">$a</span>);imagefill(<span class="local-variable">$png</span>, <span class="integer">0</span>, <span class="integer">0</span>, <span class="local-variable">$fill</span>);<span class="predefined">header</span>( <span class="string"><span class="delimiter">"</span><span class="content">Content-type: image/png</span><span class="delimiter">"</span></span> );<span class="predefined">header</span>(<span class="string"><span class="delimiter">'</span><span class="content">Content-Disposition: attachment; filename="w</span><span class="delimiter">'</span></span> . <span class="local-variable">$w</span> . <span class="string"><span class="delimiter">'</span><span class="content">h</span><span class="delimiter">'</span></span> . <span class="local-variable">$h</span> . <span class="string"><span class="delimiter">'</span><span class="content">r</span><span class="delimiter">'</span></span> . <span class="local-variable">$r</span> . <span class="string"><span class="delimiter">'</span><span class="content">g</span><span class="delimiter">'</span></span> . <span class="local-variable">$g</span> . <span class="string"><span class="delimiter">'</span><span class="content">b</span><span class="delimiter">'</span></span> . <span class="local-variable">$b</span> . <span class="string"><span class="delimiter">'</span><span class="content">a</span><span class="delimiter">'</span></span> . <span class="local-variable">$an</span> . <span class="string"><span class="delimiter">'</span><span class="content"> .png"</span><span class="delimiter">'</span></span>);<span class="predefined">header</span>(<span class="string"><span class="delimiter">"</span><span class="content">Cache-Control: no-cache, must-revalidate</span><span class="delimiter">"</span></span>); <span class="comment">// HTTP/1.1</span><span class="predefined">header</span>(<span class="string"><span class="delimiter">"</span><span class="content">Expires: Sat, 26 Jul 1997 05:00:00 GMT</span><span class="delimiter">"</span></span>); <span class="comment">// Date in the past</span>imagepng( <span class="local-variable">$png</span> );imagedestroy( <span class="local-variable">$png</span> ); |
The script in action
http://blog.absolutedisaster.co.uk/png-maker
Source files
The custom jQuery UI files have been further reduced as much as possible – uneccessary images and CSS rules have been removed. This means this version of the UI plugin may not be suitable for use in other projects unless you just want a simple slider as in this case. Also the colour picker background image and css have been modified to simplify the interface slightly.
I’m releasing this as GPL – feel free to install, modify, whatever, as long as it is not sold or otherwise charged for, and, wherever you use it, be good enough to give me credit, retain my credits in the files and drop me a line.
http://blog.absolutedisaster.co.uk/png-maker/png-maker_v0.2.zip
CSS3 Active Cheatsheet
Here’s a very nicely put together cheatsheet for some of the fancy new CSS3 styles. Can’t really be printed, it being interactive and all, but an awesome illustration of the power of the new rules.
MySQL Error #1153 – Got a packet bigger than ‘max_allowed_packet’ bytes
Easily fixed
SSH into server
Edit MySQL config – in CentOS 5# vi /etc/my.cnf
If:
there is no line with ‘max_allowed_packet’ add below the line ‘[mysqld]’:max_allowed_packet=16M
Else:
increase the max_allowed_packet value
Then:
Save the file and restart mysql:service mysqld restart
Done.
Display line number in VI / VIM
Turn on
Press [Esc] to exit insert or append mode
Raise a promt by pressing [:]
Type set number
and hit enter.
Turn off
As above, but the command is set nonumber
Plesk 9.x – Access multiple databases with a single MySQL user
I have to set this up quite a lot for user sharing across multiple Joomla! sites. I will eventually get round to publishing the full instructions for that, but in the meantime I will start with this.
I got started on this with the aid of this post from Simple Steps:
Multiple mysql databases with single user
Fantastically useful as this is, it’s slightly out of step with Plesk 9 (or at least the config for my host), so for my reference and yours, here are updated instructions.
For the purpose of this example, we shall pretend we are going to add the user ‘ac_siteuser’ to the database ‘fh_testing’
Connect to MySQL
1. Using PuTTy, or your preferred terminal, connect to the server over SSH
2. Connect to MySQL as the admin user. Note in Plesk the MySQL user ‘root’ is replaced by ‘admin’# mysql -u admin -p
You will be prompted for the admin password.
Add existing user to different database with permissions
3. Select the database named ‘mysql’mysql> USE
mysql
;
If you need to check the permissions (all the ‘Y’s and ‘N’s in the INSERT statement below) against an existing user you can view the table like this:mysql> SELECT * FROM
db
;
I found this to be necessary as the first time I attempted this, I receieved an error: ERROR 1136 (21S01): Column count doesn’t match value count at row 1
If you already have a lot of users the results may be hard to read, so to just view one user:mysql> SELECT * FROM
db
LIMIT 1;+------+------+------+-------------+-------------+-------------+-------------+-------------+-----------+------------+-----------------+------------+------------+-----------------------+------------------+------------------+----------------+---------------------+--------------------+--------------+| Host | Db | User | Select_priv | Insert_priv | Update_priv | Delete_priv | Create_priv | Drop_priv | Grant_priv | References_priv | Index_priv | Alter_priv | Create_tmp_table_priv | Lock_tables_priv | Create_view_priv | Show_view_priv | Create_routine_priv | Alter_routine_priv | Execute_priv |+------+------+------+-------------+-------------+-------------+-------------+-------------+-----------+------------+-----------------+------------+------------+-----------------------+------------------+------------------+----------------+---------------------+--------------------+--------------+| % | test | user | Y | Y | Y | Y | Y | Y | N | Y | Y | Y | Y | Y | Y | Y | Y | N | N |+------+------+------+-------------+-------------+-------------+-------------+-------------+-----------+------------+-----------------+------------+------------+-----------------------+------------------+------------------+----------------+---------------------+--------------------+--------------+
4. Insert the user into the db
table with priveleges for the new database.
Having checked the privelege settings against those below and satisfying yourself they are good, you do the insertion:mysql> INSERT INTO
db
VALUES('localhost','fh_testing','ac_siteuser','Y','Y','Y','Y','Y','Y','N','Y','Y','Y','Y','Y','Y','Y','Y','N','N');
Note that to prevent access from any other server with this user, set the Host field to ‘localhost’ as in the above example. ‘%’ means ANY mysql connections will be allowed from ANY host.
And that is it.
Or is it? Your sites can now access another database with that user, but you have no access to that user in Plesk or through Plesk’s PHPMyAdmin interface.
Add existing user and database to Plesk tables
4. Select the database named ‘psa’mysql> USE
psa
;
5. Check the account_id of the user being added to the databasemysql> SELECT * FROM
db_users
;+----+------------------+------------+-------+| id | login | account_id | db_id |+----+------------------+------------+-------+| 1 | ac_siteuser | 3 | 2 || 2 | ac_testinguser | 4 | 3 || 3 | fh_testinguser | 6 | 4 |+----+------------------+------------+-------+
In this case, the id of user ‘ac_site’ is 3
6. Check the id of the databasemysql> select * from data_bases;+----+----------------+-------+--------+--------------+-----------------+| id | name | type | dom_id | db_server_id | default_user_id |+----+----------------+-------+--------+--------------+-----------------+| 2 | ac_livedb | mysql | 1 | 1 | 1 || 3 | ac_testing | mysql | 1 | 1 | 2 || 4 | fh_testing | mysql | 1 | 1 | 3 | +----+----------------+-------+--------+--------------+-----------------+
In this case the id of the fh_testing database is 4
7. Insert user name, user account_id and database id into db_users tableINSERT INTO
db_users
VALUES ('','ac_site','3','4');
8. Finally exit and restart mysqlmysql> exit;
# service mysqld restart