Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
finish: ->
      return unless @_loadingElem?
      # Again, define a listener to run once the loading screen has fully transitioned out
      listener = =>
        # Remove the loading screen from the body
        document.body.removeChild(@_loadingElem)
        # Add a class to the body to signal that the loading screen has finished and the app is ready
        document.body.className += " pg-loaded"
        if transitionEvent? then @_loadingElem.removeEventListener(transitionEvent, listener)
        # Reset the loading screen element since it's no longer attached to the DOM
        @_loadingElem = null

      # Detect CSS animation support. If not found, we'll call the listener immediately. Otherwise, we'll wait
      if transitionEvent?
        # Set a class on the loading screen to trigger a fadeout animation
        @_loadingElem.className += " pg-loaded"
        # When the loading screen is finished fading out, we'll remove it from the DOM
        @_loadingElem.addEventListener(transitionEvent, listener)
      else
        listener()

    updateLoadingHtml: (loadingHtml, immediately=false) ->
      if immediately
        # Ignore any loading HTML that may be queued up. Show this immediately
        @_loadingHtmlToDisplay = [loadingHtml]
        @_readyToShowLoadingHtml = true
      else
        # Add to an array of HTML to display to the user
        @_loadingHtmlToDisplay.push(loadingHtml)
      # If ready, let's display the new loading HTML
      if @_readyToShowLoadingHtml then @_changeLoadingHtml()

    _changeLoadingHtml: ->
      @_readyToShowLoadingHtml = false

      loadingListener = =>
        # New loading HTML has fully transitioned in. We're now ready to show a new message/HTML
        @_readyToShowLoadingHtml = true
        # Remove the CSS class that triggered the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-loading ", "")
        if transitionEvent? then @_loadingHtmlElem.removeEventListener(transitionEvent, loadingListener)
        # Check if there's still HTML left in the queue to display. If so, let's show it
        if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()
```

Response:
({
  finish: function() {
    var listener;
    if (this._loadingElem == null) {
      return;
    }
    // Again, define a listener to run once the loading screen has fully transitioned out
    listener = () => {
      // Remove the loading screen from the body
      document.body.removeChild(this._loadingElem);
      // Add a class to the body to signal that the loading screen has finished and the app is ready
      document.body.className += " pg-loaded";
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingElem.removeEventListener(transitionEvent, listener);
      }
      // Reset the loading screen element since it's no longer attached to the DOM
      return this._loadingElem = null;
    };
    // Detect CSS animation support. If not found, we'll call the listener immediately. Otherwise, we'll wait
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      // Set a class on the loading screen to trigger a fadeout animation
      this._loadingElem.className += " pg-loaded";
      // When the loading screen is finished fading out, we'll remove it from the DOM
      return this._loadingElem.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  updateLoadingHtml: function(loadingHtml, immediately = false) {
    if (immediately) {
      // Ignore any loading HTML that may be queued up. Show this immediately
      this._loadingHtmlToDisplay = [loadingHtml];
      this._readyToShowLoadingHtml = true;
    } else {
      // Add to an array of HTML to display to the user
      this._loadingHtmlToDisplay.push(loadingHtml);
    }
    // If ready, let's display the new loading HTML
    if (this._readyToShowLoadingHtml) {
      return this._changeLoadingHtml();
    }
  },
  _changeLoadingHtml: function() {
    var loadingListener;
    this._readyToShowLoadingHtml = false;
    return loadingListener = () => {
      // New loading HTML has fully transitioned in. We're now ready to show a new message/HTML
      this._readyToShowLoadingHtml = true;
      // Remove the CSS class that triggered the fade in animation
      this._loadingHtmlElem.className = this._loadingHtmlElem.className.replace(" pg-loading ", "");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtmlElem.removeEventListener(transitionEvent, loadingListener);
      }
      // Check if there's still HTML left in the queue to display. If so, let's show it
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
  }
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
({
  finish: function() {
    var listener;
    if (this._loadingElem == null) {
      return;
    }
    // Again, define a listener to run once the loading screen has fully transitioned out
    listener = () => {
      // Remove the loading screen from the body
      document.body.removeChild(this._loadingElem);
      // Add a class to the body to signal that the loading screen has finished and the app is ready
      document.body.className += " pg-loaded";
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingElem.removeEventListener(transitionEvent, listener);
      }
      // Reset the loading screen element since it's no longer attached to the DOM
      return this._loadingElem = null;
    };
    // Detect CSS animation support. If not found, we'll call the listener immediately. Otherwise, we'll wait
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      // Set a class on the loading screen to trigger a fadeout animation
      this._loadingElem.className += " pg-loaded";
      // When the loading screen is finished fading out, we'll remove it from the DOM
      return this._loadingElem.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  updateLoadingHtml: function(loadingHtml, immediately = false) {
    if (immediately) {
      // Ignore any loading HTML that may be queued up. Show this immediately
      this._loadingHtmlToDisplay = [loadingHtml];
      this._readyToShowLoadingHtml = true;
    } else {
      // Add to an array of HTML to display to the user
      this._loadingHtmlToDisplay.push(loadingHtml);
    }
    // If ready, let's display the new loading HTML
    if (this._readyToShowLoadingHtml) {
      return this._changeLoadingHtml();
    }
  },
  _changeLoadingHtml: function() {
    var loadingListener;
    this._readyToShowLoadingHtml = false;
    return loadingListener = () => {
      // New loading HTML has fully transitioned in. We're now ready to show a new message/HTML
      this._readyToShowLoadingHtml = true;
      // Remove the CSS class that triggered the fade in animation
      this._loadingHtmlElem.className = this._loadingHtmlElem.className.replace(" pg-loading ", "");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtmlElem.removeEventListener(transitionEvent, loadingListener);
      }
      // Check if there's still HTML left in the queue to display. If so, let's show it
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
  }
});
```

Response:
finish: ->
      return unless @_loadingElem?
      # Again, define a listener to run once the loading screen has fully transitioned out
      listener = =>
        # Remove the loading screen from the body
        document.body.removeChild(@_loadingElem)
        # Add a class to the body to signal that the loading screen has finished and the app is ready
        document.body.className += " pg-loaded"
        if transitionEvent? then @_loadingElem.removeEventListener(transitionEvent, listener)
        # Reset the loading screen element since it's no longer attached to the DOM
        @_loadingElem = null

      # Detect CSS animation support. If not found, we'll call the listener immediately. Otherwise, we'll wait
      if transitionEvent?
        # Set a class on the loading screen to trigger a fadeout animation
        @_loadingElem.className += " pg-loaded"
        # When the loading screen is finished fading out, we'll remove it from the DOM
        @_loadingElem.addEventListener(transitionEvent, listener)
      else
        listener()

    updateLoadingHtml: (loadingHtml, immediately=false) ->
      if immediately
        # Ignore any loading HTML that may be queued up. Show this immediately
        @_loadingHtmlToDisplay = [loadingHtml]
        @_readyToShowLoadingHtml = true
      else
        # Add to an array of HTML to display to the user
        @_loadingHtmlToDisplay.push(loadingHtml)
      # If ready, let's display the new loading HTML
      if @_readyToShowLoadingHtml then @_changeLoadingHtml()

    _changeLoadingHtml: ->
      @_readyToShowLoadingHtml = false

      loadingListener = =>
        # New loading HTML has fully transitioned in. We're now ready to show a new message/HTML
        @_readyToShowLoadingHtml = true
        # Remove the CSS class that triggered the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-loading ", "")
        if transitionEvent? then @_loadingHtmlElem.removeEventListener(transitionEvent, loadingListener)
        # Check if there's still HTML left in the queue to display. If so, let's show it
        if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()


