Previous time, we just tackled cgi form with an html mockup screen and a cgi skeleton for our Rebtweeter Client Project. This time, we will have a fully functional prototype (it’s far from being the first release yet as per Project Vision Draft, just a demonstration of the core functionality) which will allow you to fast bookmark a link to twitter thanks to automatic title parsing given the url.
You can straight away test it on Rebtweeter.com by clicking on the picture below (you can use the Rebtweetdemo account for real):
Select for example the “link to” command and add a link in the command text zone like shown above or below
link to http://www.rebol.com/article/0424.html
Submit and see the live result on http://twitter.com/rebtweetdemo (beware if the link has already been posted, twitter will not repost it.):
This is the full html source code (there is just an onChangeSelectAction javascript function added to the previous mockscreen to add command action to the command text zone):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Rebtweeter</title>
<link rel="stylesheet" type="text/css" href="view.css" media="all">
<script type="text/javascript" src="view.js"></script>
</head>
<body id="main_body" >
<img id="top" alt="" src="top.png">
<div id="form_container">
<h1 id="logo"><a>Rebtweeter</a></h1>
<form id="form_95898" class="appnitro" method="post" action="http://rebolhosting.com/cgi-bin/rebtweeter.cgi">
<script type="text/javascript">
<!--
function onChangeSelectAction(oform,value)
{
var commands= new Array()
commands["1"]="Tweet";
commands["2"]="Talk to";
commands["3"]="Link to";
oform["command"].value = commands[value] + " ";
}
//-->
</script>
<div class="form_description">
<h2>Rebtweeter next generation twitter client</h2>
<p>Give it a try, it's awesome!</p>
</div>
<ul >
<li id="li_1" >
<label class="description" for="account">Twitter account </label>
<div>
<input id="account" name="account" class="element text medium" maxlength="255" value="rebtweetdemo">
</div>
</li> <li id="li_4" >
<label class="description" for="password">Account password </label>
<div>
<input id="password" name="password" type="password" class="element text medium" maxlength="255" value="reboltutorial">
</div>
</li> <li id="li_3" >
<label class="description" for="action">Twitter Action </label>
<div>
<select class="element select medium" id="action" name="action" onchange="onChangeSelectAction(this.form,this.value)">
<option value="1" selected >Tweet</option>
<option value="2">Talk to</option>
<option value="3">Link to</option>
</select>
</div><p class="guidelines" id="guide_3"><small>Select an action or type it directly in Command field</small></p>
</li> <li id="li_2" >
<label class="description" for="command">Command </label>
<div><textarea class="element textarea small" id="command" name="command">Tweet </textarea>
</div><p class="guidelines" id="guide_2"><small>Type the whole command for example Talk to Jason Hi Jason I just discovered Rebtweeter</small></p>
</li>
<li class="buttons">
<input type="hidden" name="form_id" value="95898"
>
<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit" >
</li>
</ul>
</form>
<div id="footer">
<a href="http://www.rebtweeter.com">rebtweeter.com</a> | <a href="http://twitter.com/rebtweetdemo">twitter.com/rebtweetdemo</a>
</div>
</div>
<img id="bottom" alt="" src="bottom.png">
</body>
</html>
And this the Rebol Cgi Code, the interesting part being the Parse Rule section:
#!/usr/bin/rebol -c
REBOL [Title: "Rebtweeter Web Client"]
http-redirect: func [url] [
print join "Location: " url
print join "Expires: 0" newline
]
cgi-string: make string! 1024
switch system/options/cgi/request-method [
"GET" [cgi-string: system/options/cgi/query-string]
"POST" [read-io system/ports/input cgi-string 1024]
]
cgi: construct decode-cgi cgi-string
do http://reboltutorial.com/source/rebol-twitter.r
tweetuser: cgi/account
tweetpassword: cgi/password
status: none
rule: [set action [
'tweet copy message to end
| 'link 'to set url url! copy title to end
| 'talk 'to set name word! copy message to end
]
]
if/else (parse (to-block cgi/command) rule) [
switch action [
tweet [
parse cgi/command [thru "tweet " copy status to end]
]
link [
if (none? title) [
parse read url [
thru <title>
copy title to </title>
thru </title> to end
]
if ((length? title) > 120) [
parse title [
[to "-" thru "-" | ]
copy title to end
]
]
if ((length? title) > 120) [
title: rejoin [copy/part title 117 "..."]
]
]
status: reform [ title url]
]
talk [
status: rejoin ["@" name " " message]
]
]
tweet status
http-redirect select system/options/cgi/other-headers "HTTP_REFERER"
quit
][
tweet cgi/command
http-redirect select system/options/cgi/other-headers "HTTP_REFERER"
quit
]
The “link to” command is the most complex of all three available command: it will get the title of the url automatically of no title is appended to it by the user to the command box. It will also try to optimize the title if it’s beyond 120 characters by truncating section before “-” (generally the site’s name though the site’s name could be after the article’s title, this case is not taken into account yet).
To upload the cgi to your rebol hosting webservice, you have to:
1°) change the path to your rebol exe in the first line of rebol’s script (this is similar to perl)
2°) chmod permission to 755
That’s all Folks for this time!
admin:
Edoc:
