Orion’s new Help system

As was described in the Orion 7.0 release announcement, the Orion Help system has finally gotten the re-write it has long needed. Beyond eliminating our last use of JSPs, the new Help now features:

  • A more integrated look

Orion Help Screenshot

  • A new service point for plug-in contributions: orion.help.pages

A plug-in can contribute a top-level entry to Help’s table of contents by providing a root property representing the root page ({Location: object, Name: string, Directory: boolean}) [example]. Orion Help then invokes functions on the registered service as its page content/sub-pages become needed. This service purposely resembles Orion’s file service (read, and optionally fetchChildren and readBlob), and returns either immediate results or promises [example].

  • Consumption of markdown content

Everyone’s using markdown these days. This is what a plug-in’s read implementation needs to return. You can easily author it in Orion’s markdown editor.

  • Generation of document hierarchy based on markdown headers

A full document tree can be defined in a single markdown stream, no separate sub-pages required.
markdown file headers

Eclipse Help System we knew you well, and wish you all the best on the desktop.

Posted in General, New & Noteworthy | Comments Off

Announcing Orion 7.0

Orion 7.0 is now available! Check it out right now on OrionHub, or download your own server. This release brings some significant changes, including rewriting several parts of the UI and adding capabilities in others. Here is a quick overview of what’s new:

A new Git UI

The evolution of our new Git UI that we began in Orion 6.0 is now complete. All major Git capabilities are consolidated on one page, with a two-pane layout similar to the Orion editor. The left hand side shows a history timeline, and has operations for manipulating branches such as fetch, merge, squash, push, etc. A new Sync button has been added which performs all the most typical operations to get your local clone synchronized with the chosen reference point (merge or rebase, then push). Fetching occurs automatically every time you visit the Git page. The right hand side is used to display commit details, create new commits, and perform operations on commits such as reset, tag, cherry-pick, etc. Overall, this new layout makes much better use of available space, is more touch friendly, and simplifies the most common Git workflow. The underlying implementation has also had some significant performance work, making many operations much snappier than the previous release.

r7-git-ui

A new help system

The 1990’s called and wanted its help system back, so we implemented a brand new one using modern web technologies. The new help system is a simple HTML5 and JavaScript page with overview and detail panes. Help content is authored in Markdown (naturally using the Orion Markdown editor), and rendered into HTML for display. Ditching our last use of JSP technology has also made the Orion Java server lighter and easier to consume.

r7-help-ui

A new global search UI

The separate global search page has been replaced with a fly-out that appears directly in the editor. This reduces context switching and allows you to more seamlessly integrate searching into your editing workflow. All the same search and replace capabilities are available in this new UI. Read more about it here.

r7-search

Language tooling enhancements

Many improvements have been made to CSS and JavaScript language tooling in this release. Read all the details here.

Editor hover help

The Orion editor has initial support for hover help aid in code exploration. If you hover over a function, the rendered documentation for that function is shown. In Orion 8.0 we will hook this more deeply into the static analysis engine to provide hover help in many more places.

r7-hover-help

New authentication types

Support has been added for authenticating with Google+ and GitHub auth. Read more about it here.

Cloud foundry tooling

This release has many new features for developing and deploying for Cloud Foundry. Orion now has a Cloud Foundry manifest editor with syntax highlighting, error and warning reporting, and content assist. The deploy dialog now has support to launch applications with missing or incomplete manifests, with the option to persist missing manifest content during deployment.

r7-cf-editor

Multi-instance server

The Orion Java server has been architected to support multiple concurrent server instances behind a reverse proxy. This architectural change enables scenarios such as fail over, load balancing, and zero downtime upgrades of the server. This work involved more comprehensive use of file locking to avoid contention between server instances, and making sure only one server performs background tasks such as search indexing to avoid work duplication. The server also now always separation of instance-private disk state from content that needs sharing between instances. Stay tuned for more documentation on how to configure and deploy multi-instance Orion clusters.

It has been a busy four months! Our next release, Orion 8.0, will be coming at the end of February, 2015. Until then, enjoy the cloud coding!

Posted in Announcements, New & Noteworthy | Comments Off

Orion 7.0 – Language Tooling Enhancements

The upcoming Orion 7.0 release has many improvements and enhancements in the language tooling, especially for Javascript development. Here is a list of the more notable changes coming in 7.0!

Updated third party libraries

Many third party libraries have been updated in 7.0:

Improved content assist

JavaScript content assist has been improved in many ways, like allowing proposals inside JSDoc-formatted comments,  improved object support from our indexes and improved built-in type detection.

