Closed sidiqim closed 3 years ago
At the moment turning off the rulers just resets the dragmode to default
so I'll fix this so it returns to the user's default. By default the plugin switches between dragmode default
and translate
https://github.com/artf/grapesjs/issues/1936. I'm not sure why the rulers are turned of when the canvas is cleared, maybe it stops all commands. I'll look into it but if that's the case I'm not sure there'd be any fix for that.
The second issue is related to context
check here https://github.com/artf/grapesjs/issues/2852, but tldr; is the panel buttons act like radio buttons if they have the same context
, so using one button toggles off all other buttons in the same context
.
TLDR; solution
:
{
attributes: {
title: 'Toggle Rulers'
},
context: 'toggle-rulers', //! Add context
label: `<svg width="18" viewBox="0 0 16 16"><path d="M0 8a.5.5 0 0 1 .5-.5h15a.5.5 0 0 1 0 1H.5A.5.5 0 0 1 0 8z"/><path d="M4 3h8a1 1 0 0 1 1 1v2.5h1V4a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2.5h1V4a1 1 0 0 1 1-1zM3 9.5H2V12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V9.5h-1V12a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V9.5z"/></svg>`,
command: 'ruler-visibility',
id: 'ruler-visibility'
}
The first issue has been fixed in the latest release.
Thanks for addressing the issue with the update, and guidance on second issue.
Would be glad for a solution for hiding rulers in preview mode.
You can hide them with:
editor.on('run:preview', () => editor.stopCommand('ruler-visibility'));
Thank you once again... Based on your guidance I used the following code to maintain the rulers' state after returning back from preview mode.
const rulersButton = editor.Panels.getButton('options','ruler-visibility');
var rulersActiveBeforePreview;
//Hide rulers (if active) in Preview Mode.
editor.on('run:preview', function() {
rulersActiveBeforePreview = rulersButton.get('active');
if (rulersActiveBeforePreview) {
editor.stopCommand('ruler-visibility');
rulersButton.set('active', false);
}
});
//Show rulers (if active before preview is clicked) upon exit from Preview Mode.
editor.on('stop:preview', function() {
if (rulersActiveBeforePreview) {
editor.runCommand('ruler-visibility');
rulersButton.set('active', true);
}
});
First of all, thanks a lot for this wonderful plugin.
Is this an issue or am I not able to get it right? Please have a look at this -> https://jsfiddle.net/tfupj7ro/
Initially rulers are not active,
dragmode
is set toAbsolute
, after turning on rulers,dragmode
is stillAbsolute
. But once rulers are turned off,dragmode
is getting changed toTranslate
, and again after turning on rulers,dragmode
is getting back toAbsolute
. (Try dropping components each time and check the behavior.)I want to always keep
dragmode
toAbsolute
. How do I achieve this, please suggest.The other issue is, when canvas is cleared, rulers are getting turned off and
dragmode
is getting changed toTranslate
. I want to keep the rulers' visibility state same even after canvas is cleared.