cyberweb 0.4.174

data/lib/cyberweb/web_object/css.rb

@@ -0,0 +1,627 @@
+#!/usr/bin/ruby -w
+# Encoding: UTF-8
+# frozen_string_literal: true
+# =========================================================================== #
+# require 'cyberweb/web_object/css.rb'
+# =========================================================================== #
+require 'cyberweb/base/base.rb'
+
+module Cyberweb
+
+class WebObject < Base # === Cyberweb::WebObject
+
+  require 'cyberweb/toplevel_methods/css.rb'
+
+  # ========================================================================= #
+  # === return_default_css_files
+  # ========================================================================= #
+  def return_default_css_files(
+      array_local_css_files = ARRAY_LOCAL_CSS_FILES
+    )
+    _ = ''.dup
+    array_local_css_files.each {|this_css_file|
+      _ << '<link rel="stylesheet" type="text/css" '\
+           'href="'+relative_path?+'cascading_style_sheet/'+
+           this_css_file+'" />'+"\n"
+    }
+    _
+  end
+
+  # ========================================================================= #
+  # === append_this_to_the_body_css
+  # ========================================================================= #
+  def append_this_to_the_body_css(i)
+    @internal_hash[:body_css_style] << i
+  end
+
+  # ========================================================================= #
+  # === return_css_style
+  #
+  # This method will simply return the <style>CONTENT_HERE</style> variant.
+  # ========================================================================= #
+  def return_css_style(i)
+    if i.is_a? Hash
+      _ = ''.dup
+      i.each_pair {|key, value|
+        _ << "#{key} = #{value};"
+      }
+      i = _
+    end
+    return "<style>\n#{i}\n</style>\n"
+  end; alias return_this_css_style return_css_style # === return_this_css_style
+       alias page_css_classes      return_css_style # === page_css_classes
+
+  # ========================================================================= #
+  # === generate_drop_shadow
+  #
+  # This method will "generate" a drop shadow.
+  #
+  # Combined usage example:
+  #
+  #   generate_drop_shadow :red, :default, 'drop_shadow_red'
+  #   div('pad0_5em drop_shadow_red') {
+  #
+  # ========================================================================= #
+  def generate_drop_shadow(
+      use_this_colour                 = '#585858',
+      border                          = :default,
+      use_this_name_for_the_CSS_class = 'drop_shadow'
+    )
+    case border
+    # ======================================================================= #
+    # === :default
+    # ======================================================================= #
+    when :default
+      border = '2px 4px 8px'
+    end
+    css_style(
+      '.'+use_this_name_for_the_CSS_class.to_s+' {
+  filter: drop-shadow('+border.to_s+' '+use_this_colour.to_s+');
+}'
+    )
+  end
+
+  # ========================================================================= #
+  # === css_style
+  #
+  # Use this method to define the css style for the given web object.
+  #
+  # If the last four characters of the argument provided to this method
+  # end with ".css" then we will try to read the file specified
+  # therein. (In this case we assume that it must be a .css file
+  # that was passed into this method.)
+  #
+  # In order to use templates, do something like the following:
+  #
+  #   css_style = :template1
+  #
+  # :symbol names can be used, such as :template1, :template2
+  # and so forth. Alternatively, you can pass a String, or embed
+  # the template-variants via a format such as '#TEMPLATE1#', which
+  # will be substituted with whatever :template1 would normally
+  # return.
+  # ========================================================================= #
+  def css_style(
+      i = :default
+    )
+    # ======================================================================= #
+    # === Special handling of Symbols given here
+    # ======================================================================= #
+    if i.is_a? Symbol
+      case i
+      # ===================================================================== #
+      # === :default
+      #
+      # This can be used like in this way:
+      #
+      #   css_style :template1
+      #
+      # ===================================================================== #
+      when :default,
+           :template,
+           :template1,
+           :css_template1
+        i = css_comment('Generated via `'+i.to_s+'`')+
+            TEMPLATE1 # <- This is CSS/default.css
+      # ===================================================================== #
+      # === :template2
+      # ===================================================================== #
+      when :template2
+        i = css_comment('Generated via `'+i.to_s+'`')+
+            TEMPLATE2
+      # ===================================================================== #
+      # === :code
+      # ===================================================================== #
+      when :code
+        i = css_comment('Generated via `'+i.to_s+'`')+
+            CODE_TEMPLATE
+      # ===================================================================== #
+      # === :template_ruby_regex
+      # ===================================================================== #
+      when :template_ruby_regex
+        i = css_comment('Generated via `'+i.to_s+'`')+
+            TEMPLATE_RUBY_REGEX
+      end
+      i = i.join('') if i.is_a? Array # Join them all.
+    end
+    # ======================================================================= #
+    # Next, substitute for #TEMPLATE1 macro.
+    # ======================================================================= #
+    if i.to_s.include? '#TEMPLATE1'
+      i = i.dup if i.frozen?
+      i.gsub!(/#TEMPLATE1/, TEMPLATE1)
+    end
+    if i and i.end_with?('.css') # assume we pass a .css file here.
+      i = readlines(i).join('') if File.exist?(i)
+    end
+    # ======================================================================= #
+    # Next, we will always append to the @css_style instance variable.
+    # This allows os to build-up the CSS for a webpage.
+    # ======================================================================= #
+    add_with_newline(
+      return_css_style(i)
+    )
+  end; alias main_css_style      css_style # === main_css_style
+       alias main_css            css_style # === main_css
+       alias css_main_style      css_style # === css_main_style
+       alias add_this_css_style  css_style # === add_this_css_style
+       alias css_class           css_style # === css_class
+       alias css_classes         css_style # === css_classes
+       alias c_style=            css_style # === c_style=
+       alias c_class=            css_style # === c_class=
+       alias css_style=          css_style # === css_style=
+       alias general_css=        css_style # === general_css=
+       alias css=                css_style # === css=
+       alias css_template=       css_style # === css_template=
+       alias css_main            css_style # === css_main
+       alias css_main_class      css_style # === css_main_class
+       alias css_code            css_style # === css_code
+       alias c1=                 css_style # === c1=
+       alias c1                  css_style # === c1
+       alias main_css_class      css_style # === main_css_class
+       alias css_style           css_style # === css_style
+       alias append_to_css_style css_style # === append_to_css_style
+       alias append_this_css     css_style # === append_this_css
+       alias inline_css          css_style # === inline_css
+       alias add_css_style       css_style # === add_css_style
+
+  # ========================================================================= #
+  # === hide_scrollbars
+  #
+  # This method can be used to hide the scrollbars, by using CSS.
+  #
+  # I do not recommend to use it, but it exists mostly due to
+  # convenience - and perhaps the user may have a real use
+  # case for this, such as browser-kiosk mode, or something
+  # similar.
+  #
+  # The idea I had when reading this description:
+  #
+  #   https://www.w3schools.com/howto/howto_css_hide_scrollbars.asp
+  #
+  # ========================================================================= #
+  def hide_scrollbars
+    append_this_to_the_body_css '
+      overflow: hidden; /* Hide scrollbars */
+    '
+  end; alias disable_scrollbars hide_scrollbars # === disable_scrollbars
+
+  # ========================================================================= #
+  # === set_body_css_class
+  #
+  # This method can be used to designate a (or several) css_class(es)
+  # in the <body> tag of a webpage.
+  # ========================================================================= #
+  def set_body_css_class(
+      i = ''
+    )
+    @internal_hash[:body_css_class] = i.to_s
+  end; alias body_css_class   set_body_css_class # === body_css_class
+       alias body_css_class=  set_body_css_class # === body_css_class=
+       alias body_css_classes set_body_css_class # === body_css_classes
+       alias body_css_class   set_body_css_class # === body_css_class
+       alias body_css=        set_body_css_class # === body_css=
+       alias body_css         set_body_css_class # === body_css
+       alias bcc=             set_body_css_class # === bcc=
+       alias bcc              set_body_css_class # === bcc
+       alias main_body=       set_body_css_class # === main_body?
+       alias main_body        set_body_css_class # === main_body
+       alias body=            set_body_css_class # === body?
+       alias body             set_body_css_class # === body
+       alias css_class        set_body_css_class # === css_class
+       alias b1=              set_body_css_class # === b1=
+       alias b1               set_body_css_class # === b1
+
+  # ========================================================================= #
+  # === set_body_css_style
+  #
+  # Use this to specify a css style for use in the <body> tag.
+  #
+  # An example for this may be the following:
+  #
+  #   { padding: 25em; }
+  #
+  # ========================================================================= #
+  def set_body_css_style(i)
+    # ======================================================================= #
+    # Since as of Apr 2016, we get rid of all newlines too.
+    # ======================================================================= #
+    if i
+      i = i.dup if i.frozen?
+      i.delete!("\n") if i.include? "\n"
+    end
+    @internal_hash[:body_css_style] = i
+  end; alias body_css_style  set_body_css_style # === body_css_style
+       alias body_css_style= set_body_css_style # === body_css_style=
+       alias body_style=     set_body_css_style # === body_style=
+       alias body_style      set_body_css_style # === body_style
+       alias bcs=            set_body_css_style # === bcs=
+       alias bcs             set_body_css_style # === bcs
+       alias css1=           set_body_css_style # === css1=
+       alias css1            set_body_css_style # === css1
+       alias body_css        set_body_css_style # === body_css
+
+  # ========================================================================= #
+  # === fetch_css_classes
+  #
+  # Use this method to find matching entries. Invoke it at the end
+  # after loading your web object. It will then return an array
+  # with your css class (which you can then inject).
+  #   
+  # Usage example:
+  #
+  #   w.fetch_css_classes
+  #   w.print_this_css(web_object.fetch_css_classes)
+  #
+  # ========================================================================= #
+  def fetch_css_classes(
+      i = CSS_DIRECTORY
+    )
+    array_collection = []
+    these_classes_exist = ::Cyberweb.found_these_css_classes
+    # ======================================================================= #
+    # For the following code to work, CSS_DIRECTORY must obviously exist.
+    # This constant will refer to the css classes that are part of Cyberweb.
+    # ======================================================================= #
+    Dir.foreach(i) {|file|
+      next if File.directory?(file)
+      if File.exist? css_dir+'/'+file
+        _ = readlines(css_dir+'/'+file)
+        _.each {|line|
+          these_classes_exist.each { |entry|
+            array_collection << line if line.include? entry and line =~ /^\.#{entry} /
+          }
+        }
+      end
+    }
+    return array_collection
+  end
+
+  # ========================================================================= #
+  # === found_these_css_classes?
+  #
+  # To display all the CSS classes we use, do something like this:
+  #
+  #   pre found_these_css_classes?.join(''+"\n")
+  #
+  # ========================================================================= #
+  def found_these_css_classes?
+    ::Cyberweb.found_these_css_classes?
+  end
+
+  # ========================================================================= #
+  # === show_missing_css_classes
+  #
+  # This method will show missing CSS classes.
+  #
+  # In order for this to work, we depend on class AllCssClasses.
+  # ========================================================================= #
+  def show_missing_css_classes
+    _ = ::Cyberweb::AllCssClasses.new(:default, false)
+    _.test ::Cyberweb.found_these_css_classes
+    _.run
+    result = _.result
+    spacer
+    h2 'Result'
+    pre result.to_s
+    pre ::Cyberweb.found_these_css_classes.to_s
+    spacer
+    div('mart1em mars2em pad1em','','RAND_BORD_2PX') {
+      h2 'Now showing all missing <b class="orange">'+
+         'CSS classes</b> for this page:'
+      result.each { |entry|
+        marl2em sg(:pfeil_rechts,'marr4px')+entry, 'red'
+      }
+    }
+  end
+
+  # ========================================================================= #
+  # === return_css_style_for_the_triangle_isosceles_bubble
+  #
+  # This method will return two CSS classes, which can be used if you
+  # want to make use of CSS bubbles. Currently only the downwards-facing
+  # triangle is available.
+  #
+  # The original source has been adapted from here:
+  #
+  #   http://nicolasgallagher.com/pure-css-speech-bubbles/demo/
+  #
+  # ========================================================================= #
+  def return_css_style_for_the_triangle_isosceles_bubble(
+      additional_css_rules = ''
+    )
+    if additional_css_rules and additional_css_rules.empty?
+      additional_css_rules = 'margin: 1em 0 3em;'
+    end
+    return '.triangle_isosceles_bubble {
+  position:relative;
+  padding:15px;
+  '+additional_css_rules.to_s+';
+  width:500px;
+  color:#000;
+  background:#f3961c; /* default background for browsers without gradient support */
+  /* css3 */
+  background:linear-gradient(#f9d835, #f3961c);
+  border-radius:10px;
+  border: 1px solid black;
+}
+
+/* This class creates the triangle that faces downwards */
+.triangle_isosceles_bubble:after {
+  content:"";
+  position:absolute;
+  bottom:-13px; /* value = - border-top-width - border-bottom-width */
+  left:30px;    /* controls the horizontal position */
+  border-width: 15px 15px 0; /* vary these values to change the angle of the vertex */
+  border-style: solid;
+  border-color: #f3961c transparent;
+  display:block;
+  width:0;
+}'
+  end
+
+  # ========================================================================= #
+  # === colour_gradient_left_to_right
+  #
+  # This method will "return" a CSS class, for a colour-gradient left to
+  # right.
+  # ========================================================================= #
+  def colour_gradient_left_to_right(
+      colour1 = :steelblue,
+      colour2 = :darkgreen,
+      css_name_that_will_be_returned = '.gradient1'
+    )
+    return "#{css_name_that_will_be_returned} {
+  background: linear-gradient(to right, #{colour1}, #{colour2});
+}"
+  end; alias colour_gradient colour_gradient_left_to_right # === colour_gradient
+
+  # ========================================================================= #
+  # === colour_gradient_right_to_left
+  #
+  # This method will "return" a CSS class, for a colour-gradient left to
+  # right.
+  # ========================================================================= #
+  def colour_gradient_right_to_left(
+      colour1 = :steelblue,
+      colour2 = :darkgreen,
+      css_name_that_will_be_returned = '.gradient1'
+    )
+    return "#{css_name_that_will_be_returned} {
+  background: linear-gradient(to left, #{colour1}, #{colour2});
+}"
+  end
+
+  # ========================================================================= #
+  # === css_class_or_no_class
+  # ========================================================================= #
+  def css_class_or_no_class(i = '')
+    unless i.to_s.empty?
+      i = " class=\"#{i}\""
+    end
+    return i
+  end
+
+  # ========================================================================= #
+  # === css_style_or_no_style
+  # ========================================================================= #
+  def css_style_or_no_style(i = '')
+    unless i.to_s.empty?
+      i = " style=\"#{i}\""
+    end
+    return i
+  end
+
+  # ========================================================================= #
+  # === set_font_size
+  #
+  # Set the font size to use via this method.
+  #
+  # Usage example for this:
+  #
+  #   w.font_size = '1.1em'
+  #
+  # ========================================================================= #
+  def set_font_size(
+      this_font_size = 'default'
+    )
+    # ======================================================================= #
+    # We will work on Strings past the next point.
+    # ======================================================================= #
+    this_font_size = this_font_size.to_s.strip
+    # ======================================================================= #
+    # Remove leading 'FS' strings - at the least this is the main rationale
+    # for the following .sub!() method call.
+    # ======================================================================= #
+    this_font_size.sub!(/FS/,'') if this_font_size.include? 'FS'
+    this_font_size.gsub!(/_/,'.') if this_font_size.include? '_'
+    case this_font_size
+    # ======================================================================= #
+    # === larger
+    # ======================================================================= #
+    when 'larger',
+          'bigger'
+      this_font_size = '1.10em;'
+    # ======================================================================= #
+    # === smaller
+    # ======================================================================= #
+    when 'smaller'
+      this_font_size = @config['default_smaller_font_size']
+    when 'def','default'
+      # ===================================================================== #
+      # The default font size. Can be found in the config file.
+      # constant still has it though.
+      # ===================================================================== #
+      this_font_size = @config['default_font_size']
+    end
+    # ======================================================================= #
+    # Now sanitize it a bit.
+    # ======================================================================= #
+    this_font_size = this_font_size.delete(' ')
+    addnl(
+      return_this_css_style(
+        'body { font-size:'+this_font_size+'; }'
+      )
+    )
+  end; alias font_size=         set_font_size # === font_size=
+       alias font_size          set_font_size # === font_size
+       alias use_this_font_size set_font_size # === use_this_font_size
+
+  # ========================================================================= #
+  # === use_monospace_font
+  #
+  # By default this will use the "Lucida Console" font.
+  # ========================================================================= #
+  def use_monospace_font(
+      use_this_font = '"Lucida Console", Monaco, monospace'
+    )
+    use_this_font = use_this_font.dup if use_this_font.frozen? 
+    use_this_font << ';' unless use_this_font.end_with? ';'
+    append_to_css_style '
+body {
+  font-family: '+use_this_font+'
+}
+    '
+  end; alias monospace_font use_monospace_font # === monospace_font
+
+  # ========================================================================= #
+  # === add_all_local_css_files
+  # ========================================================================= #
+  def add_all_local_css_files(
+      i = ARRAY_LOCAL_CSS_FILES
+    )
+    # if is_on_roebe?
+    #   into = Cyberweb.log_directory?+'css_dataset.css'
+    #   if File.exist? into
+    #     File.delete(into)
+    #   end
+    #   mkdir(Cyberweb.log_directory?) unless File.directory?(Cyberweb.log_directory?)
+    # end
+    i.each {|this_css_file|
+      if this_css_file.frozen?
+        this_css_file = this_css_file.dup
+      end
+      this_css_file << '.css' unless this_css_file.end_with? '.css'
+      # ===================================================================== #
+      # Add the content of these style-sheets as-is.
+      # ===================================================================== #
+      # if File.exist? target
+      #   addn(return_css_style(File.read(target)))
+      # end
+      # ===================================================================== #
+      # The following code is for link-rel stylesheets, but it is a
+      # bit buggy. May have to fix this at a later time.
+      # ===================================================================== #
+      # _ = '<link rel="stylesheet" type="text/css" '\
+      #     'href="'+relative_path?+'cascading_style_sheets/'+this_css_file+'" />'
+            # _ = '<link rel="stylesheet" type="text/css" '\
+      #     'href="'+::Cyberweb.project_base_dir?'" />'
+      target_file = Cyberweb.project_base_dir?+'cascading_style_sheets/'+this_css_file
+      if File.exist? target_file
+        content_of_this_css_file = File.read(target_file, encoding: use_which_encoding?)
+        dataset = ::Cyberweb.style_tag(content_of_this_css_file)
+        addnl(dataset)
+        # if is_on_roebe?
+        #   append_what_into(dataset, into)
+        # end
+      else
+        e "No file exists at #{target_file}."
+      end
+    }
+  end; alias add_default_css_files    add_all_local_css_files # === add_default_css_files
+       alias append_default_css_files add_all_local_css_files # === append_default_css_files
+
+  # ========================================================================= #
+  # === set_background
+  #
+  # Use this to set a specific background colour.
+  #
+  # Usage example:
+  #
+  #   w.background = 'black'
+  #
+  # Hmm doesn't seem to work ... odd.
+  # ========================================================================= #
+  def set_background(
+      colour = 'black'
+    )
+    _ = 'body { '.dup
+    case colour # Handle symbols here, since Jan 2014.
+    when :scroll
+      _ << ' background-attachment: scroll; ' 
+    else
+      _ << "background-color: #{colour};"
+    end
+    _ << ' }'
+    add_this_css_style(_)
+  end; alias background_colour  set_background # === background_colour
+       alias background_color   set_background # === background_color
+       alias background_color=  set_background # === background_color?
+       alias background_colour= set_background # === background_colour=
+       alias background         set_background # === background
+
+  # ========================================================================= #
+  # === add_this_remote_css_page
+  #
+  # Use this method in order to include a remote css file.
+  #
+  # The argument to this method should be the remote URL that
+  # you want to access.
+  #
+  # Please use use this method solely for remote URLs.
+  #
+  # Specific Usage Example:
+  #
+  #   css_remote_url 'http://www.playgroundblues.com/media/stylesheets/screen.css'
+  #
+  # ========================================================================= #
+  def add_this_remote_css_page(i)
+    addnl(
+      '<link rel="stylesheet" href="'+i+'" type="text/css" media="screen">'
+    )
+  end; alias css_remote_url       add_this_remote_css_page # === css_remote_url
+       alias external_stylesheet  add_this_remote_css_page # === external_stylesheet
+       alias remote_css           add_this_remote_css_page # === remote_css
+       alias add_remote_css_page  add_this_remote_css_page # === add_remote_css_page
+       alias css_file=            add_this_remote_css_page # === css_file=
+       alias add_css_file         add_this_remote_css_page # === add_css_file
+       alias css_file             add_this_remote_css_page # === css_file
+       alias external_style_sheet add_this_remote_css_page # === external_style_sheet
+
+  # ========================================================================= #
+  # === white_font
+  # ========================================================================= #
+  def white_font
+    add_this_css_style(
+      'body { color: white; }'
+    )
+  end
+
+  # ========================================================================= #
+  # === listing_css
+  # ========================================================================= #
+  def listing_css(i)
+    ::Cyberweb.listing_css_object = i
+  end
+
+end; end