diff options
Diffstat (limited to 'SunkenMoon.html.coffee')
| -rw-r--r-- | SunkenMoon.html.coffee | 142 |
1 files changed, 11 insertions, 131 deletions
diff --git a/SunkenMoon.html.coffee b/SunkenMoon.html.coffee index 12dee74..a719d15 100644 --- a/SunkenMoon.html.coffee +++ b/SunkenMoon.html.coffee @@ -4,7 +4,7 @@ # This program is available under the terms of the MIT License -version = "0.1.116" +version = "0.1.143" { htmlcup } = require 'htmlcup' @@ -41,137 +41,17 @@ genPage = -> @meta charset:"utf-8" @link rel:"shortcut icon", href:icon @title title - @style type: "text/css", - """ - body { - /* background:pink; */ - /* background: #69B2FF; */ - /* background: #21AFF8; */ - /* background: #0286E8; */ - /* background: #1096EE; */ - background:black; - text-align: center; - font-size: 22px; - font-family: Helvetica; - color:white; - color:rgba(255,255,255,0.9); - margin:0; - } - .banner { - border: 5px solid white; - border: 5px solid white rgba(255,255,255,0.9); - box-shadow: 0 2px 4px blue; - margin: 1em; - } - footer, p { - margin-top:0.418em; - margin-bottom:0.418em; - margin-left:auto; - margin-right:auto; - text-shadow: 0 1px 1px blue; - } - p { - width:22em; - max-width:100%; - } - a { - /* - color:rgb(200,255,255); - color:rgba(200,255,255,0.9); - */ - color:white; - color:rgba(255,255,255,0.9); - text-decoration:none; - display: inline-block; - border: 1px solid white; - padding: 0 0.2em; - border-radius: 0.2em; - -moz-border-radius: 0.2em; - -webkit-border-radius: 0.2em; - -ie-border-radius: 0.2em; - } - a:hover { - background-color:rgba(20,70,180,1.0); - } - .petition { - margin:0.418em; - padding:0.618em; - } - .petition a { - font-size:127.2%; - box-shadow: 0 2px 4px blue; - margin:0.3em; - } - .page { - width: 100%; - height: 100%; - margin: 0; - border: 0; - } - .centering { - display: table; - padding: 0; - } - .centered { - display: table-cell; - vertical-align: middle; - text-align: center; - } - .inline-block { - display: inline-block; - } - .dynamic-section { - display: inline-block; - vertical-align:middle; - max-width:100%; - } - .flip-lr { - -moz-transform: scaleX(-1); - -o-transform: scaleX(-1); - -webkit-transform: scaleX(-1); - transform: scaleX(-1); - filter: FlipH; - -ms-filter: "FlipH"; - } - image, .pixelart { - image-rendering:optimizeSpeed; /* Legal fallback */ - image-rendering:-moz-crisp-edges; /* Firefox */ - image-rendering:-o-crisp-edges; /* Opera */ - image-rendering:-webkit-optimize-contrast; /* Safari */ - image-rendering:optimize-contrast; /* CSS3 Proposed */ - image-rendering:crisp-edges; /* CSS4 Proposed */ - image-rendering:pixelated; /* CSS4 Proposed */ - -ms-interpolation-mode:nearest-neighbor; /* IE8+ */ - } - /* - .pixelart { - image-rendering: -moz-crisp-edges; - -ms-interpolation-mode: nearest-neighbor; - image-rendering: pixelated; - image-rendering: crisp-edges; - } - */ - g.flipped { - transform:scale(-1,1); - } - .dim { - opacity: 0.2; - } - .dim:hover { - opacity: 1; - } - """ - @body -> - @div class:"centering page", -> - @div class:"centered", -> - @div style:"visibility:hidden;position:absolute", -> + @body style:"margin:0;border:0;padding:0;height:100%;width:100%;background:black", -> + @div style:"visibility:hidden;position:absolute", -> @img id:"pixyvaquita", src:pixyvaquita @img id:"pixyvaquita_twist_l", src:frames.twist_l @img id:"pixyvaquita_twist_r", src:frames.twist_r @img id:"happybubble0", src:frames.happybubble0 @img id:"grumpybubble0", src:frames.grumpybubble0 @img id:"evilbubble0", src:frames.evilbubble0 - @div style:"position:relative", -> + @div style:"display:table;width:100%;max-width:100%;height:100%;margin:0;border:0;padding:0", -> + @div style:"display:table-cell;vertical-align:middle;width:100%;margin:0;border:0;padding:0;text-align:center", -> + @div style:"position:relative;display:inline-block", width:"#{gameAreaSize[0]*2}", height:"#{gameAreaSize[1]*2}", -> @svg id:"sea-svgroot", width:"#{gameAreaSize[0]*2}", height:"#{gameAreaSize[1]*2}", style:"position:absolute;opacity:0.9;z-index:-1000", -> @defs -> @linearGradient id:"grad1", x1:"0%", y1:"0%", x2:"0%", y2:"100%", -> @@ -182,11 +62,11 @@ genPage = -> @stop offset:"100%", style:"stop-color:rgb(0,0,0);stop-opacity:1" @rect x:"0", y:"0", width:"#{gameAreaSize[0]*2}", height:"#{gameAreaSize[1]*2}", fill:"url(#grad1)" @canvas width:"#{gameAreaSize[0]*2}", height:"#{gameAreaSize[1]*2}", -> - @footer class:"dim", -> - @span gameName - @span " - " - @a target:"_blank", href:"index.html", "Learn about Vaquitas" - @span id:"fps" + @header style:"position:absolute;top:0;left:0;font-size:10px;width:100%;color:black", -> + @span gameName + @span " - " + @a target:"_blank", href:"index.html", "Learn about Vaquitas" + @span id:"fps" gameObjects = null @script type:"text/javascript", "gameObjects=#{JSON.stringify(gameObjects)};" @script type:"text/javascript", "__hasProp = {}.hasOwnProperty; __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };" |