Tuesday, May 05, 2009

Post.rb

付箋アプリで行き詰まってる
  • RESTのDelete methodを発行するHTMLのdomがよくわからない。input type='hidden' name='_method'とかするようだけど、Sinatraではそんなこと必要ないって書いてある。
  • Sinatraでlink_toとかどうすればいいのか
要するにやりたいことは付箋をドロップしてDBから削除したいだけ

現行では頁を遷移させて削除してる
これをAJAX+Dropのアクションとして書くにはどうすれば?


   1  require "rubygems"

   2  require "sinatra"

   3  require "dm-core"

   4  require "dm-validations"

   5  require "dm-timestamps"

   6  

   7  DataMapper.setup(:default, ENV['DATABASE_URL'] || "sqlite3://#{Dir.pwd}/post.sqlite3")

   8  

   9  class Post

  10    include DataMapper::Resource

  11    property :id, Integer, :serial => true

  12    property :body, String, :length => 1..200

  13    property :created_at, DateTime

  14  end

  15  

  16  DataMapper.auto_upgrade!

  17  

  18  get '/' do

  19    @posts = Post.all

  20    erb :index

  21  end

  22  

  23  post '/' do

  24    @post = Post.new(:body => params[:post_body])

  25    if @post.save

  26      redirect "/"

  27    else

  28      redirect '/'

  29    end

  30  end

  31  

  32  get '/:id' do |id|

  33    @post = Post.get(id)

  34    if @post

  35      erb :show, :layout => false

  36    else

  37      redirect '/'

  38    end

  39  end

  40  

  41  delete '/:id' do |id|

  42    @post = Post.get(id)

  43    if @post.destroy

  44      redirect '/'

  45    else

  46      redirect '/#{id}'

  47    end

  48  end

  49  

  50  __END__

  51  @@layout

  52  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

  53    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  54  <html>

  55    <head>

  56      <meta http-equiv="Content-type" content="text/html; charset=utf-8">

  57      <title>Post Me</title>

  58      <style type="text/css" media="screen">

  59        body { background:#eed;}

  60        #input { float:left;}

  61        .draggable { width:150px; height:80px; position:absolute; padding:3px 3px 3px 3px; color:#fff;}

  62        #droppable { float:right; width:200px; height:120px; background:#999;}

  63        #drop_text { color:#fff; padding:35px 83px;}

  64        a#link_to_each { text-decoration:none;}

  65      </style>

  66      <script type="text/javascript" src="javascripts/jquery-1.3.2.min.js"></script>

  67  <script type="text/javascript" src="javascripts/jquery-ui-1.7.1.custom.min.js"></script>

  68  <script type="text/javascript" charset="utf-8">

  69  $(function() {

  70  $(".draggable").draggable({ });

  71  $("#droppable").droppable({

  72      drop: function(event, ui) { $(ui.draggable).remove(); }

  73  });

  74          $("#p_<%= @posts.last.id %>").effect("shake", { times: 4 }, 100)

  75  });

  76  </script>

  77      

  78    </head>

  79    <body>

  80      <%= yield %>

  81    </body>

  82  </html>

  83  

  84  @@index

  85  <div id="input">

  86    <form action="/" method="POST" accept-charset="utf-8">

  87      <textarea name="post_body" rows="6" cols="25"></textarea><br/>

  88      <p><input type="submit" value="Save"></p>

  89    </form>

  90  </div>

  91  <div id="droppable">

  92    <p id='drop_text'>Trash</p>

  93  </div>

  94  

  95  <div id="area">

  96    <% @posts.each do |entry| %>

  97    <div id="p_<%= entry.id %>" class='draggable' style="top:<%= 150+rand(20)*25 %>px; left:<%= 50+rand(40)*20 %>px; background:#<%= 500+rand(299) %>;">

  98      <a id='link_to_each' href="/<%= entry.id %>">â– </a><%= entry.body.gsub(/\n/, "<br/>") %>

  99    </div>

 100    <% end %>

 101  </div>

 102  

 103  @@show

 104  <div id="show">

 105    <p id='id'><%= @post.id %></p>

 106    <p id='body'><%= @post.body %></p>

 107    <p id='time'><%= @post.created_at %></p>

 108  </div>

 109  <div id="delete">

 110    <form action="/<%= @post.id %>" method="post" accept-charset="utf-8">

 111      <input type="hidden" name="_method" value="delete">

 112  

 113      <p><input type="submit" value="Delete"></p>

 114    </form>

 115  </div>

No comments: