Video Games

EVR.Sound.Controls.Button.Volume.Deamplify = function(container)
{
   EVR.Sound.Controls.Button.Volume.call(
      this, container, ALIGN_LEFT, SOUND_DEAMPLIFY_ICON);
   this.set_attributes();
   this.append();
}
EVR.Sound.Controls.Button.Volume.Deamplify.prototype = 
   new EVR.Sound.Controls.Button.Volume;
EVR.Sound.Controls.Button.Volume.Deamplify.prototype.respond = function()
{
   this.audio.decrease_volume();
   EVR.Sound.Controls.Button.Volume.prototype.respond.call(this);
}
EVR.Sound.Controls.Button.Volume.Deamplify.prototype.update = function()
{
   if (this.audio.volume <= 0)
   {
      this.focused_opacity = this.unfocused_opacity;
   }
   else
   {
      this.focused_opacity = SOUND_CONTROLS_FOUCUSED_OPACITY;
   }
   this.set_opacity();
}
EVR.Sound.Controls.Button.Volume.Deamplify.prototype.toString = function()
{
   return "[object EVR.Sound.Controls.Button.Volume.Deamplify]";
}

EVR.include("sound/controls/button/volume/Amplify.js");
EVR.include("sound/controls/button/volume/Deamplify.js");
EVR.Sound.Controls.Button.Volume = function(container, alignment, icon)
{
   EVR.Sound.Controls.Button.call(this, container, alignment);
   this.icon = icon;
   this.disable_selection();
}
EVR.Sound.Controls.Button.Volume.prototype = new EVR.Sound.Controls.Button;
EVR.Sound.Controls.Button.Volume.prototype.disable_selection = function()
{
   if (!!this.element)
   {
      var element = this.element;
      element.onselectstart = function() { return false };
      element.onmousedown = function() { return false };
   }
}
EVR.Sound.Controls.Button.Volume.prototype.set_attributes = function()
{
   this.set_color(SOUND_BUTTON_BACKGROUND);
   this.set_proportions(SOUND_BUTTON_WIDTH, SOUND_BUTTON_HEIGHT);
   this.set_text();
   this.css.cursor = "default";
}
EVR.Sound.Controls.Button.Volume.prototype.set_text = function()
{
   var font = SOUND_CONTROLS_FONT_FAMILY;
   var color = SOUND_CONTROLS_FONT_COLOR;
   var size = SOUND_CONTROLS_FONT_SIZE;
   EVR.Sound.Controls.Button.prototype.set_text.call(
      this, this.icon, font, color, size);
}
EVR.Sound.Controls.Button.Volume.prototype.toString = function()
{
   return "[object EVR.Sound.Controls.Button.Volume]";
}

EVR.Sound.Controls.Button.Volume.Amplify = function(container)
{
   EVR.Sound.Controls.Button.Volume.call(
      this, container, ALIGN_RIGHT, SOUND_AMPLIFY_ICON);
   this.set_attributes();
   this.append();
}
EVR.Sound.Controls.Button.Volume.Amplify.prototype = 
   new EVR.Sound.Controls.Button.Volume;
