2011-07-31

targetを使う

CSS

こんな面白いCSSの使い方をしている方がいたのですが、
HPが崩れていたので消される前にメモしておきました。

<p id="menu">
<a id="menu1" href="#text1">テキスト1</a>
<a id="menu2" href="#text2">テキスト2</a>
<a id="menu3" href="#text3">テキスト3</a>
<a id="menu4" href="#text4">テキスト4</a>
<a id="menu5" href="#text5">テキスト5</a>
</p>
<div id="text1">
<h2>テキスト1</h2>
<p> テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。</p>
</div>
<div id="text2">
<h2>テキスト1</h2>
<p> テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。</p>
</div>
<div id="text3">
<h2>テキスト1</h2>
<p> テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。</p>
</div>
<div id="text4">
<h2>テキスト1</h2>
<p> テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。</p>
</div>
<div id="text5">
<h2>テキスト1</h2>
<p> テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。テキスト1の本文です。</p>
</div>

参考文献のサンプルhttp://builder.japan.zdnet.com/story_media/20387833/samp_target.html
参考文献http://builder.japan.zdnet.com/html-css/20387833/

2011-07-31

ガラケーまとめ

ガラケー

●ページ内リンク

<a name="xxx"></a>

ドコモのサイトの場合うまくいかないので

<a id="xxx"></a>

に変更したらうまくいった
参考文献
http://muneto.murakami.biz/mobilesite/%E3%80%90%E6%90%BA%E5%B8%AF%E3%82%B5%E3%82%A4%E3%83%88%E5%88%B6%E4%BD%9C%E3%80%91docomoxhtml%E3%83%9A%E3%83%BC%E3%82%B8%E5%86%85%E3%83%AA%E3%83%B3%E3%82%AF.php
●アクセスキー

<a href="***" accesskey="1">リンク先</a>

●フォーム入力の文字種

<input name="E-mail" type="text" istyle="3" format="*m" mode="alphabet"
 style="-wap-input-format:&quot;*&lt;ja:en&gt;&quot;;" />

docomo(istyle)----------
istyle="1"
全角かなモード
istyle="2"
半角カナモード
istyle="3"
半角英字モード
istyle="4"
半角数字モード
Ezweb(format)-------------
format="*A"
半角英字（大文字）モード
format="*a"
半角英字（小文字）モード
format="*N"
半角数字モード
format="*X"
半角英数（大文字）モード
format="*x"
半角英数（小文字）モード
format="*M"
全角かなモード
format="*m"
全角英字モード
softbank(mode)-------------
mode="hiragana"
全角かなモード
mode="katakana"
全角カナモード
mode="alphabet"
半角英字モード
mode="numeric"
半角数字モード

2011-07-31

type属性でiphoneのキーボードを切り替える

スマホ

HTML5のinput要素のtype属性が以下の場合でどう表示される。
環境はiPhone4(iOS4.0)でiPhone3G(OS3.1.2)の結果

<input type="text">

<input type="search">

<input type="email">

<input type="url">

<input type="number">

<input type="password">

<input type="tel">

前回のプロジェクトで参考になったため忘れない為にメモします
参考文献http://blog.fonland.net/2009/12/input-type-iphone.html

2011-05-11

Ruby on Rails3ちょっとしたメモ

Ruby on Rails

これからたくさんRails3を学んでいくのでちょくちょくメモを取っておく

モデルなどによく見る
has_many :users, :through => :time_user_links
などは
●has_manyはusersをたくさん持っているという意味
●throughはこの場合ならusersをtime_user_linksにスルーする、繋げるとう意味（スルーパス）
また
belongs_to :time
belongs_to :user
などは
●belongs_toが属すると言う意味でtimeとuserがそのモデルに属するという意味

あと「はじめるRails3」の第2巻が出る様だ。またこれで一歩前進できる！！
http://www.oiax.jp/rails/zakkan/hajimeru_rails_3_2b.html

2011-05-11

Ruby on Rails３でファイルを直接アップロード

