---

CSS property manager. This class is used for agnostic handling of icons, CSS class names, or styling preferences of a subsite/instance.

Defined in packages/xotcl-core/tcl/01-debug-procs.tcl

Class Relations

• class: ::nx::Object

::nx::Object create ::template::CSS

Methods (to be applied on the object)

• class (scripted, public)

   template::CSS class [ -toolkit toolkit ] name

  In case, a mapping for CSS classes is defined, return the mapping for the provided class name. Otherwise return the provided class name.

  Switches:

  -toolkit (optional)

  Parameters:

  name (required)

  Testcases:

  No testcase defined.

  #
  # In case, a mapping for CSS classes is defined, return the
  # mapping for the provided class name. Otherwise return the
  # provided class name.
  #
  if {![info exists toolkit]} {
      set toolkit ${:preferredCSSToolkit}
  }
  #ns_log notice "CSS CLASS <$name> get from toolkit $toolkit exists [dict exists ${:cssClasses} $toolkit $name]"
  
  if {[dict exists ${:cssClasses} $toolkit $name]} {
      return [dict get ${:cssClasses} $toolkit $name]
  } else {
      return $name
  }

• classes (scripted, public)

   template::CSS classes classNames

  Map a list of CSS class names

  Parameters:

  classNames (required)

  Testcases:

  No testcase defined.

  #
  # Map a list of CSS class names
  #
  return [join [lmap class $classNames {:class $class}] " "]

• clear (scripted, public)

   template::CSS clear

  Clear the cached toolkit name, such that it is reloads the settings on the next initialize call.

  Testcases:

  No testcase defined.

  #
  # Clear the cached toolkit name, such that it is reloads the
  # settings on the next initialize call.
  #
  unset -nocomplain :preferredCSSToolkit