EVR.Sound.Controls.Button.Volume.Amplify.prototype.respond = function()
{
   this.audio.increase_volume();
   EVR.Sound.Controls.Button.Volume.prototype.respond.call(this);
}
EVR.Sound.Controls.Button.Volume.Amplify.prototype.update = function()
{
   if (this.audio.volume >= 1)
   {
      this.focused_opacity = this.unfocused_opacity;
   }
   else
   {
      this.focused_opacity = SOUND_CONTROLS_FOUCUSED_OPACITY;
   }
   this.set_opacity();
}
EVR.Sound.Controls.Button.Volume.Amplify.prototype.toString = function()
{
   return "[object EVR.Sound.Controls.Button.Volume.Amplify]";
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <title>-</title>
    <style type="text/css">
      img
      {
        width: 480px;
        margin: 30px;
      }
    </style>
  </head>

  <body>
    <?php
      foreach (glob("*.png") as $ii => $file)
      {
         echo "\t<img src=\"$file\" alt=\"$ii\" />\n";
      }
    ?>
  </body>

</html>

var HEIGHT_RATIO = .375;
var STRIPE_HEIGHT = .7;
var STRIPE_PALETTE = ["#AA8ADE", "#916D10", "#F88C37"];
var STRIPE_DURATION = 420;
var CRAWL_STEP = .02;
var CRAWL_FRAME_DURATION = 150;
var DINING_HEIGHT = .2;
var TITLE_MIN_HEIGHT = 100;
var GLYPH_HEIGHT = .2;
var GLYPH_WIDTH = .008;
var GLYPH_LETTER_RATIO = .5;
var GLYPH_SHADOW_OFFSET = .75;
var TITLE_PALETTE = ["#d00000", "#b0b0b0", "#0000d0"];
var TITLE_FLASH_FRAME_DURATION = 880;
var TITLE_SHADOW_BRIGHTNESS = 60;
var TITLE_TEXT_BRIGHTNESS = 45;

BH = function()
{
    this.stripes_palette = STRIPE_PALETTE;
    this.stripes_shift = false;
    this.title_palette = TITLE_PALETTE;
    this.title_center_index = 0;
    this.setEventHandlers();
    this.setChildren();
    this.convertTitle();
    this.arrange();
    this.startFlash();
    this.startCrawl();
    this.startTitleFlash();
}

BH.prototype.setEventHandlers = function()
{
    var current = this;
    window.onresize = function() { current.arrange() };
}

BH.prototype.setChildren = function()
{
    this.harvester = document.getElementById("harvester");
    this.cabinet = document.getElementById("cabinet");
    this.feeder = document.getElementById("feeder");
    this.menu = document.getElementById("menu");
    this.blueprint = document.getElementById("blueprint");
    this.stripes = document.getElementById("stripes");
    this.crawl_right = document.getElementById("crawl-right");
    this.crawl_left = document.getElementById("crawl-left");
    this.dining = document.getElementById("dining");
    this.marquee = document.getElementById("marquee");
    this.title = document.getElementById("title");
}

BH.prototype.convertTitle = function()
{
    var title = this.title;
    var text = title.innerHTML;
    title.innerHTML = "";
    var ch, glyph;
    for (var ii = 0; ii < text.length; ii++)
    {
	ch = text.charAt(ii);
	if (ch != " " && ch != "\n" && ch != "\t")
	{
	    foreground = document.createElement("span");
	    foreground.className = "foreground";
	    foreground.style.zIndex = 1;
	    title.appendChild(foreground);
	    background = document.createElement("span");
	    background.innerHTML = ch;
	    background.className = "background";
	    background.style.zIndex = 0;
	    title.appendChild(background);
	}
    }
    this.glyphs = title.getElementsByTagName("span");
}

BH.prototype.arrange = function()
{
    this.clearStripes();
    var harvester = this.harvester;
    var harvester_w = harvester.clientWidth;
    var height = this.formatPx(harvester_w * HEIGHT_RATIO);
    harvester.style.height = height;
    var cabinet = this.cabinet;
    var feeder = this.feeder;
    var menu = this.menu;
    cabinet.style.height = height;
    feeder.style.height = height;
    menu.style.height = height;
    var cabinet_w = cabinet.clientWidth;
    feeder.style.width = this.formatPx(harvester_w - cabinet_w - menu.clientWidth);
    feeder.style.left = this.formatPx(cabinet_w);
    cabinet.getElementsByTagName("img")[0].height = cabinet.clientHeight;
    menu.getElementsByTagName("img")[0].height = menu.clientHeight;
    var win_h = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight;
    var marquee = this.marquee;
    this.arrangeFeeder();
    this.arrangeTitle();
    this.addStripes();
}

BH.prototype.arrangeFeeder = function()
{
    var feeder = this.feeder;
    var images = feeder.getElementsByTagName("img");
    var range = feeder.clientHeight;
    var y, image;
    for (var ii = 0; ii < images.length; ii++)
    {
	image = images[ii];
	image.style.top = this.formatPx(parseInt((range - image.clientHeight) / 2));
	if (image.id == "crawl-left")
	{
	    var length = image.clientWidth;
	    image.style.left = this.formatPx(-length);
	    this.crawl_length = length;
	    this.crawl_step = parseInt(CRAWL_STEP * length);
	}
	else
	{
	    image.style.left = this.formatPx(0);
	}
    }
}

BH.prototype.arrangeTitle = function()
{
    var title = this.title;
    var range_x = title.clientWidth;
    var width = parseInt(GLYPH_WIDTH * range_x);
    this.resizeTitle();
    var range_y = title.clientHeight;
    var height = parseInt(GLYPH_HEIGHT * range_y);
    var shadow_offset = parseInt(GLYPH_SHADOW_OFFSET * width);
    var y = parseInt((range_y - height) / 2 - shadow_offset / 2);
    var glyphs = this.glyphs;
    title.style.fontSize = this.formatPx(GLYPH_LETTER_RATIO * height);
    var glyph_count = glyphs.length / 2;
    var width_all = width * glyph_count;
    var margin = (range_x - width_all) / (glyph_count + 1);
    var x = margin;
    var foreground, background, color;
    for (var ii = 0; ii < glyphs.length; ii += 2)
    {
	foreground = glyphs[ii];
	background = glyphs[ii + 1];
	foreground.style.height = this.formatPx(height);
	background.style.height = this.formatPx(height);
	foreground.style.lineHeight = this.formatPx(height);
	background.style.lineHeight = this.formatPx(height);
	foreground.style.top = this.formatPx(y);
	background.style.top = this.formatPx(y + shadow_offset);
	foreground.style.width = this.formatPx(width);
	background.style.width = this.formatPx(width);
	foreground.style.left = this.formatPx(x);
	background.style.left = this.formatPx(x - shadow_offset);
	x += margin + width;
    }
}

BH.prototype.resizeTitle = function()
{
    var title = this.title;
    var available = this.getWindowHeight() - this.marquee.offsetHeight - this.harvester.offsetHeight;
    var min_height = TITLE_MIN_HEIGHT;
    if (available > min_height)
    {
	title.style.height = this.formatPx(available);
    }
    else
    {
	title.style.height = this.formatPx(min_height);
    }
}

BH.prototype.getWindowHeight = function()
{
    if (typeof(window.innerHeight) != "undefined")
    {
	return window.innerHeight;
    }
    return document.documentElement.clientHeight;
}

BH.prototype.clearStripes = function()
{
    var stripes = this.stripes;
    while (stripes.firstChild)
    {
	stripes.removeChild(stripes.firstChild);
    }
}

BH.prototype.formatPx = function(measurement)
{
    return parseInt(measurement) + "px";
}

BH.prototype.addStripes = function()
{
    this.clearStripes();
    var stripes = this.stripes;
    var bound = this.cabinet.clientHeight;
    var height = parseInt(bound * STRIPE_HEIGHT);
    var sum = 0;
    var stripe;
    while (sum < bound)
    {
	stripe = document.createElement("div");
	stripe.innerHTML = "&nbsp;";
	stripe.style.height = this.formatPx(height);
	stripes.appendChild(stripe);
	sum += height;
    }
}

BH.prototype.startFlash = function()
{
    var current = this;
    window.setInterval(
	function() {
	    current.setStripeColors();
	}, STRIPE_DURATION);
}

BH.prototype.setStripeColors = function()
{
    var stripes = this.stripes.getElementsByTagName("div");
    var palette = this.stripes_palette;
    var palette_ii = this.stripes_shift;
    var color;
    for (var ii = 0; ii < stripes.length; ii++)
    {
	color = palette[palette_ii % palette.length];
	stripes[ii].style.background = color;
	palette_ii++;
    }
    this.stripes_shift = !this.stripes_shift;
}

BH.prototype.startCrawl = function()
{
    var current = this;
    window.setInterval(
	function() {
	    current.crawl();
	}, CRAWL_FRAME_DURATION);
}

BH.prototype.crawl = function()
{
    var right = this.crawl_right;
    var left = this.crawl_left;
    var length = this.crawl_length;
    var step = this.crawl_step;
    var right_x = parseInt(right.style.left) + step;
    var left_x = parseInt(left.style.left) + step;
    if (right_x >= length)
    {
	right_x = 0;
	left_x = -length;
    }
    right.style.left = this.formatPx(right_x);
    left.style.left = this.formatPx(left_x);
}

BH.prototype.startTitleFlash = function()
{
    var current = this;
    window.setInterval(
	function() {
	    current.flashTitle();
	}, TITLE_FLASH_FRAME_DURATION);
}

BH.prototype.flashTitle = function()
{
    var glyphs = this.glyphs;
    var glyph_count = glyphs.length / 2;
    var start = parseInt(glyph_count / 2) - 1;
    var center = start + 1;
    var palette = this.title_palette;
    var palette_ii = this.incrementIndex(this.title_center_index, palette);
    this.title_center_index = palette_ii;
    var color, shadow, text_color;
    for (var ii = 0; ii <= start; ii++)
    {
	color = new Color(palette[palette_ii]);
	shadow = new Color(color.getString());
	text_color = new Color(color.getString());
	shadow.changeBrightness(TITLE_SHADOW_BRIGHTNESS);
	text_color.changeBrightness(TITLE_TEXT_BRIGHTNESS);
	glyphs[ii * 2].style.backgroundColor = color.getString();
	glyphs[ii * 2 + 1].style.backgroundColor = shadow.getString();
	glyphs[ii * 2 + 1].style.color = text_color.getString();
	glyphs[(glyph_count - ii - 1) * 2].style.backgroundColor = color.getString();
	glyphs[(glyph_count - ii - 1) * 2 + 1].style.backgroundColor = shadow.getString();
	glyphs[(glyph_count - ii - 1) * 2 + 1].style.color = text_color.getString();
	palette_ii = this.incrementIndex(palette_ii, palette);
    }
    color = new Color(palette[palette_ii]);
    shadow = new Color(color.getString());
    text_color = new Color(color.getString());
    shadow.changeBrightness(TITLE_SHADOW_BRIGHTNESS);
    text_color.changeBrightness(TITLE_TEXT_BRIGHTNESS);
    glyphs[center * 2].style.backgroundColor = color.getString();
    glyphs[center * 2 + 1].style.backgroundColor = shadow.getString();
    glyphs[center * 2 + 1].style.color = text_color.getString();
    palette_ii = this.incrementIndex(palette_ii, palette);
}

BH.prototype.incrementIndex = function(index, list)
{
    index += 1;
    if (index >= list.length)
    {
	index = 0;
    }
    return index;
}

window.onload = function() { new BH() };

216.73.216.18

December 3, 2013♦

Where in the mind's prism does light shine, inward, outward, or backward, and where in a plane does it intersect, experientially and literally, while possessing itself in a dripping wet phantasm?

Fig 1.1 What happens after you turn on a video game and before it appears?

The taxonomy of fun contains the difference between gasps of desperation and exaltation, simultaneously identical and opposite; one inspires you to have sex, while the other to ejaculate perpetually. A destruction and its procession are effervescent, while free play is an inseminated shimmer hatching inside you. Unlikely to be resolved, however, in such a way, are the climaxes of transitions between isolated, consecutive game states.

You walk through a door or long-jump face first (your face, not Mario's) into a painting. A moment passes for eternity, viscerally fading from your ego, corpus, chakra, gaia, the basis of your soul. It happens when you kill too, and especially when you precisely maim or obliterate something. It's a reason to live, a replicating stasis.

Fig 1.2 Sequence in a video game

Video games are death reanimated. You recurse through the underworld toward an illusion. Everything in a decision and logic attaches permanently to your fingerprint. At the core, you use its energy to soar, comatose, back into the biosphere, possibly because the formal structure of a mind by human standards is useful in the next world.

↠ RSS Feed ↞