{"action":"created","issue":{"url":"https://api.github.com/repos/madebymany/sir-trevor-js/issues/439","repository_url":"https://api.github.com/repos/madebymany/sir-trevor-js","labels_url":"https://api.github.com/repos/madebymany/sir-trevor-js/issues/439/labels{/name}","comments_url":"https://api.github.com/repos/madebymany/sir-trevor-js/issues/439/comments","events_url":"https://api.github.com/repos/madebymany/sir-trevor-js/issues/439/events","html_url":"https://github.com/madebymany/sir-trevor-js/issues/439","id":133780893,"number":439,"title":"Make image src same as url to which image was uploaded","user":{"login":"rnjailamba","id":6762840,"avatar_url":"https://avatars.githubusercontent.com/u/6762840?v=3","gravatar_id":"","url":"https://api.github.com/users/rnjailamba","html_url":"https://github.com/rnjailamba","followers_url":"https://api.github.com/users/rnjailamba/followers","following_url":"https://api.github.com/users/rnjailamba/following{/other_user}","gists_url":"https://api.github.com/users/rnjailamba/gists{/gist_id}","starred_url":"https://api.github.com/users/rnjailamba/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rnjailamba/subscriptions","organizations_url":"https://api.github.com/users/rnjailamba/orgs","repos_url":"https://api.github.com/users/rnjailamba/repos","events_url":"https://api.github.com/users/rnjailamba/events{/privacy}","received_events_url":"https://api.github.com/users/rnjailamba/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/madebymany/sir-trevor-js/labels/Question","name":"Question","color":"cc317c"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2016-02-15T18:02:32Z","updated_at":"2016-04-19T04:05:19Z","closed_at":"2016-02-19T14:00:28Z","body":"I am looking to use the Amazon s3 url to which i am uploading the image and use it in the image src attribute.\r\n\r\nThis is how i have modified the uploader code - \r\n\r\n```\r\n/*\r\n\t*   Sir Trevor Uploader\r\n\t*   Generic Upload implementation that can be extended for blocks\r\n\t*/\r\n\r\n\tvar _ = __webpack_require__(2);\r\n\tvar $ = __webpack_require__(56);\r\n\tvar config = __webpack_require__(58);\r\n\tvar utils = __webpack_require__(57);\r\n\r\n\tvar EventBus = __webpack_require__(62);\r\n\r\n\tmodule.exports = function(block, file, success, error) {\r\n\tconsole.log(\"in the uploader\");\r\n\r\n\t  EventBus.trigger('onUploadStart');\r\n\r\n\t  var uid  = [block.blockID, (new Date()).getTime(), 'raw'].join('-');\r\n\t  var data = new FormData();\r\n\r\n\t  console.log(file);\r\n\r\n\t  data.append('attachment[name]', file.name);\r\n\t  data.append('attachment[file]', file);\r\n\t  data.append('attachment[uid]', uid);\r\n\r\n\t  block.resetMessages();\r\n\r\n\t  var callbackSuccess = function(data) {\r\n\t    console.log('Upload callback called',data);\r\n\t    EventBus.trigger('onUploadStop', data);\r\n\r\n\t    if (!_.isUndefined(success) && _.isFunction(success)) {\r\n\t      success.apply(block, arguments, data);\r\n\t    }\r\n\t  };\r\n\r\n\t  var callbackError = function(jqXHR, status, errorThrown) {\r\n\t    utils.log('Upload callback error called');\r\n\t    EventBus.trigger('onUploadStop', undefined, errorThrown, status, jqXHR);\r\n\r\n\t    if (!_.isUndefined(error) && _.isFunction(error)) {\r\n\t      error.call(block, status);\r\n\t    }\r\n\t  };\r\n\r\n\t  var url = block.uploadUrl || config.defaults.uploadUrl;\r\n\t  console.log(url);\r\n             var xhr;\r\n             debugger;\r\n\t  $.ajax({\r\n\t    url:\"/imageUploadAPI/getImageURL\",\r\n         type: 'POST',\r\n         async: false,\r\n         data: '',\r\n         dataType: \"text\",\r\n         context: this,\r\n         cache: false,\r\n         processData: false,\r\n         success: function(response) {\r\n           console.log('S3 url retrieval successs!',response);\r\n           var returnedURL = response;\r\n\r\n             xhr = $.ajax({\r\n               url: returnedURL,\r\n               contentType: 'image;charset=UTF-8',\r\n               crossDomain: true,\r\n               data: file,\r\n               processData: false,\r\n               headers: {'Content-Type': 'image;charset=UTF-8'},\r\n               type: \"PUT\",\r\n               success: callbackSuccess\r\n             });\r\n\r\n         },\r\n         error: function(response) {\r\n           console.log('Error with S3 upload: ' + response.statusText);\r\n         }\r\n\t  });\r\n\t  block.addQueuedItem(uid, xhr);\r\n\t  console.log(xhr,uid);\r\n       xhr.done(callbackSuccess).fail(callbackError).always(block.removeQueuedItem(uid));\r\n       console.log(\"dfdf\");\r\n       return \"{ file: { url: '/xyz/abc.jpg' } }\";\r\n```\r\n\r\nHowever the image html looks like this - \r\n```\r\n<div class=\"st-block__editor\" style=\"\">\r\n<img src=\"blob:http%3A//localhost%3A3000/b85e22ec-b06d-41c4-924e-f2fe706f7249\">\r\n</div>\r\n```\r\n\r\nAlso on printing output by - \r\n`        $('.output').text($('.js-st-instance').val());\r\n`\r\nI got\r\n`{\"data\":[{\"type\":\"image\",\"data\":{}}]}`"},"comment":{"url":"https://api.github.com/repos/madebymany/sir-trevor-js/issues/comments/211720960","html_url":"https://github.com/madebymany/sir-trevor-js/issues/439#issuecomment-211720960","issue_url":"https://api.github.com/repos/madebymany/sir-trevor-js/issues/439","id":211720960,"user":{"login":"rnjailamba","id":6762840,"avatar_url":"https://avatars.githubusercontent.com/u/6762840?v=3","gravatar_id":"","url":"https://api.github.com/users/rnjailamba","html_url":"https://github.com/rnjailamba","followers_url":"https://api.github.com/users/rnjailamba/followers","following_url":"https://api.github.com/users/rnjailamba/following{/other_user}","gists_url":"https://api.github.com/users/rnjailamba/gists{/gist_id}","starred_url":"https://api.github.com/users/rnjailamba/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rnjailamba/subscriptions","organizations_url":"https://api.github.com/users/rnjailamba/orgs","repos_url":"https://api.github.com/users/rnjailamba/repos","events_url":"https://api.github.com/users/rnjailamba/events{/privacy}","received_events_url":"https://api.github.com/users/rnjailamba/received_events","type":"User","site_admin":false},"created_at":"2016-04-19T04:05:19Z","updated_at":"2016-04-19T04:05:19Z","body":"Well i solved the issue\r\nin \t*   Sir Trevor Uploader\r\njust alter the callbackSuccess.\r\nHere data is the url you have assigned to the image\r\n`\t  var callbackSuccess = function(data) {\r\n\t  \tvar z = {url: data};\r\n\t\tvar x = {};\r\n\t\tx.file = z\r\n\t\tdata = x;\r\n\t    EventBus.trigger('onUploadStop', data);\r\n\t    if (true) {\r\n\t      arguments[0] = data;\r\n\t      success.apply(block, arguments, data);\r\n\t    }\r\n\r\n\t  };`"}}