Fix array length, sort context vars, console commands stack, context var list themeability (UPDATED)

[cgalvarez]

Concerns addressed by this pull request:

Console

• User can now navigate through the last 20 commands entered with alt+up/alt+down (when focused on the input of the text editor inside the console panel). It's useful when you want to execute the same code multiple times or the last executed command contained an error.

Context var list

• Fixes the array length when the length property of a context variable is undefined. It happens to me with $GLOBALS['GLOBALS'], for example, which is shown as $GLOBALS['GLOBALS'] array[undefined], but its value is really Array[0].
• Now bool values are printed correctly as true/false (previously was being printed as 1/0).
• Now using variable name instead fullname. (Reason: getting the whole access path to an array/object value was messing things up and making harder to read.)
• Sorted: now all variables, keys (in case of array) and properties (in case of objects) are sorted in a natural, alphabetical ascending order, following the same behavior as PHP function ksort() (string keys first, numeric ones then). Numeric keys are not enclosed between quotes anymore. This improves readability, since it's far easier to find any variable/key/property.
• Themeable, which improves readability too, since it's far easier to distinguish the type of a value based on its color:
  • The default is to inherit the styles from the current atom theme for the language-php package. This way, one uses the same color codes in the editor and the panels from this package.
  • Now every label span is provided with new classes if it's a property of an object or a key of an array (otherwise it's a variable): syntax--property and syntax--numeric/syntax--string depending on the type.
  • Now every value span is provided with a class with the value type: syntax--array, syntax--bool, syntax--error, syntax--null, syntax--numeric, object, syntax--resource, syntax--string, or syntax--uninitialized.
  • Every span item uses the same syntax-php from the package language-php.
  • The top taxonomies (Locals/Superglobals/User defined constants) have the class syntax--type.

Editor

• Fixes error when trying to change breakpoint configuration in a line with no breakpoint set.

Here is a screenshoot showing the improvements:

DISCLOSURE: I've made some CSS customizations apart. If some users like it, I could ship them with the PR (like the = and : to separate variables/keys/properties from their values, or the layout of the panels).

[cchamplin]

Over all I really like these adjustments. The only thing I'm not sure about is the sorting of arrays. My concern is that in general PHP sorts array keys internally in the order they were added to the array. If as user expects their arrays to follow PHP internals this might be confusing to see the keys order alpha-numerically. Thoughts?

[cgalvarez]

Hi @cchamplin . I'm currently a little busy, but I'll try to split these features into multiple PRs ASAP.

The sorting of arrays is made only in the variables inspector widget to ease the searching of specific keys. I found it invaluable when searching for keys in $_GLOBALS or $_REQUEST. You can always get the real order by entering the variable in the console if you want.

BTW, the distribution shown in the screenshot and some styles are not included in this PR (I mean the icons and the layout of the widgets and the styles of the stack context, for example). I'm applying them through a customized styles.less inside Atom. Do you want me to make another PR for these styles as well?

[StAmourD]

@cgalvarez These are split into a few PRs. I've tried to use the --author flag when committing hopefully this gives you credit. I'm not sure how well that will work though, feel free to re-split them or pull them into your account and resubmit the PRs.

• 252 Console History

• 253 Themable

• 254 Array Sorting (I've put this behind a feature flag to address @cchamplin 's concerns)

• 255 Breakpoint Config BugFix

• 256 Shorten to Variable Name instead of FullName ( @cgalvarez CSS needed for this please)