[QUESTION] Open different Panel's view on click text element
Question
How can I make "click" event on texts open different panel's view than StyleManager? I'm trying this:
var domComps = editor.DomComponents;
var textType = editor.DomComponents.getType('text');
domComps.addType('text', {
model: textType.model,
view: textType.view.extend({
events: {
'click': function(){
editor.Panels.getButton('views', 'editor').set('active', true)
}
},
}),
});
editor.Panels.addButton('views',{
id: 'editorCK',
className: 'fa fa-bars',
command: 'abrirEditor',
attributes: { title: 'Some title'},
});
Answers (3)
different panel's view than StyleManager
Probably you're talking about the behavior in the demo, implemented by the webpage preset here https://github.com/artf/grapesjs-preset-webpage/blob/master/src/panels/index.js#L106 So in your case, it'd be something like this:
editor.on('component:selected', () => {
const selected = editor.getSelected();
if (selected && selected.is('text')) {
// do stuff
}
});
@artf so, I tried it and didn't work, it isn't setting active my panel button with id "editorCK"
editor.on('component:selected', () => {
const selected = editor.getSelected();
const openLayersBtn = editor.Panels.getButton('views', 'editorCK');
if (selected && selected.is('text')) {
if(!openLayersBtn || !openLayersBtn.get('active') && selected){
const openSmBtn = editor.Panels.getButton('views', 'editorCK');
openSmBtn && openSmBtn.set('active', 1);
}
}
});
Did you create the abrirEditor command?
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1675
[Question] How to make 'Settings' has 'title', 'href' ,'title' manually?
Hi Artur, Usually, 'Settings' has 'Id' and 'Title'. However, when you click any text that has become link, 'Settings' now has 'title', 'hre...
Issue #1886
How to create Drop down for the button inside a panel?
I'm trying to create a dropdown while clicking a button. I can append the data using ul, li to a button. Other than that any other way is t...
Issue #696
click binding question
Hello everyone, I'm new to all of this and I've been going through the documentation but I still dont understand how to bind click event. I...
Issue #1031
[Question] Custom icons
I want to add a custom icon to the grapesjs panel at the top of the editor page. Is it possible to do this with any SVG or with text? If so...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.