Google 避難所名簿共有サービス　アルバム・写真リスト

tenkao

2011-03-20 22:04:56

License: MIT License

Fork: 5

Fav: 3

View: 36989

Play
Stop
Reload

Fullscreen

Smart Phone

Fork tree

Readme
JavaScript 103 lines
HTML 9 lines
CSS 57 lines

Google 避難所名簿共有サービス　アルバム・写真リスト
jQuery v1.5.1

$(function() {
  $.ajax({
    url: 'http://picasaweb.google.com/data/feed/api/user/tohoku.anpi',
    data: {
      kind: 'album',
      alt: 'json'
    },
    dataType: 'jsonp',
    jsonp: 'callback',
    beforeSend: function() {
      $('#album').html('読込み中');
    },
    success: function(data) {
      var d = data.feed.entry,
          s = '',
          c = 0,
          i;
      for (i=0; i<d.length; i++) {
        var title = d[i].title.$t;
        var count = d[i].gphoto$numphotos.$t;
        var href = d[i].link[0].href;
        var li = '<li><a href="' + href + '">' + title + '</a>［' + count + '］</li>';
        s += li;
        c += count;
      }
      $('#album').html(s);
      $('p+h2').text('アルバムリスト： ' + d.length + 'アルバム［' + c + '枚］');
    }
  });
  $('#album').find('a').live('click', function() {
    var url = $(this).attr('href'),
        title = $(this).text();
    //alert(title);
    $.ajax({
      url: url,
      dataType: 'jsonp',
      jsonp: 'callback',
      beforeSend: function() {
        $('#photo').html('読込み中');
        $('#album+h2').text('写真リスト： ' + title);
      },
      success: function(json) {
        var photos = json.feed.entry,
            i, s;
        for (i=0; i<photos.length; i++) {
          var photo = photos[i],
              caption = photo.summary.$t,
              url = photo.link[2].href,
              url_comment = photo.link[0].href,
              comment = photo.gphoto$commentCount.$t;
          if (!caption) { caption = 'キャプションなし'; }
          if (!comment) {
            comment = '<strong>0</strong>'; 
          } else if (comment === 1) {
            comment = '<strong>1</strong>';
          }
        var li = '<li data-comment="' + url_comment + '"><a href="' + url + '" target="_blank">' + caption + '</a>（' + comment + '）</li>';
          s += li;
        }
        $('#album+h2').append('［' + photos.length + '枚］');
        $('#photo').html(s);
        $(window).one('scroll', set_comment);
      },
      error: function() {
        alert('error');
      }
    });
    return false;
  });
  function set_comment() {
    $('#photo').find('li').each(function() {
      var $this = $(this),
          url = $this.attr('data-comment');
      $.getJSON(url, function(json) {
        var entry = json.feed.entry;
        if (entry) {
          var last = entry.pop(),
              comment = last.content.$t,
              re = /(pf|personal finder|personal|finder|ｐｆ)/i,
              re2 = /(開始|始め|終了|完了|終わり|終り|おわり)/i;
          if (comment.match(re2)) {
            comment = comment.replace(re2, '<em>$1</em>');
          }
          if (comment.match(re)) {
            comment = comment.replace(re, '<strong>$1</strong>');
            elem = $('<blockquote />').html(comment);
          } else { 
            elem = $('<blockquote />').addClass('none').html(comment);
          }
          $this.append(elem);
        }
      });
    });
  }
  $('#comment').click(function() {
    if ($(this).is(':checked')) {
      $('blockquote').show();
    } else {
      $('blockquote').hide();
    }
  });
});

Google 避難所名簿共有サービス　アルバム・写真リスト

