{"id":13880246,"url":"https://github.com/thoughtbot/jack_up","last_synced_at":"2025-07-16T16:31:27.052Z","repository":{"id":4172396,"uuid":"5288367","full_name":"thoughtbot/jack_up","owner":"thoughtbot","description":"[DEPRECATED] Easy AJAX file uploading in Rails","archived":true,"fork":false,"pushed_at":"2016-10-07T18:00:51.000Z","size":101,"stargazers_count":200,"open_issues_count":0,"forks_count":30,"subscribers_count":53,"default_branch":"master","last_synced_at":"2025-06-30T09:18:14.215Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Ruby","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thoughtbot.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2012-08-03T17:43:40.000Z","updated_at":"2024-09-17T15:44:40.000Z","dependencies_parsed_at":"2022-08-20T11:40:35.315Z","dependency_job_id":null,"html_url":"https://github.com/thoughtbot/jack_up","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/thoughtbot/jack_up","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thoughtbot%2Fjack_up","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thoughtbot%2Fjack_up/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thoughtbot%2Fjack_up/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thoughtbot%2Fjack_up/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thoughtbot","download_url":"https://codeload.github.com/thoughtbot/jack_up/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thoughtbot%2Fjack_up/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265524631,"owners_count":23782016,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-06T08:02:53.534Z","updated_at":"2025-07-16T16:31:26.634Z","avatar_url":"https://github.com/thoughtbot.png","language":"Ruby","funding_links":[],"categories":["Ruby"],"sub_categories":[],"readme":"# Deprecated as of October 7, 2016\n\nGiven other [both](https://shubox.io/) [paid](https://www.filestack.com/) and\n[free](http://josephndungu.com/tutorials/ajax-file-upload-with-dropezonejs-and-paperclip-rails)\nuploading tools available, JackUp has been deprecated.\n\n# JackUp\n\n## Easy AJAX file uploading in Rails.\n\n### Install\n\nModify your `Gemfile`:\n\n```ruby\ngem 'jack_up'\n```\n\nand run `bundle install` from your shell.\n\nModify your `application.js` manifest:\n\n```javascript\n//= require jquery\n//= require underscore\n//= require jack_up\n//= require_tree .\n```\n\n### Requirements\n\nRails 4.0+, CoffeeScript, and both jQuery and\nUnderscore.js included in your `application.js` manifest.\n\n### Usage\n\nCreate a JackUp.Processor, binding to various events emitted.\n\n```coffeescript\n$ -\u003e # when the document is ready\n  # create a new processor with the endpoint to where your assets are uploaded\n  jackUp = new JackUp.Processor(path: '/assets')\n\n  # called if upload is an image; returns an image jQuery object with src attribute assigned\n  jackUp.on 'upload:imageRenderReady', (e, options) -\u003e\n    # assigns a data-attribute with the file guid for later referencing\n    # set the border color to red, denoting that the image is still being uploaded\n    options.image.attr(\"data-id\", options.file.__guid__).css(border: \"5px solid red\")\n    $('.file-drop').append(options.image)\n\n  # upload has been sent to server; server will handle processing\n  jackUp.on \"upload:sentToServer\", (e, options) -\u003e\n    # change the border color to yellow to signify successful upload (server is still processing)\n    $(\"img[data-id='#{options.file.__guid__}']\").css borderColor: 'yellow'\n\n  # when server responds successfully\n  jackUp.on \"upload:success\", (e, options) -\u003e\n    # server has completed processing the image and has returned a response\n    $(\"img[data-id='#{options.file.__guid__}']\").css(borderColor: \"green\")\n\n  # when server returns a non-200 response\n  jackUp.on \"upload:failure\", (e, options) -\u003e\n    # alert the file name\n    alert(\"'#{options.file.name}' upload failed; please retry\")\n    # remove the image from the dom since the upload failed\n    $(\"img[data-id='#{options.file.__guid__}']\").remove()\n\n```\n\nOnce the processor is set up, wire up drag-and-drop support:\n\n```coffeescript\n  $('.file-drop').jackUpDragAndDrop(jackUp)\n\n  # if you do not want the browser to redirect to the file when droped anywhere else on the page\n  $(document).bind 'drop dragover', (e) -\u003e\n    e.preventDefault()\n```\n\nIf you just want to bind to a standard `\u003cinput type='file'\u003e`:\n\n```coffeescript\n  $('.standard-attachment').jackUpAjax(jackUp)\n```\n\nYou can use both at the same time, referencing the same `JackUp.Processor`, in\norder to provide both options to your users.\n\n### Example Rails Setup\n\nFor instant file uploading:\n\n```ruby\n# Gemfile\ngem 'rails'\ngem 'paperclip'\ngem 'rack-raw-upload'\n```\n\nUsing the `rack-raw-upload` gem allows for accessing the file posted to the\ncontroller via `params[:file]`; this makes it incredibly easy to handle file\nuploads.\n\n```ruby\n# app/models/asset.rb\nclass Asset \u003c ActiveRecord::Base\n  has_attached_file :photo\nend\n\n# app/controllers/assets_controller.rb\nclass AssetsController \u003c ApplicationController\n  def create\n    @asset = Asset.new(photo: asset_params[:file])\n\n    if @asset.save\n      render json: @asset\n    else\n      head :bad_request\n    end\n  end\n\n  private\n\n  def asset_params\n    params.permit(:file)\n  end\nend\n```\n\nThis view code could be placed anywhere for immediate uploading:\n\n```haml\n.file-drop\n  %span{ 'data-placeholder' =\u003e 'Drop files here' } Drop files here\n\n%input.standard-attachment{ name: 'standard_attachment', accept: 'image/*', type: :file, multiple: :multiple }\n```\n\nAnything with a data-placeholder attribute will be hidden when an file is successfully dropped.\n\nIf attaching assets to a different model, additionally use:\n\n```ruby\n# app/models/post.rb\nclass Post \u003c ActiveRecord::Base\n  has_many :assets, dependent: :destroy\n\n  accepts_nested_attributes_for :assets\nend\n\n# app/controllers/posts_controller.rb\nclass PostsController \u003c ApplicationController\n  def new\n    @post = Post.new\n    @post.assets.build\n  end\n\n  def create\n    @post = Post.new(post_params)\n    @post.save\n    respond_with @post\n  end\n\n  private\n\n  def post_params\n    params.require(:post).permit(:asset_ids, :assets_attributes)\n  end\nend\n```\n\nTo wire up the posts view:\n\n```haml\n# app/views/posts/new.html.haml\n= form_for @post, html: { multipart: true } do |form|\n  = form.text_field :title, { placeholder: 'Title' }\n\n  .file-drop\n    %span{ 'data-placeholder' =\u003e 'Drop files here' } Drop files here\n\n  %input.standard-attachment{ name: 'standard_attachment', accept: \"image/*\", type: :file, multiple: :multiple }\n\n  = form.submit 'Create Post'\n```\n\n```coffeescript\n# app/assets/javascripts/posts.coffee\n# truncated from above to demonstrate additional code to associate uploads\n# with posts\njackUp.on \"upload:success\", (e, options) -\u003e\n  $(\"img[data-id='#{options.file.__guid__}']\").css(borderColor: \"green\")\n\n  # read the response from the server\n  asset = JSON.parse(options.responseText)\n  assetId = asset.id\n  # create a hidden input containing the asset id of the uploaded file\n  assetIdsElement = $(\"\u003cinput type='hidden' name='post[asset_ids][]'\u003e\").val(assetId)\n  # append it to the form so saving the form associates the created post\n  # with the uploaded assets\n  $(\".file-drop\").parent(\"form\").append(assetIdsElement)\n```\n\n## License\n\nJackUp is copyright 2012-2013 Josh Steiner, Josh Clayton, and thoughtbot, inc., and may be redistributed under the terms specified in the LICENSE file.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthoughtbot%2Fjack_up","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthoughtbot%2Fjack_up","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthoughtbot%2Fjack_up/lists"}