高橋メソッドCGI

web

高橋メソッド(http://www.rubycolor.org/takahashi/)をHTML(JavaScript)で再現するものを、wstarさんが作っていた(http://www13.cds.ne.jp/~wstar/ksr/parts.cgi?2005040870)のを見て、あまりに簡単な出来に驚いたのでCGI化してみた。 (もろもろの情報は http://www.hyuki.com/tf/ 経由)

テキストエリアに文字を打ちこむと、高橋メソッドのスライドが生成されます。改行はそのままスライドの改行として反映されます。空行でスライドの切り替え。色つけとか余分な機能はまったくなし。
高橋メソッドCGIの高橋メソッドによる説明はこちら

作ってからいろいろ見てみると、やっぱりもうある。ここ(http://la.ma.la/blog/diary_200504080545.htm)とか。調べてから作れっちゅうのワハハ。笑っておこう。

ソースはこんなの。wstarさんのHTMLをストレートにCGIに。なんの工夫もありません。

#!/usr/local/bin/ruby
require 'cgi'

$myself = File.basename($0)
def head(str)
  return <<EOS_h
<html>
  <head>
    <title>高橋メソッド</title>
    <style type="text/css">
.slide {
	font-family : sans-serif;
	font-size : 100px;
	position : absolute;
	top : 50px;
	visibility : hidden;
	text-align : center;
	z-index : 1;
}
html, body, p {
	padding : 0;
	margin : 0;
}
p#menu {
	position : absolute;
	z-index : 2;
}

    </style>
    <script type="text/javascript">
var pages = null;
var nowPage = 0;
function getElementsByClass(searchClass){
  var classElements = new Array();
  var allElements = document.getElementsByTagName('*');
  var j = 0;
  for (var i=0; i < allElements.length; i++) {
    if (allElements[i].className == searchClass) {
      classElements.push(allElements[i]);
    }
  }
  return classElements;
}

function nextPage(page){
  if (nowPage < pages.length - 1){
    toPage(nowPage + 1);
  }
}
function prevPage(page){
  if (nowPage > 0){
    toPage(nowPage - 1);
  }
}

function lastPage(page){
  toPage(pages.length - 1);
}

function toPage(page){
  pages[nowPage].style.visibility = "hidden";
  pages[nowPage].style.fontSize = "100px";
  nowPage = page;
  var p = pages[page];

  var nHeight = 100 * document.body.clientHeight / p.clientHeight;
  var nWidth  = 100 * document.body.clientWidth / p.clientWidth;
  var nnn = nHeight > nWidth ? nWidth : nHeight;
  p.style.fontSize = nnn + "px";
  p.style.top = (document.body.clientHeight - p.clientHeight) / 2;
  p.style.left = (document.body.clientWidth - p.clientWidth) / 2;
  p.style.visibility = "visible";
}

function init(){
  pages = getElementsByClass("slide");
  toPage(0);
  toPage(0);
}
</script>
</head>
  <body onload="init()">
    <p id="menu">
      <a href="#{$myself}?takahashi=#{CGI.escape(str)}">再生成</a>
      <a href="javascript:toPage(0)">先頭</a>
      <a href="javascript:nextPage()">次へ</a>
      <a href="javascript:prevPage()">戻る</a>
      <a href="javascript:lastPage()">最後</a>
    </p>
EOS_h
end

def footer
  return <<EOS_f
  </body>
</html>
EOS_f
end

cgi = CGI.new
print cgi.header({"type"=>"text/html","charset"=>"euc-jp"})

if cgi.params['gen'][0]  == nil
  print <<EOS
<html>
  <head>
     <title>
       高橋メソッド
     </title>
  </head>
  <body>
    <h1>高橋メソッドCGI</h1>
    <form action='#{$myself}' method="get">
      <textarea name="takahashi" cols="80" rows="30">#{CGI.escapeHTML(cgi.params['takahashi'][0])}</textarea>
      <input type="hidden" name="gen" value="true" />
      <br/>
      <input type="submit" value="スライド生成"/>
    </form>
  </body>
</html>
EOS
else
  str = cgi.params['takahashi'][0]
  mesarray = str.split("\r\n\r\n")
  print head(str)
  mesarray.each do |slide|
    puts 
    puts "<pre class='slide'>"
    puts CGI.escapeHTML(slide)
    puts "</pre>"
    puts
  end
  print footer
end
puts