atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace),
which returns an HTMLElement.

Atom.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/src/atom.js:55:11)
Object.<anonymous> (/Users/jawad/.atom/packages/color-picker/lib/ColorPicker-saturationSelector.coffee:7:26)

Something like:

Convert to HSL
Convert to RGBA
...

Hi there,

I've noticed that ver since I've installed color-picker, Atom is slightly slower on load. While investigating the Timecop logs, I noticed that color-picker is taking a lot to activate (45-60ms).

This should definitely be optimised in order to stop influencing the speed of Atom.

Anything you can do regarding this?

Thanks in advance!

First: this thing is awesome.

• Open a css file in a right split (ctrl-shift-)
• Try the color picker
• it's in the wrong place

atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace),
which returns an HTMLElement.

Atom.Object.defineProperty.get (/Users/james/Downloads/Atom.app/Contents/Resources/app/src/atom.js:55:11)
Object.activate (/Users/james/.atom/packages/color-picker/lib/ColorPicker.coffee:18:21)

Unless Alpha is Edited RGB is not an option

• Open the color picker
• Scroll the editor

My gut says I want it to scroll with the page. But maybe closing would work too. Can hook editorView.verticalScrollbar.on('scroll', @onEditorScrolled)

Currently if I have a setup of less varaibles like this:

@site-wide-color: #123456

@specific-color-that-could-change: @site-wide-color

The @specific-color-that-could-change is not evaluated to a color. Are there plans to support this? I may be able to help with a patch if this feature desired. I think a phase one of just showing the value is a good start.

Here is what I see:

The real issue is when I use the @specific-color-that-could-change outside that file. I tried to look it up, and it wouldn't do the lookup.

I find HSLA to be one the most intuitive color formats to work with by allowing to directly manipulate Hue, Saturation and Lightness. Any chance this plugin could gain support for this?

[Enter steps to reproduce below:]

1. ...
2. ...

Atom Version: 0.165.0
System: Mac OS X 10.10.1
Thrown From: color-picker package, v1.1.0

Stack Trace

Uncaught TypeError: Cannot read property 'reset' of null

At /Users/reberhardt/.atom/packages/color-picker/lib/ColorPicker.coffee:100

TypeError: Cannot read property 'reset' of null
  at Object.module.exports.open (/Users/reberhardt/.atom/packages/color-picker/lib/ColorPicker.coffee:100:22)
  at atom-workspace.<anonymous> (/Users/reberhardt/.atom/packages/color-picker/lib/ColorPicker.coffee:19:69)
  at atom-workspace.handler (/Applications/Atom.app/Contents/Resources/app/src/space-pen-extensions.js:115:32)
  at atom-workspace.jQuery.event.dispatch (/Applications/Atom.app/Contents/Resources/app/node_modules/space-pen/vendor/jquery.js:4681:9)
  at atom-workspace.elemData.handle (/Applications/Atom.app/Contents/Resources/app/node_modules/space-pen/vendor/jquery.js:4359:46)
  at CommandRegistry.module.exports.CommandRegistry.handleCommandEvent (/Applications/Atom.app/Contents/Resources/app/src/command-registry.js:243:29)
  at /Applications/Atom.app/Contents/Resources/app/src/command-registry.js:3:61
  at KeymapManager.module.exports.KeymapManager.dispatchCommandEvent (/Applications/Atom.app/Contents/Resources/app/node_modules/atom-keymap/lib/keymap-manager.js:549:16)
  at KeymapManager.module.exports.KeymapManager.handleKeyboardEvent (/Applications/Atom.app/Contents/Resources/app/node_modules/atom-keymap/lib/keymap-manager.js:391:22)
  at HTMLDocument.module.exports.WindowEventHandler.onKeydown (/Applications/Atom.app/Contents/Resources/app/src/window-event-handler.js:167:20)

Commands

  2x -0:03.7 editor:newline (input.hidden-input)
     -0:00.0 color-picker:open (input.hidden-input)

Config

{
  "core": {
    "disabledPackages": [
      "linter"
    ],
    "useReactEditor": true,
    "themes": [
      "atom-dark-ui",
      "monokai"
    ]
  }
}

Installed Packages

# User
autocomplete-plus, v0.21.0
color-picker, v1.1.0
go-plus, v2.0.10
language-matlab, v0.1.0
monokai, v0.7.0

# Dev
No dev packages

/cc @atom/core

Can the upcoming Saas/Less variable support also handle Stylus variables?
What about the built-in functions like lighten(color, amount)? :D

After updating to .133, when viewing the settings page I see the Picker UI appear at random, for a second at best, repeatedly over the Package List on the left.

So you're aware, I am on Yosemite Beta (2).
Latest Atom & latest color-picker.

Any ideas?

Would it be possible that you add support for SVG files, Coffee and JS support?

The settings view says that this package adds 581ms to startup time. This is the biggest impact of any package that I have installed. It would be awesome if some optimization to start up time could happen 😸

When switching themes in Atom on the Settings tab the color picker shows up and disappears.

Use Workspace::getActivePaneItem instead

WorkspaceView.getActivePaneItem (/Applications/Atom.app/Contents/Resources/app/src/workspace-view.js:564:7)
<unknown> (/Users/aaronransley/.atom/packages/color-picker/lib/variable-inspector.coffee:48:44)
_fulfilled (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:787:54)
self.promiseDispatch.done (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:816:30)
Promise.promiseDispatch (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:749:13)
<unknown> (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:557:44)
flush (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:108:17)
process._tickCallback (node.js:349:11)

Is there support for searching the project tree for variables? Most of my variables are in a variables.sass file in another directory. Is it possible to have these variables recognized as well?

Deprecation cop has a problem with you code.

atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace),
which returns an HTMLElement.

Atom.Object.defineProperty.get (/usr/share/atom/resources/app/src/atom.js:55:11)
Object.activate (/home/fiws/dotfiles/atom.symlink/packages/color-picker/lib/ColorPicker.coffee:18:21)

Same warning for these lines:

/color-picker/lib/ColorPicker-view.coffee:39:18
/color-picker/lib/ColorPicker-saturationSelector.coffee:6:19
/color-picker/lib/ColorPicker-saturationSelector.coffee:7:26
/color-picker/lib/ColorPicker-alphaSelector.coffee:6:19
/color-picker/lib/ColorPicker-alphaSelector.coffee:7:26
/color-picker/lib/ColorPicker-hueSelector.coffee:7:19
/color-picker/lib/ColorPicker-hueSelector.coffee:8:26
/color-picker/lib/ColorPicker-view.coffee:154:17

When I open the picker and then scroll the editor using the normal two-finger swipe, the picker stays in the same position relative to the viewport even though the viewport contents scroll. Probably #2 implements closing on cursor move since that works, but this would be nice too.

Steps to reproduce:

1. Open a second view into a file (e.g. ctrl+k, left)
2. Try to use the color picker in the old view

Versions:

• Atom 0.114.0
• Color Picker 1.1.0

Uncaught TypeError: Cannot call method 'matchesAttributes' of undefined /usr/share/atom/resources/app/src/editor.js:2037
Uncaught TypeError: Cannot call method 'matchesAttributes' of undefined /usr/share/atom/resources/app/src/editor.js:2037
module.exports.Editor.handleMarkerCreated /usr/share/atom/resources/app/src/editor.js:2037
(anonymous function) /usr/share/atom/resources/app/src/editor.js:3
(anonymous function) /usr/share/atom/resources/app/node_modules/emissary/lib/emitter.js:133
module.exports.Emitter.emit /usr/share/atom/resources/app/node_modules/emissary/lib/emitter.js:132
module.exports.DisplayBuffer.handleBufferMarkerCreated /usr/share/atom/resources/app/src/display-buffer.js:1411
(anonymous function) /usr/share/atom/resources/app/src/display-buffer.js:5
(anonymous function) /usr/share/atom/resources/app/node_modules/emissary/lib/emitter.js:133
module.exports.Emitter.emit /usr/share/atom/resources/app/node_modules/emissary/lib/emitter.js:132
module.exports.MarkerManager.createMarker /usr/share/atom/resources/app/node_modules/text-buffer/lib/marker-manager.js:183
module.exports.MarkerManager.markRange /usr/share/atom/resources/app/node_modules/text-buffer/lib/marker-manager.js:87
module.exports.TextBuffer.markRange /usr/share/atom/resources/app/node_modules/text-buffer/lib/text-buffer.js:928
module.exports.DisplayBuffer.markBufferRange /usr/share/atom/resources/app/src/display-buffer.js:1095
module.exports.Editor.markBufferRange /usr/share/atom/resources/app/src/editor.js:1152
module.exports.Editor.addSelectionForBufferRange /usr/share/atom/resources/app/src/editor.js:1269
module.exports.ColorPickerView.selectColor ColorPicker-view.coffee:425
module.exports.ColorPickerView.replaceColor ColorPicker-view.coffee:440
(anonymous function) ColorPicker-view.coffee:177
jQuery.event.dispatch /usr/share/atom/resources/app/node_modules/space-pen/vendor/jquery.js:4676
elemData.handle

"This package added 500ms to startup time."

I'm on a Win7 x64 machine, with a new clean Atom install and the latest version of color-picker.

