Ephellon/Tuxedo Script - advance demo & editor.markdown

## index.html
<h1>TuxedoScript Examples</h1>
<div>
  Help<br>
  right-click a pen's content to open an editor<br>
  double-click a pen's contents to open the original pen<br>
  Ephellon Dantzler 2016
</div>
<!-- ⌘ - http://codepen.io/Ephellon/pen/zvvGaz -->
<textarea default>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features
## Coffee Script-Like Examples, see coffeescript.org

## Extendable features
## +advance
## +eval
## +js-editor
## +legacy
## +math
## +wordy
## -hide
## -html-editor
## -ugly

## Assignment
#number = 42
#opposite = true
3.14 => PI

## Conditions
number = -42 if opposite.
  /* or
    number = -42 if opposite is true.
    number = -42 unless opposite is false.
  */

## Functions
$square x {
  <- x^2
}
  /* or, with +math
     square(x) = x^2
  */
$eat f {
  $doc.writeln "I ate the ${f}<br>"
}
$discuss f {
  // f[f.length-1]
  #s = "s" if f#01 != 's'.
    else s = "";
  $doc.writeln "The ${f} look${s} good<br>"
}
$doc.writeln = $x {
  $doc.body.$html += "${x}<br>"
}

## Arrays
#list = [1, 2, 3, 4, 5]

## Objects
#math = {
  root: @.sqrt
  square: square
  cube: $x {
     <- x^3
  }
}

## Splats + Interpolation
$race winner, runners... {
  $doc.writeln "${winner}, ${runners}"
}

## Existence
alert "I knew it" if Elvis exists.

## Array comprehension
#menu = ['tacos', 'burritos', 'sushi', 'spaghetti']

if menu exists {
  discuss food from menu
}

eat food from menu while the food isnt "sushi"

## Simple English
#sushi = "sushi" from menu
#third = 3 in menu

## Reserved words
#off = off
\off = off OR NOT on</textarea>
<textarea coffee>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features
## Coffee Script-Like Examples, see coffeescript.org

## Extendable features
## +advance
## +eval
## +js-editor
## +legacy
## +math
## +wordy
## -hide
## -html-editor
## -ugly

## Assignment
#number = 42
#opposite = true
3.14 => PI

## Conditions
number = -42 if opposite.
  #*# or you can use
    number = -42 if opposite is true.
    number = -42 unless opposite is false.
  ##

## Functions
$square x {
  <- x^2
}
$eat f {
  $doc.writeln "I ate the ${f}<br>"
}
$discuss f {
  #s = "s" if f#01 != 's'.
  else s = "";
  $doc.writeln "The ${f} look${s} good<br>"
}
$doc.writeln = $x {
  $doc.body.$html += "${x}<br>"
}

## Arrays
#list = [1, 2, 3, 4, 5]

## Objects
#math = {
  root: @.sqrt
  square: square
  cube: $ x {
    <- x^3
  }
}

## Splats + Interpolation
$race winner, runners... {
  $doc.writeln "${winner}, ${runners}"
}

## Existence
alert "I knew it" if Elvis exists.

## Array comprehension
#menu = ['tacos', 'burritos', 'sushi', 'spaghetti']

if menu exists {
  discuss food from menu
}

eat food from menu while the food isnt "sushi"

## Simple English
#sushi = "sushi" from menu
#third = 3 in menu

## Reserved words
#off = off
\off = off OR NOT on</textarea>
<textarea wKpxKX>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features

## +advance
## +clean
## +eval
## +js-editor
## +legacy
## +math
## +wordy

$doc.writeln = $m {
  $doc.body.$html += m + "<br>"
}

.system {
  @(p) {
    <- @purpose = p
  }
  toString() {
    <- @purpose
  }
}
$skeletal {
  <- new system "<b func>provides structure</b> to the body and <b func>protects the internal organs</b>"
}
$muscular {
     <- new system "<b func>provides structure</b> to the body and <b func>allows movement</b>"
}
$digestive {
  <- new system "<b func>provides energy</b> from consumption of foods and drinks; and <b func>rids the body of waste</b>"
}
$respiratory {
  <- new system "<b func>provides oxygen</b> and a way to release waste gases"
}
$nervous {
  <- new system "<b func>provides sensation</b>, <b func>thought</b>, and <b func>commands</b> for most bodily functions"
}
$circulatory {
  <- new system "<b func>provides roots</b> for oxygen, nutrient, and mineral rich blood; and <b func>rids</b> the body of waste"
}
$skin {
  <- new system "along with <b sys>hair</b>, <b func>provides protection</b>, <b func>cooling</b>, and <b func>heating</b>"
}

$doc.writeln "The <b sys>nervous</b> system <b def>${nervous()}</b>"
$doc.writeln "The <b sys>digestive</b> system <b def>${digestive()}</b>"
$doc.writeln "The <b sys>skin</b> system <b def>${skin()}</b>"</textarea>
<textarea EVwgdJ>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features

## +clean
## +eval
## +legacy
## +math
## +wordy
## +advance
## -hide
## -html-editor
## -js-editor
## -ugly

.PiggyBank {
  @(max) {
    @max = max
    @coins = 0
    @smashed = false
  }

  add(amount) {
    amount = amount OR 1
    if @coins < @max AND NOT @smashed {
      @coins += amount
    }
    if @coins < @max {
      @coins = @coins
    }{
      @coins = @max
    }
  }

  amount(value) {
    if value {
      <- value equals @coins
    }
    <- @coins
  }

  smashed() {
    <- @smashed
  }

  smash() {
    <- @smashed = true
  }

  toString() {
    <- "$" + (@amount() * 0.01)
  }
}

#bank = new PiggyBank(500) // $5
  $doc.body.$html += ("<b val>${bank.amount()}</b> <br>")
bank.add()
  $doc.body.$html += ("<b val>${bank.amount()}</b> <br>")
