moparisthebest/mailcatcher
1
0
Fork 0
mirror of https://github.com/moparisthebest/mailcatcher synced 2024-08-13 17:03:45 -04:00
Code Issues Releases Wiki Activity

Expose updated fractal api access in front-end

Browse Source
This commit is contained in:
Samuel Cochran 2011-10-08 00:25:04 +08:00
parent 88711084e7
commit 60160e1642
3 changed files with 31 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lib/mail_catcher/web.rb
View File

@ -124,6 +124,7 @@ module MailCatcher
get "/messages/:id/analysis.?:format?" do get "/messages/:id/analysis.?:format?" do
id = params[:id].to_i id = params[:id].to_i
if part = MailCatcher::Mail.message_part_html(id) if part = MailCatcher::Mail.message_part_html(id)
# TODO: Server-side cache? Make the browser cache based on message create time? Hmm.
uri = URI.parse("http://api.getfractal.com/api/v2/validate#{"/format/#{params[:format]}" if params[:format].present?}") uri = URI.parse("http://api.getfractal.com/api/v2/validate#{"/format/#{params[:format]}" if params[:format].present?}")
response = Net::HTTP.post_form(uri, api_key: "5c463877265251386f516f7428", html: part["body"]) response = Net::HTTP.post_form(uri, api_key: "5c463877265251386f516f7428", html: part["body"])
content_type ".#{params[:format]}" if params[:format].present? content_type ".#{params[:format]}" if params[:format].present?

48
public/javascripts/application.coffee
View File

@ -136,12 +136,9 @@ class MailCatcher
$("#message .views :not(.analysis).tab.selected").removeClass 'selected' $("#message .views :not(.analysis).tab.selected").removeClass 'selected'
if id? if id?
# Makes a new iframe which will have a foreign origin eventually, and populate it with a quick intro and a form to send to Fractal. # Makes a new iframe and populate it with a quick intro and a button
$iframe = $('#message iframe').contents().children().html(""" $iframe = $('#message iframe').contents().children()
<html class="mailcatcher"><head>#{$('link[rel="stylesheet"]')[0].outerHTML}</head><body><iframe></iframe></body></html> .html("""
""")
.find("head").append($('link[rel="stylesheet"]').clone()).end()
.find('iframe').contents().children().html("""
<html> <html>
<head> <head>
<title>Analysis</title> <title>Analysis</title>
@ -151,34 +148,25 @@ class MailCatcher
<h1>Analyse your email with Fractal</h1> <h1>Analyse your email with Fractal</h1>
<p><a href="http://getfractal.com/" target="_blank">Fractal</a> is a really neat service that applies common email design and development knowledge from <a href="http://www.email-standards.org/" target="_blank">Email Standards Project</a> to your HTML email and tells you what you've done wrong or what you should do instead.</p> <p><a href="http://getfractal.com/" target="_blank">Fractal</a> is a really neat service that applies common email design and development knowledge from <a href="http://www.email-standards.org/" target="_blank">Email Standards Project</a> to your HTML email and tells you what you've done wrong or what you should do instead.</p>
<p>Please note that this <strong>sends your email to the Fractal service</strong> for analysis. Read their <a href="http://getfractal.com/terms" target="_blank">terms of service</a> if you're paranoid.</p> <p>Please note that this <strong>sends your email to the Fractal service</strong> for analysis. Read their <a href="http://getfractal.com/terms" target="_blank">terms of service</a> if you're paranoid.</p>
<form action="http://getfractal.com/validate" method="POST"> <p>(This output is still just raw XML. Someone keen to transform this into something prettier would be greatly appreciated!)</p>
<input type="hidden" name="html" /> <form>
<input type="submit" value="Analyse" disabled="disabled" /><span class="loading" style="color: #999">Loading your email...</span> <input type="submit" value="Analyse" /><span class="loading" style="color: #999; display: none">Analysing&hellip;</span>
</form> </form>
</body> </body>
</html> </html>
""") """)
# This should be cached if already accessed, so it's actually quite quick $form = $iframe.find('form')
$.get "/messages/#{id}.html", (html) -> .submit (e) ->
$iframe e.preventDefault()
.find('input[name="html"]').attr('value', html).end() $(this)
.find('.loading').hide().end() .find('input[type="submit"]').attr('disabled', 'disabled').end()
.find('input[type="submit"]').attr('disabled', null).end() .find('.loading').show()
.find('form').submit -> $.ajax
$(this) url: "/messages/#{id}/analysis.xml",
.find('input[type="submit"]').attr('disabled', 'disabled').end() dataType: "text"
.find('.loading').text('Analysing...').show() success: (data) ->
$form.replaceWith('<h2>Results</h2><pre id="result"></pre>')
# FIXME: Fractal need to allow GET requests to their JSONP endpoint, then we can use the API: $iframe.find("#result").text data
# $.ajax
# url: 'http://getfractal.com/api/v1/validate/format/jsonp'
# data:
# api_key: '59372c4f65426f78282c5c657d'
# html: html
# dataType: 'jsonp'
# success: (json) ->
# console.log json
# $iframe.children().html json
refresh: -> refresh: ->
$.getJSON '/messages', (messages) => $.getJSON '/messages', (messages) =>

17
public/javascripts/application.js
View File

@ -148,15 +148,22 @@
} }
}; };
MailCatcher.prototype.loadMessageAnalysis = function(id) { MailCatcher.prototype.loadMessageAnalysis = function(id) {
var $iframe; var $form, $iframe;
id || (id = this.selectedMessage()); id || (id = this.selectedMessage());
$("#message .views .analysis.tab:not(.selected)").addClass('selected'); $("#message .views .analysis.tab:not(.selected)").addClass('selected');
$("#message .views :not(.analysis).tab.selected").removeClass('selected'); $("#message .views :not(.analysis).tab.selected").removeClass('selected');
if (id != null) { if (id != null) {
$iframe = $('#message iframe').contents().children().html("<html class=\"mailcatcher\"><head>" + ($('link[rel="stylesheet"]')[0].outerHTML) + "</head><body><iframe></iframe></body></html>").find("head").append($('link[rel="stylesheet"]').clone()).end().find('iframe').contents().children().html("<html>\n<head>\n<title>Analysis</title>\n" + ($('link[rel="stylesheet"]')[0].outerHTML) + "\n</head>\n<body class=\"iframe\">\n<h1>Analyse your email with Fractal</h1>\n<p><a href=\"http://getfractal.com/\" target=\"_blank\">Fractal</a> is a really neat service that applies common email design and development knowledge from <a href=\"http://www.email-standards.org/\" target=\"_blank\">Email Standards Project</a> to your HTML email and tells you what you've done wrong or what you should do instead.</p>\n<p>Please note that this <strong>sends your email to the Fractal service</strong> for analysis. Read their <a href=\"http://getfractal.com/terms\" target=\"_blank\">terms of service</a> if you're paranoid.</p>\n<form action=\"http://getfractal.com/validate\" method=\"POST\">\n<input type=\"hidden\" name=\"html\" />\n<input type=\"submit\" value=\"Analyse\" disabled=\"disabled\" /><span class=\"loading\" style=\"color: #999\">Loading your email...</span>\n</form>\n</body>\n</html>"); $iframe = $('#message iframe').contents().children().html("<html>\n<head>\n<title>Analysis</title>\n" + ($('link[rel="stylesheet"]')[0].outerHTML) + "\n</head>\n<body class=\"iframe\">\n<h1>Analyse your email with Fractal</h1>\n<p><a href=\"http://getfractal.com/\" target=\"_blank\">Fractal</a> is a really neat service that applies common email design and development knowledge from <a href=\"http://www.email-standards.org/\" target=\"_blank\">Email Standards Project</a> to your HTML email and tells you what you've done wrong or what you should do instead.</p>\n<p>Please note that this <strong>sends your email to the Fractal service</strong> for analysis. Read their <a href=\"http://getfractal.com/terms\" target=\"_blank\">terms of service</a> if you're paranoid.</p>\n<p>(This output is still just raw XML. Someone keen to transform this into something prettier would be greatly appreciated!)</p>\n<form>\n<input type=\"submit\" value=\"Analyse\" /><span class=\"loading\" style=\"color: #999; display: none\">Analysing&hellip;</span>\n</form>\n</body>\n</html>");
return $.get("/messages/" + id + ".html", function(html) { return $form = $iframe.find('form').submit(function(e) {
return $iframe.find('input[name="html"]').attr('value', html).end().find('.loading').hide().end().find('input[type="submit"]').attr('disabled', null).end().find('form').submit(function() { e.preventDefault();
return $(this).find('input[type="submit"]').attr('disabled', 'disabled').end().find('.loading').text('Analysing...').show(); $(this).find('input[type="submit"]').attr('disabled', 'disabled').end().find('.loading').show();
return $.ajax({
url: "/messages/" + id + "/analysis.xml",
dataType: "text",
success: function(data) {
$form.replaceWith('<h2>Results</h2><pre id="result"></pre>');
return $iframe.find("#result").text(data);
}
}); });
}); });
} }