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.

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

grapejs storage #38

Open
ghost opened this issue Oct 6, 2022 · 0 comments
Open

grapejs storage #38

ghost opened this issue Oct 6, 2022 · 0 comments

Comments

@ghost
Copy link

ghost commented Oct 6, 2022

Hello,
We need to store template/ page in grapejs remote storage. load function work well but store function not work and we create db.json file to store data. please tell us what we done wrong in this following code.
const projectEndpoint = your_url/db.json;
const editor = grapesjs.init({
height: "100%",
container: "#editor",
showOffsets: true,
fromElement: true,
noticeOnUnload: false,
pageManager: true, // This should be set to true
type: 'remote',
autosave: true,
autoload: true,
stepsBeforeSave: 1,
contentTypeJson: true,
urlStore: projectEndpoint,
urlLoad: projectEndpoint,
params: {},

selectorManager: {
componentFirst: true
},
plugins: ["grapesjs-component-code-editor", "grapesjs-parser-postcss","gjs-preset-webpage","grapesjs-project-manager"],
pluginsOpts: {
"grapesjs-component-code-editor": {
/* Test here your options */
},
"grapesjs-project-manager": {
loadFirst: true,
},
}
});

const pn = editor.Panels;
const panelViews = pn.addPanel({
id: "views"
});
panelViews.get("buttons").add([
{
attributes: {
title: "Open Code"
},
className: "fa fa-file-code-o",
command: "open-code",
togglable: false, //do not close when button is clicked again
id: "open-code"
}
]);

const tp = editor.Panels;
const panelOpts = tp.addPanel({
id: 'options'
});
tp.addButton('views', {
id: 'open-pages',
className: 'fa fa-file-o',
attributes: {
title: 'Take Screenshot'
},
command: 'open-pages',
togglable: false
});
panelOpts.get('buttons').add([{
attributes: {
title: 'Open projects and templates'
},
className: 'fa fa-folder-o',
command: 'open-templates',//Open modal
id: 'open-templates'
}, {
attributes: {
title: 'Save As Template'
},
className: 'fa fa-save white-color',
command: 'save-as-template',//Save page as template
togglable: false,
id: 'save-as-template'
}]);

editor.on('storage:load', function(e) {
console.log('Loaded ', e);
editor.render();
//autorender: 0;
});
editor.on('storage:store', function(e) {
var htmldata = editor.getHtml();
var cssdata = editor.getCss();
console.log(htmldata);
console.log(cssdata);
console.log('store', e);
});
Thank you...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

0 participants