bank.add 23
  $doc.body.$html += ("<b val>${bank.toString()}</b> <br>")
bank.smash()
  $doc.body.$html += ("<b val>${bank.amount()}</b> <br>")
bank.add 23
  $doc.body.$html += ("<b val>${bank.toString()}</b> <br>")
bank.smash()</textarea>
  <textarea zvdqpK>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!
## +advance
## +eval
## +js-editor
## +legacy
## +wordy

.Animal {
  @(name, sound, places) {
    @name = name || ''
    @sound = sound || 'makes a noise'
    @places = places || 'somewhere'
  }

  speak(sound) {
    $doc.body.$html += ('The ${@name} <b sound>${@sound}</b><br/>')
  }

  lives(places) {
    $doc.body.$html += ('The ${@name} lives <b place>${@places}</b><br/>')
  }
}

.Cat Animal {}
.Dog Animal {}

.Tiger Cat {}
.Wolf Dog {}

#siberian--tiger = new Tiger("Siberian Tiger", "roars", "Siberia")
#grey--wolf = new Dog("Grey Wolf", "howls", "in N\. America")
#worm = new Animal("Worm", "", "everywhere")

siberian_tiger.speak()
grey_wolf.lives()
worm.lives()
</textarea>
  <textarea NGvdqW>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features

## +clean
## +eval
## +js-editor
## +legacy
## +math
## +wordy
## +advance

#gold, silver, rest

$medals first, second, others... {
  gold = first
  silver = second
  rest = others
}

#contenders = ["Michael Phelps", "Liu Xiang", "Yao Ming", "Allyson Felix", "Shawn Johnson", "Roman Sebrle", "Guo Jingjing", "Tyson Gay", "Asafa Powell", "Usain Bolt"]

medals contenders...

  $doc.body.$html += ("<b gold>Gold</b>: <b name>${gold}</b><br/>")
  $doc.body.$html += ("<b silver>Silver</b>: <b name>${silver}</b><br/>")
  $doc.body.$html += ("<b other>Contenders</b>: <b name>${rest}</b><br/>")</textarea>
<textarea LpOXLj>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features

## +clean
## +eval
## +math
## +wordy

#d = "horizontal", c = 0, s = 100, m = 200
setInterval($ {
  $dim {
    c += @.random() * 5
    s += @.random() * 15 if s-c < @.random() * 5.
    s = m if s > m.
    c = s if c > s.

    #barSize = (c - 4) + "px", bgSize = s + "px", bgMargin = (s * -0.5) + "px"
    if d is "horizontal" {
      bar.style.width = barSize
      bg.style.width = bgSize
      bg.style.marginLeft = bgMargin
    }{
      bar.style.height = barSize
      bg.style.height = bgSize
      bg.style.marginTop = bgMargin
    }
    <- c is s AND c is m
  }

  if d is "horizontal" && dim() {
    c = 0
    s = 100
    d = "vertical"
  } else-if d is "vertical" && dim() {
    c = 6
    s = 100
    d = "text"
  } else-if d is "text" {
    dim()
    bar.$html = (@.round(c/m * 99) + @.round(@.random() * 9) /10) + "%"
  }

}, 200)</textarea>
<textarea xwLEzx>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!
## +advance
## +eval
## +js-editor
## +legacy
## +wordy

.Domain {
  @(d, k, p, c, o, f, g, s) {
    @domain = d || ''
    @kingdom = k || ''
    @phylum = p || ''
    @class = c || ''
    @order = o || ''
    @family = f || ''
    @genus = g || ''
    @species = s || ''
    @binomial--nomenclature = "${g} ${s}"
  }

  domain() {
    <- @domain = d || ""
  }
  kingdom() {
    <- @kingdom = k || ""
  }
  phylum() {
    <- @phylum = p || ""
  }
  class() {
    <- @class = c || ""
  }
  order() {
    <- @order = o || ""
  }
  family() {
    <- @family = f || ""
  }
  genus() {
    <- @genus = g || ""
  }
  species() {
    <- @species = s || ""
  }
  applyName(n) {
    <- @name = n || "", @
  }
}

## *k: kingdom, $p;
## *p: phylum_, $c;
## *c: class_, $o;
## *o: order_, $f;
## *f: family_, $g;
## *g: genus_, $s;
## *s: species_;

## Domains
$Bacteria {
  <- new Domain("Bacteria", "Bacteria")
}

$Archaea {
  <- new Domain("Archaea", "Archaea")
}

$Eukaryota $k {
  <- new Domain("Eukaryota", $k)
}

## Kingdoms: Eukaryota
$Animalia $p {
  <- new Eukaryota("Animalia", $p)
}

$Excavata $p {
  <- new Eukaryota("Excavata", $p)
}

$Amoebozoa $p {
  <- new Eukaryota("Amoebozoa", $p)
}

$Opisthokonta $p {
  <- new Eukaryota("Opisthokonta", $p)
}

$Rhizaria $p {
  <- new Eukaryota("Rhizaria", $p)
}

$Chromalveolata $p {
  <- new Eukaryota("Chromalveolata", $p)
}

$Archaeplastida $p {
  <- new Eukaryota("Archaeplastida", $p)
}

## Phyla
$Chordata $c {
  <- new Animalia("Chordata", $c)
}

## Classes
$Mammalia $o {
  <- new Chordata("Mammalia", $o)
}

## Orders
$Primates $f {
  <- new Mammalia("Primates", $f)
}

$Proboscidea $f {
  <- new Mammalia("Proboscidea", $f)
}

## Families
$Hominidae $g {
  <- new Primates("Hominidae", $g)
}

$Elephantidae $g {
  <- new Proboscidea("Elephantidae", $g)
}

## Genera
$Homo $s {
  <- new Hominidae("Homo", $s)
}

$Loxodonta $s {
  <- new Elephantidae("Loxodonta", $s)
}

## Species
$Sapien {
  <- new Homo "Sapien"
}

$Erectus {
  <- new Homo "Erectus"
}

$Africana {
  <- new Loxodanta "Africana"
}

## et cetra
$Human name {
  <- new Sapien..applyName name
}

$Elephant name {
  <- new Africana..applyName name
}

#myData = new Human "Ephellon"
$win.myData = myData

$doc.body.$html += ("me:<br>")
for obj in myData {
  $doc.body.$html += ("My <b var>${obj}</b> is '<b val>${myData[obj]}</b>'<br>")
}</textarea>
<textarea zvRPWv>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features
## 5: lines by Kishin

## +advance
## +eval
## +js-editor
## +legacy
## +math
## +wordy
## -hide
## -html-editor
## -ugly

## *rand: @.random()
## *req: requestAnimationFrame

($ {
  $Line x, y, hue {
    @x = @ox = x
    @y = @oy = y
    @hue = hue
    @a = 360$rand
    @va = 0.2$rand - 0.1
    @vx = 20$rand
    @radius = 150$rand
    @delay = 100$rand
  }

  Line.prototype = {
    constructor: Line,
    update: $ {
      <- @delay-- if @delay > 0.
      @ox = @x
      @oy = @y
      @x += @vx * $rand
      @vx += 2$rand - 1
      @y = c.height/2 + @.sin(@a += @va * $rand) * @radius

      ctx.strokeStyle = 'hsl(${@hue}, 100%, 50%)'
      ctx.lineWidth = 1 + @.cos @a * 5$rand
      ctx.beginPath()
      ctx.moveTo(@ox, @oy)
      ctx.lineTo(@x, @y)
      ctx.stroke()

      if @x > c.width {
        @x = 0
        @vx = 20$rand
        @hue = 360$rand
        @va = 0.2$rand - 0.1
      }
      if @x < 0 {
        @x = c.width
        @vx = -20$rand
        @hue = 360$rand
        @va = 0.2$rand - 0.1
      }
    }
  }

  #c = $doc.$id("c")
  #ctx = c.getContext("2d")
  c.width = $win.innerWidth
  c.height = $win.innerHeight

  #lines = [], maxLines = 100, hue = 0, hueInc = 360/maxLines

  for i, 0, maxLines, 1 {
    lines.push(new Line(0, c.height/2, hue += hueInc))
  }

  $con.log lines

  $req($loop {
    $req loop

    ctx.save()
    ctx.fillStyle = "rgba(0, 0, 0, 0.4)"
    ctx.fillRect(0, 0, c.width, c.height)
    ctx.globalCompositeOperation = "lighter"

    for i, 0, lines.length, 1 {
      lines[i].update ctx
    }
    ctx.restore()
  })
})()</textarea>
<textarea rOJExb>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!, strict mode required for advanced features

## +advance
## +clean
## +eval
## +js-editor
## +legacy
## +math
## +wordy
## -hide
## -html-editor
## -ugly

#c = $doc.$id 'canv'
#$ = c.getContext '2d'

($ {
  #s = $win.innerWidth/2
  #h = $win.innerHeight/2

  c.width = s
  c.height = h
  $.miterLimit = 0.1

  #arr = []
  #idx = -1
  #p = {
    x: s
    y: s/1.5
  }
  #int
  #r = 0.005
  #sz = 8

  #crv = 0.1
  #circ = 8
  #p3 = -0.05
  #p4 = 0.5

  #f1 = 250
  #f1d = on
  #stop = on
  #img
  #u = 0

  $add p, q {
    <- {
      x: p.x + q.x
      y: p.y + q.y
    }
  }

  $cart r, a {
    <- {
      x: @.cos a * r,
      y: @.sin a * r
    }
  }

  $coord ti, r {
    idx++
    arr#idx = 0 if !arr#idx.
    arr#idx += ti
    <- cart(r, arr#idx)
  }

  $.fillStyle = 'hsla(0, 0%, 10%, 1)'
  $.fillRect(0, 0, c.width, c.height)

  $draw {
    u -= 0.3
    #rp = coord(r, sz)
    $.fillStyle = 'hsla(0, 0%, 10%, 0.001)'
    $.save()
    $.beginPath()
    $.moveTo(p.x, p.y)
    $.lineWidth = 4
    $.shadowColor = 'hsla(0, 0%, 10%, 0.2)'
    $.shadowBlur = 25
    for i, 0, 127, 1 {
      idx = -1
      p = add(p, add(coord(crv, circ), add(coord(p3, rp.x), coord(p4, rp.y))))
      $.lineTo(p.x, p.y)
    }
    $.strokeStyle = 'hsla(${u}, 100%, 55%, 1)'
    $.closePath()
    $.stroke()
    $.restore()
  }

  $msp e {
    <- {
      x: ((e.clientX - c.offsetLeft) - h) / h
      y: ((e.clientY - c.offsetTop)) / h
    }
  }

  $go {
    $win.requestAnimationFrame go
    draw()
  }

  $win.addEventListener('mousemove', $e {
    #p = msp e
    r = 0.01 * (1 - |p.y|)
    crv = 0.1 + 0.00025p.x
  }, no)

  $win.addEventListener('resize', $ {
    #s = $win.innerWidth/2
    #h = $win.innerHeight/2
    c.width = $win.innerWidth
    c.height = $win.innerHeight
    $.miterLimit = 0.1
    $.fillStyle = 'hsla(0, 0%, 10%, 1)'
    $.fillRect(0, 0, c.width, c.height)
  }, no)
  go()
})()</textarea>
<textarea meQEbx>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!
## +advance
## +eval
## +legacy
## +math
## +wordy
## +js-unit

