angelozerr / tern-tabris

A Tern plugin adding tabris.js support.

tern-tabris

tern-tabris is a plugin which adds support for tabris.js to the JavaSript code intelligence system Tern.

tern-tabris provides :

• the tern tabris plugin tabris.js
• the CodeMirror template lint addon tabris-templates.js for CodeMirror tabris completion templates.
• the CodeMirror context autocomplete addon context-autocomplete-hint.js for expansion of placeholder variables to strings and triggering autocompletion for functions with string arguments.

Demo

You can play with online demo which uses CodeMirror ((inside Web Browser).

You can see Tabris.js Scratchpad - Native Mobile Apps in JavaScript demo at youtube.

You can see demos in this git project with CodeMirror in demos/tabris.html :

Here a screenshot with completion with CodeMorror tabris completion :

Here a screenshot with completion with Eclipse IDE tabris completion :

If you wish to use Eclipse as IDE, see Eclipse support for tabris.

Installation

tern-tabris works with the NodeJS [Tern Server][tern-server], and within a browser.

The easiest way to install tern-tabris is to use a recent version of [npm][npm]. In the directory where you installed the [tern package][tern-npm], simply run

$ npm install tern-tabris

You can find tern-tabris to the npm registry

Configuration

tabris support tabris.

With Node.js

In order for Tern to load the tern-tabris plugin once it is installed, you must include tabris in the plugins section of your [Tern configuration file][tern-config].

Here is a minimal example .tern-project configuration file:

{
  "libs":["ecma5"],
  "plugins": {
    "tabris": {}
  }
}

With WebBrowser (CodeMirror)

See demos/tabris.html

Structure

The basic structure of the project is given in the following way:

• tabris.js the tern plugin.
• demos/ demos with tabris tern plugin which use CodeMirror.
• test test of the tern plugin.

tern-tabris's Issues

Support overloaded functions

For example Widget.set can be used to set all properties at once by providing an object as a single argument or set one property at a call by providing the property name and a value:

set(property, value): Widget - Sets the given property
set(properties): Widget - Sets the all given properties-value pairs.

This is currently not possible as functions are represented by JS object keys which cannot have duplicates.

Supports Window Object, Console Object and several W3C standards

According http://eclipsesource.com/blogs/2015/05/15/javascript-api-top-tabris-js-feature-5/ tabris supports windows, object, etc

@cpetrov is window can be accessible without tabris object? If it that, it will be easy to do that by referencing tabris.window to window of browser.json.

Implement completion guess for tabris

Implement completion guess for tabris like:

• user write

tabris.crea

• he does Ctrl+Space and completion shows create.
• user apply completion for create.
• a second popup completion opens with "Button", "Page", etc

@cpetrov I think you could be interested since I have implemented completion guess https://github.com/angelozerr/tern-guess-types with CodeMirror. See demo at http://demo-angelozerr.rhcloud.com/CodeMirror-Java/guess-types.html of completion guess (it requires CodeMirror which is not released).

Include events and links to tabris.js object definitions

We would also need to include additional data about links and events in the Tern defs, e.g. supported events + descriptions and links to relevant tabris.js objects examples and snippets. Should this be part of the "!doc"?

Hover for tabris "string"

Tabris uses a lot of string to define widget type, event, etc. It should be cool when mouse hover those string, it displays the doc of the widget, action. Here a screenshot, when mouse hover the "Button" string inside tabris.create :

Widget#children doesnt work "object is not a function"

Widget#children doesnt work :

var button = tabris.create('Button', {});
var children = button.children();

This code throws the tern error "object is not a function" :

Uncaught TypeError: object is not a function 
  def.js:137 TypeParser.parseBaseRetType.result

Browser demo only shows Action visibility hover snippet for visibility and enabled properties

var label = tabris.create("Label", {});
var action = tabris.create("Action", {});

var labelEnabled = label.get("enabled");
var labelVisible = label.get("visibility");
var actionEnabled = action.get("enabled");
var actionVisibility = action.get("visibility");

Hovering over the enabled/visibility state variables seems to always show the action visibility documentation snippet ("bool - Whether the action is visible."), although the getPropertyType() function returns the right type.

Tested with Firefox 33.1.1 and Chromium 38.0.2125.122 (290379).

get() autocompletion throws exception

@eb2f2c6 seems to have introduced a regression. get() autocompletion throws an error:

TypeError: null is not an object (evaluating 'propertyType.isEmpty')

To reproduce:

tabris.create("Button").get("")

Release 0.1.0

@cpetrov once your PR will be accepted, I think we could publish tern-tabris.

What do you think about that?

Widget.set chaining broken

See demos/tabris.html. Autocompleting button.set('text', '...'). leads to "TypeError: _self.hasProp is not a function".

Add demo with tabris lint

Setter second argument type validation lint not working

The example in the tabris-lint demo (line 11):

...
button.set("text", true); // Here 'text' property is not string type (error)
...

is not working since it was introduced in 51d2303 (no error is shown for true)

Do you think we can implement/fix it or should we remove it from the demo?

Tabris object return type autocompletion throws exception

With #33:

tabris.create("Picker").get("selection").

Throws Uncaught TypeError: Cannot read property 'propagate' of null in infer.js:384.

Autocompleting undefined. works as expected (it is also an object with type ? defined in ecma5.json).

@angelozerr Do you know what might be causing that?

Completion for properties tabris.create

It should be cool if we could have completion for properties tabris.create according the widget type. For instance :

tabris.create("Button", {
  // here Ctrl+Space shows layoutData, text, etc
})

Extracting definitions to external files

Opened PR #28 to prepare for the extraction of static definitions to external JSON files. Do you know what would be a good way to include such definition files into the project?