Ju99ernaut / grapesjs-template-manager

Template and page manager for grapesjs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

grapejsstorage

opened this issue · comments

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 projectID = 1;
const projectEndpoint = url../my-server/db.json;
const editor = grapesjs.init({
height: "100%",
container: "#editor",
showOffsets: true,
fromElement: true,
noticeOnUnload: false,
pageManager: true, // This should be set to true
storageManager: {
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...