• icon_name (scripted, public)

   template::CSS icon_name filename

  Return an icon name for the proved filename Default icon name

  Parameters:

  filename (required)

  Testcases:

  No testcase defined.

  #
  # Return an icon name for the proved filename
  #
  # Default icon name
  set iconName file
  if {${:iconset} eq "bootstrap-icons"} {
      switch [ad_file extension $filename] {
          .doc  -
          .docx -
          .odt  -
          .txt  {set iconName "file-earmark-text"}
  
          .csv  -
          .ods  -
          .xls  -
          .xlsx {set iconName "file-earmark-spreadsheet"}
  
          .odp  -
          .ppt  -
          .pptx {set iconName "file-earmark-spreadsheet"}
  
          .pdf  {set iconName "file-earmark-pdf"}
  
          .c    -
          .h    -
          .tcl {set iconName "file-earmark-code"}
  
          .css  -
          .html -
          .java -
          .js   -
          .json -
          .py   -
          .sql {set iconName "filetype-[string range [ad_file extension $filename] 1 end]"}
  
          default {
              switch -glob [ns_guesstype $filename] {
                  image/* {set iconName "file-earmark-image"}
                  video/* {set iconName "file-earmark-play"}
                  audio/* {set iconName "file-earmark-slides"}
                  default {
                      ns_log notice "not handled '[ad_file extension $filename] / [ns_guesstype $filename] of <$filename>"
                  }
              }
          }
      }
  }
  return $iconName

• initialize (scripted, public)

   template::CSS initialize

  Initialize tailorization for CSS toolkits. The function reads the global apm package parameter and sets/resets accordingly (a) the default values (actually parameters) for the form field and (b) defines the toolkit specific CSS class name mapping. Loading optional, but universally present header files has do be performed per request... not sure this is the best place, since packages are as well initialized in the background.

  Testcases:

  No testcase defined.

  #
  # Initialize tailorization for CSS toolkits. The function reads
  # the global apm package parameter and sets/resets accordingly
  # (a) the default values (actually parameters) for the form
  # field and (b) defines the toolkit specific CSS class name
  # mapping.
  #
  #
  # Loading optional, but universally present header files has do
  # be performed per request... not sure this is the best place,
  # since packages are as well initialized in the background.
  #
  if {[ns_conn isconnected] && [apm_package_enabled_p "bootstrap-icons"]} {
      template::head::add_css -href urn:ad:css:bootstrap-icons
  }
  set paramValue [parameter::get_global_value -package_key acs-templating  -parameter PreferredCSSToolkit  -default [parameter::get_global_value -package_key xowiki  -parameter PreferredCSSToolkit  -default default]]
  #
  # Check, if parameter value is compatible with the theme. In
  # particular, a preferred toolkit of "bootstrap3" does not work
  # when the theme is based on Bootstrap 5 and vice versa. When necessary,
  # align the value.
  #
  if {$paramValue in {default bootstrap bootstrap5} && [ns_conn isconnected]} {
      set theme [subsite::get_theme]
      if {$paramValue in {bootstrap default} && [string match *bootstrap5* $theme]} {
          set paramValue bootstrap5
      } elseif {$paramValue in {bootstrap5 default} && [string match *bootstrap3* $theme]} {
          set paramValue bootstrap
      }
      if {$paramValue eq "default"} {
          # For the time being, YUI is the default (deriving default
          # toolkit from theme did not work, we have to assume that
          # the fonts for Bootstrap 3 or 5 are not loaded for edit
          # buttons, etc.
          set paramValue yui
      }
  }
  
  #
  # Just do initialization once
  #
  if {[info exists :preferredCSSToolkit]
      && ${:preferredCSSToolkit} eq $paramValue
  } {
      return
  }
  #ns_log notice "template::CSS: initialize to <$paramValue>"
  #
  # The code below is executed only on first initialization of the
  # object or on changes of the preferredCSSToolkit.
  #
  set :preferredCSSToolkit $paramValue
  set :iconset [template::iconset]
  
  if {${:preferredCSSToolkit} eq "bootstrap"} {
      if {[info commands ::xowiki::formfield::FormField] ne ""} {
          ::xowiki::formfield::FormField parameter [subst {
              {CSSclass form-control}
              {form_item_wrapper_CSSclass form-group}
              {form_label_CSSclass ""}
              {form_widget_CSSclass ""}
              {form_button_CSSclass "[template::CSS class form-action]"}
              {form_button_wrapper_CSSclass ""}
              {form_help_text_CSSclass help-block}
          }]
      }
  } elseif {${:preferredCSSToolkit} eq "bootstrap5"} {
      if {[info commands ::xowiki::formfield::FormField] ne ""} {
          ::xowiki::formfield::FormField parameter [subst {
              {CSSclass form-control}
              {form_item_wrapper_CSSclass mb-3}
              {form_label_CSSclass "form-label me-1"}
              {form_widget_CSSclass ""}
              {form_button_CSSclass "[template::CSS class form-action]"}
              {form_button_wrapper_CSSclass ""}
              {form_help_text_CSSclass form-text}
          }]
          ::xowiki::formfield::select parameter {
              {CSSclass form-select}
          }
          ::xowiki::formfield::checkbox parameter {
              {CSSclass form-check}
          }
          ::xowiki::formfield::radio parameter {
              {CSSclass form-check}
          }
          ::xowiki::formfield::range parameter {
              {CSSclass form-range}
          }
      }
  } else {
      if {[info commands ::xowiki::formfield::FormField] ne ""} {
  
          ::xowiki::formfield::FormField parameter {
              {CSSclass}
              {form_label_CSSclass ""}
              {form_widget_CSSclass form-widget}
              {form_item_wrapper_CSSclass form-item-wrapper}
              {form_button_CSSclass ""}
              {form_button_wrapper_CSSclass form-button}
              {form_help_text_CSSclass form-help-text}
          }
          ::xowiki::Form requireFormCSS
      }
  }

• require_toolkit (scripted, public)

   template::CSS require_toolkit [ -css ] [ -js ]

  Make sure that the preferred toolkit is loaded. Note that some combination won't match nicely, since e.g. the toolbar of a theme based on bootstrap5 is messed up, when the preferred toolkit is bootstrap3. .... so, we should have some default setting or fallbacks to handle such situations.

  Switches:

  -css (optional)

  -js (optional)

  Testcases:

  No testcase defined.

  #
  # Make sure that the preferred toolkit is loaded. Note that some
  # combination won't match nicely, since e.g. the toolbar of a
  # theme based on bootstrap5 is messed up, when the preferred
  # toolkit is bootstrap3. .... so, we should have some default
  # setting or fallbacks to handle such situations.
  #
  if {${:preferredCSSToolkit} eq "bootstrap5"} {
      if {$css} {::template::head::add_css -href urn:ad:css:bootstrap5}
      if {$js}  {::template::head::add_javascript -src urn:ad:js:bootstrap5}
  } elseif {${:preferredCSSToolkit} eq "bootstrap"} {
      if {$css} {::template::head::add_css -href urn:ad:css:bootstrap3}
      if {$js}  {::template::head::add_javascript -src urn:ad:js:bootstrap3}
  } else {
      # YUI has many simple files, let the application decide what
      # to be loaded.
  }

• toolkit (scripted, public)

   template::CSS toolkit

  Return the preferred CSS toolkit

  Testcases:

  No testcase defined.

  #
  # Return the preferred CSS toolkit
  #
  return ${:preferredCSSToolkit}

---