| 1 | package App::Mobirc::Web::Template::Mobile; |
|---|
| 2 | use strict; |
|---|
| 3 | use warnings; |
|---|
| 4 | use base qw(Template::Declare); |
|---|
| 5 | use Template::Declare::Tags; |
|---|
| 6 | use Params::Validate ':all'; |
|---|
| 7 | use List::Util qw/first/; |
|---|
| 8 | use HTML::Entities qw/encode_entities/; |
|---|
| 9 | use URI::Escape qw/uri_escape_utf8/; |
|---|
| 10 | use HTTP::MobileAgent::Plugin::Charset; |
|---|
| 11 | |
|---|
| 12 | template 'mobile/wrapper_mobile' => sub { |
|---|
| 13 | my ($self, $mobile_agent, $code, $subtitle) = @_; |
|---|
| 14 | my $encoding = $mobile_agent->can_display_utf8 ? 'UTF-8' : 'Shift_JIS'; |
|---|
| 15 | outs_raw qq{<?xml version=" 1.0 " encoding="$encoding"?>}; |
|---|
| 16 | html { attr { 'lang' => 'ja', 'xml:lang' => 'ja', xmlns => 'http://www.w3.org/1999/xhtml' } |
|---|
| 17 | head { |
|---|
| 18 | meta { attr { 'http-equiv' => 'Content-Type', 'content' => "text/html; charset=$encoding" } } |
|---|
| 19 | meta { attr { 'http-equiv' => 'Cache-Control', content => 'max-age=0' } } |
|---|
| 20 | meta { attr { name => 'robots', content => 'noindex, nofollow' } } |
|---|
| 21 | link { attr { rel => 'stylesheet', href => '/static/mobirc.css', type=> "text/css"} }; |
|---|
| 22 | link { attr { rel => 'stylesheet', href => '/static/mobile.css', type=> "text/css"} }; |
|---|
| 23 | if ($mobile_agent->user_agent =~ /(?:iPod|iPhone)/) { |
|---|
| 24 | meta { attr { name => 'viewport', content => 'width=device-width' } } |
|---|
| 25 | meta { attr { name => 'viewport', content => 'initial-scale=1.0, user-scalable=yes' } } |
|---|
| 26 | } |
|---|
| 27 | title { |
|---|
| 28 | my $title = $subtitle ? "$subtitle - " : ''; |
|---|
| 29 | $title .= "mobirc"; |
|---|
| 30 | $title; |
|---|
| 31 | } |
|---|
| 32 | } |
|---|
| 33 | body { |
|---|
| 34 | a { name is 'top' }; |
|---|
| 35 | $code->() |
|---|
| 36 | } |
|---|
| 37 | }; |
|---|
| 38 | }; |
|---|
| 39 | |
|---|
| 40 | private template 'mobile/footer' => sub { |
|---|
| 41 | hr { }; |
|---|
| 42 | outs_raw ''; # TODO: pictogram::docomo { '8' } |
|---|
| 43 | a { attr { 'accesskey' => "8", 'href' => "/mobile/"} |
|---|
| 44 | 'back to top' |
|---|
| 45 | } |
|---|
| 46 | }; |
|---|
| 47 | |
|---|
| 48 | template 'mobile/topics' => sub { |
|---|
| 49 | my $self = shift; |
|---|
| 50 | my %args = validate( |
|---|
| 51 | @_ => { |
|---|
| 52 | mobile_agent => 1, |
|---|
| 53 | channels => 1, |
|---|
| 54 | } |
|---|
| 55 | ); |
|---|
| 56 | |
|---|
| 57 | show 'wrapper_mobile', $args{mobile_agent}, sub { |
|---|
| 58 | for my $channel ( @{ $args{channels} } ) { |
|---|
| 59 | div { attr { class => 'OneTopic' } |
|---|
| 60 | |
|---|
| 61 | a { attr { href => sprintf('/mobile/channel?channel=', uri_escape_utf8($channel->name)) } |
|---|
| 62 | $channel->name; |
|---|
| 63 | } br { } |
|---|
| 64 | |
|---|
| 65 | span { $channel->topic } br { } |
|---|
| 66 | } |
|---|
| 67 | } |
|---|
| 68 | |
|---|
| 69 | show 'footer'; |
|---|
| 70 | }, 'topics'; |
|---|
| 71 | }; |
|---|
| 72 | |
|---|
| 73 | template 'mobile/keyword' => sub { |
|---|
| 74 | my $self = shift; |
|---|
| 75 | my %args = validate( |
|---|
| 76 | @_ => { |
|---|
| 77 | mobile_agent => 1, |
|---|
| 78 | rows => 1, |
|---|
| 79 | irc_nick => 1, |
|---|
| 80 | } |
|---|
| 81 | ); |
|---|
| 82 | |
|---|
| 83 | show 'wrapper_mobile', $args{mobile_agent}, sub { |
|---|
| 84 | a { attr { name => "1" } } |
|---|
| 85 | a { attr { accesskey => '7', href => '#1' } }; |
|---|
| 86 | |
|---|
| 87 | div { attr { class => 'ttlLv1' } 'keyword' }; |
|---|
| 88 | |
|---|
| 89 | for my $row ( @{$args{rows}} ) { |
|---|
| 90 | show '../keyword_line', $row, $args{irc_nick}; |
|---|
| 91 | } |
|---|
| 92 | |
|---|
| 93 | show 'footer'; |
|---|
| 94 | }, 'keyword'; |
|---|
| 95 | }; |
|---|
| 96 | |
|---|
| 97 | template 'mobile/top' => sub { |
|---|
| 98 | my $self = shift; |
|---|
| 99 | my %args = validate( |
|---|
| 100 | @_ => { |
|---|
| 101 | exists_recent_entries => 1, |
|---|
| 102 | keyword_recent_num => 1, |
|---|
| 103 | channels => 1, |
|---|
| 104 | mobile_agent => 1, |
|---|
| 105 | } |
|---|
| 106 | ); |
|---|
| 107 | |
|---|
| 108 | show 'wrapper_mobile', $args{mobile_agent}, sub { |
|---|
| 109 | if ($args{keyword_recent_num} > 0) { |
|---|
| 110 | div { |
|---|
| 111 | class is 'keyword_recent_notice'; |
|---|
| 112 | a { |
|---|
| 113 | href is '/mobile/keyword?recent_mode=on'; |
|---|
| 114 | "Keyword($args{keyword_recent_num})" |
|---|
| 115 | } |
|---|
| 116 | }; |
|---|
| 117 | } |
|---|
| 118 | |
|---|
| 119 | for my $channel (@{$args{channels}}) { |
|---|
| 120 | outs_raw ''; |
|---|
| 121 | a { |
|---|
| 122 | href is ('/mobile/channel?channel=' . uri_escape_utf8($channel->name)); |
|---|
| 123 | $channel->name |
|---|
| 124 | }; |
|---|
| 125 | if ($channel->unread_lines) { |
|---|
| 126 | a { |
|---|
| 127 | href is ('/mobile/channel?recent_mode=on&channel=' . uri_escape_utf8($channel->name)); |
|---|
| 128 | $channel->unread_lines |
|---|
| 129 | } |
|---|
| 130 | } |
|---|
| 131 | br { }; |
|---|
| 132 | } |
|---|
| 133 | hr { }; |
|---|
| 134 | show 'menu' => ( |
|---|
| 135 | exists_recent_entries => $args{exists_recent_entries} |
|---|
| 136 | ); |
|---|
| 137 | hr { }; |
|---|
| 138 | show '../parts/version_info' |
|---|
| 139 | }; |
|---|
| 140 | }; |
|---|
| 141 | |
|---|
| 142 | template 'mobile/recent' => sub { |
|---|
| 143 | my $self = shift; |
|---|
| 144 | my %args = validate( |
|---|
| 145 | @_ => { |
|---|
| 146 | channel => 1, |
|---|
| 147 | has_next_page => 1, |
|---|
| 148 | irc_nick => 1, |
|---|
| 149 | mobile_agent => 1, |
|---|
| 150 | } |
|---|
| 151 | ); |
|---|
| 152 | my $channel = $args{channel} or die 'missing channel'; |
|---|
| 153 | |
|---|
| 154 | show 'wrapper_mobile', $args{mobile_agent}, sub { |
|---|
| 155 | div { |
|---|
| 156 | class is 'ChannelHeader'; |
|---|
| 157 | a { |
|---|
| 158 | class is 'ChannelName'; |
|---|
| 159 | $channel->name; |
|---|
| 160 | }; |
|---|
| 161 | a { |
|---|
| 162 | href is '/mobile/channel?channel=' . uri_escape_utf8($channel->name); |
|---|
| 163 | 'more...'; |
|---|
| 164 | }; |
|---|
| 165 | }; |
|---|
| 166 | |
|---|
| 167 | for my $message (@{$channel->recent_log}) { |
|---|
| 168 | show '../irc_message', $message, $args{irc_nick}; |
|---|
| 169 | br { }; |
|---|
| 170 | } |
|---|
| 171 | |
|---|
| 172 | if ($args{has_next_page}) { |
|---|
| 173 | outs_raw ''; |
|---|
| 174 | a { |
|---|
| 175 | href is '/mobile/recent'; |
|---|
| 176 | accesskey is '6'; |
|---|
| 177 | 'next'; |
|---|
| 178 | } |
|---|
| 179 | } |
|---|
| 180 | |
|---|
| 181 | hr { }; |
|---|
| 182 | |
|---|
| 183 | show 'go_to_top'; |
|---|
| 184 | }; |
|---|
| 185 | }; |
|---|
| 186 | |
|---|
| 187 | private template 'mobile/go_to_top' => sub { |
|---|
| 188 | div { |
|---|
| 189 | class is 'GoToTop'; |
|---|
| 190 | outs_raw ''; |
|---|
| 191 | a { |
|---|
| 192 | accesskey is "8"; |
|---|
| 193 | href is "/mobile/"; |
|---|
| 194 | 'ch list' |
|---|
| 195 | }; |
|---|
| 196 | }; |
|---|
| 197 | }; |
|---|
| 198 | |
|---|
| 199 | private template 'mobile/menu' => sub { |
|---|
| 200 | my $self = shift; |
|---|
| 201 | my %args = validate( |
|---|
| 202 | @_ => { |
|---|
| 203 | exists_recent_entries => 1, |
|---|
| 204 | }, |
|---|
| 205 | ); |
|---|
| 206 | |
|---|
| 207 | outs_raw ''; |
|---|
| 208 | a { attr { href => '/mobile/#top', accesskey => 0 } |
|---|
| 209 | 'refresh list' |
|---|
| 210 | }; |
|---|
| 211 | br { }; |
|---|
| 212 | |
|---|
| 213 | if ($args{exists_recent_entries}) { |
|---|
| 214 | span { '*' } |
|---|
| 215 | a { attr { href => '/mobile/recent', accesskey => '*' } |
|---|
| 216 | 'recent' |
|---|
| 217 | } |
|---|
| 218 | br { } |
|---|
| 219 | } |
|---|
| 220 | a { attr { href => '/mobile/topics', accesskey => '#' } |
|---|
| 221 | 'topics' |
|---|
| 222 | } |
|---|
| 223 | br { }; |
|---|
| 224 | |
|---|
| 225 | a { attr { 'href' => '/mobile/keyword' } |
|---|
| 226 | 'keyword' |
|---|
| 227 | }; |
|---|
| 228 | br { }; |
|---|
| 229 | |
|---|
| 230 | outs_raw ''; |
|---|
| 231 | a { |
|---|
| 232 | attr { href => '/mobile/clear_all_unread', accesskey => '9' } |
|---|
| 233 | 'clear_all_unread' |
|---|
| 234 | } |
|---|
| 235 | br { }; |
|---|
| 236 | |
|---|
| 237 | }; |
|---|
| 238 | |
|---|
| 239 | template 'mobile/channel' => sub { |
|---|
| 240 | my $self = shift; |
|---|
| 241 | my %args = validate( |
|---|
| 242 | @_ => { |
|---|
| 243 | mobile_agent => 1, |
|---|
| 244 | channel => 1, |
|---|
| 245 | channel_page_option => 1, |
|---|
| 246 | irc_nick => 1, |
|---|
| 247 | recent_mode => 1, |
|---|
| 248 | message => 1, |
|---|
| 249 | } |
|---|
| 250 | ); |
|---|
| 251 | my $channel = $args{channel}; |
|---|
| 252 | |
|---|
| 253 | show 'wrapper_mobile', $args{mobile_agent}, sub { |
|---|
| 254 | form { |
|---|
| 255 | attr { action => '/mobile/channel?channel=' . uri_escape_utf8($channel->name), method => 'post' }; |
|---|
| 256 | input { |
|---|
| 257 | unless ($args{mobile_agent}->is_non_mobile) { |
|---|
| 258 | size is 10; |
|---|
| 259 | } |
|---|
| 260 | if ($args{message}) { |
|---|
| 261 | value is $args{message}; |
|---|
| 262 | } |
|---|
| 263 | type is 'text'; |
|---|
| 264 | name is 'msg'; |
|---|
| 265 | }; |
|---|
| 266 | input { attr { type => "submit", accesskey => "1", value => "OK", } }; |
|---|
| 267 | }; |
|---|
| 268 | |
|---|
| 269 | for my $html (@{$args{channel_page_option}}) { |
|---|
| 270 | outs_raw $html; |
|---|
| 271 | } |
|---|
| 272 | br { }; |
|---|
| 273 | |
|---|
| 274 | if ($channel) { |
|---|
| 275 | if (@{$channel->message_log} > 0) { |
|---|
| 276 | if ($args{recent_mode}) { |
|---|
| 277 | for my $message (reverse $channel->recent_log) { |
|---|
| 278 | show '../irc_message', $message, $args{irc_nick}; |
|---|
| 279 | br { }; |
|---|
| 280 | } |
|---|
| 281 | hr { }; |
|---|
| 282 | outs_raw ''; |
|---|
| 283 | a { |
|---|
| 284 | attr { 'accesskey' => 5, href => '/mobile/channel?channel=' . uri_escape_utf8($channel->name) }; |
|---|
| 285 | 'more' |
|---|
| 286 | }; |
|---|
| 287 | } else { |
|---|
| 288 | for my $message (reverse $channel->message_log) { |
|---|
| 289 | show '../irc_message', $message, $args{irc_nick}; |
|---|
| 290 | br { }; |
|---|
| 291 | } |
|---|
| 292 | } |
|---|
| 293 | } else { |
|---|
| 294 | p { 'no message here yet' }; |
|---|
| 295 | } |
|---|
| 296 | } else { |
|---|
| 297 | p { 'no such channel.' }; |
|---|
| 298 | } |
|---|
| 299 | |
|---|
| 300 | hr { }; |
|---|
| 301 | |
|---|
| 302 | show 'go_to_top'; |
|---|
| 303 | } |
|---|
| 304 | }; |
|---|
| 305 | |
|---|
| 306 | 1; |
|---|