GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.38k stars 4.06k forks source link

Question: trying to have 'Settings' sector under the style #2968

Closed gunslingor closed 4 years ago

gunslingor commented 4 years ago

https://github.com/artf/grapesjs/issues/1627

I think the question is related to this line specifically, I have the same issue. I look thru the demo but this class only appears in css and this line, so this selector returns undefined does it not? What element has this so that it can then be appended?

traitsProps.append($('.gjs-trt-traits')); It does work in the demo but I don't understand how..

Trying to solve in KotlinJS, notice:

Nikesh-hub commented 4 years ago

Hello @gunslingor before calling trait sector you need to make active both section settingButton && settingButton.set('active', 1); styleManagerButton && styleManagerButton.set('active', 1);

and then you can call

 

// Add Settings Sector   | var traitsSector = $('

'+   | '
Settings
' +   | '
');   | var traitsProps = traitsSector.find('.gjs-sm-properties');   | traitsProps.append($('.gjs-trt-traits'));   | $('.gjs-sm-sectors').before(traitsSector);   | traitsSector.find('.gjs-sm-title').on('click', function(){   | var traitStyle = traitsProps.get(0).style;   | var hidden = traitStyle.display == 'none';   | if (hidden) {   | traitStyle.display = 'block';   | } else {   | traitStyle.display = 'none';   | }   | });   |  

gunslingor commented 4 years ago

Yeah, I figured that out eventually. I don't get why I have to configure this section AFTER initialization instead of during like many other panels/sections. I think it's because I am using the presets plugin. I think init needs to be simple if your using it and then modified after, but I don't have confirmation and I don't know why. Is this correct, or can you use the presets plugin AND configure traits at init time (at the same time)?

artf commented 4 years ago

@gunslingor there is no real reason behind that choice. When the plugin was already published instead of modifying it I've preferred to put it directly in the demo to avoid breaking stuff, that's all. You can always create your plugin with your default layout

gunslingor commented 4 years ago

Okay, I think I understand. I need many different versions of grapejs canvases... each should be it's own plugin, maybe sharing common code in some cases. I was thinking differently, that presets were only settings that could be overridden but it's more like a preset is the complete solution itself... now I gotta learn to make plugins, off I go!