Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Can't set icon for launcher if it isn't in category 'Notebooks' #5822

Open
yuvipanda opened this issue Dec 31, 2018 · 4 comments
Open

Can't set icon for launcher if it isn't in category 'Notebooks' #5822

yuvipanda opened this issue Dec 31, 2018 · 4 comments
Labels
pkg:launcher
Milestone
Reference

Comments

@yuvipanda
Copy link
Contributor

I'm trying to add launcher entries (for launching RStudio / Shiny / etc) into the JupyterLab launcher.

If I do:

      launcher.add({
        command: commandId,
        // This is the only way to get icon URLs in here
        category: 'External Applications',
        kernelIconUrl: 'http://words.yuvi.in/profile.jpg'
      })

I don't get a launcher icon - just blank space.

If I do:

      launcher.add({
        command: commandId,
        // This is the only way to get icon URLs in here
        category: 'Notebook',
        kernelIconUrl: 'http://words.yuvi.in/profile.jpg'
      })

I do get a launcher icon. It looks like the code is checking if the launcher is a 'kernel' by seeing if it is in the Notebook / Console category and honoring kernelIconUrl only then?
@ian-r-rose
Copy link
Member

You should be able to set an icon by adding an iconClass CSS class to the command that you created for launching an external application. An example of this is in the terminal launcher item:

jupyterlab/packages/terminal-extension/src/index.ts

Lines 200 to 229 in 3044387

commands.addCommand(CommandIDs.createNew, {
label: args => (args['isPalette'] ? 'New Terminal' : 'Terminal'),
caption: 'Start a new terminal session',
iconClass: args => (args['isPalette'] ? '' : TERMINAL_ICON_CLASS),
execute: args => {
const name = args['name'] as string;
const initialCommand = args['initialCommand'] as string;
const term = new Terminal({ initialCommand });
const promise = name
? services.terminals.connectTo(name)
: services.terminals.startNew();
term.title.icon = TERMINAL_ICON_CLASS;
term.title.label = '...';
let main = new MainAreaWidget({ content: term });
shell.addToMainArea(main);
return promise
.then(session => {
term.session = session;
tracker.add(main);
shell.activateById(main.id);
return main;
})
.catch(() => {
term.dispose();
});
}
});

We typically make a CSS class with the desired image as a background image.

For some history: the launcher used to have its own execute, iconClass, etc options. This wound up being pretty duplicative with the command registry, so it was refactored to take a command id in #4757. One place where it didn't quite fit as nicely was when the launcher icon is a specific kernel, and that was retained as a sort of side-option to the command definition.

@ian-r-rose
Copy link
Member

Also to be filed under: we need better narrative documentation 🙁

@yuvipanda
Copy link
Contributor Author

@ian-r-rose thank you!

Hmm, now I wonder - I'm constructing these launcher items dynamically (from fetching a remote URL), and won't know what should be in the CSS before. Should I just dynamically generate the CSS required and apply it?

@ian-r-rose
Copy link
Member

Ooh, tricky. I suppose dynamically generating CSS would be the best way forward; I can't really think of a better approach.

@ian-r-rose ian-r-rose added this to the Reference milestone Dec 31, 2018
@yuvipanda yuvipanda mentioned this issue Jan 10, 2019
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
pkg:launcher
Projects
None yet
Milestone
Reference
Development

No branches or pull requests
2 participants
@yuvipanda @ian-r-rose