Amazon Web Service を Ruby にて操作
「.amazonrc」の内容
Amazon Web Service(http://aws.amazon.com/)にアカウント登録すれば、key_idやsecret_key_idなどの情報を取得できます。
key_id = 'XXXXX' secret_key_id = 'XXXXX' associate = 'XXXXX' cache = false locale = 'jp' encoding = 'utf-8'
書籍検索サンプルコード
#!/usr/local/bin/ruby -Ku # -*- coding: utf-8 -*- # デフォルトだと設定ファイルは「/etc/amazonrc」「~/.amazonrc」などを読みにいく # 今回はカレントの「.amazonrc」を読みにいくよう設定 ENV['AMAZONRCDIR'] = './' ENV['AMAZONRCFILE'] = '.amazonrc' require 'amazon/aws' require 'amazon/aws/search' req = Amazon::AWS::Search::Request.new() #------------------------------------------------------------ # 色々な条件にて、ItemSearch を使用してみたよ #------------------------------------------------------------ is = Amazon::AWS::ItemSearch.new( 'Books', {'Title' => 'ruby'} ) #is = Amazon::AWS::ItemSearch.new( 'Books', {'Author' => 'るびきち'} ) #is = Amazon::AWS::ItemSearch.new( 'Books', {'Title' => '逆引き', 'Author' => 'るびきち'} ) rg = Amazon::AWS::ResponseGroup.new( 'Large' ) page = req.search( is, rg ) #------------------------------------------------------------ # 1ページ分表示 #------------------------------------------------------------ puts "search count : #{page.item_search_response.items.total_results}" page.item_search_response.items.item.each do |i| puts "title = #{i.item_attributes.title}" puts "publisher = #{i.item_attributes.publisher}" author = i.item_attributes.author author.each { |k, v| puts "author = #{k}" } if not author.nil? puts "" end #------------------------------------------------------------ # ページごと表示 #------------------------------------------------------------ total_page = page.item_search_response.items.total_pages.to_i puts "page count : #{total_page}" if total_page > 1 then page_cnt = 0 page = req.search( is, rg, total_page ) # 1〜指定ページまで読み込み page.each do |p| puts "----------------------------------------" puts "#{page_cnt+=1}ページ" puts "----------------------------------------" p.item_search_response.items.item.each do |i| i.item_attributes.to_h.each do |k, v| if Amazon::AWS::AWSArray === v puts "#{k} = #{v.join(" / ")}" if not v.nil? else puts "#{k} = #{v}" if not v.nil? end end puts "" end end end
書籍検索サンプルコード(一気に全件取得)
#!/usr/local/bin/ruby -Ku # -*- coding: utf-8 -*- #-------------------------------------------------------------------------------- # Amazon Web Service / 書籍名にて検索(全件数を一気に取得) #-------------------------------------------------------------------------------- ENV['AMAZONRCDIR'] = './' ENV['AMAZONRCFILE'] = '.amazonrc' require 'amazon/aws' require 'amazon/aws/search' req = Amazon::AWS::Search::Request.new() is = Amazon::AWS::ItemSearch.new( 'Books', {'Title' => 'ruby'} ) rg = Amazon::AWS::ResponseGroup.new( 'Large' ) page = req.search( is, rg, :ALL_PAGES) page.each do |p| p.item_search_response.items.item.each do |i| i.item_attributes.to_h.each do |k, v| if Amazon::AWS::AWSArray === v puts "#{k} = #{v.join(" / ")}" if not v.nil? else puts "#{k} = #{v}" if not v.nil? end end puts "" end end
■
チェックボックスをJavaScriptからノード追加した場合の「checked」プロパティの挙動
<問題> ノード追加する前に「checked」プロパティを指定してもIEだとチェックされない。 IEのバグのようです・・・
<script language="JavaScript" type="text/JavaScript"> <!-- function case1() { var checkEle = document.createElement("input"); checkEle.setAttribute("type", "checkbox"); checkEle.setAttribute("checked", true); document.getElementById("case1").appendChild(checkEle); } //--> </script> <div id="case1"></div>
<対応策1> createElementにて<input checked>を指定(IE限定の方法です)
<script language="JavaScript" type="text/JavaScript"> <!-- function case2() { if(navigator.userAgent.indexOf("MSIE") != -1) { checkEle = document.createElement("<input checked>"); } else { checkEle = document.createElement("input"); } checkEle.setAttribute("type", "checkbox"); checkEle.setAttribute("checked", true); document.getElementById("case2").appendChild(checkEle); } //--> </script> <div id="case2"></div>
<対応策2> ノード追加した後に「checked」プロパティを指定
<script language="JavaScript" type="text/JavaScript"> <!-- function case3() { var checkEle = document.createElement("input"); checkEle.setAttribute("type", "checkbox"); document.getElementById("case3").appendChild(checkEle); checkEle.setAttribute("checked", true); } //--> </script> <div id="case3"></div>
StyleSheetソース
#RoundBox{ width: 25em; margin: 2px 0 3px 3px; } #RoundBox .Header { font-size: 16px; color: #004040; font-weight: 600; text-align: center; border-color: #CCEEAA; border-style: solid; border-width: 0 6px 0 6px; margin: 0; padding: 6px; } #RoundBox .rb1 { margin: 0 6px; } #RoundBox .rb2 { margin: 0 4px; } #RoundBox .rb3 { margin: 0 3px; } #RoundBox .rb4 { margin: 0 2px; } #RoundBox .rb5 { margin: 0 1px; height: 2px; } .rb1, .rb2, .rb3, .rb4, .rb5{ height: 1px; overflow: hidden; background: #CCEEAA; padding: 0; }
HTMLソース
<DIV id="RoundBox"> <DIV> <DIV class="rb1"></DIV> <DIV class="rb2"></DIV> <DIV class="rb3"></DIV> <DIV class="rb4"></DIV> <DIV class="rb5"></DIV> </DIV> <DIV class="Header">角を丸くしたボックス</DIV> <DIV> <DIV class="rb5"></DIV> <DIV class="rb4"></DIV> <DIV class="rb3"></DIV> <DIV class="rb2"></DIV> <DIV class="rb1"></DIV> </DIV> </DIV>
WEBページ レイアウト
TABLE要素 ・ DIV要素
レイアウトの為にTABLE要素を使用するのは良くないと聞きます。
<反省点> TABLE要素を使って画面を一つのテーブルで囲み、レイアウト(画面構成)を行っていた。 <答え?> レイアウトはDIV要素+CSSにて行うようにする。 <反省した理由> TABLE要素の内容は、その範囲のデータ全てがダウンロードされないと、列がいくつあるか確定できない為、 ブラウザは画面表示を始められないようです。 上記理由を知り、画面を一つのTABLE要素で囲むレイアウト方法だと、難点がある事に気づきました。 ・動作が遅くなる ・全てを読み込むまで何も表示されない状態が続く ※「全てを読み込むまで何も表示されない状態が続く」対応策として、 「THEAD, TFOOT, TBODY」や、HTML4で追加された「COLGROUP, COL」を使用する。 「COLGROUP, COL」:最初にTABLEの列数と幅の情報を与える
角を丸くしたボックスを作ってみました
StyleSheetソース
/********************************************* 内容エリア *********************************************/ .body{ border-left: 1px solid #919B9C; border-right: 1px solid #919B9C; border-bottom: 1px solid #919B9C; padding: 5px; height: 100%; } /********************************************* タブエリア *********************************************/ #tabAreaPane{ width: 100%; height: 25px; margin: 0px; border-bottom: 1px solid #919B9C; } #tabAreaPane DIV{ width: 100px; height: 100%; border: 1px solid #919B9C; background-color: #FFFFFF; margin-left: 0px; margin-right: 2px; cursor: pointer; position: relative; bottom: -1px; float: left; text-align: center; } #tabAreaPane SPAN{ font-family: arial; vertical-align: top; width: 100%; line-height: 1.5em; } /********************************************* マウスが乗った時のタブ *********************************************/ #tabAreaPane .overTab{ border-top: 2px solid #FF0000; } /********************************************* マウスが離れた時のタブ *********************************************/ #tabAreaPane .outTab{ border-top: 1px solid #919B9C; } /********************************************* 指定されているタブ *********************************************/ #tabAreaPane .activeTab{ border-top: 3px solid #FF0000; border-bottom: none; }