But when I right click and select the picker it's empty, everything works but I can't see the palette and everything else.

Does anyone experience this?

Not sure what's up, but I can't get the picker to open, whether by key shortcut or by going through the command list.

Just went to a blank white box... no apparent reason.
I was trying to use it in a sass file.
Any ideas?

I just wiped my atom settings to start from a clean slate and discovered an issue when installing this plugin. On a fresh install of atom (v100) on Ubuntu 14.04, immediately after the plugin is downloaded, the atom editor will turn black and nothing will be rendered.

Restarting atom does not fix this, and the only way I've found so far to fix the issue is by disabling the plugin manually and not using it.

Deprecation cop is not happy with color-picker in the latest Atom.

keymaps/color-picker.cson
Use the atom-workspace tag instead of the workspace class.

It would be great if other packages could benefit of the great work you did on detecting less/sass variables in files. I didn't dug much in the codebase but I believe this feature could be extracted as a npm module.

To go further, I think it would be awesome if it could lead to some kind of unified API to read variables content accross a project for the 3 main preprocessor (less, sass, stylus).

To be frank, I was considering implementing something like that in my color highlighting package to be able to provides something like a project palette, and, why not, dynamic snippets, where you can start typing something like color: to open a palette dialog when you can select the color to insert from the project palette.

Maybe we can share the work on that, what do you think of it ?

I find myself often needing to make a color lighter or darker when choosing a highlight color for example. Can you add a slider for brightness?

I'm thinking somewhere along the lines of the slider in c

Hello,

I updated my color-picker module and now it doesn't work anymore.
I restarted Atom 3 times and each time the package was not activated.

Do you have any idea ?

...would be lovely, otherwise this is the hands down the best color picker i've ever seen in a text editor. thanks!

Wasn't sure if SCSS was included in your mentioned support of Sass, but variables in SCSS don't appear to be recognized:

The following does not work:

@some-colour: green;

Just a heads up, they just updated atom to atom-shell 0.15 which upgrades to version 36 of Chromium. Chromium 36 no longer allows colors for <canvas> tags to use quirks mode, which means you need to include a leading hash mark with your colors. So when atom 0.121 is released you'll probably run into this issue.

In particular, color-picker will crash at startup with this error:
"Error: Failed to execute 'addColorStop' on 'CanvasGradient': The value provided ('FF0000') could not be parsed as a color.

on line color-picker\lib\ColorPicker-hueSelector.coffee:27:.

Here is info on the relevant change to Chromium:
http://src.chromium.org/viewvc/blink?view=revision&revision=171791

You probably just need to add hash marks to the list of _hexes, although I haven't done any extensive testing.

On opening the color picker via shortcut, it appears for a moment, then dies with this error:

Uncaught TypeError: Cannot read property '0' of undefined /[my home folder]/.atom/packages/color-picker/lib/ColorPicker-view.coffee:171

It started this morning, and is still happening after the latest release (3 hours ago coincidentally)

This is on OSX if it matters. Thanks!

color-picker (9 deprecations)
atom.workspaceView is no longer available. In most cases you will not need the view. See the Workspace docs for alternatives: https://atom.io/docs/api/latest/Workspace. If you do need the view, please use atom.views.getView(atom.workspace), which returns an HTMLElement.
Called 1 timeCreate Issue on color-picker repo

Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object.activate - /home/david/.atom/packages/color-picker/lib/ColorPicker.coffee:18:21
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
ColorPickerView.initialize - /home/david/.atom/packages/color-picker/lib/ColorPicker-view.coffee:39:18
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object. - /home/david/.atom/packages/color-picker/lib/ColorPicker-saturationSelector.coffee:6:19
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object. - /home/david/.atom/packages/color-picker/lib/ColorPicker-saturationSelector.coffee:7:26
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object. - /home/david/.atom/packages/color-picker/lib/ColorPicker-alphaSelector.coffee:6:19
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object. - /home/david/.atom/packages/color-picker/lib/ColorPicker-alphaSelector.coffee:7:26
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object. - /home/david/.atom/packages/color-picker/lib/ColorPicker-hueSelector.coffee:7:19
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
Object. - /home/david/.atom/packages/color-picker/lib/ColorPicker-hueSelector.coffee:8:26
Atom.Object.defineProperty.get - /usr/share/atom/resources/app/src/atom.js:55:11
ColorPickerView.bind - /home/david/.atom/packages/color-picker/lib/ColorPicker-view.coffee:154:17

If I use color picker to choose a color such as #333333, scss-lint complains about it and wants #333. It would be cool if there were an option in the Color Picker package that would dump out abbreviated hexes.

I get these alternating errors when activating via shift + cmd + c:

Uncaught TypeError: Cannot call method 'on' of undefined
Uncaught TypeError: Cannot call method 'off' of undefined

The preview image on https://atom.io/packages/color-picker is dead. Maybe it should point to the same thing as the repo homepage?

Uncaught TypeError: Cannot read property '0' of undefined

This error appears when I try to use the Color Picker. I click right on the property value then the color picker opens but it's immediately closed and the Chrome console opens itself.

The error is located to : _.atom/packages/color-picker/lib/ColorPicker-view.coffee:171_

So, if I let my console open and I try again to use the picker, it works like a charm.

Uncaught TypeError: Cannot call method 'matchesAttributes' of undefined /Applications/Atom.app/Contents/Resources/app/src/editor.js:1880
module.exports.Editor.handleMarkerCreated /Applications/Atom.app/Contents/Resources/app/src/editor.js:1880
(anonymous function) /Applications/Atom.app/Contents/Resources/app/src/editor.js:3
(anonymous function) /Applications/Atom.app/Contents/Resources/app/node_modules/emissary/lib/emitter.js:133
module.exports.Emitter.emit /Applications/Atom.app/Contents/Resources/app/node_modules/emissary/lib/emitter.js:132
module.exports.DisplayBuffer.handleBufferMarkerCreated /Applications/Atom.app/Contents/Resources/app/src/display-buffer.js:1136
(anonymous function) /Applications/Atom.app/Contents/Resources/app/src/display-buffer.js:5
(anonymous function) /Applications/Atom.app/Contents/Resources/app/node_modules/emissary/lib/emitter.js:133
module.exports.Emitter.emit /Applications/Atom.app/Contents/Resources/app/node_modules/emissary/lib/emitter.js:132
module.exports.MarkerManager.createMarker /Applications/Atom.app/Contents/Resources/app/node_modules/text-buffer/lib/marker-manager.js:173
module.exports.MarkerManager.markRange /Applications/Atom.app/Contents/Resources/app/node_modules/text-buffer/lib/marker-manager.js:87
module.exports.TextBuffer.markRange /Applications/Atom.app/Contents/Resources/app/node_modules/text-buffer/lib/text-buffer.js:927
module.exports.DisplayBuffer.markBufferRange /Applications/Atom.app/Contents/Resources/app/src/display-buffer.js:863
module.exports.Editor.markBufferRange /Applications/Atom.app/Contents/Resources/app/src/editor.js:1056
module.exports.Editor.addSelectionForBufferRange /Applications/Atom.app/Contents/Resources/app/src/editor.js:1157
module.exports.ColorPickerView.selectColor ColorPicker-view.coffee:424
module.exports.ColorPickerView.replaceColor ColorPicker-view.coffee:439
(anonymous function) ColorPicker-view.coffee:176
jQuery.event.dispatch /Applications/Atom.app/Contents/Resources/app/node_modules/space-pen/vendor/jquery.js:4676
elemData.handle /Applications/Atom.app/Contents/Resources/app/node_modules/space-pen/vendor/jquery.js:4360

First off, thank you for the awesome package!

The keyboard binding of cmd-shift-c does not do anything when the cursor is over a hex code or when the hex code is selected, until the first time we right click and choose Color Picker.

After that, cmd-shift-c keeps opening the last opened color regardless of the position of the cursor.

atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace),
which returns an HTMLElement.

Atom.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/src/atom.js:55:11)
Object.activate (/Users/jmp/.atom/packages/color-picker/lib/ColorPicker.coffee:18:21)

Hi there !

Thanks a lot for the improvement with Sass/LESS variables !

A cool feature will be to allow us to directly choose a variable color instead of a color value!

For illustrated my demand, imagine that I have @beautiful-red: #903;. Then if I use the color-picker and go to channels near to that value (ex. #CC0000 or rgb(204, 0, 0)), it propose me @beautiful-red.

I imagine that is really tricky but it will be awesome! ;-)

It would be really helpful if there were a CHANGELOG to be able to see at a glance what was added / fixed / changed in each version. Thanks! 😃

Currently a function [ex: lighten($var, 20%);] shows just the base color ($var), not the result of the function. Could a use highlight a whole function, open Color Picker and the result of the function be displayed?

This is not a huge problem, but if the cursor position is low enough, the picker is placed such that it hides the position, sorta snapped to the bottom of the viewport. It'd be nice if the picker would be e.g. offset horizontally such that the color value in the source would always be visible.

I love this package, but it just stopped working. It pops open briefly then disappears, and the console pops up:

Cannot read property '0' of undefined /Users/z/.atom/packages/color-picker/lib/ColorPicker-view.coffee:171