app/views/reader/index.html.erb
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<base target="_blank">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<title>Fastladder</title>
<%= stylesheet_link_tag "reader" %>
<link rel="shortcut icon" href="/favicon.ico">
</head>
<body>
<!-- header -->
<div id="header" style="height:0px;display:none"></div>
<!-- /header -->
<!-- menu -->
<div id="menu" style="position:relative;width:100%;height:32px;">
<table width="100%" style="position:absolute;margin:1px 0 0 0;padding:0" cellpadding="0" cellspacing="0" border="0">
<tr>
<td nowrap style="width:260px;height:32px;padding:4px 0;margin:0;text-align:left;white-space:nowrap;" valign="top">
<div id="reader_logo">
<a href="/" target="_self"><img src="/img/logo_small.gif" border="0"></a>
</div></td>
<td valign="top" style="position:relative;padding-top:0px;padding-left:5px;vertical-align:top;" nowrap>
<div id="message_box" style="position:absolute;margin-top:4px;z-index:10"><form style="display:inline;margin:0;padding:0" onsubmit="return false">
<table cellpadding="0" cellspacing="0"><tr>
<td valign="bottom" style="padding-right:7px">
<span id="loading" onclick="show_tips()">
<img id="loadicon" src="/img/icon/loading.gif" width="19" height="19">
</span> <
</td>
<td nowrap>
<span class="alert" id="message" style="background:#fff;font-size:12px;padding:0;">
welcome
</span>
</td></tr>
</table>
</form></div>
</td>
</tr>
</table>
<table style="position:absolute;right:0;top:0;width:70%">
<tr>
<td align="right" nowrap style="padding-left:12px;padding-top:2px;vertical-align:top;">
<div id="my_menu" style="line-height:100%;padding:4px 6px 0px 0;text-align:right">
<span id="welcome">welcome <%= link_to current_member.username, user_path(current_member.username) %></span>
| <%= link_to "Settings", "#config", onclick: "init_config();return false;" %>
| <%= link_to "Mobile", "/mobile" %>
| <%= link_to "Account", account_index_path, target: "_self" %>
| <%= link_to "Sign Out", logout_path, target: "_self" %>
</div>
</td></tr>
</table>
</div>
<!-- /menu -->
<!-- control -->
<div id="control" style="height:28px;margin-left:262px;border-bottom:1px solid #ccc; margin-bottom: 2px;position:relative;background:#f1f1f1">
<div style="position:absolute;left:0px;" id="control_buttons" class="buttons">
<ul id="control_buttons_ul">
<li class="button icon" id="pin_button"
onmouseover="Control.pin_hover.call(this,event);"
onmouseout="Control.pin_mouseout.call(this,event);"
onclick="Control.pin_click.call(this,event);"
style="background-image:url('/img/icon/pin.gif')" > <span id="pin_count"></span></li>
<li class="button icon" id="keyhelp_button" onclick="Control.toggle_keyhelp()" style="background-image:url('/img/icon/key_q.gif');width:auto;padding-left:26px;"> Shortcut Keys<kbd>?</kbd></li>
<li class="button icon" id="menu_button"
style="text-align:right;width:auto;"
onselectstart="return false"
onmousedown="Control.toggle_menu.call(this,event);"
><span style="white-space:nowrap;">Others<span class="tri_icon"> </span></span>
</li>
</ul>
</div>
<span style="display:none" id="unread-item-count">[% get_unread_count %]</span>
<small id="total_unread_count" style="font-size:12px;position:absolute;right: 70px;"></small>
<div class="fontpad">
<img src="/img/icon/text_small.gif" rel="Control:font(-1)">
<img src="/img/icon/text_default.gif" rel="Control:font(0)">
<img src="/img/icon/text_big.gif" rel="Control:font(1)">
</div>
</div>
<!-- /control -->
<noscript>
<!-- This is best practice of centering -->
<center style="padding-top:1em">
To use Fastladder, enable JavaScript by changing your browser options.
</center>
</noscript>
<div id="container" style="display:none">
<div id="left_container">
<div id="left_body">
<div id="subs_tools">
<div class="toolbar" id="subs_buttons" style="padding : 6px 12px 0 12px;">
<table width="100%" height="20px"><tr>
<td width="30%">
<div onclick="Control.reload_subs()" id="reload_button" class="button" style="background-image:url('/img/icon/reload.gif')">Reload</div>
</td>
<td width="30%">
<div class="button" onclick="init_manage()" style="background-image:url('/img/icon/mylist.gif')">Edit</div></td>
<td width="30%"><div class="button" onclick="Control.show_subscribe_form()" style="background-image:url('/img/icon/add.gif')">Add</div></td>
</tr></table>
</div>
<div class="toolbar" id="subs_toolbar" style="padding-left:12px;padding-bottom:4px">
<table width="100%" height="20px"><tr>
<td width="25%" valign="bottom" >
<div class="button" id="viewmode_toggle"
onselectstart="return false"
onmousedown="ViewmodeToggle.click.call(this,event);return false"
><b id="mode_text_view" style="font-weight:normal">mode</b><span class="tri_icon"> </span>
</div>
<td width="25%" valign="bottom">
<div class="button" id="sortmode_toggle"
onmousedown="SortmodeToggle.click.call(this,event)"><b id="mode_text_sort" style="font-weight:normal">sort</b><span class="tri_icon"> </span>
</div>
<td valign="bottom">
<div class="button" id="show_all_button"
onclick="Control.toggle_show_all.call(this,event);show_all_mouseover.call(this,event);"
onmouseover="show_all_mouseover.call(this,event);"
onmouseout="show_all_mouseout.call(this,event)"
></div>
</tr></table>
</div>
<div class="toolbar" id="subs_search">
<div id="search_box_container"><img src="/img/icon/search_left.gif"><input type="text" id="finder" class="quickfind" value="" autocomplete="off"></div>
</div>
</div><!-- /subs_tools -->
<div id="subs_container">
<div id="subs_body" class="folder">
<div class="wait">loading feeds</div>
</div>
</div>
</div>
</div><!--/left_container-->
<div id="right_container" style="display:none">
<div id="buffer"></div>
<div id="right_top_navi" class="subs_navi"></div>
<div id="right_body"></div><!-- /right_body -->
<div id="right_bottom" style="clear:both">
<div id="right_bottom_navi" class="subs_navi"></div>
<div class="ads" id="ads_bottom" style="margin:30px 0;border-top:1px dotted #cacaca;line-height:16px"></div>
<br clear="all">
<div id="feed_paging" class="feed_navi">
<span id="feed_paging_prev" class="button" rel="Control:feed_page(-1)" style="padding:4px 5px 0px 5px">≪ Newer</span><span id="feed_paging_next" class="button" style="border-left:3px double #888;padding:4px 5px 0px 5px" rel="Control:feed_page(1)">Older ≫</span>
</div>
<div id="scroll_padding"></div>
</div><!-- /right_bottom -->
</div><!-- /right_container -->
</div><!-- /container -->
<div id="error_window" style="display:none">
<h2 id="error_title"></h2>
<div id="error_body"></div>
<div class="close">
<span class="button" onclick="Element.hide('error_window')">Close</span>
</div>
</div>
<div id="subscribe_window">
<div class="tabs">
<div class="tab tab-active" id="tab_add_feed" rel="tab:subscribe_window>add_feed">add feed</div>
<div class="tab tab-inactive" rel="tab:subscribe_window>import_feed">import feed</div>
</div>
<div class="body">
<div id="add_feed">
<%= form_tag '/api/feed/discover', id: 'discover_form' do %>
<b>Feed URL</b> : <input type="text" name="url" style="width:280px" id="discover_url" value="http://">
<input type="submit" value="next" style="width:90px">
<% end -%>
<div id="discover_items"></div>
<div style="float:left" class="discover_help">
<%= link_to(subscribe_index_path) do %>
<img src="/img/icon/new_window.gif" border="none">
<% end -%>
</div>
</div>
<div id="import_feed" style="display:none">
<%= form_tag import_path, multipart: true, target: '_blank' do %>
<b>file</b> : <input type="file" name="opml" style="width:230px"> <input type="submit" value=" Upload " style="width:90px">
<% end -%>
<%= form_tag import_path, multipart: true, target: '_blank' do %>
<b>OPML URL</b> : <input type="text" name="url" value="http://" style="width:280px"> <input type="submit" value=" Import from URL " style="width:90px">
<% end -%>
<div style="float:left" class="discover_help">
<%= link_to(import_path) do %>
<img src="/img/icon/new_window.gif" border="none">
<% end -%>
</div>
</div>
<div class="close">
<span class="button" onclick="Control.hide_subscribe_form()">Close</span>
</div>
</div>
</div>
<div style="display:none;position:absolute;right:79px;background:#f0f0f0;padding:5px;top:0px;font-size:12px;border:1px solid #4889fd" id="ads_top_description">[% ad.description | html %]</div>
<div id="keyhelp">
<h2>Shortcut Keys<kbd>?</kbd></h2>
<div id="keybind_table"></div>
<p class="notice">
</p>
</div>
<div id="mini_window">
<div id="mini_window_header"><span class="button" onmousedown="DOM.hide('mini_window')">x</span></div>
<div id="mini_window_container">
<div id="mini_window_body"></div>
</div>
</div>
<div id="help_window" style="position:absolute;display:none">
</div>
<div id="footer" style="height:0px;display:none;font-size:0px;margin:0;padding:0;border:none"></div>
<!-- TEMPLATE -->
<!-- not subscribed -->
<textarea class="template" id="discover_select_sub">
<div class="discover_item">
<div style="float:right" id="" class="[[ subscribed ]]">
<a href="[[feedlink]]" rel="subscribe" class="sub_button">Add</a><br>
</div>
<img src="<%= Addressable::URI.unescape(favicon_path('[[feedlink]]')) %>" width="16" height="16"> <a href="[[link]]">[[title]]</a>
| <b style="color:#717578">[[subscribers_count]]</b><span style="color:#717578"> [[users]]</span>
<br>
<small><a href="[[feedlink]]" class="feedlink">[[feedlink]]</a></small>
</div>
</textarea>
<!-- subscribed -->
<textarea class="template" id="discover_select_unsub">
<div class="discover_item">
<div style="float:right" id="" class="[[ subscribed ]]">
<a href="[[feedlink]]" rel="unsubscribe" class="unsub_button">Unsubscribe</a><br>
</div>
<img src="<%= Addressable::URI.unescape(favicon_path('[[feedlink]]')) %>" width="16" height="16"> <a href="[[link]]">[[title]]</a>
| <b style="color:#717578">[[subscribers_count]]</b><span style="color:#717578"> [[users]]</span>
<span style="color:red">[Subscribed]</span><br>
<small><a href="[[feedlink]]" class="feedlink">[[feedlink]]</a></small>
</div>
</textarea>
<textarea class="template" id="subscribe_item">
<span style="background-image:url('[[icon]]')"
id="subs_item_[[ subscribe_id ]]"
class="treeitem [[ classname ]]"
onmouseover="SubsItem.onhover.call(this,event)"
onmouseout="SubsItem.onunhover.call(this,event)"
rel="Control:read('[[ subscribe_id ]]')"
subscribe_id="[[subscribe_id]]">
[[ title ]] ([[ unread_count ]])
</span>
</textarea>
<!-- フォルダ表示モード -->
<textarea class="template" id="subscribe_folder" style="">
<span class="folderitem [[ classname ]]">[[ name ]] ([[ unread_count ]])</span>
</textarea>
<!-- channel info -->
<textarea class="template" id="inbox_feed">
<div class="channel" style="margin:0 10px;padding:0">
<h1 class="title" style="margin:2px 10px 2px 10px;padding:10px 0 8px 0">
<div>
<table style="width:98%">
<tr>
<td width="95%"><a href="[[ link ]]">[[ title ]]</a></td>
<td rowspan="2" valign="top">[[ image ]]</td>
</tr>
<tr>
<td style="padding-top:6px;"><small class="description" style="padding:0;margin:0;line-height:16px">[[ description ]]</small></td>
</tr>
</table>
</div>
</h1>
</div>
<div class="channel_toolbar" style="margin:0 10px">
<table align="right"><tr>
<td nowrap style="padding-right:10px">
<span class="channel_folder" style="background:url('/img/icon/close.gif') no-repeat;padding-left:20px"
onselectstart="return false"
onmousedown="FolderToggle.click.call(this,event);return false"
class="button move" id="folder_label">[[ folder ]] <img src="/img/icon/tri_d.gif"></span>
</td>
<td style="padding-right:15px;position:relative"><img id="rate_img" class="rate_pad" src="/img/rate/pad/[[ rate ]].gif" sid="[[subscribe_id]]" onclick="LDR.Rate.click.call(this,event)" onmouseout="LDR.Rate.out.call(this,event)" onmousemove="LDR.Rate.hover.call(this,event)"></td>
<td nowrap>
<span id="feed_prev" title="Show newer items" class="button" rel="Control:feed_page(-1)"><</span>
<span id="feed_next" title="Show older items" class="button" rel="Control:feed_page(1)">></span>
</td>
</table>
<table><tr>
<td valign="bottom" nowrap style="padding:0 6px;line-height:22px;height:22px;overflow:hidden" id="channel_info">[[ widgets ]]</td>
</tr></table>
<div style="clear:both;font-size:1px;height:1px"></div>
</div>
<div class="footer" style="position:relative;clear:both">
</div>
[[ items ]]
</textarea>
<!-- adfeeds -->
<textarea class="template" id="inbox_adfeeds">
<div class="channel" style="margin:0 10px;padding:0">
<h1 class="title" style="margin:2px 10px 2px 10px;padding:10px 0 8px 0">
<div>
<table style="width:98%">
<tr>
<td width="95%"><a href="[[ link ]]">[[ title ]]</a></td>
<td rowspan="2" valign="top">[[ image ]]</td>
</tr>
<tr>
<td style="padding-top:6px;"><small class="description" style="padding:0;margin:0;line-height:16px">[[ description ]]</small></td>
</tr>
</table>
</div>
</h1>
</div>
<div class="channel_toolbar channel_adfeeds" style="margin:0 10px">
<table><tr>
<td valign="bottom" nowrap style="padding:0 6px;line-height:22px;height:22px;overflow:hidden" id="channel_info">
これはスポンサーフィードです。あと[[ads_expire]]日で自動的に解除されます。
<a href="/subscribe/[[ feedlink ]]">このフィードを購読する</a>
</td>
</tr></table>
<div style="clear:both;font-size:1px;height:1px"></div>
</div>
<div class="footer" style="position:relative;clear:both">
</div>
[[ items ]]
</textarea>
<!-- item -->
<textarea class="template" id="inbox_items">
<div class="item [[loop_context]] [[pinned]]" id="item_[[id]]">
<div class="padding" id="item_count_[[ item_count ]]">
<div class="item_header">
<div class="item_buttons" style="float:right;padding-right:4px;padding-top:4px">
<span id="pin_[[id]]" style="display:block;width:18px;height:18px;margin-right:4px;float:left;" class="[[pin_active]]"><img onmousedown="toggle_pin([[id]])" src="/img/icon/pin.gif"></span>
<img onmousedown="Control.close_and_next_item([[id]],event)" src="/img/icon/batu.gif">
</div>
<h2 class="item_title" id="head_[[id]]" count="[[ item_count ]]">
<a href="[[ link ]]">[[ title ]]</a>
</h2>
</div>
<div class="item_info">
<a href="[[ link ]]" target="blank">Permalink</a> |
<small class="rel">[[ relative_date ]]</small>
<small class="author">[[ author ]]</small>
<small class="category">[[ category ]]</small>
<small class="enclosure">[[ enclosure ]]</small>
</div>
<div class="item_body" id="item_body_[[id]]">
<div class="body">[[ body ]]</div>
</div>
<div class="item_footer">
<div class="entry_widgets">[[ widgets ]]</div>
</div>
</div>
</div>
</textarea>
<!-- clip register -->
<textarea class="template" id="clip_register">
<div class="clip_register">
<div style="border : 3px solid #F44;padding:10px;background:#fff">
この機能を使うには「<a href="http://clip.livedoor.com/">livedoor クリップ</a>」の利用登録が必要です。
</div>
</div>
</textarea>
<!-- clip info -->
<textarea class="template" id="clip_info">
[[#{ public_clip_count ? ['<a href="', clip_page_link(link), '" target="_blank"><b>', public_clip_count, '</b> ', (public_clip_count > 1 ? 'users' : 'user'), '</a>'].join("") : "" }]] | [[#{ new DateTime(created_on * 1000).ymd_jp() + "にクリップ済み" }]]
</textarea>
<!-- clip form -->
<textarea class="template" id="clip_form">
<div class="clip_form_body">
<form id="clip_form_[[id]]" class="clip_form" target="_blank" method="post" action="/clip/add">
<div class="rate_pad_wrapper"><img id="clip_rate_[[id]]" class="rate_pad" src="/img/rate/pad/0.gif" item_id="[[id]]" onclick="ClipRate.click.call(this,event)" onmouseout="ClipRate.out.call(this,event)" onmousemove="ClipRate.hover.call(this,event)"></div>
<h3>Bookmark
<span id="clip_info_[[id]]"></span>
</h3>
<input type="hidden" name="title" value="[[title]]">
<input type="hidden" name="link" value="[[link]]">
<input type="hidden" name="rate" value="">
<input type="hidden" name="from" value="reader">
<table class="compact">
<tr>
<th width="80">Tag</th>
<td><input type="text" name="tags" value="[[tags]]" onkeypress="(event.keyCode==27)&&clip_click([[id]])" onkeyup="(event.keyCode==27)&&clip_click([[id]])"></td>
</tr>
<tr>
<th width="80">Comment</th>
<td><textarea name="notes">[[notes]]</textarea></td>
</tr>
<tr>
<th> </th>
<td style="font-size:90%">
<input type="submit" value="Bookmark" class="clip_submit">
<select name="public">
<option value="on" selected>Public</option>
<option value="off">Private</option>
</select>
</td>
</tr>
</table>
</form>
</div>
</textarea>
<textarea class="template" id="folder_item">
<span class='button flat_menu [[ checked ]]'
onmouseout='MenuItem.onunhover.call(this,event)'
onmouseover='MenuItem.onhover.call(this,event)'
onmouseup='Control.move_to("[[ move_to ]]");FlatMenu.hideAll()'
rel=''>[[ folder_name ]]</span>
</textarea>
<textarea class="template" id="pin_item">
<span class='button flat_menu pin_item [[target]]'
style="background-image:url('[[icon]]');background-repeat:no-repeat;background-position:2px 3px;"
onmouseout='PinItem.onunhover.call(this,event)'
onmouseover='PinItem.onhover.call(this,event)'
onmouseup='Control.read_pin("[[ link ]]");FlatMenu.hideAll()'
>[[ title ]]</span>
</textarea>
<textarea class="template" id="menu_item">
<span class='button flat_menu' style="background-repeat:no-repeat;background-position:2px 3px;padding-left:8px"
onmouseout='MenuItem.onunhover.call(this,event)'
onmouseover='MenuItem.onhover.call(this,event)'
onmouseup='[[action]]'
>[[ title ]]</span>
</textarea>
<textarea class="template" id="viewmode_item">
<span class='button flat_menu [[ checked ]]'
onmouseout='MenuItem.onunhover.call(this,event)'
onmouseover='MenuItem.onhover.call(this,event)'
onmouseup='Control.change_view("[[ mode ]]");FlatMenu.hideAll()'
rel=''>[[ label ]]</span>
</textarea>
<textarea class="template" id="sortmode_item">
<span class='button flat_menu [[ checked ]]'
onmouseout='MenuItem.onunhover.call(this,event)'
onmouseover='MenuItem.onhover.call(this,event)'
onmouseup='Control.change_sort("[[ mode ]]");FlatMenu.hideAll()'
rel=''>[[ label ]]</span>
</textarea>
<!-- ADS -->
<textarea class="template" id="ads_body">
<div>
[[items]]
</div>
</textarea>
<textarea class="template" id="ads_item">
</textarea>
<!-- /TEMPLATE -->
<script type="text/javascript">
var ApiKey = "<%= session[:session_id] %>";
function ads_mouseover(){
if(typeof Element == 'object'){
Element.show('ads_top_description');
setStyle('ads_top_description',{
top : $('container').offsetTop + 'px',
width : this.offsetWidth - 10 + 'px'
})
}
}
function ads_mouseout(){
if(typeof Element == 'object'){
Element.hide('ads_top_description')
}
}
</script>
<%= javascript_include_tag "reader" %>
</body>
</html>