Video Games

IDLE_COLOR = "#882355";
PLAYING_COLOR = "#AF5789";

function set_callbacks()
{
    var song_containers = document.getElementsByClassName("song");
    var audio_elements = document.getElementsByTagName("audio");
    var ii;
    for (ii = 0; ii < song_containers.length; ii++)
    {
        song_containers[ii].style.backgroundColor = IDLE_COLOR;
        song_containers[ii].onclick =
            (function(index) {
                return function() {
                    audio_element = audio_elements[index]
                    var jj;
                    for (jj = 0; jj < audio_elements.length; jj++)
                    {
                        if (jj != index)
                        {
                            audio_elements[jj].pause();
                            if (audio_elements[jj].readyState > 0)
                            {
                                audio_elements[jj].currentTime = 0;
                            }
                        }
                    }
                    if (audio_element.paused)
                    {
                        audio_element.play();
                    }
                    else
                    {
                        audio_element.pause();
                    }
                };
            }(ii));
        if (ii < song_containers.length - 1)
        {
            audio_elements[ii].addEventListener(
                "ended",
                (function(index) {
                    return function() {
                        audio_elements[index + 1].play()
                    };
                }(ii)));
        }
        audio_elements[ii].addEventListener(
            "playing",
            (function(index) {
                return function() {
                    var jj;
                    for (jj = 0; jj < song_containers.length; jj++)
                    {
                        if (jj != index)
                        {
                            color = IDLE_COLOR;
                        }
                        else
                        {
                            color = PLAYING_COLOR;
                        }
                        song_containers[jj].style.backgroundColor = color;
                    }
                };
            }(ii)));
    }
}

window.onload = set_callbacks;

<?php

require("util.php");
write_background_image();

?>

<!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>Quicklime</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <script src="audio.js" type="text/javascript"></script>
  </head>
  <body>
    <center>
      <div id="title">
        <img src="img/Disfigurant.png" />
      </div>
      <div id="player">
        <?php insert_audio_elements()  ?>
      </div>
      <a id="download" href="aud/">
        <img src="img/Exttade.png" />
      </a>
    </center>
  </body>
</html>

<?php

define("TC", 7);
define("IMG_ROOT", "img/");
define("AUD_ROOT", "aud/");

function write_background_image()
{
    $paths = glob(IMG_ROOT . "bg/*");
    $limit = count($paths);
    if ($limit > pow(TC, 2))
    {
        $indices = get_indices($limit);
        $image = new Imagick($paths[0]);
        $tile_size = $image->getImageWidth();
        $indices = get_indices(count($paths));
        $image = new Imagick();
        $size = $tile_size * TC;
        $image->newImage($size, $size, new ImagickPixel("transparent"));
        $image->setImageFormat("png");
        $image->setInterlaceScheme(Imagick::INTERLACE_PNG);
        for ($x = 0; $x < $size; $x += $tile_size)
        {
            for ($y = 0; $y < $size; $y += $tile_size)
            {
                $tile = new Imagick($paths[array_pop($indices)]);
                $image->compositeImage($tile, Imagick::COMPOSITE_DEFAULT, $x, $y);
            }
        }
        $image->writeImage(IMG_ROOT . "CfA2-Great-Wall.png");
    }
}

function get_indices($limit)
{
    $indices = array();
    while (count($indices) < pow(TC, 2))
    {
        $index = rand(0, $limit - 1);
        if (!in_array($index, $indices))
        {
            $indices[] = $index;
        }
    }
    return $indices;
}

function insert_audio_elements()
{
    $paths = glob(AUD_ROOT . "*.mp3");
    foreach ($paths as $path)
    {
        preg_match("/.+_[0-9]+_(.*).mp3/", basename($path), $matches);
        echo "\t<div class=\"song\">\n";
        echo "\t\t$matches[1]\n";
        echo "\t\t<audio src=\"$path\" preload=\"auto\"></audio>\n";
        echo "\t</div>\n";
    }
}

?>

<?php

set_include_path("/home/frank/lib/php/" . PATH_SEPARATOR . get_include_path());
require_once "cms/autoload.php";

function display_page()
{
   $mixes_page = new Mixes();
   echo $mixes_page;
}

<?php

require_once "operations/file/list_directory.php";

define("INDEX_SEPARATOR", ".");
define("VERTICAL_ORIENTATION_DIRECTORY_NAME", "vertical");
define("HORIZONTAL_ORIENTATION_DIRECTORY_NAME", "horizontal");