Ruby on Rails

今回はファイルのアップロードですが、データベースにではなく直接ファイルを流します。
そのため管理者であるということを条件として作成していきます。
ですのでadministratorは管理者であるという意味です。
そしてadministrator内にfileを作成し、その中にnew.html.erbとdone.html.erbを作成します。

まずはroutes.rbの作成です。管理者になっている（ログインしている）という意味のcollection
にget内にdoneとnewを追加します。
今回使うファイルはdone.html.erbとnew.html.erbだけなのでこれだけです。

new自体はお決まりのindex,new,show,edit,createの中に入っているので指定する必要はないのですが、indexがないためnewに直接飛ばすという意味で指定しました。

resources :files do
   get :done, :new, :on => :collection
end

次にコントローラーです。見た感じcreateしか指定していません。doneとnewは空で結構です。
●まずupload = params[:upload_image]でパラメーターを指定します。
●次にunless params[:upload_image].blank?でパラメーターが空でないか調べます
●そして@filename = save_image_file(upload)と@filename = save_file(upload)は@filenameに
情報を入れています。save_image_fileもsave_fileもモデルなどで作ります。（今回はpravate指定のコントローラー内で作成）
●render :action => :doneでdoneに飛ばしています。
●flash[:warning] = 'ファイル名が空です'はunless以外の時にメッセージを出します。
●redirect_to params[:from] || :administrator_filesはメッセージ出力後redirect_toでnewに飛ばしています

class Administrator::FilesController < Administrator::Base
  def new  
  end

  def create
    unless params[:upload_image].blank?
      upload = params[:upload_image]
      @filename = save_image_file(upload)
      render :action => :done
      return
    end
    unless params[:upload_file].blank?
      upload = params[:upload_file]
      @filename = save_file(upload)
      render :action => :done
      return
    end
    flash[:warning] = 'ファイル名が空です'
    redirect_to params[:from] || :administrator_files
  end

  def done
  end

次にsave_image_fileとsave_fileを作成します。プログラムが多くなる場合モデルに書いた方がいいのですが今回はpravate指定をしてコントローラーで作成しました。

●original_filenameは送られてきたファイル情報からファイル名だけを取り出す処理です
●unless upload.original_filename.blank?はファイルが空ではないという条件
●送られるファイル情報をfilenameとする
●送られて来ているファイルの送信先をfiledirとする
●送られたファイルをjoinでファイル・パスの区切り文字を気にしないでRubyがうまくつなげる処理
●f = File.open(filepath, "wb")はファイル操作を行うという意味で"wb"はw=writeでb=バイナリを意味しその書き込み先がfilepathである
●f.write(upload.read)は中身を読みそれをファイルに書き込む作業
●save_fileもsave_image_fileも行き先が違うだけで内容は同じです

  private
  def save_image_file(upload)
    unless upload.original_filename.blank?
      filename = upload.original_filename
      filedir = "public/images/abcd_self"
      filepath = File.join(filedir,filename)

      f = File.open(filepath, "wb")
      f.write(upload.read)
      f.close

      return filename
    end
  end
  
  def save_file(upload)
    unless upload.original_filename.blank?
      filename = upload.original_filename
      filedir = "app/views/abcd/abcd_self"
      filepath = File.join(filedir,filename)

      f = File.open(filepath, "wb")
      f.write(upload.read)
      f.close

      return filename
    end
  end
end

次にようやくnewの作成です。

●<% if flash[:warning] -%><%= flash[:warning] %><% end -%>で空の時のメッセージを出します。
●<%= form_tag [ :administrator, :files ], :multipart => true do %>〜<% end %>でフォームの作成です。administrator内のfilesであるということです
●<%= file_field_tag 'upload_image' %>はファイルを参照するフィールドです
●<%= submit_tag "アップロード" %>でアップロードボタンの作成です

これでイメージ用とファイル用二つ作りました。空の場合上にメッセージも出力されます。

<h2>ファイルアップロード</h2>

