-
-
Save podhmo/1958491 to your computer and use it in GitHub Desktop.
スカンディナヴィア半島
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="ja"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>スカンディナヴィア半島</title> | |
<link rel="stylesheet" href="./layout.css" type="text/css"></style> | |
</head> | |
<body> | |
<div id="header"> | |
<!-- | |
<img src="aa" alt="nanka" id="headimg"></img> | |
<img src="bb" alt="conf" id="conf" > | |
<form id="postform"> | |
<input type="text" size="100" maxlength="140"></input> | |
</form> | |
--> | |
<div id="date"></div> | |
</div> | |
<div id="listbox"> | |
<div id="li1" class="list"></div> | |
<div id="li2" class="list"></div> | |
<div id="li3" class="list"></div> | |
<div id="li4" class="list"></div> | |
<div id="li5" class="list"></div> | |
<div id="li6" class="list"></div> | |
<div id="li7" class="list"></div> | |
<div id="li8" class="list"></div> | |
<div id="li9" class="list"></div> | |
<div id="li10" class="list"></div> | |
</div> | |
<script src="./lib.js" type="text/javascript"></script> | |
<script> | |
var dm = lib.DateModel(); | |
var date = dm.getTimeFormat(dm.getDate()); | |
// todo? | |
document.getElementById("date").textContent = date; | |
//fixme: reload | |
var apim = lib.TwitterModel( | |
"https://twitter.com/", | |
"https://api.twitter.com/1/" | |
); | |
var apivm = lib.ApiViewModel("script", apim); | |
var mainm = lib.MainModel(); | |
var mainvm = lib.MainViewModel(mainm, apim); | |
var list = function(args){ | |
return mainvm.callBack(args) | |
}; | |
apivm.bindAPI("altnight", "javascript", "list"); | |
apivm.bindAPI("altnight", "net", "list"); | |
apivm.bindAPI("altnight", "jz", "list"); | |
apivm.bindAPI("altnight", "py", "list"); | |
// force reload | |
var reloatTime = 5*60*1000; | |
setInterval(function(){location.reload()}, reloatTime); | |
</script> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="ja"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>スカンディナヴィア半島</title> | |
</head> | |
<body> | |
<div id="header"> | |
<!-- | |
<img src="aa" alt="nanka" id="headimg"></img> | |
<img src="bb" alt="conf" id="conf" > | |
<form id="postform"> | |
<input type="text" size="100" maxlength="140"></input> | |
</form> | |
--> | |
<div id="date"></div> | |
</div> | |
<div id="listbox"> | |
<div id="li1" class="list"></div> | |
<div id="li2" class="list"></div> | |
<div id="li3" class="list"></div> | |
<div id="li4" class="list"></div> | |
<div id="li5" class="list"></div> | |
<div id="li6" class="list"></div> | |
<div id="li7" class="list"></div> | |
<div id="li8" class="list"></div> | |
<div id="li9" class="list"></div> | |
<div id="li10" class="list"></div> | |
</div> | |
<script type="text/javascript"> | |
<!-- | |
var d = new Date(); | |
var date = d.getFullYear() + '/' + (d.getMonth()+1) + '/' + d.getDate() + | |
' ' + d.getHours() + ':' +('0'+d.getMinutes()).slice(-2) + ':'+ ('0'+d.getSeconds()).slice(-2); | |
document.getElementById('date').textContent = date; | |
var twitterurl = "https://twitter.com/"; | |
var twitterapi = "https://api.twitter.com/1/"; | |
var reload_time = setInterval(function(){location.reload()},5*60*1000); | |
/* load json script */ | |
function loadJSON(url){ | |
var script = document.createElement("script"); | |
script.src = url; | |
script.type = "text/javascript"; | |
script.charset = "UTF-8"; | |
document.body.appendChild(script); | |
} | |
function load_list(list_user, list_name){ | |
loadJSON(twitterapi + 'lists/statuses.json?callback=list&slug='+list_name+'&owner_screen_name='+list_user+'&include_entities=true'); | |
//loadJSON("http://search.twitter.com/search.json?callback=list&locale=ja&q=このゲーム一生忘れない人はRT") | |
} | |
//load_list("altnight", "javascript"); | |
//load_list("altnight", "net"); | |
//load_list("altnight", "jz"); | |
//load_list("altnight", "py"); | |
load_list("altnight", "opera"); | |
var listid = 0; | |
/* callback tweet div */ | |
function list (arg){ | |
listid++; | |
for (var i = 0, l = arg.length; i<l; i++){ | |
/* tweet div */ | |
var tweetdiv = document.createElement('div'); | |
tweetdiv.id = arg[i].id; | |
tweetdiv.className = "tweet"; | |
document.getElementById("li" + listid).appendChild(tweetdiv); | |
/* user icon name */ | |
var a = document.createElement('a'); | |
// a.href = arg[i].user.url; | |
if (a.href == null) {a.href = "";} | |
tweetdiv.appendChild(a); | |
var img = document.createElement('img'); | |
img.src = arg[i].user.profile_image_url; | |
img.alt = arg[i].user.screen_name; | |
img.height = 28; | |
img.width =28; | |
a.appendChild(img); | |
var screenname = arg[i].user.screen_name; | |
var name = arg[i].user.name; | |
var username; | |
if (screenname == name) { | |
username = screenname; | |
} | |
else { | |
username = screenname +"(" + name + ")"; | |
} | |
var userurl = document.createElement('a'); | |
userurl.href = twitterurl + arg[i].user.screen_name; | |
userurl.className = "name"; | |
tweetdiv.appendChild(userurl); | |
username = document.createTextNode(username); | |
userurl.appendChild(username); | |
/* text */ | |
var textdiv = document.createElement('div'); | |
var text = arg[i].text; | |
if (arg[i].entities.urls[0]) text = text.replace(/(https?:\/\/[\w\.\,\-\+\?\/\%=\&#\!]+)/ig, arg[i].entities.urls[0].expanded_url); | |
text = text.replace(/(https?:\/\/[\w\.\,\-\+\?\/\%#=\&\!]+)/ig , '<a href="$1">$1</a>');//URL | |
text = text.replace(/@([\a-zA-Z0-9_]+)/g , '<a href='+ twitterurl +'$1>@$1</a>');//@user | |
text = text.replace(/#([\w一-龠ぁ-んァ-ヴー]+)/g , '<a href="http://twitter.com/search/$1">#$1</a>');//hashtag | |
if (/shindanmaker/.test(text)) text = 'また診断メーカーか。'; | |
if (/#[一-龠ぁ-んァ-ヴー0-9]{10,}/.test(text) ) text = 'また日本語ハッシュタグか'; | |
if (/gohantabeyo/.test(text))) text = 'またごはんか'; | |
textdiv.innerHTML = text; | |
textdiv.className = "tweettext" | |
tweetdiv.appendChild(textdiv); | |
/* Date */ | |
var timelink = document.createElement('a'); | |
timelink.href = twitterurl + arg[i].user.screen_name + "/status/" + arg[i].id_str; | |
tweetdiv.appendChild(timelink); | |
var d = new Date(arg[i].created_at); | |
var time = d.getFullYear() + '/' + (d.getMonth()+1) + '/' + d.getDate() + | |
' ' + d.getHours() + ':' +('0'+d.getMinutes()).slice(-2); | |
time = document.createTextNode(time); | |
time.className = "time"; | |
timelink.className = 'time'; | |
timelink.appendChild(time); | |
} | |
} | |
--> | |
</script> | |
<style type="text/css"> | |
#header{ | |
padding: 0px; | |
margin: 0px; | |
height: 24px; | |
width: auto; | |
} | |
#headimg{ | |
margin: 0px; | |
padding: 0px; | |
width: 24px; | |
height: 24px; | |
float: left; | |
} | |
#conf{ | |
margin: 0px; | |
padding: 0px; | |
width: 24px; | |
height: 24px; | |
float: left; | |
} | |
#posttwitter{ | |
margin: 0px; | |
padding: 0px; | |
height: 25px; | |
width: auto; | |
} | |
#postform{ | |
margin: 0px; | |
padding: 0px; | |
float: left; | |
} | |
#listbox{ | |
padding: 0px; | |
margin: 0px; | |
width: auto; | |
height: auto; | |
border: 2px solid red; | |
} | |
.list{ | |
padding: 0px; | |
margin: 0px; | |
width: 250px; | |
height: auto; | |
float: left; | |
background-color: #dddddd; | |
} | |
#button{ | |
float: right; | |
} | |
.tweet{ | |
border-bottom: solid 1px black; | |
border-right: solid 1px black; | |
} | |
.tweet:hover{ | |
background-color: #F00; | |
} | |
.time{ | |
margin-left: 4px; | |
color: #00F; | |
} | |
.time a{ | |
margin-left: 4px; | |
color: #00F; | |
font-size 80%; | |
} | |
.time:visited{ | |
color: #F00; | |
} | |
.name{ | |
margin-right: 4px; | |
padding: 0px; | |
} | |
</style> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#header{ | |
padding: 0px; | |
margin: 0px; | |
height: 24px; | |
width: auto; | |
} | |
#headimg{ | |
margin: 0px; | |
padding: 0px; | |
width: 24px; | |
height: 24px; | |
float: left; | |
} | |
#conf{ | |
margin: 0px; | |
padding: 0px; | |
width: 24px; | |
height: 24px; | |
float: left; | |
} | |
#posttwitter{ | |
margin: 0px; | |
padding: 0px; | |
height: 25px; | |
width: auto; | |
} | |
#postform{ | |
margin: 0px; | |
padding: 0px; | |
float: left; | |
} | |
#listbox{ | |
padding: 0px; | |
margin: 0px; | |
width: auto; | |
height: auto; | |
border: 2px solid red; | |
} | |
.list{ | |
padding: 0px; | |
margin: 0px; | |
width: 250px; | |
height: auto; | |
float: left; | |
background-color: #dddddd; | |
} | |
#button{ | |
float: right; | |
} | |
.tweet{ | |
border-bottom: solid 1px black; | |
border-right: solid 1px black; | |
} | |
.tweet:hover{ | |
background-color: #F00; | |
} | |
.time{ | |
margin-left: 4px; | |
color: #00F; | |
} | |
.time a{ | |
margin-left: 4px; | |
color: #00F; | |
font-size 80%; | |
} | |
.time:visited{ | |
color: #F00; | |
} | |
.name{ | |
margin-right: 4px; | |
padding: 0px; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var lib = (function(){ | |
var TwitterModel = function(url, apiUrl){ | |
return { | |
url: url, | |
apiUrl: apiUrl | |
}; | |
}; | |
var DateModel = function(){ | |
return { | |
getDate: function(){ | |
return new Date() | |
}, | |
getTimeFormat: function(d){ | |
var year = d.getFullYear() | |
var month = d.getMonth()+1; | |
var day = d.getDate(); | |
var hour = d.getHours(); | |
var min = ("0"+d.getMinutes()).slice(-2) | |
var sec = ('0'+d.getSeconds()).slice(-2); | |
return year + "/" + month + "/" + day + " " + hour + ":" + min + sec; | |
} | |
}; | |
} | |
var DateViewModel = function(expr){ //expr = "date" | |
return { | |
setDateData: function(date){ | |
document.getElementById(epr).textContent = date; | |
} | |
}; | |
} | |
var ApiViewModel = function(expr, apim){ | |
return { | |
loadJSON: function(url){ | |
var script = document.createElement(expr); | |
script.src = url; | |
script.type = "text/javascript"; | |
script.charset = "UTF-8"; | |
document.body.appendChild(script); | |
}, | |
bindAPI: function(user, name, cbname){ | |
var url = apim.apiUrl + "lists/statuses.json"; | |
var params = [["callback", cbname], | |
["slug", name], | |
["owner_screen_name", user], | |
["include_entities", true]]; | |
var string = ""; | |
for(var i=0, j=params.length; i<j; i++){ | |
string += "&"+params[i][0]+"="+params[i][1]; | |
} | |
this.loadJSON(url + "?" + string); | |
} | |
}; | |
}; | |
var MainViewModel = function(mainm, apim){ | |
return { | |
createTweetDiv: function(arg, listId){ | |
var tweetdiv = document.createElement('div'); | |
tweetdiv.id = arg.id; | |
tweetdiv.className = "tweet"; | |
document.getElementById("li" + listId).appendChild(tweetdiv); | |
tweetdiv.appendChild(this.createA(arg)); | |
tweetdiv.appendChild(this.createUserURL(arg)); | |
tweetdiv.appendChild(this.createText(arg, apim.url)); | |
tweetdiv.appendChild(this.createTimeLink(arg, apim.url)); | |
}, | |
createA: function(arg){ // | |
var a = document.createElement("a"); | |
if (a.href == null){ | |
a.href = ""; | |
} | |
a.appendChild(this.createImage(arg)); | |
return a; | |
}, | |
createImage: function(arg){ | |
var img = document.createElement('img'); | |
img.src = arg.user.profile_image_url; | |
img.alt = arg.user.screen_name; | |
img.height = 28; | |
img.width = 28; | |
return img | |
}, | |
createUserURL: function(arg){ | |
var userurl = document.createElement('a'); | |
// | |
var twitterurl = mainm.url | |
userurl.href = twitterurl + arg.user.screen_name; | |
userurl.className = "name"; | |
return userurl; | |
}, | |
getUserName: function(arg){ | |
var screenname = arg.user.screen_name; | |
var name = arg.user.name; | |
var username; | |
if (screenname == name) { | |
return screenname; | |
} | |
else { | |
return screenname +"(" + name + ")"; | |
} | |
}, | |
createText: function(arg, twitterurl){ | |
var textdiv = document.createElement('div'); | |
var text = arg.text; | |
text = text.replace(/(https?:\/\/[\w\.\,\-\+\?\/\%=\&#\!]+)/ig , '<a href="$1">$1</a>');//URL | |
if (arg.entities.urls[0]){ | |
text = text.replace(/(https?:\/\/[\w\.\,\-\+\?\/\%=\&#\!]+)/ig, arg.entities.urls[0].expanded_url); | |
} | |
text = text.replace(/@([\a-zA-Z0-9_]+)/g , '<a href='+ twitterurl +'$1>@$1</a>');//@user | |
text = text.replace(/#([\w一-龠ぁ-んァ-ヴー]+)/g , '<a href="http://twitter.com/search/$1">#$1</a>');//hashtag | |
if (text.match(/shindanmaker/)){ | |
text = 'ちくわ。'; | |
} | |
if (text.match(/#[一-龠ぁ-んァ-ヴー0-9]{10,}/)){ | |
text = 'ちくわぶ。'; | |
} | |
textdiv.innerHTML = text; | |
textdiv.className = "tweettext" | |
return textdiv; | |
}, | |
createTimeLink: function(arg, twitterurl){ | |
var timelink = document.createElement('a'); | |
timelink.href = twitterurl + arg.user.screen_name + "/status/" + arg.id_str; | |
var d = new Date(arg.created_at); | |
var time = d.getFullYear() + '/' + (d.getMonth()+1) + '/' + d.getDate() + | |
' ' + d.getHours() + ':' +('0'+d.getMinutes()).slice(-2); | |
time = document.createTextNode(time); | |
time.className = "time"; | |
return timelink; | |
}, | |
callBack: function(args){ | |
mainm.incId(); | |
for (var i=0, j=args.length; i<j; i++){ | |
this.createTweetDiv(args[i], mainm.getListId()); | |
} | |
} | |
}; | |
}; | |
var MainModel = function(){ | |
var listId = 0; | |
return { | |
incId: function(){ | |
listId++; | |
}, | |
getListId: function(){ | |
return listId; | |
} | |
} | |
}; | |
return{ | |
DateModel: DateModel, | |
TwitterModel: TwitterModel, | |
ApiViewModel: ApiViewModel, | |
MainModel: MainModel, | |
MainViewModel: MainViewModel, | |
}; | |
})() |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
時刻の更新の機能外れてるww