class Segmented_Image extends Div
{
   private $_image_file_path;
   private $_segment_count;
   private $_image;
   protected $_segments_directory_path;
   private $_width;
   private $_height;

   public function __construct(
      $image_file_path, $segment_count=null, $cut_orientation=null, $width=null,
      $height=null)
   {
      parent::__construct();
      $this->_image_file_path = $image_file_path;
      $this->_segment_count = $segment_count;
      $this->_cut_orientation = $cut_orientation;
      $this->initialize_image($width, $height);
      $this->initialize_segments_directory();
      $this->build_collection();
   }

/*    public function __set($name, $value) */
/*    { */
/*       if ($value === null) */
/*       { */
/*          $value = $this->find_definition($name); */
/*       } */
/*       if ($name[0] != "_") */
/*       { */
/*          parent::__set($name, $value); */
/*       } */
/*       else */
/*       { */
/*          $this->$name = $value; */
/*       } */
/*    } */

/*    private function find_definition($name) */
/*    { */
/*       $definition = null; */
/*       $name = strtoupper($name); */
/*       $name = trim($name, "_"); */
/*       if (isset($GLOBALS["DEFAULT_" . $name])) */
/*       { */
/*          $definition = $GLOBALS["DEFAULT_" . $name]; */
/*       } */
/*       if (isset($GLOBALS[$name])) */
/*       { */
/*          $definition = $GLOBALS[$name]; */
/*       } */
/*       return $definition; */
/*    } */
   
   private function initialize_image($width, $height)
   {
      $image = new Imagick($this->_image_file_path);
      if ($width || $height)
      {
         $image->scaleImage($width, $height);
      }
      $this->_width = $image->getImageWidth();
      $this->_height = $image->getImageHeight();
      $this->_image = $image;
   }

   private function initialize_segments_directory()
   {
      $this->_segments_directory_path = $this->build_segments_directory_path();
   }

   private function build_segments_directory_path()
   {
      $dynamic_image_directory_path =
         rtrim($GLOBALS["DYNAMIC_IMAGE_DIRECTORY"], "/");
      $image_file_name = basename($this->_image_file_path);
      $main_directory = $dynamic_image_directory_path . "/" . $image_file_name;
      $orientation_directory =
         $this->build_orientation_directory_path($main_directory);
      $count_directory =
         $this->build_count_directory_path($orientation_directory);
      return $count_directory;
   }

   private function build_orientation_directory_path($segments_directory_path)
   {
      $name = $this->choose_orientation_subdirectory_name();
      $path = $segments_directory_path . "/" . $name;
      return $path;
   }

   private function build_count_directory_path($orientation_directory_path)
   {
      $name = $this->_segment_count;
      $path = $orientation_directory_path . "/" . $name;
      return $path;
   }

   private function choose_orientation_subdirectory_name()
   {
      return $this->_cut_orientation == "vertical" ?
         VERTICAL_ORIENTATION_DIRECTORY_NAME :
         HORIZONTAL_ORIENTATION_DIRECTORY_NAME;
   }

   private function build_collection()
   {
      if ($segment_file_paths = $this->find_existing_segments())
      {
         $this->add_segments_to_whole($segment_file_paths);
      }
      else
      {
         mkdir($this->_segments_directory_path, 0750, True);
         $this->divide_image();
      }
   }

   private function find_existing_segments()
   {
      $files =
         file\get_directory_contents(
            $this->_segments_directory_path, null, "labeled", False);
      $segment_files = $this->extract_segment_files($files);
      return $segment_files;
   }
         
   private function extract_segment_files($files)
   {
      $segment_files = array();
      foreach ($files as $file)
      {
         if (is_file($file))
         {
            $segment_files[] = $file;
         }
      }
      return $segment_files;
   }

   private function add_segments_to_whole($file_paths)
   {
      foreach ($file_paths as $file_path)
      {
         $this->add_segment_to_whole($file_path);
      }
   }

   private function add_segment_to_whole($file_path, $width=null, $height=null)
   {
      $this->set_segment_dimensions($file_path, $width, $height);
      $segment = new Image($file_path, $width, $height);
      if ($this->_cut_orientation == "vertical")
      {
         $segment->suppress_line_break();
      }
      $this->segments[] = $segment;
   }