We can help add JSDoc tags:

jsdoc-tag-assist

JSDoc tag assist

We can show assist for parameters:

jsdoc-param-proposal

Function parameter JSDoc assist

We can show assist for type objects:

jsdoc-object-assist

Object JSDoc assist

We can show the actual return type of items from our built-in indexes (rather than simply ‘Object’):

index-type-assist

Correct index object types

We can also show assist for RegExp literals (finally):

regexp-literal-assist

RegExp literal assist

Enhanced ESLint support

Along with the version update to ESLint, we also spent time improving the overall integration support for ESLint. In doing so, we provided new linting rules and some content assist templates / completions to help you craft ESLint directives.

The new no-empty-block rule (off by default) can be used to detect empty code blocks. When an empty block is found you get a pleasant warning in the editor, with a suggestion how to fix it:

empty-block-rule

Empty code block rule

Another new rule, throw-error, will check to make sure that you only throw error-objects from throw statements. If you fail to do so, you will see the helpful reminder:

Throw an error instead

Throw an error instead

With the change to stop using JSLint/JSHint directives and a linting rule in place to warn you about the unsupported usage, we thought it best to add some content assist completions to help you craft correct ESLint directives.

So now we have ESLint directive templates:

eslint-templates

ESLint directive templates

Assist setting up an environment:

eslint-env-assist

ESLint environment assist

Assist disabling / enabling rules:

eslint-rule-assist

ESLint rule assist

Parser improvements

In order to provide content assist inside JSDoc blocks, one of the things that we had to do was add recovery support for unclosed / incomplete comment blocks while parsing your source. The new block comment recovery support will parse and recover all complete statements up to the incomplete comment.

In the following example, the declaration can be recovered, but the if-statement cannot (since the comment is also breaking the if-statement):

recovered-comment

Recovered from an incomplete comment

