aw schriftzug.png aw logo 60x60.png

RenderIconSelector
Renders a widget to select a photo

2017-02-17 - 14:08 | Version 1 |

Documentation

This function renders a selection widget to chose an icon

Parameters
  • VALUE: which icon is preselected
  • SOURCE: topic that has got a set of icons attached to it, defaults to IconSet

Implementation

%STARTINCLUDE%<!-- render photo selector -->
<div class="clsIconSelector">
<input type="hidden" class="clsIconInput" name="Icon" value="%IF{"defined VALUE" then="%VALUE%"}%" />
%ATTACHMENTS{
   topic="%IF{"defined SOURCE" then="%SOURCE%" else="Applications.ClassificationApp.IconSet"}%"
   name=".*\.(jpe?g|JPE?G|gif|GIF|png|PNG)$"
   sort="name"
   format="<div class='clsIconContainer'><img class='clsIcon' src='$url' alt='$name' title='$name' height='16px' /></div>"
}%
%CLEAR%
</div>
<literal>
<script>
jQuery(function($) {
  $(".clsIconSelector").each(function() {
    var $selector = $(this), 
    $input = $selector.find(".clsIconInput");

    function updateSelection(name) {
      $selector.find(".clsIconContainer").removeClass("selected")

      if (typeof(name) === 'undefined') {
        name = $(".clsIconInput").val();
      }

      if (name) {
        $selector.find("img[alt='"+name+"']").parent().addClass("selected");
      }
      $input.val(name);
    }

    $selector.find(".clsIcon").click(function(e) {
      var $this = $(this),
          $container = $this.parent(),
          name = $this.attr("alt");

      if ($container.is(".selected")) {
        updateSelection("");
      } else {
        updateSelection(name);
      }
      e.preventDefault();
      return false;
    });

    updateSelection()
  });
});
</script>
</literal>
%STOPINCLUDE%

Test

anchor.png
application_cascade.png
application_double.png
application_form.png
application_home.png
application_lightning.png
application_view_columns.png
application_view_tile.png
arrow_switch.png
asterisk_orange.png
asterisk_yellow.png
attach.png
bell.png
bomb.png
book.png
bug.png
cake.png
calendar_view_day.png
car.png
cart.png
chart_bar.png
chart_curve.png
chart_organisation.png
clock.png
cog.png
coins.png
comment.png
comments.png
cube_molecule.png
database_key.png
door.png
door_open.png
drink.png
dvd.png
emoticon_grin.png
eye.png
female.png
find.png
folder.gif
folder_edit.png
folder_error.png
folder_explore.png
folder_find.png
folder_heart.png
folder_image.png
folder_key.png
folder_lock.gif
folder_palette.png
group.png
heart.png
help.png
house.png
image.png
information.png
ipod.png
ipod_cast.png
key.png
lightbulb.png
lightning.png
lorry.png
magnifier.png
male.png
medal_gold_3.png
money.png
money_dollar.png
money_euro.png
money_pound.png
money_yen.png
monitor.png
music.png
new.png
newspaper.png
note.png
page_copy.png
page_excel.png
page_white_acrobat.png
palette.png
pencil.png
phone.png
photos.png
pilcrow.png
pill.png
pipe.png
plugin.png
presentation.png
printer.png
rainbow.png
report.png
report_user.png
report_word.png
rosette.png
ruby.png
script.png
server.png
server_database.png
shield.png
sitemap.png
sport_basketball.png
sport_football.png
sport_golf.png
sport_soccer.png
status_away.png
status_busy.png
status_offline.png
status_online.png
tag_blue.png
telephone.png
television.png
text.png
tux.png
user.png
user_comment.png
user_suit.png
weather_clouds.png
weather_cloudy.png
weather_lightning.png
weather_rain.png
weather_snow.png
weather_sun.png
webcam.png
world.png
wrench.png
wrench_orange.png

Calls to 'RenderIconSelector'

Copyright

© 2006-2015 Michael Daum http://michaeldaumconsulting.com

This file is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 2 of the License, or (at your option) any later version. For more details read the LICENSE.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY, to the extent permitted by law; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
Warning: Can't find topic Applications/ClassificationApp.WebLeftBarExample

Impressum © Alexander Weimer GmbH