Prompt:
finish: ->
      return unless @_loadingElem?
      # Again, define a listener to run once the loading screen has fully transitioned out
      listener = =>
        # Remove the loading screen from the body
        document.body.removeChild(@_loadingElem)
        # Add a class to the body to signal that the loading screen has finished and the app is ready
        document.body.className += " pg-loaded"
        if transitionEvent? then @_loadingElem.removeEventListener(transitionEvent, listener)
        # Reset the loading screen element since it's no longer attached to the DOM
        @_loadingElem = null

      # Detect CSS animation support. If not found, we'll call the listener immediately. Otherwise, we'll wait
      if transitionEvent?
        # Set a class on the loading screen to trigger a fadeout animation
        @_loadingElem.className += " pg-loaded"
        # When the loading screen is finished fading out, we'll remove it from the DOM
        @_loadingElem.addEventListener(transitionEvent, listener)
      else
        listener()

Response:
updateLoadingHtml: (loadingHtml, immediately=false) ->
      if immediately
        # Ignore any loading HTML that may be queued up. Show this immediately
        @_loadingHtmlToDisplay = [loadingHtml]
        @_readyToShowLoadingHtml = true
      else
        # Add to an array of HTML to display to the user
        @_loadingHtmlToDisplay.push(loadingHtml)
      # If ready, let's display the new loading HTML
      if @_readyToShowLoadingHtml then @_changeLoadingHtml()

    _changeLoadingHtml: ->
      @_readyToShowLoadingHtml = false

      loadingListener = =>
        # New loading HTML has fully transitioned in. We're now ready to show a new message/HTML
        @_readyToShowLoadingHtml = true
        # Remove the CSS class that triggered the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-loading ", "")
        if transitionEvent? then @_loadingHtmlElem.removeEventListener(transitionEvent, loadingListener)
        # Check if there's still HTML left in the queue to display. If so, let's show it
        if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()


Response:
removingListener = =>
        # Last loading HTML to display has fully transitioned out. Time to transition the new in
        @_loadingHtmlElem.innerHTML = @_loadingHtmlToDisplay.shift()
        # Add the CSS class to trigger the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-removing ", " pg-loading ")
        if transitionEvent?
          @_loadingHtmlElem.removeEventListener(transitionEvent, removingListener)
          @_loadingHtmlElem.addEventListener(transitionEvent, loadingListener)
        else
          loadingListener()

      if transitionEvent?
        # Add the CSS class that will cause the HTML to fade out
        @_loadingHtmlElem.className += " pg-removing "
        @_loadingHtmlElem.addEventListener(transitionEvent, removingListener)
      else
        removingListener()

  pleaseWait = (options = {}) ->
    new PleaseWait(options)

  exports.pleaseWait = pleaseWait
  return pleaseWait


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
removingListener = =>
        # Last loading HTML to display has fully transitioned out. Time to transition the new in
        @_loadingHtmlElem.innerHTML = @_loadingHtmlToDisplay.shift()
        # Add the CSS class to trigger the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-removing ", " pg-loading ")
        if transitionEvent?
          @_loadingHtmlElem.removeEventListener(transitionEvent, removingListener)
          @_loadingHtmlElem.addEventListener(transitionEvent, loadingListener)
        else
          loadingListener()

      if transitionEvent?
        # Add the CSS class that will cause the HTML to fade out
        @_loadingHtmlElem.className += " pg-removing "
        @_loadingHtmlElem.addEventListener(transitionEvent, removingListener)
      else
        removingListener()

  pleaseWait = (options = {}) ->
    new PleaseWait(options)

  exports.pleaseWait = pleaseWait
  return pleaseWait
```

Response:
var pleaseWait, removingListener;

removingListener = () => {
  // Last loading HTML to display has fully transitioned out. Time to transition the new in
  this._loadingHtmlElem.innerHTML = this._loadingHtmlToDisplay.shift();
  // Add the CSS class to trigger the fade in animation
  this._loadingHtmlElem.className = this._loadingHtmlElem.className.replace(" pg-removing ", " pg-loading ");
  if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
    this._loadingHtmlElem.removeEventListener(transitionEvent, removingListener);
    return this._loadingHtmlElem.addEventListener(transitionEvent, loadingListener);
  } else {
    return loadingListener();
  }
};

if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
  // Add the CSS class that will cause the HTML to fade out
  this._loadingHtmlElem.className += " pg-removing ";
  this._loadingHtmlElem.addEventListener(transitionEvent, removingListener);
} else {
  removingListener();
}

pleaseWait = function(options = {}) {
  return new PleaseWait(options);
};

exports.pleaseWait = pleaseWait;

return pleaseWait;


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
var pleaseWait, removingListener;

removingListener = () => {
  // Last loading HTML to display has fully transitioned out. Time to transition the new in
  this._loadingHtmlElem.innerHTML = this._loadingHtmlToDisplay.shift();
  // Add the CSS class to trigger the fade in animation
  this._loadingHtmlElem.className = this._loadingHtmlElem.className.replace(" pg-removing ", " pg-loading ");
  if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
    this._loadingHtmlElem.removeEventListener(transitionEvent, removingListener);
    return this._loadingHtmlElem.addEventListener(transitionEvent, loadingListener);
  } else {
    return loadingListener();
  }
};

if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
  // Add the CSS class that will cause the HTML to fade out
  this._loadingHtmlElem.className += " pg-removing ";
  this._loadingHtmlElem.addEventListener(transitionEvent, removingListener);
} else {
  removingListener();
}

pleaseWait = function(options = {}) {
  return new PleaseWait(options);
};

exports.pleaseWait = pleaseWait;

return pleaseWait;
```

Response:
removingListener = =>
        # Last loading HTML to display has fully transitioned out. Time to transition the new in
        @_loadingHtmlElem.innerHTML = @_loadingHtmlToDisplay.shift()
        # Add the CSS class to trigger the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-removing ", " pg-loading ")
        if transitionEvent?
          @_loadingHtmlElem.removeEventListener(transitionEvent, removingListener)
          @_loadingHtmlElem.addEventListener(transitionEvent, loadingListener)
        else
          loadingListener()

      if transitionEvent?
        # Add the CSS class that will cause the HTML to fade out
        @_loadingHtmlElem.className += " pg-removing "
        @_loadingHtmlElem.addEventListener(transitionEvent, removingListener)
      else
        removingListener()

  pleaseWait = (options = {}) ->
    new PleaseWait(options)

  exports.pleaseWait = pleaseWait
  return pleaseWait


