examples/rails_app-2.3.4/app/views/files/new.html.erb

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   3 <!-- example taken from git://github.com/drogus/jquery-upload-progress -->
   4 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
   5         <head>
   6                 <title>ajaxFileUpload</title>
   7             <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   8                 <script src="/javascripts/jquery.js"></script>
   9                 <script src="/javascripts/jquery.uploadProgress.js"></script>
  10                 <script type="text/javascript">
  11                         $(function() {
  12                                 $('form').uploadProgress({
  13                                         /* scripts locations for safari */
  14                                         jqueryPath: "/javascripts/jquery.js",
  15                                         uploadProgressPath: "/javascripts/jquery.uploadProgress.js",
  16                                         start:function(){},
  17                                         uploading: function(upload) {$('#percents').html(upload.percents+'%');},
  18                                         interval: 500
  19                             });
  20                         });
  21                 </script>
  22                 <style type="text/css">
  23                         .bar {
  24                           width: 300px;
  25                         }
  26
  27                         #progress {
  28                           background: #eee;
  29                           border: 1px solid #222;
  30                           margin-top: 20px;
  31                         }
  32                         #progressbar {
  33                           width: 0px;
  34                           height: 24px;
  35                           background: #333;
  36                         }
  37                 </style>
  38         </head>
  39
  40         <body>
  41     <% if flash[:notice] %>
  42     <h1><%= flash[:notice] %></h1>
  43     <% end %>
  44 <p>
  45   This is a demo of <a href="http://upr.bogomips.org/">upr</a> in action.
  46   Much of this (including all JS) was stolen from the
  47   <a href="http://github.com/drogus/jquery-upload-progress"
  48   >jQuery-upload-progress</a>
  49 </p>
  50 <p>
  51   Also, see the <a href="/">mongrel_upload_progress-compatible</a> version
  52 </p>
  53 <p>
  54   Last but not least, check out the <a href="/files/pull">Ajax.Pull</a>
  55   example that uses a single, streaming HTTP response to interatively
  56   send progress updates.
  57 </p>
  58
  59           <form id="upload" enctype="multipart/form-data" action="/files/new" method="post">
  60         <input name="data" type="file"/>
  61         <input type="submit" value="Upload"/>
  62       </form>
  63
  64             <div id="uploading">
  65               <div id="progress" class="bar">
  66                 <div id="progressbar">&nbsp;</div>
  67               </div>
  68             </div>
  69                 <div id="percents"></div>
  70         </body>
  71 </html>