<% if flash[:warning] -%>
<p id="warning"><%= flash[:warning] %></p>
<% end -%>

<%= form_tag [ :administrator, :files ], :multipart => true do  %>
  画像ファイルを選択して下さい:（*.jpg, *.gif, ...）<br/>
  <%= file_field_tag 'upload_image' %><br/>
  <%= submit_tag "アップロード" %><br/>
<% end %>
<br/>
<%= form_tag [ :administrator, :files ], :multipart => true do  %>
  テンプレートファイルを選択して下さい:（*.html.erb）<br/>
  <%= file_field_tag 'upload_file' %><br/>
  <%= submit_tag "アップロード" %><br/>
<% end %>
<br/>

最後にファイルを受け取るdoneの作成です。

●ファイル名:<%= @filename %>はコントローラーで指定した@filename = save_image_file(upload)と@filename = save_file(upload)なので、ファイル名が出力されます。
●<%= link_to 'アップロードを続ける', :administrator_files %>でnewに戻って何度もアップロードできます。

<h1>アップロードしました</h1>
ファイル名:<%= @filename %>
<br/>
<p><%= link_to 'アップロードを続ける', :administrator_files %></p>

以上でアップロードができました。

2011-05-11

Ruby on Rails3　サーバーリスタートを管理画面で行う

Ruby on Rails

今回はサーバーをリスタートしてみました。
何らかの時にサーバーをリスタートしたい時にそれが管理画面からできたら凄く便利です。
そこで前回ファイルアップロードをしたのでその中についでにリスタートボタンを追加してみました。
まずはroutes.rbの修正でrestart_serverをgetに追加します。
その後にnewに以下の様に追加します。

<%= button_to 'リスタート', {:action => :restart_server}, :method => :get %>

名前をrestart_serverにしfile_touchを行っています。
リスタートが完了したらメッセージの出力を行っています。

def restart_server
    file_touch
    flash[:warning] = 'リスタートしました'
    redirect_to params[:from] || :administrator_files
end

ここで重要なのはfilepath = "../../restart/tmp/restart.txt"です。ようはrestart.txtを書き換えればいいので、filepathで先ほどと同じように書き換えます。f=からcloseまでは前回のアップロードと同じです。これはシンボリックリンクを活用し直接書き換えている。

def file_touch
    filepath = "../../restart/tmp/restart.txt"

    f = File.open(filepath, "wb")
    f.write('')
    f.close

    return
end

リスタートできました。

2011-05-11

Ruby on Railsでsearch（検索）の作成

Ruby on Rails

今回は検索を出きるようにしてみました。
ユーザー名を検索する際に名前で検索をしてみました。
これはデータベースで全然違ってくるのでパラメーターは自由に変えてOKです
まずはパラメーターの:nameが空ではない（！＝否定）をしてします。
LIKEは等号の（＝）の代わりにLIKE演算子を使っています。
これによりワイルドカード記号（％＝ワイルドカード）を使用できるようです。
そしてif params[:name].present?で、パラメーターが空でない（present＝空ではない）となる
それ以外の時（else）は順番にデータベースのcreated_atをDESC順にならべている

def search
    if !params[:name].blank?
      @users = User.where(["name LIKE ?", "%#{params[:name]}%"]).
        page(params[:page]).per(30) if params[:name].present?
    else
      @users = User.order("created_at DESC").
        page(params[:page]).per(30)
    end
    render :action => "index"
  end

ここは問題ありません。前回同様のフォームの書き方です。
今回usersや@user、Userなど指定していないのに出てきていますが、
私は作成済みの環境でプラスしているためにこの様になってます。
usersというモデルやコントローラが存在しているためである

<%= form_tag [:search, :administrator_users ], :method => :get do %>
  <table class="list">
    <tr>
      <th style="text-align: right">ID</th>
      <td><%= text_field_tag "name", params[:name] %></td>
      <td><%= submit_tag "検索" %></td>
    </tr>
  </table>
<% end %>