Prompt:
removingListener = =>
        # Last loading HTML to display has fully transitioned out. Time to transition the new in
        @_loadingHtmlElem.innerHTML = @_loadingHtmlToDisplay.shift()
        # Add the CSS class to trigger the fade in animation
        @_loadingHtmlElem.className = @_loadingHtmlElem.className.replace(" pg-removing ", " pg-loading ")
        if transitionEvent?
          @_loadingHtmlElem.removeEventListener(transitionEvent, removingListener)
          @_loadingHtmlElem.addEventListener(transitionEvent, loadingListener)
        else
          loadingListener()

Response:
if transitionEvent?
        # Add the CSS class that will cause the HTML to fade out
        @_loadingHtmlElem.className += " pg-removing "
        @_loadingHtmlElem.addEventListener(transitionEvent, removingListener)
      else
        removingListener()

  pleaseWait = (options = {}) ->
    new PleaseWait(options)

  exports.pleaseWait = pleaseWait
  return pleaseWait


Response:
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions
        return val if el.style[key]?

    transitionEvent = getTransitionEvent()

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        logo: null
        loadingHtml: null
        template: """

        """


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions
        return val if el.style[key]?

    transitionEvent = getTransitionEvent()

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        logo: null
        loadingHtml: null
        template: """
          <div class='pg-loading-inner'>
            <div class='pg-loading-center-outer'>
              <div class='pg-loading-center-middle'>
                <h1 class='pg-loading-logo-header'>
                  <img class='pg-loading-logo'></img>
                </h1>
                <div class='pg-loading-html'>
                </div>
              </div>
            </div>
          </div>
        """
```

Response:
(function(root, factory) {
  if (typeof exports === "object") {
    // CommonJS
    factory(exports);
  } else if (typeof define === "function" && define.amd) {
    // AMD. Register as an anonymous module.
    define(["exports"], factory);
  } else {
    // Browser globals
    factory(root);
  }
})(this, function(exports) {
  var PleaseWait;
  return PleaseWait = function() {
    var _pleaseWait, getTransitionEvent, transitionEvent;
    getTransitionEvent = function() {
      var el, key, transitions, val;
      el = document.createElement('fakeelement');
      transitions = {
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd',
        'animation': 'animationend'
      };
      for (key in transitions) {
        val = transitions[key];
        if (el.style[key] != null) {
          return val;
        }
      }
    };
    transitionEvent = getTransitionEvent();
    return _pleaseWait = {
      defaultOptions: {
        backgroundColor: null,
        logo: null,
        loadingHtml: null,
        template: `

`
      }
    };
  };
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
(function(root, factory) {
  if (typeof exports === "object") {
    // CommonJS
    factory(exports);
  } else if (typeof define === "function" && define.amd) {
    // AMD. Register as an anonymous module.
    define(["exports"], factory);
  } else {
    // Browser globals
    factory(root);
  }
})(this, function(exports) {
  var PleaseWait;
  return PleaseWait = function() {
    var _pleaseWait, getTransitionEvent, transitionEvent;
    getTransitionEvent = function() {
      var el, key, transitions, val;
      el = document.createElement('fakeelement');
      transitions = {
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd',
        'animation': 'animationend'
      };
      for (key in transitions) {
        val = transitions[key];
        if (el.style[key] != null) {
          return val;
        }
      }
    };
    transitionEvent = getTransitionEvent();
    return _pleaseWait = {
      defaultOptions: {
        backgroundColor: null,
        logo: null,
        loadingHtml: null,
        template: `<div class='pg-loading-inner'>
  <div class='pg-loading-center-outer'>
    <div class='pg-loading-center-middle'>
      <h1 class='pg-loading-logo-header'>
        <img class='pg-loading-logo'></img>
      </h1>
      <div class='pg-loading-html'>
      </div>
    </div>
  </div>
</div>`
      }
    };
  };
});
```

Response:
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions
        return val if el.style[key]?

    transitionEvent = getTransitionEvent()

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        logo: null
        loadingHtml: null
        template: """

        """


Prompt:
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

Response:
for key, val of transitions
        return val if el.style[key]?

    transitionEvent = getTransitionEvent()

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        logo: null
        loadingHtml: null
        template: """

        """


Response:
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml, immediately=false) ->
        if immediately
          @_loadingHtmlToDisplay = [loadingHtml]
          @_readyToShowLoadingHtml = true
        else
          @_loadingHtmlToDisplay.push(loadingHtml)

        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml, immediately=false) ->
        if immediately
          @_loadingHtmlToDisplay = [loadingHtml]
          @_readyToShowLoadingHtml = true
        else
          @_loadingHtmlToDisplay.push(loadingHtml)

        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()
```

Response:
({
  done: function() {
    var listener;
    if (this._loadingDiv == null) {
      return;
    }
    listener = () => {
      document.body.removeChild(this._loadingDiv);
      document.body.className += " pg-loaded";
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      return this._loadingDiv = null;
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingDiv.className += " pg-loaded";
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  updateLoadingHtml: function(loadingHtml, immediately = false) {
    if (immediately) {
      this._loadingHtmlToDisplay = [loadingHtml];
      this._readyToShowLoadingHtml = true;
    } else {
      this._loadingHtmlToDisplay.push(loadingHtml);
    }
    if (this._readyToShowLoadingHtml) {
      return this._changeLoadingHtml();
    }
  },
  load: function(options = {}) {
    var listener, logo;
    options = this._createOptions(options);
    this._loadingDiv || (this._loadingDiv = document.createElement("header"));
    this._loadingHtmlToDisplay = [];
    this._loadingDiv.className = "pg-loading-screen";
    if (options.backgroundColor != null) {
      this._loadingDiv.style.backgroundColor = options.backgroundColor;
    }
    this._loadingDiv.innerHTML = options.template;
    this._loadingHtml = this._loadingDiv.getElementsByClassName("pg-loading-html")[0];
    if (this._loadingHtml != null) {
      this._loadingHtml.innerHTML = options.loadingHtml;
    }
    this._readyToShowLoadingHtml = false;
    logo = this._loadingDiv.getElementsByClassName("pg-loading-logo")[0];
    if (logo != null) {
      logo.src = options.logo;
    }
    document.body.appendChild(this._loadingDiv);
    this._loadingDiv.className += " pg-loading";
    return listener = () => {
      this._readyToShowLoadingHtml = true;
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, listener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
  }
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
({
  done: function() {
    var listener;
    if (this._loadingDiv == null) {
      return;
    }
    listener = () => {
      document.body.removeChild(this._loadingDiv);
      document.body.className += " pg-loaded";
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      return this._loadingDiv = null;
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingDiv.className += " pg-loaded";
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  updateLoadingHtml: function(loadingHtml, immediately = false) {
    if (immediately) {
      this._loadingHtmlToDisplay = [loadingHtml];
      this._readyToShowLoadingHtml = true;
    } else {
      this._loadingHtmlToDisplay.push(loadingHtml);
    }
    if (this._readyToShowLoadingHtml) {
      return this._changeLoadingHtml();
    }
  },
  load: function(options = {}) {
    var listener, logo;
    options = this._createOptions(options);
    this._loadingDiv || (this._loadingDiv = document.createElement("header"));
    this._loadingHtmlToDisplay = [];
    this._loadingDiv.className = "pg-loading-screen";
    if (options.backgroundColor != null) {
      this._loadingDiv.style.backgroundColor = options.backgroundColor;
    }
    this._loadingDiv.innerHTML = options.template;
    this._loadingHtml = this._loadingDiv.getElementsByClassName("pg-loading-html")[0];
    if (this._loadingHtml != null) {
      this._loadingHtml.innerHTML = options.loadingHtml;
    }
    this._readyToShowLoadingHtml = false;
    logo = this._loadingDiv.getElementsByClassName("pg-loading-logo")[0];
    if (logo != null) {
      logo.src = options.logo;
    }
    document.body.appendChild(this._loadingDiv);
    this._loadingDiv.className += " pg-loading";
    return listener = () => {
      this._readyToShowLoadingHtml = true;
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, listener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
  }
});
```

