NAME

Catalyst::Controller::AutoAssets::Handler::IconSet - IconSet type handler

SYNOPSIS

In your controller:

  package MyApp::Controller::Assets::Icons;
  use parent 'Catalyst::Controller::AutoAssets';
  
  1;

Then, in your .conf:

  <Controller::Assets::Icons>
    include        root/static/icons/
    type           IconSet
  </Controller::Assets::Icons>

And in your .tt files:

  <head>
    <!-- include the auto generated icon CSS -->
    [% c.controller('Assets::Icons').html_head_tags %]
    
    <!-- or, in static HTML -->
    <link rel="stylesheet" type="text/css" href="/assets/icons/current/icons.css" />
  </head>
  
  ...
  
  <!-- access individual icons by name -->
  [% c.controller('Assets::Icons').img_tag('foo.png') %]
  <img src="[% c.controller('Assets::Icons').asset_path('apple.jpg') %]">
  
  ...
  
  <!-- use icon class names in markup -->
  <div class="mycls [% c.controller('Assets::Icons').icon_class('apple.jpg') %]"></div>
  
  <!-- or, in static HTML -->
  <div class="mycls icon-apple"></div>

DESCRIPTION

Like the 'ImageSet' asset type but also generates/includes CSS classes for accessing/using icons in HTML markup (i.e. with the css style 'background-image'). These icon class names can then be used in HTML tags or directly in JavaScript frameworks like ExtJS.

This class extends Catalyst::Controller::AutoAssets::Handler::ImageSet. Only differences are shown below.

CONFIG PARAMS

flatten_paths

Inherited from ImageSet but defaults to true (1).

icon_name_prefix

String to prepend to the generated css icon class name. Defaults to 'icon-'.

lowercase_icon_names

Whether or not to use all lowercase characters in the css icon class name. Defaults to true (1).

strip_ext_icon_names

Whether or not to strip the file extension from the filename when generating the css class name. Defaults to true (1).

replace_nonwords_icon_names

Whether or not to convert special characters and _ in filename to '-' when generating the css class name. Defaults to true (1).

icon_name_generator

CodeRef used to generate the css icon class name. Receives ($self, $image_name) as arguments and returns the css class name. If this is overridden it will supersede all the above "_icon_names" options. With all the default options, the $image_name 'Brick_House.png' would return the CSS class name 'icon-brick-house'.

css_rule_generator

CodeRef used to generate the actual css rule definition for a given icon class name. Receives ($self, $icon_class, $path) as arguments and returns the css rule string. By default, args 'icon-brick-house' and 'Brick_House.png' would return:

  .icon-brick-house { background-image: url(Brick_House.png) !important; }

css_file_name

The name of the automatically generated CSS file which will contain the CSS rules for all the icons included in the asset. This file is accessible as an ordinary subfile in the asset.

Defaults to 'icons.css'.

METHODS

html_head_tags

Returns a pre-built link tag to include the generated CSS suitable for use in an HTML <head> section. By default this will be:

  <link rel="stylesheet" type="text/css" href="<CONTROLLER_PATH>/<SHA1>/icons.css" />

icon_class

Returns the generated icon css class name for the supplied icon path/filename.

  [% c.controller('Assets::Icons').icon_class("Brick_House.png") %] # 'icon-brick-house'

SEE ALSO

Catalyst::Controller::AutoAssets
Catalyst::Controller::AutoAssets::Handler::ImageSet
Catalyst::Controller::AutoAssets::Handler

AUTHOR

Henry Van Styn <vanstyn@cpan.org>

COPYRIGHT AND LICENSE

This software is copyright (c) 2013 by IntelliTree Solutions llc.

This is free software; you can redistribute it and/or modify it under the same terms as the Perl 5 programming language system itself.