   private function set_segment_dimensions($file_path, &$width, &$height)
   {      
      if ($width === null || $height === null)
      {
         $segment = new Imagick($file_path);
         $width = $segment->getImageWidth();
         $height = $segment->getImageHeight();
      }
   }
   
   private function divide_image()
   {
      $segment_width = $this->determine_segment_width();
      $segment_height = $this->determine_segment_height();
      $overflow =
         $this->_cut_orientation == "horizontal" ?
         $this->_height % $segment_height : $this->_width % $segment_width;
      if ($this->_cut_orientation == "horizontal")
      {
         $this->divide_image_horizontally(
            $segment_width, $segment_height, $overflow);
      }
      else
      {
         $this->divide_image_vertically(
            $segment_width, $segment_height, $overflow);
      }
   }

   private function determine_segment_width()
   {
      if ($this->_cut_orientation == "vertical")
      {
         return $this->calculate_region_length($this->_width);
      }
      return $this->_width;
   }

   private function determine_segment_height()
   {
      if ($this->_cut_orientation == "horizontal")
      {
         return $this->calculate_region_length($this->_height);
      }
      return $this->_height;
   }

   private function divide_image_horizontally(
      $segment_width, $segment_height, $overflow)
   {
      $modifier = 0;
      $position = 0;
      for ($ii = 0; $position < $this->_height; $ii++)
      {
         $segment_file_path = $this->build_segment_file_path($ii);
         $modifier = ($overflow-- > 0);
         $this->crop_and_save_segment(
            $this->_width, $segment_height + $modifier, 0, $position,
            $segment_file_path);
         $this->add_segment_to_whole(
            $segment_file_path, $this->_width, $segment_height);
         $position += $segment_height + $modifier;
      }
   }

   private function divide_image_vertically(
      $segment_width, $segment_height, $overflow)
   {
      $modifier = 0;
      $position = 0;
      for ($ii = 0; $position < $this->_width; $ii++)
      {
         $segment_file_path = $this->build_segment_file_path($ii);
         $modifier = ($overflow-- > 0);
         $this->crop_and_save_segment(
            $segment_width + $modifier, $this->_height, $position, 0,
            $segment_file_path);
         $this->add_segment_to_whole(
            $segment_file_path, $segment_width, $this->_height);
         $position += $segment_width + $modifier;
      }
   }

   private function crop_and_save_segment(
      $width, $height, $x_position, $y_position, $save_path)
   {
      $clone = $this->_image->clone();
      $clone->cropImage($width, $height, $x_position, $y_position);
      $clone->setImagePage(0, 0, 0, 0);
      $clone->writeImage($save_path);
   }

   private function calculate_region_length($image_length)
   {
      return intval($image_length/$this->_segment_count);
   }

   private function build_segment_file_path($index)
   {
      return $this->_segments_directory_path . "/" . $index;
   }
}

216.73.216.217

June 29, 2013♦

A few weeks ago, for Fishing Jam, I made a fishing simulation from what was originally designed to be a time attack arcade game. In the program, Dark Stew, the player controls Aphids, an anthropod who fishes for aquatic creatures living in nine pools of black water.

Fishing means waiting by the pool with the line in. The longer you wait before pulling the line out, the more likely a creature will appear. Aside from walking, it's the only interaction in the game. The creatures are drawings of things you maybe could find underwater in a dream.

The background music is a mix of clips from licensed to share songs on the Free Music Archive. Particularly, Seed64 is an album I used a lot of songs from. The full list of music credits is in the game's README file.

I'm still planning to use the original design in a future version. There would be a reaction-based mini game for catching fish, and the goal would be to catch as many fish as possible within the time limit. I also want to add details and obstacles to the background, which is now a little boring, being a plain, tiled, white floor.

If you want to look at all the drawings or hear the music in the context of the program, there are Windows and source versions available. The source should work on any system with Python and Pygame. If it doesn't, bug reports are much appreciated. Comments are also welcome :)

Dark Stew: Windows, Pygame Source

I wrote in my last post that I would be working on an old prototype about searching a cloud for organisms for Fishing Jam. I decided to wait a while before developing that game, tentatively titled Xenographic Barrier. Its main interactive element is a first-person scope/flashlight, so I'd like to make a Wii version of it.

I'm about to start working on a complete version of Ball & Cup. If I make anything interesting for it, I'll post something. There are a lot of other things I want to write about, like game analyses, my new GP2X and arcades in Korea, and there's still music to release. Lots of fun stuff coming!

↠ RSS Feed ↞