Response:
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml, immediately=false) ->
        if immediately
          @_loadingHtmlToDisplay = [loadingHtml]
          @_readyToShowLoadingHtml = true
        else
          @_loadingHtmlToDisplay.push(loadingHtml)

        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()


Prompt:
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml, immediately=false) ->
        if immediately
          @_loadingHtmlToDisplay = [loadingHtml]
          @_readyToShowLoadingHtml = true
        else
          @_loadingHtmlToDisplay.push(loadingHtml)

Response:
if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()


Response:
if transitionEvent?
          @_loadingHtml.addEventListener(transitionEvent, listener)
        else
          listener()

        return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
if transitionEvent?
          @_loadingHtml.addEventListener(transitionEvent, listener)
        else
          listener()

        return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()
```

Response:
if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
  this._loadingHtml.addEventListener(transitionEvent, listener);
} else {
  listener();
}

return this._loadingDiv;

({
  _createOptions: function(options = {}) {
    var defaultOptions, k, newOptions, v;
    defaultOptions = this.defaultOptions;
    newOptions = {};
// Set options
    for (k in defaultOptions) {
      v = defaultOptions[k];
      newOptions[k] = options[k] != null ? options[k] : v;
    }
    return newOptions;
  },
  _changeLoadingHtml: function() {
    var loadingListener, removingListener;
    this._readyToShowLoadingHtml = false;
    loadingListener = () => {
      this._readyToShowLoadingHtml = true;
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-loading ", "");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, loadingListener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
    removingListener = () => {
      this._loadingHtml.innerHTML = this._loadingHtmlToDisplay.shift();
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-removing ", " pg-loading ");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, removingListener);
        return this._loadingHtml.addEventListener(transitionEvent, loadingListener);
      } else {
        return loadingListener();
      }
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingHtml.className += " pg-removing ";
      return this._loadingHtml.addEventListener(transitionEvent, removingListener);
    } else {
      return removingListener();
    }
  }
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
  this._loadingHtml.addEventListener(transitionEvent, listener);
} else {
  listener();
}

return this._loadingDiv;

({
  _createOptions: function(options = {}) {
    var defaultOptions, k, newOptions, v;
    defaultOptions = this.defaultOptions;
    newOptions = {};
// Set options
    for (k in defaultOptions) {
      v = defaultOptions[k];
      newOptions[k] = options[k] != null ? options[k] : v;
    }
    return newOptions;
  },
  _changeLoadingHtml: function() {
    var loadingListener, removingListener;
    this._readyToShowLoadingHtml = false;
    loadingListener = () => {
      this._readyToShowLoadingHtml = true;
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-loading ", "");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, loadingListener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
    removingListener = () => {
      this._loadingHtml.innerHTML = this._loadingHtmlToDisplay.shift();
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-removing ", " pg-loading ");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, removingListener);
        return this._loadingHtml.addEventListener(transitionEvent, loadingListener);
      } else {
        return loadingListener();
      }
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingHtml.className += " pg-removing ";
      return this._loadingHtml.addEventListener(transitionEvent, removingListener);
    } else {
      return removingListener();
    }
  }
});
```

Response:
if transitionEvent?
          @_loadingHtml.addEventListener(transitionEvent, listener)
        else
          listener()

        return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()


Prompt:
if transitionEvent?
          @_loadingHtml.addEventListener(transitionEvent, listener)
        else
          listener()

        return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

Response:
loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()


Response:
return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
      updateLoadingHtml: (html) -> _pleaseWait.updateLoadingHtml(html)
    }

  exports.pleaseWait = new PleaseWait()


Prompt:
return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()

Response:
updateLoadingHtml: (html) -> _pleaseWait.updateLoadingHtml(html)
    }

  exports.pleaseWait = new PleaseWait()


Response:
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml) ->
        @_loadingHtmlToDisplay.push(options.loadingHtml)
        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        if transitionEvent?
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml) ->
        @_loadingHtmlToDisplay.push(options.loadingHtml)
        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        if transitionEvent?
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()
```

Response:
({
  done: function() {
    var listener;
    if (this._loadingDiv == null) {
      return;
    }
    listener = () => {
      document.body.removeChild(this._loadingDiv);
      document.body.className += " pg-loaded";
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      return this._loadingDiv = null;
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingDiv.className += " pg-loaded";
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  updateLoadingHtml: function(loadingHtml) {
    this._loadingHtmlToDisplay.push(options.loadingHtml);
    if (this._readyToShowLoadingHtml) {
      return this._changeLoadingHtml();
    }
  },
  load: function(options = {}) {
    var listener, logo;
    options = this._createOptions(options);
    this._loadingDiv || (this._loadingDiv = document.createElement("header"));
    this._loadingHtmlToDisplay = [];
    this._loadingDiv.className = "pg-loading-screen";
    if (options.backgroundColor != null) {
      this._loadingDiv.style.backgroundColor = options.backgroundColor;
    }
    this._loadingDiv.innerHTML = options.template;
    this._loadingHtml = this._loadingDiv.getElementsByClassName("pg-loading-html")[0];
    if (this._loadingHtml != null) {
      this._loadingHtml.innerHTML = options.loadingHtml;
    }
    this._readyToShowLoadingHtml = false;
    logo = this._loadingDiv.getElementsByClassName("pg-loading-logo")[0];
    if (logo != null) {
      logo.src = options.logo;
    }
    document.body.appendChild(this._loadingDiv);
    this._loadingDiv.className += " pg-loading";
    listener = () => {
      this._readyToShowLoadingHtml = true;
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  }
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
({
  done: function() {
    var listener;
    if (this._loadingDiv == null) {
      return;
    }
    listener = () => {
      document.body.removeChild(this._loadingDiv);
      document.body.className += " pg-loaded";
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      return this._loadingDiv = null;
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingDiv.className += " pg-loaded";
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  updateLoadingHtml: function(loadingHtml) {
    this._loadingHtmlToDisplay.push(options.loadingHtml);
    if (this._readyToShowLoadingHtml) {
      return this._changeLoadingHtml();
    }
  },
  load: function(options = {}) {
    var listener, logo;
    options = this._createOptions(options);
    this._loadingDiv || (this._loadingDiv = document.createElement("header"));
    this._loadingHtmlToDisplay = [];
    this._loadingDiv.className = "pg-loading-screen";
    if (options.backgroundColor != null) {
      this._loadingDiv.style.backgroundColor = options.backgroundColor;
    }
    this._loadingDiv.innerHTML = options.template;
    this._loadingHtml = this._loadingDiv.getElementsByClassName("pg-loading-html")[0];
    if (this._loadingHtml != null) {
      this._loadingHtml.innerHTML = options.loadingHtml;
    }
    this._readyToShowLoadingHtml = false;
    logo = this._loadingDiv.getElementsByClassName("pg-loading-logo")[0];
    if (logo != null) {
      logo.src = options.logo;
    }
    document.body.appendChild(this._loadingDiv);
    this._loadingDiv.className += " pg-loading";
    listener = () => {
      this._readyToShowLoadingHtml = true;
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  }
});
```