$time d {
  <- d + 's' if d < 60.
  #h = parseInt(d / 3600)
    h = "0" + h if h < 10.
  #m = parseInt(|d - 3600h| / 60)
    m = "0" + m if m < 10.
  #s = | d - 3600h - 60m | OR 0
    s = "0" + s if s < 10.
  <- '${h}h:${m}m:${s}s'
}

#* JS-Unit ##
@Before {
  ## @@ toconsole
  @@x = 'value'
}

(@Test {
  @@assert( '2m 0s', time 120)
  @@assertFalse( $loc.toString..match(/codepen/) )
}#)

(@Test {
  @@assertEquals( @.PI, 3.141592653589793 )
    ## pass
  @@assertEquals( @.PI, 3.14159265358979 )
    ## fail
  @@assertEquals( 'value', @@x )
    ## pass
}#)

@After {
  ## afterwards
}</textarea>
<textarea MKWaja>/* TuxedoScript 11.2.8
  @aut: Ephellon Dantzler
  @dat: Tue Sept 8, 2015
  @tie: 23:51 CST -06:00
  @lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
*/
##!
## +advance
## +eval
## +math
## +legacy
## +wordy

#prom contact

## *num: number.substr

$contact <Contact person> { // ideal situation, contact
  <- "the best way to contact ${person.name} is by ${person.contact.best}"
}

$contact <String name, Number number> { // name, telephone number
  number = |number|.toString()
  switch number.length {
    @10:
      number = "+1" + ("(" + $num(0,3) + ") " + $num(3,3) + "-" + $num(6,4))
      break
    @11:
      number = "+" + (number[0] + "(" + $num(1,3) + ") " + $num(4,3) + "-" + $num(7,4))
      break
    @12..14:
      // a valid number was given
      break
    @def:
      number += " is not a valid number"
  }
  <- "The best way to contact <b var>${name}</b> is by telephone, <b val>${number}</b>"
}

$contact <String name, String email> { // name, email
  <- "The best way to contact <b var>${name}</b> is by e-mail, <b val>${email}</b>"
}

$contact <String name, Array list> { // name, list of ways
  <- "${name} has specified a list of ways to reach them:<br>${list}"
}

$contact <String name, * type> { // name, any type
  <- "${name} exists, but they didn't provide a valid way to contact them;<br>${type}"
}

$contact <...> {
  <- "Contact does not exist"
}

#test = contact("John Doe", 8005555555)

$doc.body.innerHTML += (
  test
    .replace(/\n/g, "<br>")
    .replace(/\s\s/g, "  ")
)</textarea>
<textarea type="text/ts"></textarea>

## script.js
var data = tux.get.form.data();
if(data !== null) {
  for(var pen in data) {
    var a = document.querySelector("textarea[" + pen + "]");
    a.className = "show";
    a.title = pen + ", needs " + data[pen];
    a.addEventListener("contextmenu", function(){
      window.open("http://codepen.io/Ephellon/debug/zvvGaz?code=" + encode(a.value) + "#" + pen)
    });
    a.addEventListener("dblclick", function(){
      var n = "", m = "html css js console".split(" ");
      for(var x = 0; x < m.length && n.length < 4; x++) {
        n += +(data[pen].indexOf(m[x]) > -1)
      }
      n = (n !== "0000")? "?editors=" + n: "";
      window.open("http://codepen.io/Ephellon/pen/" + pen + n)
    })
  }
}

function encode(x) {
  x = encodeURI(x)
    .replace(/\n/g, "%0D")
    .replace(/#/g, "%23")
    .replace(/\(/g, "%28")
    .replace(/\)/g, "%29")
    .replace(/\*/g, "%2A")
    .replace(/\+/g, "%2B")
    .replace(/\//g, "%2F")
    .replace(/\:/g, "%3A")
    .replace(/;/g, "%3B")
    .replace(/</g, "%3C")
    .replace(/\=/g, "%3D")
    .replace(/>/g, "%3E")
    .replace(/\[/g, "%5B")
    .replace(/\]/g, "%5D")
    .replace(/\{/g, "%7B")
    .replace(/\}/g, "%7D")
    .replace(/%20/g, "+");
  return x;
}

## scripts
<script src="http://codepen.io/Ephellon/pen/EVxVaJ.js"></script>

## style.css
body, body * {
  background: #e6e6e6;
  color: #000;
  font-family: arial, monospace;
  font-size: 14px;
  overflow: hidden;
}

textarea {
  background: #000;
  border: 1px solid #fff;
  display: none;
  max-width: 100vw;
  overflow: auto;
  width: 99vw;
}

textarea.show {
  background: #fff;
  border: solid 5px #fff;
  border-radius: 0.5vw;
  box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.2);
  color: #b6b6b6;
  display: initial;
  font-size: 2vw;
  height: auto;
  padding-left: 2.5vw;
  padding-right: 2.5vw;
  text-shadow: none;
  width: auto;
  z-index: 9;
}

## Tuxedo Script - advance demo & editor.markdown

      
    Raw
  

              Tuxedo Script - advance demo & editor.markdown
            
          
    Tuxedo Script - advance demo & editor

advance [experimental] TuxedoScript demo, best in full/debug
A Pen by Mink CBOS - Ephellon Dantzler on CodePen.
License.

  
## Tuxedo Script editor.markdown

      
    Raw
  

              Tuxedo Script editor.markdown
            
          
    Tuxedo Script editor

Tuxedo Script Editor
A Pen by Mink CBOS - Ephellon Dantzler on CodePen.
License.

  
## Tuxedo Script Examples.markdown

      
    Raw
  

              Tuxedo Script Examples.markdown
            
          
    Tuxedo Script Examples

Tuxedo Script Examples
A Pen by Mink CBOS - Ephellon Dantzler on CodePen.
License.

  
## Tuxedo Script Exmples.markdown

      
    Raw
  

              Tuxedo Script Exmples.markdown
            
          
    Tuxedo Script Exmples

Tuxedo Script Examples
A Pen by Mink CBOS - Ephellon Dantzler on CodePen.
License.
	<h1>TuxedoScript Examples</h1>
	<div>
	Help<br>
	right-click a pen's content to open an editor<br>
	double-click a pen's contents to open the original pen<br>
	Ephellon Dantzler 2016
	</div>
	<!-- ⌘ - http://codepen.io/Ephellon/pen/zvvGaz -->
	<textarea default>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features
	## Coffee Script-Like Examples, see coffeescript.org

	## Extendable features
	## +advance
	## +eval
	## +js-editor
	## +legacy
	## +math
	## +wordy
	## -hide
	## -html-editor
	## -ugly

	## Assignment
	#number = 42
	#opposite = true
	3.14 => PI

	## Conditions
	number = -42 if opposite.
	/* or
	number = -42 if opposite is true.
	number = -42 unless opposite is false.
	*/

	## Functions
	$square x {
	<- x^2
	}
	/* or, with +math
	square(x) = x^2
	*/
	$eat f {
	$doc.writeln "I ate the ${f}<br>"
	}
	$discuss f {
	// f[f.length-1]
	#s = "s" if f#01 != 's'.
	else s = "";
	$doc.writeln "The ${f} look${s} good<br>"
	}
	$doc.writeln = $x {
	$doc.body.$html += "${x}<br>"
	}

	## Arrays
	#list = [1, 2, 3, 4, 5]

	## Objects
	#math = {
	root: @.sqrt
	square: square
	cube: $x {
	<- x^3
	}
	}

	## Splats + Interpolation
	$race winner, runners... {
	$doc.writeln "${winner}, ${runners}"
	}

	## Existence
	alert "I knew it" if Elvis exists.

	## Array comprehension
	#menu = ['tacos', 'burritos', 'sushi', 'spaghetti']

	if menu exists {
	discuss food from menu
	}

	eat food from menu while the food isnt "sushi"

	## Simple English
	#sushi = "sushi" from menu
	#third = 3 in menu

	## Reserved words
	#off = off
	\off = off OR NOT on</textarea>
	<textarea coffee>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features
	## Coffee Script-Like Examples, see coffeescript.org

	## Extendable features
	## +advance
	## +eval
	## +js-editor
	## +legacy
	## +math
	## +wordy
	## -hide
	## -html-editor
	## -ugly

	## Assignment
	#number = 42
	#opposite = true
	3.14 => PI

	## Conditions
	number = -42 if opposite.
	#*# or you can use
	number = -42 if opposite is true.
	number = -42 unless opposite is false.
	##

	## Functions
	$square x {
	<- x^2
	}
	$eat f {
	$doc.writeln "I ate the ${f}<br>"
	}
	$discuss f {
	#s = "s" if f#01 != 's'.
	else s = "";
	$doc.writeln "The ${f} look${s} good<br>"
	}
	$doc.writeln = $x {
	$doc.body.$html += "${x}<br>"
	}

	## Arrays
	#list = [1, 2, 3, 4, 5]

	## Objects
	#math = {
	root: @.sqrt
	square: square
	cube: $ x {
	<- x^3
	}
	}

	## Splats + Interpolation
	$race winner, runners... {
	$doc.writeln "${winner}, ${runners}"
	}

	## Existence
	alert "I knew it" if Elvis exists.

	## Array comprehension
	#menu = ['tacos', 'burritos', 'sushi', 'spaghetti']

	if menu exists {
	discuss food from menu
	}

	eat food from menu while the food isnt "sushi"

	## Simple English
	#sushi = "sushi" from menu
	#third = 3 in menu

	## Reserved words
	#off = off
	\off = off OR NOT on</textarea>
	<textarea wKpxKX>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features

	## +advance
	## +clean
	## +eval
	## +js-editor
	## +legacy
	## +math
	## +wordy

	$doc.writeln = $m {
	$doc.body.$html += m + "<br>"
	}

	.system {
	@(p) {
	<- @purpose = p
	}
	toString() {
	<- @purpose
	}
	}
	$skeletal {
	<- new system "<b func>provides structure</b> to the body and <b func>protects the internal organs</b>"
	}
	$muscular {
	<- new system "<b func>provides structure</b> to the body and <b func>allows movement</b>"
	}
	$digestive {
	<- new system "<b func>provides energy</b> from consumption of foods and drinks; and <b func>rids the body of waste</b>"
	}
	$respiratory {
	<- new system "<b func>provides oxygen</b> and a way to release waste gases"
	}
	$nervous {
	<- new system "<b func>provides sensation</b>, <b func>thought</b>, and <b func>commands</b> for most bodily functions"
	}
	$circulatory {
	<- new system "<b func>provides roots</b> for oxygen, nutrient, and mineral rich blood; and <b func>rids</b> the body of waste"
	}
	$skin {
	<- new system "along with <b sys>hair</b>, <b func>provides protection</b>, <b func>cooling</b>, and <b func>heating</b>"
	}

	$doc.writeln "The <b sys>nervous</b> system <b def>${nervous()}</b>"
	$doc.writeln "The <b sys>digestive</b> system <b def>${digestive()}</b>"
	$doc.writeln "The <b sys>skin</b> system <b def>${skin()}</b>"</textarea>
	<textarea EVwgdJ>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features

	## +clean
	## +eval
	## +legacy
	## +math
	## +wordy
	## +advance
	## -hide
	## -html-editor
	## -js-editor
	## -ugly

	.PiggyBank {
	@(max) {
	@max = max
	@coins = 0
	@smashed = false
	}

	add(amount) {
	amount = amount OR 1
	if @coins < @max AND NOT @smashed {
	@coins += amount
	}
	if @coins < @max {
	@coins = @coins
	}{
	@coins = @max
	}
	}

	amount(value) {
	if value {
	<- value equals @coins
	}
	<- @coins
	}

	smashed() {
	<- @smashed
	}

	smash() {
	<- @smashed = true
	}

	toString() {
	<- "$" + (@amount() * 0.01)
	}
	}

	#bank = new PiggyBank(500) // $5
	$doc.body.$html += ("<b val>${bank.amount()}</b> <br>")
	bank.add()
	$doc.body.$html += ("<b val>${bank.amount()}</b> <br>")
	bank.add 23
	$doc.body.$html += ("<b val>${bank.toString()}</b> <br>")
	bank.smash()
	$doc.body.$html += ("<b val>${bank.amount()}</b> <br>")
	bank.add 23
	$doc.body.$html += ("<b val>${bank.toString()}</b> <br>")
	bank.smash()</textarea>
	<textarea zvdqpK>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!
	## +advance
	## +eval
	## +js-editor
	## +legacy
	## +wordy

	.Animal {
	@(name, sound, places) {
	@name = name \|\| ''
	@sound = sound \|\| 'makes a noise'
	@places = places \|\| 'somewhere'
	}

	speak(sound) {
	$doc.body.$html += ('The ${@name} <b sound>${@sound}</b><br/>')
	}

	lives(places) {
	$doc.body.$html += ('The ${@name} lives <b place>${@places}</b><br/>')
	}
	}

	.Cat Animal {}
	.Dog Animal {}

	.Tiger Cat {}
	.Wolf Dog {}

	#siberian--tiger = new Tiger("Siberian Tiger", "roars", "Siberia")
	#grey--wolf = new Dog("Grey Wolf", "howls", "in N\. America")
	#worm = new Animal("Worm", "", "everywhere")

	siberian_tiger.speak()
	grey_wolf.lives()
	worm.lives()
	</textarea>
	<textarea NGvdqW>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features

	## +clean
	## +eval
	## +js-editor
	## +legacy
	## +math
	## +wordy
	## +advance

	#gold, silver, rest

	$medals first, second, others... {
	gold = first
	silver = second
	rest = others
	}

	#contenders = ["Michael Phelps", "Liu Xiang", "Yao Ming", "Allyson Felix", "Shawn Johnson", "Roman Sebrle", "Guo Jingjing", "Tyson Gay", "Asafa Powell", "Usain Bolt"]

	medals contenders...

	$doc.body.$html += ("<b gold>Gold</b>: <b name>${gold}</b><br/>")
	$doc.body.$html += ("<b silver>Silver</b>: <b name>${silver}</b><br/>")
	$doc.body.$html += ("<b other>Contenders</b>: <b name>${rest}</b><br/>")</textarea>
	<textarea LpOXLj>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features

	## +clean
	## +eval
	## +math
	## +wordy

	#d = "horizontal", c = 0, s = 100, m = 200
	setInterval($ {
	$dim {
	c += @.random() * 5
	s += @.random() * 15 if s-c < @.random() * 5.
	s = m if s > m.
	c = s if c > s.

	#barSize = (c - 4) + "px", bgSize = s + "px", bgMargin = (s * -0.5) + "px"
	if d is "horizontal" {
	bar.style.width = barSize
	bg.style.width = bgSize
	bg.style.marginLeft = bgMargin
	}{
	bar.style.height = barSize
	bg.style.height = bgSize
	bg.style.marginTop = bgMargin
	}
	<- c is s AND c is m
	}

	if d is "horizontal" && dim() {
	c = 0
	s = 100
	d = "vertical"
	} else-if d is "vertical" && dim() {
	c = 6
	s = 100
	d = "text"
	} else-if d is "text" {
	dim()
	bar.$html = (@.round(c/m * 99) + @.round(@.random() * 9) /10) + "%"
	}

	}, 200)</textarea>
	<textarea xwLEzx>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!
	## +advance
	## +eval
	## +js-editor
	## +legacy
	## +wordy

	.Domain {
	@(d, k, p, c, o, f, g, s) {
	@domain = d \|\| ''
	@kingdom = k \|\| ''
	@phylum = p \|\| ''
	@class = c \|\| ''
	@order = o \|\| ''
	@family = f \|\| ''
	@genus = g \|\| ''
	@species = s \|\| ''
	@binomial--nomenclature = "${g} ${s}"
	}

	domain() {
	<- @domain = d \|\| ""
	}
	kingdom() {
	<- @kingdom = k \|\| ""
	}
	phylum() {
	<- @phylum = p \|\| ""
	}
	class() {
	<- @class = c \|\| ""
	}
	order() {
	<- @order = o \|\| ""
	}
	family() {
	<- @family = f \|\| ""
	}
	genus() {
	<- @genus = g \|\| ""
	}
	species() {
	<- @species = s \|\| ""
	}
	applyName(n) {
	<- @name = n \|\| "", @
	}
	}

	## *k: kingdom, $p;
	## *p: phylum_, $c;
	## *c: class_, $o;
	## *o: order_, $f;
	## *f: family_, $g;
	## *g: genus_, $s;
	## *s: species_;

	## Domains
	$Bacteria {
	<- new Domain("Bacteria", "Bacteria")
	}

	$Archaea {
	<- new Domain("Archaea", "Archaea")
	}

	$Eukaryota $k {
	<- new Domain("Eukaryota", $k)
	}

	## Kingdoms: Eukaryota
	$Animalia $p {
	<- new Eukaryota("Animalia", $p)
	}

	$Excavata $p {
	<- new Eukaryota("Excavata", $p)
	}

	$Amoebozoa $p {
	<- new Eukaryota("Amoebozoa", $p)
	}

	$Opisthokonta $p {
	<- new Eukaryota("Opisthokonta", $p)
	}

	$Rhizaria $p {
	<- new Eukaryota("Rhizaria", $p)
	}

	$Chromalveolata $p {
	<- new Eukaryota("Chromalveolata", $p)
	}

	$Archaeplastida $p {
	<- new Eukaryota("Archaeplastida", $p)
	}

	## Phyla
	$Chordata $c {
	<- new Animalia("Chordata", $c)
	}

	## Classes
	$Mammalia $o {
	<- new Chordata("Mammalia", $o)
	}

	## Orders
	$Primates $f {
	<- new Mammalia("Primates", $f)
	}

	$Proboscidea $f {
	<- new Mammalia("Proboscidea", $f)
	}

	## Families
	$Hominidae $g {
	<- new Primates("Hominidae", $g)
	}

	$Elephantidae $g {
	<- new Proboscidea("Elephantidae", $g)
	}

	## Genera
	$Homo $s {
	<- new Hominidae("Homo", $s)
	}

	$Loxodonta $s {
	<- new Elephantidae("Loxodonta", $s)
	}

	## Species
	$Sapien {
	<- new Homo "Sapien"
	}

	$Erectus {
	<- new Homo "Erectus"
	}

	$Africana {
	<- new Loxodanta "Africana"
	}

	## et cetra
	$Human name {
	<- new Sapien..applyName name
	}

	$Elephant name {
	<- new Africana..applyName name
	}

	#myData = new Human "Ephellon"
	$win.myData = myData

	$doc.body.$html += ("me:<br>")
	for obj in myData {
	$doc.body.$html += ("My <b var>${obj}</b> is '<b val>${myData[obj]}</b>'<br>")
	}</textarea>
	<textarea zvRPWv>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features
	## 5: lines by Kishin

	## +advance
	## +eval
	## +js-editor
	## +legacy
	## +math
	## +wordy
	## -hide
	## -html-editor
	## -ugly

	## *rand: @.random()
	## *req: requestAnimationFrame

	($ {
	$Line x, y, hue {
	@x = @ox = x
	@y = @oy = y
	@hue = hue
	@a = 360$rand
	@va = 0.2$rand - 0.1
	@vx = 20$rand
	@radius = 150$rand
	@delay = 100$rand
	}

	Line.prototype = {
	constructor: Line,
	update: $ {
	<- @delay-- if @delay > 0.
	@ox = @x
	@oy = @y
	@x += @vx * $rand
	@vx += 2$rand - 1
	@y = c.height/2 + @.sin(@a += @va * $rand) * @radius

	ctx.strokeStyle = 'hsl(${@hue}, 100%, 50%)'
	ctx.lineWidth = 1 + @.cos @a * 5$rand
	ctx.beginPath()
	ctx.moveTo(@ox, @oy)
	ctx.lineTo(@x, @y)
	ctx.stroke()

	if @x > c.width {
	@x = 0
	@vx = 20$rand
	@hue = 360$rand
	@va = 0.2$rand - 0.1
	}
	if @x < 0 {
	@x = c.width
	@vx = -20$rand
	@hue = 360$rand
	@va = 0.2$rand - 0.1
	}
	}
	}

	#c = $doc.$id("c")
	#ctx = c.getContext("2d")
	c.width = $win.innerWidth
	c.height = $win.innerHeight

	#lines = [], maxLines = 100, hue = 0, hueInc = 360/maxLines

	for i, 0, maxLines, 1 {
	lines.push(new Line(0, c.height/2, hue += hueInc))
	}

	$con.log lines

	$req($loop {
	$req loop

	ctx.save()
	ctx.fillStyle = "rgba(0, 0, 0, 0.4)"
	ctx.fillRect(0, 0, c.width, c.height)
	ctx.globalCompositeOperation = "lighter"

	for i, 0, lines.length, 1 {
	lines[i].update ctx
	}
	ctx.restore()
	})
	})()</textarea>
	<textarea rOJExb>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!, strict mode required for advanced features

	## +advance
	## +clean
	## +eval
	## +js-editor
	## +legacy
	## +math
	## +wordy
	## -hide
	## -html-editor
	## -ugly

	#c = $doc.$id 'canv'
	#$ = c.getContext '2d'

	($ {
	#s = $win.innerWidth/2
	#h = $win.innerHeight/2

	c.width = s
	c.height = h
	$.miterLimit = 0.1

	#arr = []
	#idx = -1
	#p = {
	x: s
	y: s/1.5
	}
	#int
	#r = 0.005
	#sz = 8

	#crv = 0.1
	#circ = 8
	#p3 = -0.05
	#p4 = 0.5

	#f1 = 250
	#f1d = on
	#stop = on
	#img
	#u = 0

	$add p, q {
	<- {
	x: p.x + q.x
	y: p.y + q.y
	}
	}

	$cart r, a {
	<- {
	x: @.cos a * r,
	y: @.sin a * r
	}
	}

	$coord ti, r {
	idx++
	arr#idx = 0 if !arr#idx.
	arr#idx += ti
	<- cart(r, arr#idx)
	}

	$.fillStyle = 'hsla(0, 0%, 10%, 1)'
	$.fillRect(0, 0, c.width, c.height)

	$draw {
	u -= 0.3
	#rp = coord(r, sz)
	$.fillStyle = 'hsla(0, 0%, 10%, 0.001)'
	$.save()
	$.beginPath()
	$.moveTo(p.x, p.y)
	$.lineWidth = 4
	$.shadowColor = 'hsla(0, 0%, 10%, 0.2)'
	$.shadowBlur = 25
	for i, 0, 127, 1 {
	idx = -1
	p = add(p, add(coord(crv, circ), add(coord(p3, rp.x), coord(p4, rp.y))))
	$.lineTo(p.x, p.y)
	}
	$.strokeStyle = 'hsla(${u}, 100%, 55%, 1)'
	$.closePath()
	$.stroke()
	$.restore()
	}

	$msp e {
	<- {
	x: ((e.clientX - c.offsetLeft) - h) / h
	y: ((e.clientY - c.offsetTop)) / h
	}
	}

	$go {
	$win.requestAnimationFrame go
	draw()
	}

	$win.addEventListener('mousemove', $e {
	#p = msp e
	r = 0.01 * (1 - \|p.y\|)
	crv = 0.1 + 0.00025p.x
	}, no)

	$win.addEventListener('resize', $ {
	#s = $win.innerWidth/2
	#h = $win.innerHeight/2
	c.width = $win.innerWidth
	c.height = $win.innerHeight
	$.miterLimit = 0.1
	$.fillStyle = 'hsla(0, 0%, 10%, 1)'
	$.fillRect(0, 0, c.width, c.height)
	}, no)
	go()
	})()</textarea>
	<textarea meQEbx>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!
	## +advance
	## +eval
	## +legacy
	## +math
	## +wordy
	## +js-unit

	$time d {
	<- d + 's' if d < 60.
	#h = parseInt(d / 3600)
	h = "0" + h if h < 10.
	#m = parseInt(\|d - 3600h\| / 60)
	m = "0" + m if m < 10.
	#s = \| d - 3600h - 60m \| OR 0
	s = "0" + s if s < 10.
	<- '${h}h:${m}m:${s}s'
	}

	#* JS-Unit ##
	@Before {
	## @@ toconsole
	@@x = 'value'
	}

	(@Test {
	@@assert( '2m 0s', time 120)
	@@assertFalse( $loc.toString..match(/codepen/) )
	}#)

	(@Test {
	@@assertEquals( @.PI, 3.141592653589793 )
	## pass
	@@assertEquals( @.PI, 3.14159265358979 )
	## fail
	@@assertEquals( 'value', @@x )
	## pass
	}#)

	@After {
	## afterwards
	}</textarea>
	<textarea MKWaja>/* TuxedoScript 11.2.8
	@aut: Ephellon Dantzler
	@dat: Tue Sept 8, 2015
	@tie: 23:51 CST -06:00
	@lie: "Free for use, as long as my name, CoffeeScript, Python, and ECMA are mentioned"
	*/
	##!
	## +advance
	## +eval
	## +math
	## +legacy
	## +wordy

	#prom contact

	## *num: number.substr

	$contact <Contact person> { // ideal situation, contact
	<- "the best way to contact ${person.name} is by ${person.contact.best}"
	}

	$contact <String name, Number number> { // name, telephone number
	number = \|number\|.toString()
	switch number.length {
	@10:
	number = "+1" + ("(" + $num(0,3) + ") " + $num(3,3) + "-" + $num(6,4))
	break
	@11:
	number = "+" + (number[0] + "(" + $num(1,3) + ") " + $num(4,3) + "-" + $num(7,4))
	break
	@12..14:
	// a valid number was given
	break
	@def:
	number += " is not a valid number"
	}
	<- "The best way to contact <b var>${name}</b> is by telephone, <b val>${number}</b>"
	}

	$contact <String name, String email> { // name, email
	<- "The best way to contact <b var>${name}</b> is by e-mail, <b val>${email}</b>"
	}

	$contact <String name, Array list> { // name, list of ways
	<- "${name} has specified a list of ways to reach them:<br>${list}"
	}

	$contact <String name, * type> { // name, any type
	<- "${name} exists, but they didn't provide a valid way to contact them;<br>${type}"
	}

	$contact <...> {
	<- "Contact does not exist"
	}

	#test = contact("John Doe", 8005555555)

	$doc.body.innerHTML += (
	test
	.replace(/\n/g, "<br>")
	.replace(/\s\s/g, " ")
	)</textarea>
	<textarea type="text/ts"></textarea>
	var data = tux.get.form.data();
	if(data !== null) {
	for(var pen in data) {
	var a = document.querySelector("textarea[" + pen + "]");
	a.className = "show";
	a.title = pen + ", needs " + data[pen];
	a.addEventListener("contextmenu", function(){
	window.open("http://codepen.io/Ephellon/debug/zvvGaz?code=" + encode(a.value) + "#" + pen)
	});
	a.addEventListener("dblclick", function(){
	var n = "", m = "html css js console".split(" ");
	for(var x = 0; x < m.length && n.length < 4; x++) {
	n += +(data[pen].indexOf(m[x]) > -1)
	}
	n = (n !== "0000")? "?editors=" + n: "";
	window.open("http://codepen.io/Ephellon/pen/" + pen + n)
	})
	}
	}

	function encode(x) {
	x = encodeURI(x)
	.replace(/\n/g, "%0D")
	.replace(/#/g, "%23")
	.replace(/\(/g, "%28")
	.replace(/\)/g, "%29")
	.replace(/\*/g, "%2A")
	.replace(/\+/g, "%2B")
	.replace(/\//g, "%2F")
	.replace(/\:/g, "%3A")
	.replace(/;/g, "%3B")
	.replace(/</g, "%3C")
	.replace(/\=/g, "%3D")
	.replace(/>/g, "%3E")
	.replace(/\[/g, "%5B")
	.replace(/\]/g, "%5D")
	.replace(/\{/g, "%7B")
	.replace(/\}/g, "%7D")
	.replace(/%20/g, "+");
	return x;
	}
	body, body * {
	background: #e6e6e6;
	color: #000;
	font-family: arial, monospace;
	font-size: 14px;
	overflow: hidden;
	}

	textarea {
	background: #000;
	border: 1px solid #fff;
	display: none;
	max-width: 100vw;
	overflow: auto;
	width: 99vw;
	}

	textarea.show {
	background: #fff;
	border: solid 5px #fff;
	border-radius: 0.5vw;
	box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.2);
	color: #b6b6b6;
	display: initial;
	font-size: 2vw;
	height: auto;
	padding-left: 2.5vw;
	padding-right: 2.5vw;
	text-shadow: none;
	width: auto;
	z-index: 9;
	}