Support was also improved to report parsing errors that cause a complete failure to parse, where no tokens at all are being returned from the parse. In the following example we now correctly report the bad ` token:

fatal-error-reporting

Bad parse errors properly reported

Improved mark occurrences

A lot of work has gone into improving the accuracy and adding new occurrence support.

We can now show you occurrences of labelled statements:

labelled-statement-occ

Labelled statements

Correctly show occurrences in throw statements:

throw-statement-occ

Throw statement occurrences

Mark occurrences in use-before-define and hoisting scenarios:

hoisting-occ

Use-before-define and hoisting

We even fixed a long standing bug that refused to show occurrences for something that was not defined in the file:

Global occurrences

Global occurrences

Improved web tools

Our support for HTML has been improved with the addition of an HTML outline, which is powered by the htmlparser third party library.

HTML outline

Posted in New & Noteworthy | Comments Off

Orion 7.0 – Inline Global Search Pane

As of Orion 7.0 the stand-alone Orion Search page will be replaced by an inline search pane in the Editor page. There are several reasons for this. First, as a user, immediately before initiating a search, you are almost always browsing or modifying existing files on the Editor page. Second, after obtaining the search results, you almost always return to the Editor in order to browse or modify the file you were looking at or a file you found during the search. Having a separate search page forced you to switch contexts while searching. This created an artificial separation between the tasks of editing/browsing files and the task of searching through them, while in fact, the latter is a secondary task performed to support the former.

With the search inside the Editor page you can now initiate a global file content search without leaving your current tab. Select “Edit” → “Global Search…” from the main menu bar or use the keyboard shortcut Ctrl+Shift+H (Cmd+Shift+H on Mac) to open the inline search pane.

EditMenu

Enter the search parameters and click on the search button to initiate the search. (Tip: Hitting Enter in any of the text input boxes also triggers the search.)

SearchOptions

The search parameters section will collapse and the list of files with matches will appear in the inline pane. You can expand each file in the list to see the lines which contain matches or you can click on the file name to open it in the editor on the right hand side.

SearchResults

To run another search click on the “^ Edit Search” link in the top left corner of the pane. This will expand the search parameters area allowing you to modify your search and run it again.

Search and Replace

As was the case with the stand-alone search page, the inline search pane supports search and replace. To perform a replace operation click on the “Switch to Replace Mode” link below the search term input box. After filling in the parameters click on the “Replace…” button to see a preview allowing you to select specifically which matches to replace and which to ignore. (Note: Clicking on the “Replace…” button will NOT modify any of your files.)

ReplaceOptions

The list of matches will appear in the inline search pane and a preview of each file showing the before and after versions will appear over the editor on the right hand side. A little tab with the word “Preview:” and the name of the file will appear over the editor indicating that this is a preview only. For now this preview is read-only and supports none of the editing or in-file searching functionality.

PreviewReplace

Once you have selected which matches you wish to replace using the check marks next to the inline search pane’s result list click on the “Replace Selected” button, above the result list, to apply the changes to your files. The inline search pane will display the list of files that were modified as well as the number of matches that were modified in each file.

ReplaceReport

Posted in New & Noteworthy | Tagged | Comments Off

Orion 7.0 – GitHub and Google+ Authentication

Orion 7.0, coming in late October 2014, will have significant improvements to its authentication infrastructure. Orion will now support OAuth 2.0 providers for authentication, in place of the OpenID and Mozilla Persona authentication methods. Orion 7.0 stable builds can be downloaded now on the Orion download page.

New Authentication Changes

Orion 7.0 allows you to authenticate using your existing OAuth 2.0 accounts. This means if you have an existing Google or GitHub account you will be able to log into Orion 7.0 securely and easily. This gives you multiple options for authentication.

With this update we also removed Mozilla Persona support. For more information on Mozilla Persona visit: https://login.persona.org/

This changes our home page slightly to display 3 methods of authentication:

  • Orion
  • Google+
  • GitHub

Auth Logos

Google Migration

With this update we are also updating the old Google OpenID authentication to the new Google OpenID Connect, based on OAuth 2.0. Soon Google will no longer support the old version so all systems need to updated accordingly. If you have already linked your account with your Google account you will need to update it to the new OAuth 2.0 authentication. Luckily this is quite simple.

All you need to do is try to authenticate to Orion using the Google icon. Then Google will prompt you to accept the new permissions.

Authorize App

That’s it! You will now be in Orion 7.0 and your account will already be updated.

For more information on Google’s authentication migration visit: https://developers.google.com/+/api/auth-migration#timetable

Create a Linked Account

Creating a linked account used to be difficult but we have now changed this to make it relatively painless. There are two ways to create a linked account:

  • Create a new account
  • Link an existing account

New Account

To create a new linked account, simply try to authenticate with the OAuth provider of your choice (GitHub or Google).

If the account does not exist you will be sent to an account creation page.

Create Account

The account you create will automatically be linked to your OAuth account.

Existing Account

To link an existing account to your OAuth account is the same as it used to be. First log into your Orion the account you wish to link. Then go to the Settings Page → User Profile.

Link Account

At the bottom of the page is the Linked Accounts section. Here you can either add/remove your OAuth accounts. You can also remove your old Google OpenID and Mozilla Persona accounts.

What’s Next?

We plan to redo our landing page to make it more inviting and informative for new and existing users. This will explain the basics of what Orion is and how to use it.

We also plan to have more integration with your GitHub account so that if you link your account you no longer need to authenticate again to perform git operations.

Posted in General, New & Noteworthy | Tagged , | Comments Off

Orion 6.0 – Git Page Changes

In an attempt to stream line and improve Git workflows, we have started on a redesign of the Git pages in Orion 6.0

From Many to One

One of our main design goals was to reorganize all of the git functionality from multiple pages down to one. We used to have individual pages or views on pages for:

  • git status
  • git log
  • git repository
  • all git repositories
  • branches
  • tags
  • git configuration options

With the exception of the all git repositories page (which we are in the process of redesigning), all of the other pages have been merged into the current Git page which looks like this (with sections collapsed):

git1

Let’s take a look at what’s in each of these sections. Starting from the very top:

Repo Header

At the very top of the page, we have the name of the repo along with buttons that perform repo-level actions:

  • Apply Patch: brings up a dialog that lets a user select the URL or file that contains the patch
  • Pull: Performs a Pull on the repo (fetch + rebase)
  • Delete: Deletes this repo

Changed Files

This section replaces the old git status page – it will show you the current state of your working directory. With no files changed, the section looks like this:

git2

The top of the section contains the 2 main section buttons:

  • Discard: discard any changes made to selected files and revert the files to their previous committed state
  • Commit: commit selected files with the messaged entered in the message box

Next down comes the message box area which is used to enter a commit message – notice the 2 checkboxes. Amend Previous Commit can be toggled to amend the previous commit (the previous message will be fetched and displayed in the message box). Prepare for Gerrit will add a ChangeId to the commit message.

When files are changed, they appear in a table under the message box:

git3

The files can be expanded to reveal the changes made:

git4

Note that you can also choose to view the diffs side by side or open a compare editor to view the diffs.

You can select the files to include in the commit by using the checkboxes (or the select all checkbox if you want to include all files). As you select files, a number counter at the top of the table changes to match your selected file count.

Once you have selected your files (and typed in a message) you can hit Commit to commit them (or Discard to discard the changes made).

When you have files selected, a Show Patch link appears on the same line with the Commit and Discard buttons. This will create a patch for you out of the files that you have selected.

git5

Commits

The commits section has been redesigned with some new sub-sections.

git6

  • Outgoing: this section lists all of the commits that have not been pushed yet to the remote repo
  • Incoming: this sections  lists all of the commits that have not been merged into the local repo
  • History: this section lists all of the commits that the local branch has in common with the remote branch.

Let’s see what happens, when we commit the change from the previous section:

git7

The commit shows up in the Outgoing section. Note that there is a new Undo button that will let you undo the commit and restore the changed files back into your working directory (a soft reset).

Before pushing, you want to be sure that you are caught up to all changes, so you can hit Fetch in the Incoming section to fetch the latest changes. All of the changes that haven’t been merged will show up and you can accept them by hitting Rebase or Merge.

git8

The accepted changes now show up in the History section. You can scroll down to view the the history, or hit the “More commits for <Branch>” to load more entries.

git10

Once you are all up to date with the remote branch, you can Push your changes.

There is also a new button Sync which is combination of Fetch/Rebase/Push.

Changes in a Commit

Expanding any commit in the history will reveal the changed files (this is true for any place a commit is shown on the page) :

git17

Branches and Tags

The branches and tags sections have been merged into one section as well. There are top level items for local branches, remotes and tags. The 2 buttons in this section are:

  • New Remote: brings up a dialog to add a new remote
  • New Branch: brings up a dialog to create a new branch

git11

If you expand the local item, you will see all of the local branches you have for the current repo – you can check a branch out from here.

git12

If you expand the branch – you will see the log for that branch along with all allowable actions next to each commit.

git13

Each remote can be expanded to reveal all of its remote branches along with applicable actions for each entry.

git14

You can see the log for a remote branch by expanding it.

The tags section follows the same pattern – expand the top level item and you are presented with the list of tags along with all available actions for that tag.

git15

Configuration

The configuration section is now being rendered as a table.

git16

 More to Come

Although the Git page is in a reasonable state right now, we have some future improvements planned that will truly allow for a one page design. Stay tuned for more!

Posted in General, New & Noteworthy | 1 Comment

Orion’s new Markdown editor

Markdown has emerged as a popular authoring format for on-line documentation. The recently released Orion 6.0 includes a new split-pane Markdown editor that previews your generated HTML document as you type. You can try it out now, along with the rest of Orion 6.0, on OrionHub.

Initial editing of a .md file: Features typical Orion editor responsiveness, syntax styling and annotations. The preview pane is auto-scrolled to keep it in sync with the source editor, and its highlighted region reflects the caret position in the editor.
mdEditor_initial

Some editor options you may wish to change (note: to add Word Wrap to this menu go to Settings > Editor and select the little circle beside the Word Wrap option)
mdEditor_options

Vertical split orientation: The preview pane is still auto-scrolled to keep it in sync with the source editor.
mdEditor_vertical

gfm extensions: The editor handles extended markdown syntax supported by the marked library, which includes Git Flavored Markdown. The following screenshot shows a gfm table, fenced code block and strikeout text.
mdEditor_gfm

What’s next?

The Markdown editor will continue to improve during the Orion 7.0 timeframe. We have some initial enhancement ideas in mind, including content assist, warning annotations, and various usability tweaks. We’d also really like to hear your enhancement requests and bug reports, to ensure that it’s the best markdown editor out there. Thanks in advance!

Posted in New & Noteworthy | Comments Off

Orion and ESLint 0.6.2

In 7.0 we updated the version of ESLint used in Orion to 0.6.2 which has many improvements over the last version we were using (0.4.2).

There is a catch though.

Since version 0.4.2, ESLint has dropped support for the jslint / jshint directive used in-source to describe your environment.

For example: /*jslint amd:true*/

The new way to do this is to use the eslint-env directive.

For example: /*eslint-env amd, browser*/

Configuring ESLint has the complete rundown on setting up your desired environment(s), but the basics are:

  • Use only the name of the environment to indicate it should be used, i.e. there is no amd:true or amd:false, amd alone means amd:true, leaving it out means amd:false
  • If using more than one environment, they are defined in a comma-separated list like: /*eslint-env amd, browser, mocha, node*/

Just in case you forget all about these directives Orion has a linting rule to remind you to update them….

Unsupported directive warning

Unsupported directive warning

 

Posted in Integrations, New & Noteworthy, Tips & Tricks | Comments Off

Article on Orion and BeagleBone Black development

There’s a great article by Benjamin Cabé over at Element14 about utilizing Orion to do development on a BeagleBone Black leveraging Node.js, MQTT and all sorts of other Internet of Things technology.

Eclipse Orion, Arduino and BeagleBone Black – Prototyping your Internet of Things

Posted in Integrations, Tips & Tricks | 1 Comment

Orion 6.0 – Language Tooling Enhancements

The upcoming Orion 6.0 release will bring many improvements to your online IDE experience.  Many enhancements and improvements have been added to the language tooling support in Orion, especially for Javascript development.  Here is a list of the more notable changes prepared for 6.0!

Additional syntax highlighting

Orion now provides syntax highlighting for .c .h. cpp and Arduino (.pde/.ino) files.

image20

Generating JSDoc

A new command has been added to help with creating JSDoc for function declarations and function expressions. It is found in the Tools menu for JavaScript source and is called Generate Element Comment with the key binding Alt+Shift+J (Win / *nix) and Ctrl+Shift+J on Mac OS.

The command:
image13

… will insert JSDoc like this on function expressions:
image07

… and will insert this JSDoc on function declarations:
image06

Javascript tooling inside HTML script blocks

Much of the Orion Javascript Tooling support is now available while working in the HTML editor.  Linting support will now run on Javascript code inside of <script> tags.  Show occurrences will function when variables and functions are selected inside your scripts.

image22

Javascript validation overhaul

The validation/linting support for Javascript in Orion, built on ESLint, has been given an overhaul with new rules, an updated engine and more user flexibility.  The validator will scan your Javascript files (as well as HTML <script> tags) and add errors or warnings to the margin of the editor.  Hovering provides a more detailed explanation of the issue.

image14

Users can now customize the warnings they see on the new validation settings page, Settings > Validation.  Each validation rule can be set to error, warning or ignore.

A large number of rules have been added, warning you of discouraged code styles, missing documentation, unused variables, unreachable code and many other common programming problems.  All of the rules have variable severity which you can set on the Validation settings page.

New code validation rules

There have been a lot of new rules added to ESLint in Orion in 6.0, some of the more notable ones are:

Unused params:
image05

Duplicate object keys:
image11

Unreachable code:
image18

Scoped code templates

When activating content assist (Ctrl-Space) the Orion Javascript Tooling Support provides many code templates for common code patterns and common library usage.  Previously the entire template list would be made available to the content assist proposal list, only being filtering by the characters typed.  Now, the location you are in is used to scope the proposals so that only applicable code patterns are provided.

Unscoped proposals:
image00

Scoped proposals:
image04

Show occurrences of object properties

Selecting a named object property with Show Occurrences turned on will highlight the property definition as well as all references to it within the object expression (via this object).

image15

The outliner has also been improved to list the properties of an object.

image09

ESLint updated

Orion is now using the the latest version of ESLint – 0.4.2

Esprima updated

The Esprima parsing library that underpins much of the Javascript tooling support in Orion has been updated to 1.1.0-dev.

Parser updates

The Orion customized version of the Esprima parser has seen many updates in 6.0, from performance improvements in  the token stream and ESLint integration to improved parser errors that direct users how to correct their code problems.

There have also been a few updates to the parser’s tolerance while parsing code with errors in it. Additional recovery support has been added for the following scenarios:

Missing tokens in call expressions:
image02
Missing tokens in object expressions:
image19
Missing declarations in object properties:
image03
Missing tokens in if statements:
image08
Missing tokens in while statements:
image17
Missing tokens in for statements:
image10

Experimental Web Worker Support

The JavaScript Tools engine can now be hosted in a web worker, off the main browser UI thread. The worker delivers increased responsiveness when editing very large files, as expensive operations like parsing and validation do not block the UI. The worker is turned off by default in the Orion 6.0 release, but users can enable it by doing the following:

  1. Go to Settings > Plugins.
  2. Scroll down to “Orion JavaScript Tool Support” and click the Plugin link.
  3. Click the “Use a web worker” checkbox:
    image16
  4. Reload the Orion editor. You won’t see any visual changes, but under the hood, the JS tooling will be super fast.
Posted in New & Noteworthy | Comments Off