Opened 13 years ago
Closed 13 years ago
#10206 closed New Feature (wontfix)
new way to specify pos_horz offset via calls to addIcon
| Reported by: | Zac Morris | Owned by: | |
|---|---|---|---|
| Priority: | Normal | Milestone: | |
| Component: | UI : Skins | Version: | 4.0 Beta |
| Keywords: | Skins | Cc: |
Description
Currently, creating a new skins assumes the user has either: 1) a set of individual 16px X 16px icons images 2) is modifying an existing skin's icons.png which is a single vertical/column stripe of images
May corporations maintain a reference set of images that may need to be utilize for creating a custom skin. These reference images may already be a set of sprite images that are not laid out in a single vertical/column.
Adding a pos_horz parameter to the addIcon method of core/skin.js file allows a skin to define an icon that may come from a non-vertically aligned "source" file.
This would also mean modifying getIconStyle to enable both a new input parameter, but also a lookup of the new pos_horz value vs the current default 0.
/**
* Registers an icon.
*
* @param {String} name The icon name.
* @param {String} path The path to reach the icon image file.
* @param {Number} [offset_vert] The vertical offset position of the icon, if
* available inside a strip image.
* @param {Number} [offset_horz] The horizontal offset position of the icon, if
* available inside a strip image.
*/
addIcon: function( name, path, offset_vert, offset_horz ) {
name = name.toLowerCase();
if ( !this.icons[ name ] ) {
this.icons[ name ] = {
path: path,
offset_vert: offset_vert || 0,
offset_horz: offset_horz || 0
};
}
},
/**
* Get the CSS background styles to be used to render an specific icon.
*
* @param {String} name The icon name, as registered with {@link #addIcon}.
* @param {Boolean} [rtl] Indicates that the RTL version of the icon is
* to be used, if available.
* @param {String} [overridePath] The path to reach the icon image file. It
* overrides the path defined by the named icon, if available, and is
* used if the named icon was not registered.
* @param {Number} [overrideOffset] The vertical offset position of the
* icon. It overrides the offset defined by the named icon, if
* available, and is used if the named icon was not registered.
*/
getIconStyle: function( name, rtl, overridePath, overrideOffset_vert, overrideOffset_horz ) {
var icon, path, offset_vert, offset_horz;
if ( name ) {
name = name.toLowerCase();
// If we're in RTL, try to get the RTL version of the icon.
if ( rtl )
icon = this.icons[ name + '-rtl' ];
// If not in LTR or no RTL version available, get the generic one.
if ( !icon )
icon = this.icons[ name ];
}
path = overridePath || ( icon && icon.path ) || '';
offset_vert = overrideOffset_vert || ( icon && icon.offset_vert );
offset_horz = overrideOffset_horz || ( icon && icon.offset_horz );
return path &&
( 'background-image:url(' + CKEDITOR.getUrl( path ) + ');background-position:' + offset_horz + 'px '+offset_vert+'px;' );
}
While this may break the common x before y paradigm, adding the pos_horz after the pos_vert means the change is completely backwards compatible with all existing plugins/skins.
I will submit this as a pull request.
Change History (4)
comment:1 Changed 13 years ago by
| Type: | Bug → New Feature |
|---|
comment:2 Changed 13 years ago by
| Version: | 4.1 (GitHub - major) → 4.0 Beta |
|---|
comment:4 Changed 13 years ago by
| Resolution: | → wontfix |
|---|---|
| Status: | new → closed |

4.0 Beta is the first version for which this ticket makes sense.