Friday, June 26, 2009

Convert Ruby code to HTML code for blog posting

本篇前傳請看Here

直接進入主題,首先,要先安裝一個叫syntax的東西(原諒我稱呼他為"東西" 因為我才讀ruby第二天Q口Q)
安裝的方法是透過command line下:

>gem install syntax

執行畫面如下:


安裝完成後就可以來.... 寫formatter程式XD,說寫,其實是剪剪貼貼啦XD 對程式的部分一知半解的。

程式內容如下:
################
## ruby2html.rb
################

require "rubygems"
# "rubygems" 少了就被抱怨:
#`require': no such file to load -- syntax/convertors/html (LoadError)
require "syntax/convertors/html"
require "Win32API"
require "Win32/clipboard"
include Win32
# 上面這行少會被被抱怨:
#undefined method `data' for Windows::Clipboard:Module (NoMethodError)

in_data = Clipboard.data
convertor = Syntax::Convertors::HTML.for_syntax "ruby"
code_html = convertor.convert(in_data)
Clipboard.set_data(code_html)
以上算是try and error來的XD,我也不知道為什麼別人的程式可以跑,我就要修修改改的。
我把檔名存成"ruby2html.rb"丟在/rails_app/下面。
這支程式是這樣用的: 把要format的code選起來按複製,接著就run剛剛存好的程式:

>ruby ruby2html.rb

跑完後command line不會show什麼訊息,這時候只要開個notepad起來按貼上,就可以看到處理好的html code,就完成啦~

最後,還是要配合CSS,CSS的部份我也自己做了些修改,因為之前已經先有一段跟C#有關的CSS,怕兩種code的CSS會互相影響,以下是我的CSS file:
/* ------------------------- For format ruby codes --------------------------*/
.ruby, .ruby pre {
background-color: #f1f1f3;
color: #112;
padding: 5px;
font-family:"bitstream vera sans mono",monaco,"lucida console","courier new",courier,serif;
font-size: 0.9em;
overflow: auto;
margin: 4px 0px;
width: 95%;
}

/* Syntax highlighting */
.ruby .normal {}
.ruby .comment { color: #005; font-style: italic; }
.ruby .keyword { color: #A00; font-weight: bold; }
.ruby .method { color: #077; }
.ruby .class { color: #074; }
.ruby .module { color: #050; }
.ruby .punct { color: #447; font-weight: bold; }
.ruby .symbol { color: #099; }
.ruby .string { color: #944; background: #FFE; }
.ruby .char { color: #F07; }
.ruby .ident { color: #004; }
.ruby .constant { color: #07F; }
.ruby .regex { color: #B66; background: #FEF; }
.ruby .number { color: #F99; }
.ruby .attribute { color: #5bb; }
.ruby .global { color: #7FB; }
.ruby .expr { color: #227; }
.ruby .escape { color: #277; }
/* -----------------------------------------------------------------------*/

嗯,有了CSS跟html code配合起來,就可以把ruby code漂漂亮亮的顯示出來囉~
另外如果覺得每次都用複製code去做很麻煩的話,也可以format整個.rb檔,請自行參閱Ref 4號,個人因為習慣copy片段,所以這個是比較適合自己的方法。

Ref:
  1. Howto format ruby code for blogs (這篇應該算始祖吧..)
  2. Formatting Ruby and HTML code for blog posting
    (這篇參考始祖可以跑... 我參考他就不行跑Q口Q)
  3. syntax ruby code to html in gnome (這篇是成功的關鍵XD)
  4. Syntax Highlighting (一樣的東西,不過他讀整個.rb檔)

Comments

0 Responses to "Convert Ruby code to HTML code for blog posting"

Post a Comment

Tags