gucchan22/webrokeup.html

## webrokeup.html
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>We broke up</title>
    <link href='http://fonts.googleapis.com/css?family=Cookie' rel='stylesheet' type='text/css'>
  </head>
  <body>
    <h1>生まれ変わる7.24</h1>
    <script type="text/javascript">
      // "f", "j", "m", "q", "s", "x", "y" are not available right now.
      // commit this if you're free.
      var table = {
        a:["black",3], b:["black",1], c:["black",4], d:["red",3], e:["red",2],
        g:["green",4], h:["white",2], i:["white",3], k:["black",5], l:["purple",5],
        n:["green",5], o:["yellow",5], p:["purple",1], r:["red",1], t:["white",4],
        u:["purple",2],w:["white",1], y:["yellow",1]
      };
      var toggle = false;
      function click_evt() {
        if(toggle) {
          document.getElementById("question").innerHTML = "";
        }
        var msg = document.getElementById("itext").value.replace(/\s+/g,"").toLowerCase();
        for(var i = 0; i < msg.length; i++) {
          document.getElementById("question").innerHTML += "<span style='color:"+table[msg[i]][0]+";'>"+table[msg[i]][1]+" </span>";
          toggle = true;
        }
      }
    </script>
    <style type="text/css">
      div#question {
        font-size:4em;
        font-family: 'Cookie', cursive;
        -webkit-text-stroke-color: #000;
        -webkit-text-stroke-width: 1px;
      }
    </style>
    <input type="text" id="itext" value="We broke up">
    <input type="button" id="announce" onclick="click_evt()" value="what's your announcement?">
    <div id="question"></div>
  </body>
</html>
	<!DOCTYPE html>
	<html lang="ja">
	<head>
	<meta charset="utf-8">
	<title>We broke up</title>
	<link href='http://fonts.googleapis.com/css?family=Cookie' rel='stylesheet' type='text/css'>
	</head>
	<body>
	<h1>生まれ変わる7.24</h1>
	<script type="text/javascript">
	// "f", "j", "m", "q", "s", "x", "y" are not available right now.
	// commit this if you're free.
	var table = {
	a:["black",3], b:["black",1], c:["black",4], d:["red",3], e:["red",2],
	g:["green",4], h:["white",2], i:["white",3], k:["black",5], l:["purple",5],
	n:["green",5], o:["yellow",5], p:["purple",1], r:["red",1], t:["white",4],
	u:["purple",2],w:["white",1], y:["yellow",1]
	};
	var toggle = false;
	function click_evt() {
	if(toggle) {
	document.getElementById("question").innerHTML = "";
	}
	var msg = document.getElementById("itext").value.replace(/\s+/g,"").toLowerCase();
	for(var i = 0; i < msg.length; i++) {
	document.getElementById("question").innerHTML += "<span style='color:"+table[msg[i]][0]+";'>"+table[msg[i]][1]+" </span>";
	toggle = true;
	}
	}
	</script>
	<style type="text/css">
	div#question {
	font-size:4em;
	font-family: 'Cookie', cursive;
	-webkit-text-stroke-color: #000;
	-webkit-text-stroke-width: 1px;
	}
	</style>
	<input type="text" id="itext" value="We broke up">
	<input type="button" id="announce" onclick="click_evt()" value="what's your announcement?">
	<div id="question"></div>
	</body>
	</html>