Skip to content

Instantly share code, notes, and snippets.

@darwin

darwin/index.html

Last active May 1, 2022 20:40
Show Gist options
  • Save darwin/4772996 to your computer and use it in GitHub Desktop.
Save darwin/4772996 to your computer and use it in GitHub Desktop.
Download ZIP
Welcome to comix!
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="stylesheet" href="http://cmx.io/v/0.1/cmx.css"/>
<script src="http://cmx.io/v/0.1/cmx.js"></script>
<body>
<scene id="scene1">
<label t="translate(0,346)">
<tspan x="0" y="0em">A Comix Sample</tspan>
</label>
<actor t="translate(131,49)" pose="-11,9|-5,117|-11,99|-11,89|-11,79|-11,59|-16,34|-21,9|-6,34|-1,9|-18,79|-18,59|-6,79|-1,59">
<bubble pose="0,0|-20,10|-81,49|22,44|-17,87|-64,102">
<tspan x="0" y="0em">Hello World!</tspan>
</bubble>
</actor>
</scene>
@zinc628
Copy link

zinc628 commented Nov 14, 2019

<script src="http://cmx.io/v/0.1/cmx.js" charset="utf-8"></script> <style>.cmx-user-scene4 .cmx-text-border .cmx-path {stroke: orange}</style> 
<scene id="scene1">
  <label t="translate(0,346)">
    <tspan x="0" y="0em">One Boring Morning</tspan>
  </label>
  <drawing t="translate(0,31) rotate(-3)" pose="-2,80">
    <line stroke="green">
      <point x="0" y="0"></point>
      <point x="250" y="20"></point>
    </line>
  </drawing>
  <actor t="translate(71,19) rotate(-2)" pose="-11,9|-5,117|-11,99|-11,89|-11,79|-11,59|-16,34|-21,9|-6,34|-1,9|-18,79|-18,59|-6,79|-1,59">
    <bubble t="translate(9,11)" pose="0,0|-20,10|-81,49|19,66|-21,145|-73,109">
      <tspan x="0" y="-3em">I had an idea today</tspan>
      <tspan x="0" y="0em">I should get rid</tspan>
      <tspan x="0" y="1em">of the pesky</tspan>
      <tspan x="0" y="2em">union treaty</tspan>
      <tspan x="0" y="3em">that would be done...</tspan>
      <tspan x="8" y="76px">easily!</tspan>
    </bubble>
  </actor>
  <actor t="translate(159,15)" pose="28,1|30,109|28,91|28,81|28,71|28,51|18,31|18,1|33,26|38,1|23,71|18,51|38,71|38,51">
    <bubble t="translate(-2,-9)" pose="0,0|-14,24|-36,69|25,65|6,109|-42,161">
      <tspan x="0" y="0em">you mean</tspan>
      <tspan x="0" y="1em">as easily as</tspan>
      <tspan x="0" y="2em">making people</tspan>
      <tspan x="0" y="3em">Histarical!?</tspan>
    </bubble>
  </actor>
</scene>

<scene id="scene2">
  <drawing t="translate(0,31)">
    <line stroke="green">
      <point x="0" y="0"></point>
      <point x="250" y="20"></point>
    </line>
  </drawing>
  <actor t="translate(71,19) rotate(-2)" pose="-11,9|-1,114|-11,99|-11,89|-11,79|-11,59|-16,34|-21,9|-6,34|-1,9|-18,79|-18,59|-6,79|13,83">
    <bubble t="translate(-3,0)" pose="0,0|-12,22|-83,104|45,21|-37,182|-58,162">
      <tspan x="0" y="-2em">Yes!
      <tspan x="0" y="0em">putan would use</tspan>
      <tspan x="0" y="1em">this to start</tspan>
      <tspan x="0" y="2em">working on his</tspan>
      <tspan x="0" y="3em">Nuclear Programs</tspan>
      <tspan x="0" y="4em"><tspan fill="blue">RIGHT???</tspan></tspan>
    </tspan></bubble>
  </actor>
  <actor t="translate(159,15)" pose="28,1|30,109|28,91|28,81|28,71|28,51|18,31|13,1|33,26|38,1|23,71|18,51|38,71|38,51">
    <bubble t="translate(-2,-9)" pose="0,0|7,33|14,66|-63,30|-52,62|-94,113">
      <tspan x="0" y="1em">hmm, cool! that</tspan>
      <tspan x="0" y="2em">sounds like an easy way</tspan>
      <tspan x="0" y="3em" fill="red">to GET US KILLED!</tspan>
    </bubble>
  </actor>
</scene>

<scene id="scene3" height="230">
  <label t="translate(0,225)">
    <tspan x="0" y="0em">A few days later</tspan>
  </label>
  <actor t="translate(187,7) rotate(2)" pose="-41,48|-10,105|0,88|0,78|0,68|0,48|-5,23|-10,-2|5,23|10,-2|-11,70|-4,54|17,86|-4,110">
    <bubble t="translate(3,-2)" pose="-3,12|-22,-8|-38,20|-89,8|-102,91|-168,82">
      <tspan x="0" y="-1em">hey! I've finally done it</tspan>
      <tspan x="0" y="1em">Now I just wonder</tspan>
      <tspan x="0" y="2em">how fast I can</tspan>
      <tspan x="0" y="3em" fill="red">Produce my bombs</tspan>
      <tspan x="0" y="4em" fill="red">And how mad the people will be</tspan>
      <tspan x="0" y="5em" fill="red">This will be great.</tspan>
    </bubble>
  </actor>
</scene>

<scene id="scene4" width="300" height="98" margin-y="3" frame="no">
  <label t="translate(-9,96)" pose="6,0|7,-9">
    <tspan x="0" y="0em">~ The first box has trump and</tspan>
    <tspan x="0" y="1em">~ The People Slide 2 has the same</tspan>
    <tspan x="0" y="2em">~ The Last slide is Putan</tspan>
    <tspan x="0" y="3em">~ This was the work of table 1</tspan>
    <tspan x="0" y="4em">~ backed by </tspan><tspan fill="blue">Nobody!</tspan>
  </label>
  <actor t="translate(222,32)" pose="73,-56|69,46|73,34|93,22|81,12|82,1|66,-10|63,-39|79,-16|92,-30|63,19|42,19|65,11|40,6">
  </actor>
</scene>

@completecommunication
Copy link

thanks so much

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment