Status, roadmap... - Githubissues

BentoumiTech commented 2 years ago

An amazing plugin that you are working on!

I was playing with Symbols on grapes and saw your project, I like the approach you took to implement it.

Do there is any code I can contribute to help you get the plugin ready?

lexoyo commented 2 years ago

Hello I just saw your PR, thank you, that's a good surprise :) Sure I would love some help, I will share my todo list here then You need symbols for a project of yours? I need this plugin for the next version of silex.me Have a great day

BentoumiTech commented 2 years ago

Yes, I need symbols for a project I'm working on.

My end goal is to be able that whenever a symbol style/attributes/selection changes all the other instances of that symbol get updated.

Looking forward to seeing your todo list :)

lexoyo commented 2 years ago

Great :)

Here is my todo

[x] Backbone models for Symbols and Symbol
[x] Commands to create/delete symbol instances
[x] Mechanism to store the updated component's json in order to create new components out of the symbol
[x] Mechanism to track components inside Symbol instances and to apply a change to all occurrences of a component
[x] Sync attributes
[x] Sync css classes / selectors
[x] Sync children
[x] Sync nested children
[x] Sync styles
[x] Handle symbols in symbols
[x] Handle move a child from a symbol directly to another symbol
[x] Support pages
[x] Prevent dropping a symbol into itself (tip on how to prevent drop and here too)
[x] Prevent dropping from the stage a symbol child into the same symbol (or handle it as a move)
[x] Prevent dropping from the symbols pane a symbol child into the same symbol (or handle it as a move)
[x] Prevent make a symbol when it is a symbol already
[x] Support for making a component a symbol when the component is in a symbol (add symbol id to all instances)
[x] #4 (opionion wanted)
[ ] Tag name support
[x] Undo redo support
[ ] Rename symbol
[x] Add a trait for all symbols instances: unlink/pause sync

Bugs

[ ] when you delete something that is not in other instances it deltes everything
[ ] #6 (help wanted)
[ ] drop a quote in a symbol, then drag it to an other instance of the same symbol => the whole instance disappears
[ ] drop a "link block" component in a symbol changes its properties for: display: inline-block; min-height: 50px; padding: 5px;
[ ] change text inside a symbol then undo will undo the change only in the instance you changed

It would be great to collaborate - eventually I'll transfer this repo to the Silex Labs org (the foundation which holds silex copyright)

Have a nice day !

BentoumiTech commented 2 years ago

Thank you for sharing your to-do list, it helps a lot.

I already started to look at those three, I'll try to open a PR this week

Sync attributes
Sync styles
Sync CSS classes / selectors

lexoyo commented 2 years ago

👍

lexoyo commented 2 years ago

hey @BentoumiTech i'm back on the subject it seems all broken, i hope you didn't struggle with my non working code

lexoyo commented 2 years ago

we should probably use

https://www.npmjs.com/package/morphdom

mingodad commented 2 years ago

I'm also interested on the idea of this project but I'm not able to get it to work to test it, any clue/help ? I can get npm to install/start but I'm getting this message on console:

grapesjs@latest:2 Plugin grapesjs-sympbols not found Object
y @ grapesjs@latest:2
log.js:24 [HMR] Waiting for update signal from WDS...
lit-html.js:49 Lit is in dev mode. Not recommended for production! See https://lit.dev/msg/dev-mode for more information.
issueWarning @ lit-html.js:49
index.js:551 [webpack-dev-server] Hot Module Replacement enabled.
index.js:551 [webpack-dev-server] Live Reloading enabled.
DevTools failed to load source map: Could not load content for webpack://grapesjs-sympbols/node_modules/underscore/underscore-umd.js.map: Fetch through target failed: Unsupported URL scheme; Fallback: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for webpack://grapesjs-sympbols/node_modules/lit-html/development/lit-html.js.map: Fetch through target failed: Unsupported URL scheme; Fallback: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for https://unpkg.com/grapes.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

lexoyo commented 2 years ago

Hello Thanks for your interest I believe it is a little early for contributions, and not at all ready for production I should be back at in a month or so The idea I have now is to use dom and json diff libraries instead of this mechanism i prototyped here which looks for the parent symbol and all the children Please stay tuned and this will be testable in a couple of months Also the error messages you have are only for sourcemaps, I guess i missed a config somewhere

On Aug 18, 2022, 14:17, at 14:17, Domingo Alvarez Duarte @.***> wrote:

I'm also interested on the idea of this project but I'm not able to get it to work to test it, any clue/help ? I can get npm to install/start but I'm getting this message on console:

***@***.***:2 Plugin grapesjs-sympbols not found Object
y @ ***@***.***:2
log.js:24 [HMR] Waiting for update signal from WDS...
lit-html.js:49 Lit is in dev mode. Not recommended for production! See
https://lit.dev/msg/dev-mode for more information.
issueWarning @ lit-html.js:49
index.js:551 [webpack-dev-server] Hot Module Replacement enabled.
index.js:551 [webpack-dev-server] Live Reloading enabled.
DevTools failed to load source map: Could not load content for
webpack://grapesjs-sympbols/node_modules/underscore/underscore-umd.js.map:
Fetch through target failed: Unsupported URL scheme; Fallback: HTTP
error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for
webpack://grapesjs-sympbols/node_modules/lit-html/development/lit-html.js.map:
Fetch through target failed: Unsupported URL scheme; Fallback: HTTP
error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for
https://unpkg.com/grapes.min.js.map: HTTP error: status code 404,
net::ERR_HTTP_RESPONSE_CODE_FAILURE

-- Reply to this email directly or view it on GitHub: https://github.com/lexoyo/grapesjs-sympbols/issues/1#issuecomment-1219421436 You are receiving this because you commented.

Message ID: @.***>

mingodad commented 2 years ago

Thank you for reply ! The main error message is that this one Plugin grapesjs-sympbols not found it doesn't register the grapesjs-symbols plugin.

I did a hand made unification of this project an removed the need for lit-html but then I've got another problem where is the #symbols (appendTo: '#symbols') located ?

Do we need to create an empty div/element with that id ?

Any way thank you for your great work !

lexoyo commented 2 years ago

Yes, for now i bundled a UI which you need to tell where to go, with the appendTo option

lexoyo commented 2 years ago

The ui needs lithtml though You can leave it it was just a warning Please understand that it will not work yet, but you are welcome to try, please open a new issue then

lexoyo commented 1 year ago

FYI: I updated the "roadmap" with my progress, take a look at the demo to see how it is working so far https://codepen.io/lexoyo/pen/gOjYweZ

lexoyo commented 1 year ago

Updated the "road map" here

The demo should be up to date

silexlabs / grapesjs-symbols

Status, roadmap... #1