#!/usr/bin/ruby -w # Encoding: UTF-8 # frozen_string_literal: true # =========================================================================== # # localhost/DATA/PROGRAMMING_LANGUAGES/RUBY/src/ascii_paradise/lib/ascii_paradise/www/ascii_paradise.cgi # =========================================================================== # require 'cyberweb/autoinclude' require 'ascii_paradise'

english('Ascii Paradise Demo Page') { favicon :ruby_favicon css_style “#TEMPLATE1

container {

width: 400px;
height: 400px;
position: relative;
background: yellow;
border: 1px solid black;

} div_animation {

width: 50px;
height: 50px;
position: absolute;
background-color: red;

} “

body_css_class 's1em padt4px marpad2px VERDANAs' body_css_style 'background-color: d3d2d1; padding-left:1em; padding-right: 1em' font_size 'def'

doc {

h2 'ascii paradise'
n_components = AsciiParadise.n_animated_ascii_components?
br
e "There are <b style=\"color: darkblue\">#{n_components.to_s}</b> "\
  "registered ASCII components registered."
br
e 'Note that you can pass arguments to this .cgi file, e. g.'
br
bold 'ascii_paradise.cgi?Airbus'
br
br
# ========================================================================= #
# === Dump it into a dropdown box
# ========================================================================= #
array = AsciiParadise.available_ascii_components?
www_dropdown_box(array) # ← Registered in the project Cyberweb.
brbr
e 'TODO: add some javascript animation box, so that the below
frames can be "animated".'
br
use_this_dataset = :tears_of_ice
params = params?
unless params.empty?
  use_this_dataset = params.keys.first.to_sym
end
dataset = AsciiParadise.obtain_dataset_for(use_this_dataset)
dataset.each {|entry|
  pre entry
  spacer
}

# ee ' # <div id =“container”> # <div id=“div_animation”></div> # </div> # ' # # # embed_this_javascript ' # function do_the_animation() { # var elem = document.getElementById(“div_animation”); # var pos = 0; # var id = setInterval(frame, 5); # function frame() {

# if (pos == 350) {

# clearInterval(id);

# } else {

# pos++;

    # elem.style.top = pos + "px";
  # elem.style.left = pos + "px";
# }

# } # } # ' # button 'Start the animation', # 'bblack1 pad4px mar4px', onclick: :do_the_animation

}}