Google 避難所名簿共有サービス（https://picasaweb.google.com/tohoku.anpi , http://googlejapan.blogspot.com/2011/03/blog-post_14.html）のアルバム、写真のリストをテキストで表示します。避難所の検索や名簿のテキスト化の一助になれば幸いです。$(function() { $.ajax({ url: 'http://picasaweb.google.com/data/feed/api/user/tohoku.anpi', data: { kind: 'album', alt: 'json' }, dataType: 'jsonp', jsonp: 'callback', beforeSend: function() { $('#album').html('読込み中'); }, success: function(data) { var d = data.feed.entry, s = '', c = 0, i; for (i=0; i<d.length; i++) { var title = d[i].title.$t; var count = d[i].gphoto$numphotos.$t; var href = d[i].link[0].href; var li = '<li><a href="' + href + '">' + title + '</a>［' + count + '］</li>'; s += li; c += count; } $('#album').html(s); $('p+h2').text('アルバムリスト： ' + d.length + 'アルバム［' + c + '枚］'); } }); $('#album').find('a').live('click', function() { var url = $(this).attr('href'), title = $(this).text(); //alert(title); $.ajax({ url: url, dataType: 'jsonp', jsonp: 'callback', beforeSend: function() { $('#photo').html('読込み中'); $('#album+h2').text('写真リスト： ' + title); }, success: function(json) { var photos = json.feed.entry, i, s; for (i=0; i<photos.length; i++) { var photo = photos[i], caption = photo.summary.$t, url = photo.link[2].href, url_comment = photo.link[0].href, comment = photo.gphoto$commentCount.$t; if (!caption) { caption = 'キャプションなし'; } if (!comment) { comment = '<strong>0</strong>'; } else if (comment === 1) { comment = '<strong>1</strong>'; } var li = '<li data-comment="' + url_comment + '"><a href="' + url + '" target="_blank">' + caption + '</a>（' + comment + '）</li>'; s += li; } $('#album+h2').append('［' + photos.length + '枚］'); $('#photo').html(s); $(window).one('scroll', set_comment); }, error: function() { alert('error'); } }); return false; }); function set_comment() { $('#photo').find('li').each(function() { var $this = $(this), url = $this.attr('data-comment'); $.getJSON(url, function(json) { var entry = json.feed.entry; if (entry) { var last = entry.pop(), comment = last.content.$t, re = /(pf|personal finder|personal|finder|ｐｆ)/i, re2 = /(開始|始め|終了|完了|終わり|終り|おわり)/i; if (comment.match(re2)) { comment = comment.replace(re2, '<em>$1</em>'); } if (comment.match(re)) { comment = comment.replace(re, '<strong>$1</strong>'); elem = $('<blockquote />').html(comment); } else { elem = $('<blockquote />').addClass('none').html(comment); } $this.append(elem); } }); }); } $('#comment').click(function() { if ($(this).is(':checked')) { $('blockquote').show(); } else { $('blockquote').hide(); } }); }); <h1>Google 避難所名簿共有サービスアルバム・写真リスト</h1> <p>Google 避難所名簿共有サービス（<a href="https://picasaweb.google.com/tohoku.anpi" target="_blank">https://picasaweb.google.com/tohoku.anpi</a>, <a href="http://googlejapan.blogspot.com/2011/03/blog-post_14.html" target="_blank">http://googlejapan.blogspot.com/2011/03/blog-post_14.html</a>）のアルバム、写真のリストをテキストで表示します。<br/>避難所の検索や名簿のテキスト化の一助になれば幸いです。</p> <h2>アルバムリスト</h2> <p>以下のリンクをクリックすると写真リストが表示されます。<br />［かっこ］の中は各アルバムに含まれる写真の数です。</p> <ol id='album'></ol> <h2>写真リスト</h2> <p>以下のリンクをクリックすると新規ウィンドウで写真のページを開きます。<br />（かっこ）の中は各写真についたコメントの数です。名簿をテキスト化する作業の進捗の参考にして下さい。（<strong>コメント数が 0 のものは未着手です。</strong>）<br />写真名の下にコメントの最後の1件を表示します。（読み込みに少し時間が掛かります。）</p> <div><label for="comment"><input type="checkbox" checked="checked" name="comment" id="comment"><span>コメント表示</span></label></div> <ol id='photo'></ol>body { padding-bottom: 50px; background-color: #fff; color: '#000'; line-height: 1.6; font-family: sans-serif; } h2 { margin: 2em 0 0 0; } p { margin: 0; } strong { color: #c00; font-weight: bold; } em { margin: 0 .25em; padding: 0 .25em; background: #f99; color: #000; font-weight: normal; font-style: normal; } blockquote { margin: 0 0 1.5em 0; padding: 0 0 0 .75em; text-indent: -.75em; color: #555; font-size: 90%; } blockquote.none { background: #e0e0e0; color: #000; } div { margin: 2em 0 1.5em 0; } label { padding: .5em .75em; border: 1px solid #ccc; cursor: pointer; } blockquote:before, blockquote:after { content: ' " '; }

Play on jsdo.it games
Share
Embed
QR
Tag
Download

Complete!

Description どんなゲームですか？

Control Device

	スマートフォンコントローラー jsdo.it WebSocket Controller»
	マウス
	キーボード
	タッチデバイス

Fullscreen

有効
無効

jsdo.it games から削除する Submit

style

Design view
Code view

code

<script type="text/javascript" src="http://jsdo.it/blogparts/3mjh/js?view=design"></script><p class="ttlBpJsdoit" style="width: 465px; margin: 0; text-align: right; font-size: 11px;"><a href="http://jsdo.it/tenkao/3mjh" title="Google 避難所名簿共有サービス　アルバム・写真リスト ">Google 避難所名簿共有サービス　アルバム・写真リスト  - jsdo.it - share JavaScript, HTML5 and CSS</a></p>

QR Code