Views in a package without coffee script?


#1

I’ve seen a few threads about san-coffee packages, and I’ve had some success doing a few things, but I can’t get the View stuff to work at all.

Has anyone managed to?

If so, could you point me to an example that actually works?

(I’ve followed the vague advice in another thread of using the coffee-script inheritance mechanism to extend View, but so far with no success)


#2

Have you looked at the pre-bundled packages? It looks like they have all been pre-compiled to JavaScript.

For example, the FeedbackStatusView class (/Applications/Atom.app/Contents/Resources/app/node_modules/feedback/lib/feedback-status-view.js) might be a good place to start.

CoffeeScript yields two functions used in its inheritance mechanism: __hasProp and __extends.

The View class is inside require('atom').

Here is an example:

{View} = require('atom')

class HelloWorldView extends View
  constructor: ->
    super
  sayHello: ->
    console.log 'Hello, World!'

compiles to

var HelloWorldView, View,
  __hasProp = {}.hasOwnProperty,
  __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };

View = require('atom').View;

HelloWorldView = (function(_super) {
  __extends(HelloWorldView, _super);

  function HelloWorldView() {
    HelloWorldView.__super__.constructor.apply(this, arguments);
  }

  HelloWorldView.prototype.sayHello = function() {
    return console.log('Hello, World!');
  };

  return HelloWorldView;

})(View);

#3

It is possible to create View subclasses in straight JS, but there is an issue that prevents you from using require('util').inherits to do it.
You will need your own inherits-function that mirrors what CS compiles to (see @execjosh’s comment above).

And then you can do

function MyCustomView(params) {
    View.apply(this, arguments)
}
customInherits(MyCustomView, View)

MyCustomView.content = function() {
    // Note that content needs to be static
    this.div(....)
}

MyCustomView.prototype.initialize = function() {
    // But the rest can be normal methods
    this.member = ...
}

There should be a bug-report somewhere about not being able to use the normal Node.js inherit-method, see CoffeeScript __extends vs util.inherits (Inheritance in JS)

For a bigger/better example, see the proposed code in the following pull-request: https://github.com/tcarlsen/atom-message-panel/pull/1/files


Package "JS" generator (generates in Javascript)