Response:
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml) ->
        @_loadingHtmlToDisplay.push(options.loadingHtml)
        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")
        @_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        if transitionEvent?
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()


Prompt:
done: ->
        return unless @_loadingDiv?
        listener = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      updateLoadingHtml: (loadingHtml) ->
        @_loadingHtmlToDisplay.push(options.loadingHtml)
        if @_readyToShowLoadingHtml then @_changeLoadingHtml()

      load: (options = {}) ->
        options                            = @_createOptions(options)
        @_loadingDiv                       ||= document.createElement("header")

Response:
@_loadingHtmlToDisplay             = []
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = options.backgroundColor if options.backgroundColor?
        @_loadingDiv.innerHTML             = options.template
        @_loadingHtml                      = @_loadingDiv.getElementsByClassName("pg-loading-html")[0]
        @_loadingHtml.innerHTML            = options.loadingHtml if @_loadingHtml?
        @_readyToShowLoadingHtml           = false
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        logo.src                           = options.logo if logo?

        document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"

        listener = =>
          @_readyToShowLoadingHtml = true
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        if transitionEvent?
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()


Response:
return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()

    return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
      updateLoadingHtml: (html) -> _pleaseWait.updateLoadingHtml(html)
    }


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()

    return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
      updateLoadingHtml: (html) -> _pleaseWait.updateLoadingHtml(html)
    }
```

Response:
return this._loadingDiv({
  _createOptions: function(options = {}) {
    var defaultOptions, k, newOptions, v;
    defaultOptions = this.defaultOptions;
    newOptions = {};
// Set options
    for (k in defaultOptions) {
      v = defaultOptions[k];
      newOptions[k] = options[k] != null ? options[k] : v;
    }
    return newOptions;
  },
  _changeLoadingHtml: function() {
    var loadingListener, removingListener;
    this._readyToShowLoadingHtml = false;
    loadingListener = () => {
      this._readyToShowLoadingHtml = true;
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-loading ", "");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, loadingListener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
    removingListener = () => {
      this._loadingHtml.innerHTML = this._loadingHtmlToDisplay.shift();
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-removing ", " pg-loading ");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, removingListener);
        return this._loadingHtml.addEventListener(transitionEvent, loadingListener);
      } else {
        return loadingListener();
      }
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingHtml.className += " pg-removing ";
      return this._loadingHtml.addEventListener(transitionEvent, removingListener);
    } else {
      return removingListener();
    }
  }
});

return {
  start: function(options = {}) {
    return _pleaseWait.load(options);
  },
  finish: function() {
    return _pleaseWait.done();
  },
  updateLoadingHtml: function(html) {
    return _pleaseWait.updateLoadingHtml(html);
  }
};


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
return this._loadingDiv({
  _createOptions: function(options = {}) {
    var defaultOptions, k, newOptions, v;
    defaultOptions = this.defaultOptions;
    newOptions = {};
// Set options
    for (k in defaultOptions) {
      v = defaultOptions[k];
      newOptions[k] = options[k] != null ? options[k] : v;
    }
    return newOptions;
  },
  _changeLoadingHtml: function() {
    var loadingListener, removingListener;
    this._readyToShowLoadingHtml = false;
    loadingListener = () => {
      this._readyToShowLoadingHtml = true;
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-loading ", "");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, loadingListener);
      }
      if (this._loadingHtmlToDisplay.length > 0) {
        return this._changeLoadingHtml();
      }
    };
    removingListener = () => {
      this._loadingHtml.innerHTML = this._loadingHtmlToDisplay.shift();
      this._loadingHtml.className = this._loadingHtml.className.replace(" pg-removing ", " pg-loading ");
      if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
        this._loadingHtml.removeEventListener(transitionEvent, removingListener);
        return this._loadingHtml.addEventListener(transitionEvent, loadingListener);
      } else {
        return loadingListener();
      }
    };
    if (typeof transitionEvent !== "undefined" && transitionEvent !== null) {
      this._loadingHtml.className += " pg-removing ";
      return this._loadingHtml.addEventListener(transitionEvent, removingListener);
    } else {
      return removingListener();
    }
  }
});

return {
  start: function(options = {}) {
    return _pleaseWait.load(options);
  },
  finish: function() {
    return _pleaseWait.done();
  },
  updateLoadingHtml: function(html) {
    return _pleaseWait.updateLoadingHtml(html);
  }
};
```

Response:
return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

        removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()

    return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
      updateLoadingHtml: (html) -> _pleaseWait.updateLoadingHtml(html)
    }


Prompt:
return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

      _changeLoadingHtml: ->
        @_readyToShowLoadingHtml = false

        loadingListener  = =>
          @_readyToShowLoadingHtml = true
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-loading ", "")
          if transitionEvent? then @_loadingHtml.removeEventListener(transitionEvent, loadingListener)
          if @_loadingHtmlToDisplay.length > 0 then @_changeLoadingHtml()

Response:
removingListener = =>
          @_loadingHtml.innerHTML = @_loadingHtmlToDisplay.shift()
          @_loadingHtml.className = @_loadingHtml.className.replace(" pg-removing ", " pg-loading ")
          if transitionEvent?
            @_loadingHtml.removeEventListener(transitionEvent, removingListener)
            @_loadingHtml.addEventListener(transitionEvent, loadingListener)
          else
            loadingListener()

        if transitionEvent?
          @_loadingHtml.className += " pg-removing "
          @_loadingHtml.addEventListener(transitionEvent, removingListener)
        else
          removingListener()

    return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
      updateLoadingHtml: (html) -> _pleaseWait.updateLoadingHtml(html)
    }


Response:
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions
        return val if el.style[key]?

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        message: null
        showEllipsis: true
        logo: null
        spinnerTemplate: null
        template: """

        """


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions
        return val if el.style[key]?

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        message: null
        showEllipsis: true
        logo: null
        spinnerTemplate: null
        template: """
          <div class='pg-loading-inner'>
            <div class='pg-loading-center-outer'>
              <div class='pg-loading-center-middle'>
                <h1 class='pg-loading-logo-header'>
                  <img class='pg-loading-logo'></img>
                </h1>
                <p class='pg-loading-message'>
                </p>
                <div class='pg-loading-spinner'>
                </div>
              </div>
            </div>
          </div>
        """
```

Response:
(function(root, factory) {
  if (typeof exports === "object") {
    // CommonJS
    factory(exports);
  } else if (typeof define === "function" && define.amd) {
    // AMD. Register as an anonymous module.
    define(["exports"], factory);
  } else {
    // Browser globals
    factory(root);
  }
})(this, function(exports) {
  var PleaseWait;
  return PleaseWait = function() {
    var _pleaseWait, getTransitionEvent;
    getTransitionEvent = function() {
      var el, key, transitions, val;
      el = document.createElement('fakeelement');
      transitions = {
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd',
        'animation': 'animationend'
      };
      for (key in transitions) {
        val = transitions[key];
        if (el.style[key] != null) {
          return val;
        }
      }
    };
    return _pleaseWait = {
      defaultOptions: {
        backgroundColor: null,
        message: null,
        showEllipsis: true,
        logo: null,
        spinnerTemplate: null,
        template: `

`
      }
    };
  };
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
(function(root, factory) {
  if (typeof exports === "object") {
    // CommonJS
    factory(exports);
  } else if (typeof define === "function" && define.amd) {
    // AMD. Register as an anonymous module.
    define(["exports"], factory);
  } else {
    // Browser globals
    factory(root);
  }
})(this, function(exports) {
  var PleaseWait;
  return PleaseWait = function() {
    var _pleaseWait, getTransitionEvent;
    getTransitionEvent = function() {
      var el, key, transitions, val;
      el = document.createElement('fakeelement');
      transitions = {
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd',
        'animation': 'animationend'
      };
      for (key in transitions) {
        val = transitions[key];
        if (el.style[key] != null) {
          return val;
        }
      }
    };
    return _pleaseWait = {
      defaultOptions: {
        backgroundColor: null,
        message: null,
        showEllipsis: true,
        logo: null,
        spinnerTemplate: null,
        template: `<div class='pg-loading-inner'>
  <div class='pg-loading-center-outer'>
    <div class='pg-loading-center-middle'>
      <h1 class='pg-loading-logo-header'>
        <img class='pg-loading-logo'></img>
      </h1>
      <p class='pg-loading-message'>
      </p>
      <div class='pg-loading-spinner'>
      </div>
    </div>
  </div>
</div>`
      }
    };
  };
});
```

Response:
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions
        return val if el.style[key]?

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        message: null
        showEllipsis: true
        logo: null
        spinnerTemplate: null
        template: """

        """


Prompt:
((root, factory) ->
  if typeof exports is "object"
    # CommonJS
    factory exports
  else if typeof define is "function" and define.amd
    # AMD. Register as an anonymous module.
    define ["exports"], factory
  else
    # Browser globals
    factory root
  return
) this, (exports) ->
  PleaseWait = ->
    getTransitionEvent = ->
      el = document.createElement('fakeelement')
      transitions =
        'WebkitAnimation': 'webkitAnimationEnd',
        'OAnimation': 'oAnimationEnd',
        'msAnimation': 'MSAnimationEnd',
        'MozAnimation': 'mozAnimationEnd'
        'animation' : 'animationend'

      for key, val of transitions

Response:
return val if el.style[key]?

    _pleaseWait =
      defaultOptions:
        backgroundColor: null
        message: null
        showEllipsis: true
        logo: null
        spinnerTemplate: null
        template: """

        """


Response:
done: ->
        return unless @_loadingDiv?
        transitionEvent = getTransitionEvent()
        listener        = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      load: (options = {}) ->
        @_options                          = @_createOptions(options)
        @_loadingDiv                       = document.createElement("header")
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = @_options.backgroundColor if @_options.backgroundColor?
        @_loadingDiv.innerHTML             = @_options.template
        spinnerDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-spinner")[0]
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        messageDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-message")[0]

        if logo?
          logo.src = @_options.logo

        if spinnerDiv?
          if @_options.spinnerTemplate?
            spinnerDiv.innerHTML = @_options.spinnerTemplate
          else
            spinnerDiv.style.display = 'none'

        if messageDiv?
          if @_options.message?
            messageDiv.innerHTML = if @_options.showEllipsis
              """
                #{@_options.message}
                .
                .
                .
              """
            else
              @_options.message
          else
            messageDiv.style.display = 'none'


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
done: ->
        return unless @_loadingDiv?
        transitionEvent = getTransitionEvent()
        listener        = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      load: (options = {}) ->
        @_options                          = @_createOptions(options)
        @_loadingDiv                       = document.createElement("header")
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = @_options.backgroundColor if @_options.backgroundColor?
        @_loadingDiv.innerHTML             = @_options.template
        spinnerDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-spinner")[0]
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        messageDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-message")[0]

        if logo?
          logo.src = @_options.logo

        if spinnerDiv?
          if @_options.spinnerTemplate?
            spinnerDiv.innerHTML = @_options.spinnerTemplate
          else
            spinnerDiv.style.display = 'none'

        if messageDiv?
          if @_options.message?
            messageDiv.innerHTML = if @_options.showEllipsis
              """
                #{@_options.message}
                <span class='ellipsis one'>.</span>
                <span class='ellipsis two'>.</span>
                <span class='ellipsis three'>.</span>
              """
            else
              @_options.message
          else
            messageDiv.style.display = 'none'
```

Response:
({
  done: function() {
    var listener, transitionEvent;
    if (this._loadingDiv == null) {
      return;
    }
    transitionEvent = getTransitionEvent();
    listener = () => {
      document.body.removeChild(this._loadingDiv);
      document.body.className += " pg-loaded";
      if (transitionEvent != null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      return this._loadingDiv = null;
    };
    if (transitionEvent != null) {
      this._loadingDiv.className += " pg-loaded";
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  load: function(options = {}) {
    var logo, messageDiv, spinnerDiv;
    this._options = this._createOptions(options);
    this._loadingDiv = document.createElement("header");
    this._loadingDiv.className = "pg-loading-screen";
    if (this._options.backgroundColor != null) {
      this._loadingDiv.style.backgroundColor = this._options.backgroundColor;
    }
    this._loadingDiv.innerHTML = this._options.template;
    spinnerDiv = this._loadingDiv.getElementsByClassName("pg-loading-spinner")[0];
    logo = this._loadingDiv.getElementsByClassName("pg-loading-logo")[0];
    messageDiv = this._loadingDiv.getElementsByClassName("pg-loading-message")[0];
    if (logo != null) {
      logo.src = this._options.logo;
    }
    if (spinnerDiv != null) {
      if (this._options.spinnerTemplate != null) {
        spinnerDiv.innerHTML = this._options.spinnerTemplate;
      } else {
        spinnerDiv.style.display = 'none';
      }
    }
    if (messageDiv != null) {
      if (this._options.message != null) {
        return messageDiv.innerHTML = this._options.showEllipsis ? `${this._options.message}
.
.
.` : this._options.message;
      } else {
        return messageDiv.style.display = 'none';
      }
    }
  }
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
({
  done: function() {
    var listener, transitionEvent;
    if (this._loadingDiv == null) {
      return;
    }
    transitionEvent = getTransitionEvent();
    listener = () => {
      document.body.removeChild(this._loadingDiv);
      document.body.className += " pg-loaded";
      if (transitionEvent != null) {
        this._loadingDiv.removeEventListener(transitionEvent, listener);
      }
      return this._loadingDiv = null;
    };
    if (transitionEvent != null) {
      this._loadingDiv.className += " pg-loaded";
      return this._loadingDiv.addEventListener(transitionEvent, listener);
    } else {
      return listener();
    }
  },
  load: function(options = {}) {
    var logo, messageDiv, spinnerDiv;
    this._options = this._createOptions(options);
    this._loadingDiv = document.createElement("header");
    this._loadingDiv.className = "pg-loading-screen";
    if (this._options.backgroundColor != null) {
      this._loadingDiv.style.backgroundColor = this._options.backgroundColor;
    }
    this._loadingDiv.innerHTML = this._options.template;
    spinnerDiv = this._loadingDiv.getElementsByClassName("pg-loading-spinner")[0];
    logo = this._loadingDiv.getElementsByClassName("pg-loading-logo")[0];
    messageDiv = this._loadingDiv.getElementsByClassName("pg-loading-message")[0];
    if (logo != null) {
      logo.src = this._options.logo;
    }
    if (spinnerDiv != null) {
      if (this._options.spinnerTemplate != null) {
        spinnerDiv.innerHTML = this._options.spinnerTemplate;
      } else {
        spinnerDiv.style.display = 'none';
      }
    }
    if (messageDiv != null) {
      if (this._options.message != null) {
        return messageDiv.innerHTML = this._options.showEllipsis ? `${this._options.message}
<span class='ellipsis one'>.</span>
<span class='ellipsis two'>.</span>
<span class='ellipsis three'>.</span>` : this._options.message;
      } else {
        return messageDiv.style.display = 'none';
      }
    }
  }
});
```

Response:
done: ->
        return unless @_loadingDiv?
        transitionEvent = getTransitionEvent()
        listener        = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      load: (options = {}) ->
        @_options                          = @_createOptions(options)
        @_loadingDiv                       = document.createElement("header")
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = @_options.backgroundColor if @_options.backgroundColor?
        @_loadingDiv.innerHTML             = @_options.template
        spinnerDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-spinner")[0]
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]
        messageDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-message")[0]

        if logo?
          logo.src = @_options.logo

        if spinnerDiv?
          if @_options.spinnerTemplate?
            spinnerDiv.innerHTML = @_options.spinnerTemplate
          else
            spinnerDiv.style.display = 'none'

        if messageDiv?
          if @_options.message?
            messageDiv.innerHTML = if @_options.showEllipsis
              """
                #{@_options.message}
                .
                .
                .
              """
            else
              @_options.message
          else
            messageDiv.style.display = 'none'


Prompt:
done: ->
        return unless @_loadingDiv?
        transitionEvent = getTransitionEvent()
        listener        = =>
          document.body.removeChild(@_loadingDiv)
          document.body.className += " pg-loaded"
          if transitionEvent? then @_loadingDiv.removeEventListener(transitionEvent, listener)
          @_loadingDiv = null

        if transitionEvent?
          @_loadingDiv.className  += " pg-loaded"
          @_loadingDiv.addEventListener(transitionEvent, listener)
        else
          listener()

      load: (options = {}) ->
        @_options                          = @_createOptions(options)
        @_loadingDiv                       = document.createElement("header")
        @_loadingDiv.className             = "pg-loading-screen"
        @_loadingDiv.style.backgroundColor = @_options.backgroundColor if @_options.backgroundColor?
        @_loadingDiv.innerHTML             = @_options.template
        spinnerDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-spinner")[0]
        logo                               = @_loadingDiv.getElementsByClassName("pg-loading-logo")[0]

Response:
messageDiv                         = @_loadingDiv.getElementsByClassName("pg-loading-message")[0]

        if logo?
          logo.src = @_options.logo

        if spinnerDiv?
          if @_options.spinnerTemplate?
            spinnerDiv.innerHTML = @_options.spinnerTemplate
          else
            spinnerDiv.style.display = 'none'

        if messageDiv?
          if @_options.message?
            messageDiv.innerHTML = if @_options.showEllipsis
              """
                #{@_options.message}
                .
                .
                .
              """
            else
              @_options.message
          else
            messageDiv.style.display = 'none'


Response:
document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"
        return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions
          newOptions[k] = if options[k]? then options[k] else v

        newOptions

    return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
    }

  exports.pleaseWait = new PleaseWait()


Prompt:
document.body.appendChild(@_loadingDiv)
        @_loadingDiv.className += " pg-loading"
        return @_loadingDiv

      _createOptions: (options = {}) ->
        defaultOptions = @defaultOptions
        newOptions     = {}

        # Set options
        for k, v of defaultOptions

Response:
newOptions[k] = if options[k]? then options[k] else v

        newOptions

    return {
      start  : (options = {}) -> _pleaseWait.load(options)
      finish : -> _pleaseWait.done()
    }

  exports.pleaseWait = new PleaseWait()


Response:
_ = require "underscore"
R = require "../R"

R.create "EditableText",
  propTypes:
    value: String
    setValue: Function

  shouldComponentUpdate: (nextProps) ->
    return @_isDirty or nextProps.value != @props.value

  render: ->
    props = {
      contentEditable: true
      onInput: @_onInput
      onKeyDown: @_onKeyDown
    }
    _.defaults(props, @props)
    R.div props

  componentDidMount: ->
    @_refresh()
    # Autofocus if empty string value.
    if @props.value == "" or !@props.value
      R.findDOMNode(@).focus()

  componentDidUpdate: ->
    @_refresh()

  _refresh: ->
    el = R.findDOMNode(@)
    if el.textContent != @props.value
      el.textContent = @props.value
    @_isDirty = false

  _onInput: ->
    @_isDirty = true
    el = R.findDOMNode(@)
    newValue = el.textContent
    @props.setValue(newValue)

  _onKeyDown: (e) ->
    if e.keyCode == 13 # Enter
      e.preventDefault()


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
_ = require "underscore"
R = require "../R"

R.create "EditableText",
  propTypes:
    value: String
    setValue: Function

  shouldComponentUpdate: (nextProps) ->
    return @_isDirty or nextProps.value != @props.value

  render: ->
    props = {
      contentEditable: true
      onInput: @_onInput
      onKeyDown: @_onKeyDown
    }
    _.defaults(props, @props)
    R.div props

  componentDidMount: ->
    @_refresh()
    # Autofocus if empty string value.
    if @props.value == "" or !@props.value
      R.findDOMNode(@).focus()

  componentDidUpdate: ->
    @_refresh()

  _refresh: ->
    el = R.findDOMNode(@)
    if el.textContent != @props.value
      el.textContent = @props.value
    @_isDirty = false

  _onInput: ->
    @_isDirty = true
    el = R.findDOMNode(@)
    newValue = el.textContent
    @props.setValue(newValue)

  _onKeyDown: (e) ->
    if e.keyCode == 13 # Enter
      e.preventDefault()
```

Response:
var R, _;

_ = require("underscore");

R = require("../R");

R.create("EditableText", {
  propTypes: {
    value: String,
    setValue: Function
  },
  shouldComponentUpdate: function(nextProps) {
    return this._isDirty || nextProps.value !== this.props.value;
  },
  render: function() {
    var props;
    props = {
      contentEditable: true,
      onInput: this._onInput,
      onKeyDown: this._onKeyDown
    };
    _.defaults(props, this.props);
    return R.div(props);
  },
  componentDidMount: function() {
    this._refresh();
    // Autofocus if empty string value.
    if (this.props.value === "" || !this.props.value) {
      return R.findDOMNode(this).focus();
    }
  },
  componentDidUpdate: function() {
    return this._refresh();
  },
  _refresh: function() {
    var el;
    el = R.findDOMNode(this);
    if (el.textContent !== this.props.value) {
      el.textContent = this.props.value;
    }
    return this._isDirty = false;
  },
  _onInput: function() {
    var el, newValue;
    this._isDirty = true;
    el = R.findDOMNode(this);
    newValue = el.textContent;
    return this.props.setValue(newValue);
  },
  _onKeyDown: function(e) {
    if (e.keyCode === 13) { // Enter
      return e.preventDefault();
    }
  }
});


Prompt:
Convert this JavaScript to CoffeeScript.
```javascript
var R, _;

_ = require("underscore");

R = require("../R");

R.create("EditableText", {
  propTypes: {
    value: String,
    setValue: Function
  },
  shouldComponentUpdate: function(nextProps) {
    return this._isDirty || nextProps.value !== this.props.value;
  },
  render: function() {
    var props;
    props = {
      contentEditable: true,
      onInput: this._onInput,
      onKeyDown: this._onKeyDown
    };
    _.defaults(props, this.props);
    return R.div(props);
  },
  componentDidMount: function() {
    this._refresh();
    // Autofocus if empty string value.
    if (this.props.value === "" || !this.props.value) {
      return R.findDOMNode(this).focus();
    }
  },
  componentDidUpdate: function() {
    return this._refresh();
  },
  _refresh: function() {
    var el;
    el = R.findDOMNode(this);
    if (el.textContent !== this.props.value) {
      el.textContent = this.props.value;
    }
    return this._isDirty = false;
  },
  _onInput: function() {
    var el, newValue;
    this._isDirty = true;
    el = R.findDOMNode(this);
    newValue = el.textContent;
    return this.props.setValue(newValue);
  },
  _onKeyDown: function(e) {
    if (e.keyCode === 13) { // Enter
      return e.preventDefault();
    }
  }
});
```

Response:
_ = require "underscore"
R = require "../R"

R.create "EditableText",
  propTypes:
    value: String
    setValue: Function

  shouldComponentUpdate: (nextProps) ->
    return @_isDirty or nextProps.value != @props.value

  render: ->
    props = {
      contentEditable: true
      onInput: @_onInput
      onKeyDown: @_onKeyDown
    }
    _.defaults(props, @props)
    R.div props

  componentDidMount: ->
    @_refresh()
    # Autofocus if empty string value.
    if @props.value == "" or !@props.value
      R.findDOMNode(@).focus()

  componentDidUpdate: ->
    @_refresh()

  _refresh: ->
    el = R.findDOMNode(@)
    if el.textContent != @props.value
      el.textContent = @props.value
    @_isDirty = false

  _onInput: ->
    @_isDirty = true
    el = R.findDOMNode(@)
    newValue = el.textContent
    @props.setValue(newValue)

  _onKeyDown: (e) ->
    if e.keyCode == 13 # Enter
      e.preventDefault()


Prompt:
_ = require "underscore"
R = require "../R"

R.create "EditableText",
  propTypes:
    value: String
    setValue: Function

  shouldComponentUpdate: (nextProps) ->
    return @_isDirty or nextProps.value != @props.value

  render: ->
    props = {
      contentEditable: true
      onInput: @_onInput
      onKeyDown: @_onKeyDown
    }
    _.defaults(props, @props)
    R.div props

  componentDidMount: ->
    @_refresh()

Response:
# Autofocus if empty string value.
    if @props.value == "" or !@props.value
      R.findDOMNode(@).focus()

  componentDidUpdate: ->
    @_refresh()

  _refresh: ->
    el = R.findDOMNode(@)
    if el.textContent != @props.value
      el.textContent = @props.value
    @_isDirty = false

  _onInput: ->
    @_isDirty = true
    el = R.findDOMNode(@)
    newValue = el.textContent
    @props.setValue(newValue)

  _onKeyDown: (e) ->
    if e.keyCode == 13 # Enter
      e.preventDefault()


Response:
_ = require "underscore"
R = require "../R"

R.create "EditableText",
  propTypes:
    value: String
    setValue: Function

  shouldComponentUpdate: (nextProps) ->
    return @_isDirty or nextProps.value != @props.value

  render: ->
    props = {
      contentEditable: true
      onInput: @_onInput
      onKeyDown: @_onKeyDown
    }
    _.defaults(props, @props)
    R.div props

  componentDidMount: ->
    @_refresh()
    # Autofocus if empty string value.
    if @props.value == "" or !@props.value
      @getDOMNode().focus()

  componentDidUpdate: ->
    @_refresh()

  _refresh: ->
    el = @getDOMNode()
    if el.textContent != @props.value
      el.textContent = @props.value
    @_isDirty = false

  _onInput: ->
    @_isDirty = true
    el = @getDOMNode()
    newValue = el.textContent
    @props.setValue(newValue)

  _onKeyDown: (e) ->
    if e.keyCode == 13 # Enter
      e.preventDefault()


Prompt:
Convert this CoffeeScript to JavaScript.
```coffeescript
_ = require "underscore"
R = require "../R"

R.create "EditableText",
  propTypes:
    value: String
    setValue: Function

  shouldComponentUpdate: (nextProps) ->
    return @_isDirty or nextProps.value != @props.value

  render: ->
    props = {
      contentEditable: true
      onInput: @_onInput
      onKeyDown: @_onKeyDown
    }
    _.defaults(props, @props)
    R.div props

  componentDidMount: ->
    @_refresh()
    # Autofocus if empty string value.
    if @props.value == "" or !@props.value
      @getDOMNode().focus()

  componentDidUpdate: ->
    @_refresh()

  _refresh: ->
    el = @getDOMNode()
    if el.textContent != @props.value
      el.textContent = @props.value
    @_isDirty = false

  _onInput: ->
    @_isDirty = true
    el = @getDOMNode()
    newValue = el.textContent
    @props.setValue(newValue)

  _onKeyDown: (e) ->
    if e.keyCode == 13 # Enter
      e.preventDefault()
```

Response:
var R, _;

_ = require("underscore");

R = require("../R");

R.create("EditableText", {
  propTypes: {
    value: String,
    setValue: Function
  },
  shouldComponentUpdate: function(nextProps) {
    return this._isDirty || nextProps.value !== this.props.value;
  },
  render: function() {
    var props;
    props = {
      contentEditable: true,
      onInput: this._onInput,
      onKeyDown: this._onKeyDown
    };
    _.defaults(props, this.props);
    return R.div(props);
  },
  componentDidMount: function() {
    this._refresh();
    // Autofocus if empty string value.
    if (this.props.value === "" || !this.props.value) {
      return this.getDOMNode().focus();
    }
  },
  componentDidUpdate: function() {
    return this._refresh();
  },
  _refresh: function() {
    var el;
    el = this.getDOMNode();
    if (el.textContent !== this.props.value) {
      el.textContent = this.props.value;
    }
    return this._isDirty = false;
  },
  _onInput: function() {
    var el, newValue;
    this._isDirty = true;
    el = this.getDOMNode();
    newValue = el.textContent;
    return this.props.setValue(newValue);
  },
  _onKeyDown: function(e) {
    if (e.keyCode === 13) { // Enter
      return e.preventDefault();
    }
  }
});