mail_grabber 1.0.0.rc1

data/lib/mail_grabber/delivery_method.rb

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+module MailGrabber
+  class DeliveryMethod
+    include DatabaseHelper
+
+    # Initialize MailGrabber delivery method (Rails needs it).
+    def initialize(options = {}); end
+
+    # Catch and save messages into the database that we can check those messages
+    # in MailGrabber web application.
+    #
+    # @param [Mail::Message] message what we would like to send
+    def deliver!(message)
+      unless message.is_a?(Mail::Message)
+        raise Error::WrongParameter,
+              'The given parameter is not a Mail::Message'
+      end
+
+      store_mail(message)
+    end
+
+    # Delivery method settings (needed when run mail.deliver! method)
+    def settings
+      {}
+    end
+  end
+end

data/lib/mail_grabber/error.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module MailGrabber
+  class Error < StandardError
+    # Specific error class for errors if database error happen
+    class DatabaseHelperError < Error; end
+
+    # Specific error class for errors if parameter is not given
+    class WrongParameter < Error; end
+  end
+end

data/lib/mail_grabber/railtie.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module MailGrabber
+  class Railtie < Rails::Railtie
+    initializer 'mail_grabber.add_delivery_method' do
+      ActiveSupport.on_load :action_mailer do
+        ActionMailer::Base.add_delivery_method(
+          :mail_grabber,
+          MailGrabber::DeliveryMethod
+        )
+      end
+    end
+  end
+end

data/lib/mail_grabber/version.rb

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+module MailGrabber
+  VERSION = '1.0.0.rc1'
+end

data/lib/mail_grabber/web.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+require 'erb'
+require 'rack'
+
+require 'mail_grabber/error'
+require 'mail_grabber/database_helper'
+
+require 'mail_grabber/web/application_helper'
+require 'mail_grabber/web/application_router'
+require 'mail_grabber/web/application'
+
+module MailGrabber
+  module Web
+    module_function
+
+    # Method which build a Rack application and run the Web::Application
+    def app
+      @app ||= Rack::Builder.new do
+        use Rack::Static,
+            urls: ['/images', '/javascripts', '/stylesheets'],
+            root: File.expand_path('web/assets', __dir__)
+
+        run Web::Application
+      end
+    end
+
+    # Method to call MailGrabber::Web. This method will call the app method
+    # above.
+    #
+    # @param [Hash] env the environment variables
+    def call(env)
+      app.call(env)
+    end
+  end
+end

data/lib/mail_grabber/web/application.rb

@@ -0,0 +1,135 @@
+# frozen_string_literal: true
+
+require 'json'
+
+module MailGrabber
+  module Web
+    class Application
+      extend ApplicationRouter
+
+      include ApplicationHelper
+      include DatabaseHelper
+
+      attr_reader :request, :response
+
+      # Method to call MailGrabber::Web::Application. This method will call the
+      # initialize method and returns back with response of the application.
+      #
+      # @param [Hash] env the environment variables
+      #
+      # @return [Array] the response of the web application
+      #   e.g. [200, {}, ['Hello World']]
+      def self.call(env)
+        new(env).response.finish
+      end
+
+      # Initialize web application request and response then process the given
+      # request.
+      #
+      # @param [Hash] env the environment variables
+      def initialize(env)
+        @request = Rack::Request.new(env)
+        @response = Rack::Response.new
+
+        process_request
+      end
+
+      # Extract env['PATH_INFO'] value. If the path info is empty then it will
+      # return with root path.
+      #
+      # @return [String] path the requested path or the root path if this value
+      #   is empty
+      def path
+        @path ||= request.path_info.empty? ? '/' : request.path_info
+      end
+
+      # This method returns back with extracted request parameters.
+      #
+      # @return [Hash] params
+      def params
+        request.params
+      end
+
+      # Extract env['REQUEST_METHOD'] value.
+      #
+      # @return [String] request_method with e.g. GET, POST or DELETE etc.
+      def request_method
+        request.request_method
+      end
+
+      # Extract env['SCRIPT_NAME'] value.
+      #
+      # @return [String] script_name the initial portion of the request 'path'
+      def script_name
+        request.script_name
+      end
+
+      # Parse the routes of the ApplicationRouter and tries to find matching
+      # route for the request method, which was defined in the
+      # get, post, put, patch or delete blocks. If the 'extracted_params' is nil
+      # then it could not found any defined routes. If it can find a defined
+      # route then it saves the params and call the given block. If it cannot
+      # find anything then it will set response with 404 Not Found.
+      def process_request
+        self.class.routes[request_method].each do |route|
+          extracted_params = route.extract_params(path)
+
+          next unless extracted_params
+
+          request.update_param('request_params', extracted_params)
+
+          return instance_exec(&route.block)
+        end
+
+        response.status = 404
+        response.write('Not Found')
+      end
+
+      get '/' do
+        response.write(render('index.html.erb'))
+      end
+
+      get '/messages.json' do
+        result =
+          if params['page'].nil? || params['per_page'].nil?
+            select_all_messages
+          else
+            select_messages_by(params['page'], params['per_page'])
+          end
+
+        response.write(result.to_json)
+      end
+
+      get '/message/:id.json' do
+        message = select_message_by(params['request_params']['id'])
+        message_parts = select_message_parts_by(params['request_params']['id'])
+
+        response.write(
+          { message: message, message_parts: message_parts }.to_json
+        )
+      end
+
+      delete '/messages.json' do
+        delete_all_messages
+
+        response.write({ info: 'All messages have been deleted' }.to_json)
+      end
+
+      delete '/message/:id.json' do
+        delete_message_by(params['request_params']['id'])
+
+        response.write({ info: 'Message has been deleted' }.to_json)
+      end
+
+      # Render erb template from the views folder.
+      #
+      # @param [String] template
+      #
+      # @return [String] template with the result
+      def render(template)
+        path = File.expand_path("views/#{template}", __dir__)
+        ERB.new(File.read(path)).result(binding)
+      end
+    end
+  end
+end

data/lib/mail_grabber/web/application_helper.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module MailGrabber
+  module Web
+    # Helper module for views
+    module ApplicationHelper
+      # This method helps us that e.g. we can load style or javascript files
+      # when we are running this application standalone or in Ruby on Rails.
+      def root_path
+        script_name.to_s
+      end
+    end
+  end
+end

data/lib/mail_grabber/web/application_router.rb

@@ -0,0 +1,79 @@
+# frozen_string_literal: true
+
+module MailGrabber
+  module Web
+    module ApplicationRouter
+      NAMED_SEGMENTS_PATTERN = %r{/([^/]*):([^.:$/]+)}.freeze
+
+      attr_reader :routes
+
+      Route =
+        Struct.new(:pattern, :block) do
+          # Extract parameters from the given path. All routes has a
+          # path pattern which helps to the router to find which block it should
+          # execute. If path contains request parameters like '/test/1' then
+          # it will match with the '/test/:id' pattern. In this case it will
+          # return with '{"id" => "1"}' hash. If it is just a simple path like
+          # '/' and it has a pattern to match then it will return with '{}'.
+          # In the other case it will return with nil.
+          #
+          # @param [String] path
+          #
+          # @return [Hash/NilClass] with the extracted parameters, empty Hash
+          #   or nil
+          def extract_params(path)
+            if pattern.match?(NAMED_SEGMENTS_PATTERN)
+              named_pattern =
+                pattern.gsub(NAMED_SEGMENTS_PATTERN, '/\1(?<\2>[^$/]+)')
+
+              path.match(Regexp.new("\\A#{named_pattern}\\Z"))&.named_captures
+            elsif path == pattern
+              {}
+            end
+          end
+        end
+
+      # Define route method that we can define routing blocks.
+      #
+      # @example
+      #
+      #   get '/' do
+      #     response.write 'Hello MailGrabber'
+      #   end
+      #
+      # @example
+      #
+      #   method  pattern  block
+      #     |       |        |
+      #    get    '/test'  do ... end
+      #
+      %w[GET POST PUT PATCH DELETE].each do |method|
+        define_method(method.downcase) do |pattern, &block|
+          route(method, pattern, &block)
+        end
+      end
+
+      # Store routes with the request method, the provided pattern and the given
+      # block.
+      #
+      # @param [String] method e.g. GET, POST etc.
+      # @param [String] pattern the path what we are looking for
+      # @param [Proc] block what we will run
+      def route(method, pattern, &block)
+        @routes ||= {}
+
+        set_route('HEAD', pattern, &block) if method == 'GET'
+        set_route(method, pattern, &block)
+      end
+
+      # Set routes Hash with the Route object.
+      #
+      # @param [String] method e.g. GET, POST etc.
+      # @param [String] pattern the path what we are looking for
+      # @param [Proc] block what we will run
+      def set_route(method, pattern, &block)
+        (@routes[method] ||= []) << Route.new(pattern, block)
+      end
+    end
+  end
+end

