-
-
Notifications
You must be signed in to change notification settings - Fork 3.4k
Icons_Sprites_Usage
In the default theme for phpMyAdmin 3.5+ the major parts of phpMyAdmin's icons are now also available as CSS Sprites. This change significantly reduces the number of files the clients browser has to request from the server, which results in the page being loaded quicker.
There are two new sprite-aware functions available in phpMyAdmin. One for PHP and one for JavaScript and both of them are called PMA_getImage(). They will return an IMG tag for the requested image and are aware of which image is available as a sprite and which one isn't.
string PMA_getImage(string $filename[, string $alternate[, array $attributes]]);
echo PMA_getImage('b_drop.png');
echo PMA_getImage('b_drop.png', __("Delete something"));
echo PMA_getImage('b_drop.png', __("Delete something"), array('class' => 'hide', 'id' => 'jsonly'));
The $alternate
parameter sets both the 'alt' and the 'title' attributes in the IMG tag, but if you need to set only one of the two there are two ways to override. An example of how to only set the 'alt' attribute:
echo PMA_getImage('b_drop.png', __("Delete something"), array('title' => ""));
echo PMA_getImage('b_drop.png', "", array('alt' => __("Delete something")));
object PMA_getImage(string $filename[, string $alternate[, object $attributes]]);
This is what you might expect back after calling this function:
{
toString: function() {
// returns the IMG tag
},
attr: function(string name) {
// returns the value of the requested attribute
},
isSprite: true // or false
}
var myImage = PMA_getImage('b_edit.png');
var myImage = PMA_getImage('b_edit.png', PMA_messages['strEdit']);
var myImage = PMA_getImage('b_exit.png', "", {'alt': PMA_messages['strEdit']});
// Once you have an image object, you can query it for attributes
// and use those to replace an existing image
$img.attr('src', myImage.attr('src'));
$img.attr('class', myImage.attr('class'));
// Or you can use the image directly
var buffer = myImage.toString();
// Creating a jQuery object
var $myObj = $(PMA_getImage('b_edit.png').toString());
If you wish to use sprites in your theme, you can checkout the latest version of phpMyAdmin from Git, copy your theme into the 'themes' folder and follow the instructions for maintainers below to generate the sprites.
Note that this will regenerate the sprites for all the themes that are found in the 'themes' folder.
- A linux shell
- Imagemagick
- pngcrush (optional, but recommended)
The ./scripts/generate-sprites
script takes one argument, the path to the root folder of the phpMyAdmin. So you might call it like this:
cd /path/to/phpmyadmin
./scripts/generate-sprites .
or
/home/username/phpmyadmin/scripts/generate-sprites /home/username/phpmyadmin
Popular destinations:
- Team meetings
- GSoC home
- Developer guidelines
- How to install on Debian and Ubuntu
- Issue and pull-request management
User resources: