upload_progress_helper.rb

用ruby on rails写的一个博客程序,还不错..ruby on rails的确是个好框架

          :id => upload_target, 
          :name => upload_target,
          :src => '',
          :style => 'width:0px;height:0px;border:0' 
        })
      end

      tag
    end

    # This method must be called by the action that receives the form post
    # with the +upload_progress+.  By default this method is rendered when
    # the controller declares that the action is the receiver of a 
    # +form_tag_with_upload_progress+ posting.
    #
    # This template will do a javascript redirect to the URL specified in +redirect_to+
    # if this method is called anywhere in the controller action.  When the action
    # performs a redirect, the +finish+ handler will not be called.
    #
    # If there are errors in the action then you should set the controller 
    # instance variable +@errors+.  The +@errors+ object will be
    # converted to a javascript array from [e-mail]_messages+ and
    # passed to the +finish+ handler of +form_tag_with_upload_progress+
    #
    # If no errors have occured, the parameter to the +finish+ handler will
    # be +undefined+.
    #
    # == Example (in view)
    #
    #  <script>
    #   function do_finish(errors) {
    #     if (errors) {
    #       alert(errors);
    #     }
    #   }
    #  </script>
    #
    #  <%= form_tag_with_upload_progress {:action => 'create'}, {finish => 'do_finish(arguments[0])'} %>
    #
    def finish_upload_status(options = {})
      # Always trigger the stop/finish callback
      js = "parent.#{upload_update_object}.stop(#{options[:client_js_argument]});\n"

      # Redirect if redirect_to was called in controller
      js << "parent.location.replace('#{escape_javascript options[:redirect_to]}');\n" unless options[:redirect_to].blank?

      # Guard against multiple triggers/redirects on back
      js = "if (parent.#{upload_update_object}) { #{js} }\n"
      
      content_tag("html", 
        content_tag("head", 
          content_tag("script", "function finish() { #{js} }", 
            {:type => "text/javascript", :language => "javascript"})) + 
        content_tag("body", '', :onload => 'finish()'))
    end

    # Renders the HTML to contain the upload progress bar above the 
    # default messages
    #
    # Use this method to display the upload status after your +form_tag_with_upload_progress+
    def upload_status_tag(content='', options={})
      upload_status_progress_bar_tag + upload_status_text_tag(content, options)
    end

    # Content helper that will create a +div+ with the proper ID and class that
    # will contain the contents returned by the +upload_status+ action.  The container
    # is defined as
    #
    #   <div id="#{status_tag_id}" class="uploadStatus"> </div>
    #
    # Style this container by selecting the +.uploadStatus+ +CSS+ class.
    #
    # The +content+ parameter will be included in the inner most +div+ when 
    # rendered.
    #
    # The +options+ will create attributes on the outer most div.  To use a different
    # +CSS+ class, pass a different class option.
    #
    # Example +CSS+:
    #   .uploadStatus { font-size: 10px; color: grey; }
    #
    def upload_status_text_tag(content=nil, options={})
      content_tag("div", content, {:id => status_tag_id, :class => 'uploadStatus'}.merge(options))
    end

    # Content helper that will create the element tree that can be easily styled
    # with +CSS+ to create a progress bar effect.  The containers are defined as:
    #
    #   <div class="progressBar" id="#{progress_bar_id}">
    #     <div class="border">
    #       <div class="background">
    #         <div class="content"> </div>
    #       </div>
    #     </div>
    #   </div>
    # 
    # The +content+ parameter will be included in the inner most +div+ when 
    # rendered.
    #
    # The +options+ will create attributes on the outer most div.  To use a different
    # +CSS+ class, pass a different class option.
    #
    # Example:
    #   <%= upload_status_progress_bar_tag('', {:class => 'progress'}) %>
    #
    # Example +CSS+:
    #
    #   div.progressBar {
    #     margin: 5px;
    #   }
    #
    #   div.progressBar div.border {
    #     background-color: #fff;
    #     border: 1px solid grey;
    #     width: 100%;
    #   }
    #
    #   div.progressBar div.background {
    #     background-color: #333;
    #     height: 18px;
    #     width: 0%;
    #   }
    #
    def upload_status_progress_bar_tag(content='', options={})
      css = [options[:class], 'progressBar'].compact.join(' ')

      content_tag("div", 
        content_tag("div", 
          content_tag("div", 
            content_tag("div", content, :class => 'foreground'),
          :class => 'background'), 
        :class => 'border'), 
      {:id => progress_bar_id}.merge(options).merge({:class => css}))
    end

    # The text and Javascript returned by the default +upload_status+ controller
    # action which will replace the contents of the div created by +upload_status_text_tag+
    # and grow the progress bar background to the appropriate width.
    #
    # See +upload_progress_text+ and +upload_progress_update_bar_js+
    def upload_progress_status
      "#{upload_progress_text}<script>#{upload_progress_update_bar_js}</script>"
    end
    
    # Javascript helper that will create a script that will change the width
    # of the background progress bar container.  Include this in the script
    # portion of your view rendered by your +upload_status+ action to
    # automatically find and update the progress bar.
    #
    # Example (in controller):
    #
    #   def upload_status
    #     render :inline => "<script><%= update_upload_progress_bar_js %></script>", :layout => false
    #   end
    #
    #
    def upload_progress_update_bar_js(percent=nil)
      progress = upload_progress
      percent ||= case 
        when progress.nil? || !progress.started? then 0
        when progress.finished? then 100
        else progress.completed_percent
      end.to_i

      # TODO do animation instead of jumping
      "if($('#{progress_bar_id}')){$('#{progress_bar_id}').firstChild.firstChild.style.width='#{percent}%'}"
    end
    
    # Generates a nicely formatted string of current upload progress for
    # +UploadProgress::Progress+ object +progress+.  Addtionally, it
    # will return "Upload starting..." if progress has not been initialized,
    # "Receiving data..." if there is no received data yet, and "Upload
    # finished" when all data has been sent.
    #
    # You can overload this method to add you own output to the
    #
    # Example return: 223.5 KB of 1.5 MB at 321.2 KB/s; less than 10 seconds
    # remaining
    def upload_progress_text(state=nil)
      eval case 
        when state then @@default_messages[state.to_sym]
        when upload_progress.nil? || !upload_progress.started? then @@default_messages[:begin]
        when upload_progress.finished? then @@default_messages[:finish]
        else @@default_messages[:update]
      end 
    end

    protected
    # Javascript object used to contain the polling methods and keep track of
    # the finished state
    def upload_update_object
      "document.uploadStatus#{current_upload_id}"
    end

    # Element ID of the progress bar
    def progress_bar_id
      "UploadProgressBar#{current_upload_id}"
    end

    # Element ID of the progress status container
    def status_tag_id
      "UploadStatus#{current_upload_id}"
    end

    # Element ID of the target <iframe> used as the target of the form
    def upload_target_id
      "UploadTarget#{current_upload_id}"
    end

  end
end