Command Buttons

# This creates the HTML for a 'command' item - such
# as menu items, and the 'New Search' and 'Refine Search' that
# appear on search screen options bars. A command item is simply a UI
# element that links to a URL. Typical implementations are as buttons,
# or simply styled text with a <a>...</a> link.
#
# Arg 1 - item label text
# Arg 2 - target URL
# Arg 3 - flags
# Arg 4 - CSS class name prefix
# OPTIONAL
# Arg 5 - reference to map for future additional arguments; possibly undefined
#
# The flags is a bitwise ORing of any of the following:
# - $::c_CMDITEM_ENABLED: set if this command item is clickable; if not
#                         set you might want to output the item in
#                         a 'disabled' colour, and/or make it non-clickable
# - $::c_CMDITEM_SELECTED: set if this command item should be highlighted in
#                          some way. E.g. this bit is set for the currently
#                          selected page menu item on the animal details page.
sub hookStyle_MakeCmdItemHTML {
    my ($strLabel, $strURL, $nFlags, $strClassPrefix, $rmArgsEx) = @_;

    # Use CGI.pm:escapeHTML to protect any text in the label that would
    # mean something else in HTML:
    my $html = $::g_q->escapeHTML($strLabel);

    # Prevent menu item label being split over multiple lines:
    $html =~ s/ /&nbsp;/g;

    # Turn it into a link if the item is enabled:
    if ($nFlags & $::c_CMDITEM_ENABLED) {
        $html = $::g_q->a({'-href' => $strURL}, $html);
    }

    # Construct the css class name that we will apply to the link HTML with
    # a <span>: [Background: the $strClassPrefix parameter is a string
    # such as 'pds-sitemenu-cmd', 'pds-pagemenu-cmd', etc that is used as the
    # prefix for a css class name we apply. Different prefixes are used for
    # command items in different contexts - such as site menu command items
    # ('pds-sitemenu-cmd'), page menu command items ('pds-pagemenu-cmd'),
    # options bar command items ('pds-optionsbar-cmd') etc. If you check out
    # the stylesheet you can then see different rendering styles being applied
    # to the various derived css styles.]
    my $strClass = $strClassPrefix;
    if (!($nFlags & $::c_CMDITEM_ENABLED)) {
        $strClass .= '-disabled';
    } elsif ($nFlags & $::c_CMDITEM_SELECTED) {
        $strClass .= '-selected';
    } else {
        $strClass .= '-normal';
    }

    # Now we use <span> to apply the construct css class to the html:
    $html = $::g_q->span({'-class' => $strClass}, $html);

    # .. and return it:
    return $html;
}

# This creates the HTML for a 'command' item - such as menu items, and the 
# 'New Search' and 'Refine Search' that appear on search screen options bars.
# A command item is simply a UI element that links to a URL. Typical
# implementations are as buttons, or simply styled text with a <a>...</a> link.
#
# Arg 1 - item label text
# Arg 2 - target URL
# Arg 3 - flags
# Arg 4 - CSS class name prefix
# OPTIONAL
# Arg 5 - reference to map for future additional arguments; possibly undefined
#
# The flags is a bitwise ORing of any of the following:
# - $::c_CMDITEM_ENABLED: set if this command item is clickable; if not set you
#       might want to output the item in a 'disabled' colour, and/or make it
#       non-clickable
# - $::c_CMDITEM_SELECTED: set if this command item should be highlighted in
#       some way. E.g. this bit is set for the currently selected page menu
#       item on the animal details page.
sub hookStyle_MakeCmdItemHTML {
   my ($strLabel, $strURL, $nFlags, $strClassPrefix, $rmArgsEx) = @_;

   # Construct the css class name that we will apply to the button HTML with the 
   # 'class' attribute: [Background: the $strClassPrefix parameter is a string such 
   # as 'pds-sitemenu-cmd', 'pds-pagemenu-cmd', etc that is used as the prefix for a
   # css class name we apply. Different prefixes are used for command items
   # in different contexts - such as site menu command items ('pds-sitemenu-cmd'), 
   # page menu command items ('pds-pagemenu-cmd'), options bar command items 
   # ('pds-optionsbar-cmd') etc. If you check out the stylesheet you can then see
   # different rendering styles being applied to the various derived css styles.]
   my $strClass = $strClassPrefix;
   if (!($nFlags & $::c_CMDITEM_ENABLED)) {
      $strClass .= '-disabled';
   } elsif ($nFlags & $::c_CMDITEM_SELECTED) {
      $strClass .= '-selected';
   } else {
      $strClass .= '-normal';
   }

   # Create a unique ID for the button, using pdsMakeUniqueID():
   my $strButID = 'ci'.&pdsMakeUniqueID();
   
   # Manual code for generating a <button> (we dont use CGI.pm::button,
   # because it generates a <input> and does not support disabled colouring):   
   my $html = '<button ID="'.$strButID.'" onclick="document.location=\''.$strURL.'\';return false;"';
   $html .= ' disabled' if !($nFlags & $::c_CMDITEM_ENABLED);
   $html .= ' class="'.$strClass.'"' if $strClass ne '';
   $html .= '>'.$::g_q->escapeHTML($strLabel).'</button>';
   
   # .. and return it:
   return $html;
}

.
.
.



   .pds-sitemenu-cmd-normal { color: #000000; font-weight: bold; }
   .pds-sitemenu-cmd-disabled { color: #a0a0a0; font-weight: bold; }
   .pds-sitemenu-cmd-selected { color: blue; font-weight: bold; }
.
.



   .pds-pagemenu-cmd-normal { color: #000000; font-weight: bold; }
   .pds-pagemenu-cmd-disabled { color: #a0a0a0; font-weight: bold; }
   .pds-pagemenu-cmd-selected { color: blue; font-weight: bold; }
.
.



   .pds-optionsbar-cmd-normal { color: #000000; }
   .pds-optionsbar-cmd-disabled { color: #a0a0a0; }
   .pds-optionsbar-cmd-selected { color: blue; }
.
.
.