data/lib/mail_grabber/web/assets/javascripts/application.js

@@ -0,0 +1,539 @@
+(function() {
+  var MailGrabber = {
+    /**
+     * Change which content (message part) should show. When the page is loading
+     * the HTML content will be active and the others will be hidden. When we
+     * click on tab e.g. Plain Text then this content will active and other
+     * hidden.
+     *
+     * @param {Object} event - which part we clicked
+     */
+    changeMessageContent: function(event) {
+      var messageTabs =
+        document
+          .querySelectorAll('[data-message-tab]');
+
+      var messageContents =
+        document
+          .querySelectorAll('[data-message-content]');
+
+      var clickedTabType = event.target.dataset.messageTab;
+
+      messageTabs.forEach(function(messageTab, index) {
+        messageTab.classList.remove('active');
+        messageContents[index].classList.remove('hide');
+
+        if(messageTab.dataset.messageTab === clickedTabType) {
+          messageTab.classList.add('active');
+        }
+
+        if(messageContents[index].dataset.messageContent !== clickedTabType) {
+          messageContents[index].classList.add('hide');
+        }
+      });
+    },
+
+    /**
+     * Show default backgroud image instead of any content.
+     */
+    defaultBackground: function() {
+      var messageContent =
+        document
+          .querySelector('div[data-content-type=message-content]');
+
+      messageContent.innerHTML = '';
+
+      messageContent.style.background =
+        "url('" + messageContent.dataset.backgroundImage +
+        "') center center no-repeat";
+      messageContent.style.backgroundSize = '50%';
+      messageContent.style.opacity = '10%';
+    },
+
+    /**
+     * Delete all content (message list and message content as well),
+     * set default backgroud and the infinite scroll params when we click on
+     * the Reload or Delete tabs.
+     */
+    deleteContent: function() {
+      MailGrabber.lastMessageId = -1;
+      MailGrabber.page = 1;
+      MailGrabber.defaultBackground();
+
+      document
+        .querySelector('ul[data-content-type=message-list]')
+        .innerHTML = '';
+    },
+
+    /**
+     * Delete a message when we click on the Delete tab. It will remove all
+     * content and reload the message list.
+     *
+     * @param {Number} messageId - which message we would like to delete
+     */
+    deleteMessage: function(messageId) {
+      MailGrabber.request('DELETE', '/message/' + messageId + '.json',
+        function() {
+          MailGrabber.deleteContent();
+          MailGrabber.getMessageList();
+        }
+      );
+    },
+
+    /**
+     * Delete message list when we click on the Clear tab. It will remove
+     * everything.
+     */
+    deleteMessageList: function() {
+      MailGrabber.request('DELETE', '/messages.json', function() {
+        MailGrabber.deleteContent();
+      });
+    },
+
+    /**
+     * Get a message and render the message content, when we click on an item
+     * from the message list.
+     *
+     * @param {Number} messageId - which message we would like to see
+     */
+    getMessage: function(messageId) {
+      MailGrabber.request('GET', '/message/' + messageId + '.json',
+        function(response) {
+          MailGrabber.renderMessageContent(JSON.parse(response));
+        }
+      );
+    },
+
+    /**
+     * Get a list of the messages. Also change the params of the infinite scroll
+     * that we can know which page we are on. It checks the message ids to not
+     * load those messages which are already on the list.
+     */
+    getMessageList: function() {
+      var messageIds;
+
+      MailGrabber.request('GET', '/messages.json?page=' + MailGrabber.page +
+        '&per_page=' + MailGrabber.perPage,
+        function(response) {
+          response = JSON.parse(response);
+          messageIds = response.map(function(hash) { return hash['id'] });
+
+          if(response.length > 0) {
+            if(messageIds.indexOf(MailGrabber.lastMessageId) === -1) {
+              MailGrabber.lastMessageId = messageIds.pop();
+              MailGrabber.page++;
+              MailGrabber.renderMessageList(response);
+            } else {
+              MailGrabber.reloadMessageList();
+            }
+          }
+        }
+      );
+    },
+
+    /**
+     * Scrolling infinitely. Count the height of the list and if we reached the
+     * bottom of the list then tries to load more message.
+     *
+     * @param {Object} messageList - the message list container
+     */
+    infiniteScroll: function(messageList) {
+      var scrollHeight = messageList.scrollHeight;
+      var scrollTop = messageList.scrollTop;
+      var clientHeight = messageList.clientHeight;
+
+      if(scrollHeight - scrollTop === clientHeight) {
+        MailGrabber.getMessageList();
+      }
+    },
+
+    /**
+     * Initialize MailGrabber. Add some event listeners to the Reload and the
+     * Clear tabs then load messages and the default background.
+     */
+    init: function() {
+      document
+        .querySelector('li[data-content-type=message-reload-tab]')
+        .addEventListener('click', MailGrabber.reloadMessageList);
+
+      document
+        .querySelector('li[data-content-type=message-clear-tab]')
+        .addEventListener('click', MailGrabber.deleteMessageList);
+
+      MailGrabber.loadMessageList();
+      MailGrabber.defaultBackground();
+    },
+
+    /**
+     * Format the given date or time.
+     *
+     * @param {DateTime} dateTime - the message created at attribute
+     * @param {String} ouputType - what type we would like to see
+     *
+     * @return {String} the new format of the date or time
+     */
+    formatDateTime: function(dateTime, outputType) {
+      dateTime = new Date(dateTime);
+      var dateTimeNow = new Date();
+      // Sun Feb 21 2021 21:00:00 GMT+0100 (Central European Standard Time)
+      //  0   1  2   3      4        5         6       7        8      9
+      var dateTimeComponents = dateTime.toString().split(' ');
+      var output;
+
+      switch(outputType) {
+        case 'messageListDateOrTime':
+          if(dateTime.getDate() === dateTimeNow.getDate()) {
+            output = MailGrabber.formatTime(dateTimeComponents[4]);
+          } else if(dateTime.getFullYear() === dateTimeNow.getFullYear()) {
+            output = dateTimeComponents[1] + ' ' + dateTimeComponents[2];
+          } else {
+            output = dateTimeComponents[3] + ' ' + dateTimeComponents[1] + ' ' +
+              dateTimeComponents[2];
+          }
+
+          break;
+        default:
+          output = dateTimeComponents[3] + ' ' + dateTimeComponents[1] + ' ' +
+            dateTimeComponents[2] + ' - ' +
+            MailGrabber.formatTime(dateTimeComponents[4]);
+      }
+
+      return output;
+    },
+
+    /**
+     * Format the given number (attachment size).
+     *
+     * @param {Number} size - the size of the attachment in bytes
+     *
+     * @return {String} the formatted number with unit
+     */
+    formatSize: function(size) {
+      var exponent = (Math.log(size) / Math.log(1024)) | 0;
+      var number = +(size / Math.pow(1024, exponent)).toFixed(1);
+
+      return number + ' ' + ('KMGTPEZY'[exponent - 1] || '') + 'B';
+    },
+
+    /**
+     * Format the given time.
+     *
+     * @param {String} time
+     *
+     * @return {String} the new format of the time
+     */
+    formatTime: function(time) {
+      var timeComponents = time.split(':');
+
+      return timeComponents[0] + ':' + timeComponents[1];
+    },
+
+    /**
+     * The last message id what loaded. If it is -1 then we have no any
+     * messages.
+     */
+    lastMessageId: -1,
+
+    /**
+     * Load the message list. Also add event listener for infinite scroll.
+     */
+    loadMessageList: function() {
+      var messageList =
+        document
+          .querySelector('ul[data-content-type=message-list]');
+
+      messageList.addEventListener('scroll', function() {
+        MailGrabber.infiniteScroll(messageList);
+      });
+
+      MailGrabber.getMessageList();
+    },
+
+    /**
+     * Params that we can follow how many messages we have on the list. We are
+     * loading 15 messages in every requests.
+     */
+    page: 1,
+    perPage: 15,
+
+    /**
+     * Reload the message list. When we have new messages in the database, but
+     * we scrolled down or clicked on the Reload tab.
+     */
+    reloadMessageList: function() {
+      MailGrabber.deleteContent();
+      MailGrabber.getMessageList();
+    },
+
+    /**
+     * Render message attachment. Show the list of attachments at the top of the
+     * message content.
+     *
+     * @param {Object} messageAttachments - the message attachments container
+     * @param {Object} messagePart - a message part which we loaded
+     */
+    renderMessageAttachment: function(messageAttachments, messagePart) {
+      var messageAttachment = document.createElement('a');
+      var fileSize = document.createElement('span');
+      var messageAttachmentTemplate =
+        document
+          .querySelector(
+            'template[data-content-type=message-attachment-template]'
+          )
+          .content
+          .cloneNode(true);
+
+      messageAttachment.href =
+        'data:' + messagePart.mime_type + ';base64,' + messagePart.body;
+      messageAttachment.download = messagePart.filename;
+      messageAttachment.innerHTML = messagePart.filename;
+      messageAttachment.classList.add('color-black', 'no-text-decoration');
+
+      fileSize.innerHTML = MailGrabber.formatSize(messagePart.size);
+      fileSize.classList.add('color-gray', 'font-size-0_9', 'padding-left-10');
+
+      [messageAttachment, fileSize].forEach(function(node) {
+        messageAttachmentTemplate
+          .querySelector('li[data-content-type=message-attachment]')
+          .appendChild(node);
+      });
+
+      messageAttachments.classList.remove('hide');
+      messageAttachments.appendChild(messageAttachmentTemplate);
+    },
+
+    /**
+     * Render the HTML part of the message. If the message has inline images
+     * then it will render those images as well. An iframe will contain this
+     * content.
+     *
+     * @param {Object} iFrame - the iframe HTML tag
+     * @param {Object} messageParts - the parts of the message
+     * @param {Object} messageHtmlPart - the HTML part of the message
+     */
+    renderMessageHtmlPart: function(iFrame, messageParts, messageHtmlPart) {
+      var messageInlineAttachmentRegExp = new RegExp("cid:");
+
+      if(messageInlineAttachmentRegExp.test(messageHtmlPart)) {
+        messageHtmlPart =
+          MailGrabber.renderMessageInlineAttachments(
+            messageParts, messageHtmlPart
+          );
+      }
+
+      iFrame.srcdoc = messageHtmlPart;
+      iFrame.onload = function() {
+        iFrame.height = iFrame.contentDocument.body.scrollHeight + 65;
+      }
+    },
+
+    /**
+     * Render inline images of the message. Change the cid:something12345 with
+     * the encoded image content.
+     *
+     * @param {Object} messageParts - the parts of the message
+     * @param {Object} messageHtmlPart - the HTML part of the message
+     *
+     * @return {Object} messageHtmlPart - the modified HTML part of the message
+     */
+    renderMessageInlineAttachments: function(messageParts, messageHtmlPart) {
+      messageParts.forEach(function(messagePart) {
+        if(messagePart.is_attachment === 1 && messagePart.is_inline === 1) {
+          messageHtmlPart = messageHtmlPart.replace('cid:' + messagePart.cid,
+            'data:' + messagePart.mime_type + ';base64,' + messagePart.body);
+        }
+      });
+
+      return messageHtmlPart;
+    },
+
+    /**
+     * Render the content of the message (all parts, inline attachments and
+     * attachments). Also it sets up event listeners of the HTML, PlainText,
+     * Raw, Delete and Close tabs.
+     *
+     * @param {Object} response - the response the get message request
+     */
+    renderMessageContent: function(response) {
+      var message = response.message;
+      var messageParts = response.message_parts;
+      var messageContentTemplate =
+        document
+          .querySelector('template[data-content-type=message-content-template]')
+          .content
+          .cloneNode(true);
+
+      var messageContent =
+        document
+          .querySelector('div[data-content-type=message-content]');
+
+      messageContent.removeAttribute('style');
+      messageContent.innerHTML = '';
+
+      messageContentTemplate
+        .querySelector('div[data-content-type=message-subject]')
+        .innerHTML = message.subject;
+
+      messageContentTemplate
+        .querySelector('dl[data-content-type=metadata]')
+        .innerHTML = MailGrabber.renderMetadata(message);
+
+      messageContentTemplate
+        .querySelector('time[data-content-type=message-sent-at]')
+        .innerHTML = MailGrabber.formatDateTime(message.created_at);
+
+      messageContentTemplate
+        .querySelectorAll('[data-message-tab]')
+        .forEach(function(tab) {
+          tab.addEventListener('click', MailGrabber.changeMessageContent);
+        });
+
+      messageContentTemplate
+        .querySelector('li[data-content-type=message-delete-tab]')
+        .addEventListener('click', function() {
+          MailGrabber.deleteMessage(message.id);
+        });
+
+      messageContentTemplate
+        .querySelector('li[data-content-type=message-close-tab]')
+        .addEventListener('click', MailGrabber.defaultBackground);
+
+      messageParts.forEach(function(messagePart) {
+        if(messagePart.is_attachment === 0 && messagePart.is_inline === 0) {
+          switch(messagePart.mime_type) {
+            case 'text/html':
+              MailGrabber.renderMessageHtmlPart(
+                messageContentTemplate
+                  .querySelector('iframe[data-content-type=message-html-body]'),
+                messageParts,
+                messagePart.body
+              );
+
+              break;
+            case 'text/plain':
+              messageContentTemplate
+                .querySelector('pre[data-content-type=message-text-body]')
+                .innerText = messagePart.body;
+
+              break;
+          }
+        } else if(messagePart.is_attachment === 1 &&
+                  messagePart.is_inline === 0) {
+          MailGrabber.renderMessageAttachment(
+            messageContentTemplate
+              .querySelector('ul[data-content-type=message-attachments]'),
+            messagePart
+          );
+        }
+      });
+
+      messageContentTemplate
+        .querySelector('pre[data-content-type=message-raw-body]')
+        .innerText = message.raw;
+
+      messageContent.appendChild(messageContentTemplate);
+    },
+
+    /**
+     * Render the list of the messages. Also add event listener when click on a
+     * message then it will load that conent.
+     *
+     * @param {Object} messages - the list of the given message.
+     */
+    renderMessageList: function(messages) {
+      var messageListTemplate;
+
+      var messageList =
+        document
+          .querySelector('ul[data-content-type=message-list]');
+
+      messages.forEach(function(message) {
+        messageListTemplate =
+          document
+            .querySelector('template[data-content-type=message-list-template]')
+            .content
+            .cloneNode(true);
+
+        messageListTemplate
+          .querySelector('li')
+          .addEventListener('click', function() {
+            MailGrabber.getMessage(message.id);
+          });
+
+        messageListTemplate
+          .querySelector('div[data-content-type=message-senders]')
+          .innerHTML = message.senders;
+
+        messageListTemplate
+          .querySelector('time[data-content-type=message-sent-at]')
+          .innerHTML =
+            MailGrabber
+              .formatDateTime(message.created_at, 'messageListDateOrTime');
+
+        messageListTemplate
+          .querySelector('div[data-content-type=message-subject]')
+          .innerHTML = message.subject;
+
+        messageList.appendChild(messageListTemplate);
+      });
+    },
+
+    /**
+     * Render senders and recipients data of the message.
+     *
+     * @param {Object} message - the requested message
+     *
+     * @return {Object} the rendered metadata
+     */
+    renderMetadata: function(message) {
+      var metadata =
+        '<dt>From:</dt><dd>' + message.senders + '</dd>' +
+        '<dt>To:</dt><dd>' + message.recipients + '</dd>';
+
+      if(message.carbon_copy) {
+        metadata += '<dt>Cc:</dt><dd>' + message.carbon_copy + '</dd>';
+      }
+
+      if(message.blind_carbon_copy) {
+        metadata += '<dt>Bcc:</dt><dd>' + message.blind_carbon_copy + '</dd>';
+      }
+
+      return metadata;
+    },
+
+    /**
+     * Request function to get data from the server.
+     *
+     * @param {String} method - the request method e.g. GET, POST, DELETE
+     * @param {String} path - the path which we can get/send data
+     * @param {Function} fn - the function which handle the response
+     */
+    request: function(method, path, fn) {
+      var xhr = new XMLHttpRequest();
+
+      xhr.onload = function() {
+        if(xhr.status === 200) {
+          fn(xhr.responseText);
+        } else {
+          console.log('MailGrabberRequestError:', xhr.status, xhr.statusText);
+        }
+      };
+      xhr.open(method, MailGrabber.rootPath() + path, true);
+      xhr.send();
+    },
+
+    /**
+     * Root path which returns back with the server's root path. It can be empty
+     * string or a string. It depends on how the server is running (standalone
+     * or in Ruby on Rails).
+     */
+    rootPath: function() {
+      return document.querySelector('body').dataset.rootPath;
+    }
+  };
+
+  /**
+   * When DOM loaded then call MailGrabber's init function.
+   */
+  document.addEventListener('DOMContentLoaded', MailGrabber.init);
+}).call(this);