Gdevelop: Persistent UI during the session, panels positions are reset.

Created on 25 Oct 2020 · 11Comments · Source: 4ian/GDevelop

Description

Currently there is a persistent UI when we close and open GDevelop.
But the positions of panels isn't saved when an panel is hidden during the session.

A short example:
We open the layer panel, move the panel somewhere else, and close the panel.
The next time the panel is open, the default position is used.

Solution suggested

Use the lastest position of the panel.

Alternatives considered

No alternative.

To go further

The panels should be toggleable, with the button in the toolbar and with the shortcut.

✨ enhancement 👌good first issue 😤Non optimal UI behavior

Source

Bouh

All 11 comments

@Bouh and @4ian
Can I work on this? I think I might be able to fix this one.

K-Kumar-01 on 7 Dec 2020

👍1

@Bouh and @4ian
Can I work on this? I think I might be able to fix this one.

Yes sure you can no need to ask :)
If you need some advice or your have question don't hesitate to ask help!

Bouh on 8 Dec 2020

@Bouh and @4ian
Can I work on this? I think I might be able to fix this one.

Yes sure you can no need to ask :)
If you need some advice or your have question don't hesitate to ask help!

@Bouh
I would need some help here.
I forked the repo and cloned it. Then I ran

cd GDevelop/newIDE/app
npm install # or yarn

WITH YARN

DeepinScreenshot_20201208200056
DeepinScreenshot_20201208200103

WITH Npm

../ext/call.cc: In function ‘bool grpc::node::CreateMetadataArray(v8::Local<v8::Object>, grpc_metadata_array*)’:
../ext/call.cc:104:58: error: no matching function for call to ‘v8::Array::Get(unsigned int&)’
     Local<String> current_key(Nan::To<String>(keys->Get(i)).ToLocalChecked());
                                                          ^
In file included from /home/kushal/.cache/node-gyp/14.9.0/include/node/node.h:67:0,
                 from ../ext/call.cc:23:
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3717:43: note: candidate: v8::MaybeLocal<v8::Value> v8::Object::Get(v8::Local<v8::Context>, v8::Local<v8::Value>)
   V8_WARN_UNUSED_RESULT MaybeLocal<Value> Get(Local<Context> context,
                                           ^~~
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3717:43: note:   candidate expects 2 arguments, 1 provided
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3720:43: note: candidate: v8::MaybeLocal<v8::Value> v8::Object::Get(v8::Local<v8::Context>, uint32_t)
   V8_WARN_UNUSED_RESULT MaybeLocal<Value> Get(Local<Context> context,
                                           ^~~
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3720:43: note:   candidate expects 2 arguments, 1 provided
../ext/call.cc: In static member function ‘static Nan::NAN_METHOD_RETURN_TYPE grpc::node::Call::StartBatch(Nan::NAN_METHOD_ARGS_TYPE)’:
../ext/call.cc:681:35: error: no matching function for call to ‘v8::Object::Get(uint32_t&)’
     if (!op->ParseOp(obj->Get(type), &ops[i])) {
                                   ^
In file included from /home/kushal/.cache/node-gyp/14.9.0/include/node/node.h:67:0,
                 from ../ext/call.cc:23:
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3717:43: note: candidate: v8::MaybeLocal<v8::Value> v8::Object::Get(v8::Local<v8::Context>, v8::Local<v8::Value>)
   V8_WARN_UNUSED_RESULT MaybeLocal<Value> Get(Local<Context> context,
                                           ^~~
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3717:43: note:   candidate expects 2 arguments, 1 provided
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3720:43: note: candidate: v8::MaybeLocal<v8::Value> v8::Object::Get(v8::Local<v8::Context>, uint32_t)
   V8_WARN_UNUSED_RESULT MaybeLocal<Value> Get(Local<Context> context,
                                           ^~~
/home/kushal/.cache/node-gyp/14.9.0/include/node/v8.h:3720:43: note:   candidate expects 2 arguments, 1 provided
At global scope:
cc1plus: error: unrecognized command line option ‘-Wno-cast-function-type’ [-Werror]
cc1plus: all warnings being treated as errors
grpc_node.target.mk:204: recipe for target 'Release/obj.target/grpc_node/ext/call.o' failed
make: *** [Release/obj.target/grpc_node/ext/call.o] Error 1
make: Leaving directory '/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/build'
gyp ERR! build error 
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/home/kushal/.nvm/versions/node/v14.9.0/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:194:23)
gyp ERR! stack     at ChildProcess.emit (events.js:314:20)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:276:12)
gyp ERR! System Linux 4.15.0-30deepin-generic
gyp ERR! command "/home/kushal/.nvm/versions/node/v14.9.0/bin/node" "/home/kushal/.nvm/versions/node/v14.9.0/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "build" "--fallback-to-build" "--library=static_library" "--module=/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/src/node/extension_binary/node-v83-linux-x64-glibc/grpc_node.node" "--module_name=grpc_node" "--module_path=/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/src/node/extension_binary/node-v83-linux-x64-glibc" "--napi_version=6" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v83"
gyp ERR! cwd /media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc
gyp ERR! node -v v14.9.0
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok 
node-pre-gyp ERR! build error 
node-pre-gyp ERR! stack Error: Failed to execute '/home/kushal/.nvm/versions/node/v14.9.0/bin/node /home/kushal/.nvm/versions/node/v14.9.0/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --library=static_library --module=/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/src/node/extension_binary/node-v83-linux-x64-glibc/grpc_node.node --module_name=grpc_node --module_path=/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/src/node/extension_binary/node-v83-linux-x64-glibc --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:314:20)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:1047:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:287:5)
node-pre-gyp ERR! System Linux 4.15.0-30deepin-generic
node-pre-gyp ERR! command "/home/kushal/.nvm/versions/node/v14.9.0/bin/node" "/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build" "--library=static_library"
node-pre-gyp ERR! cwd /media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc
node-pre-gyp ERR! node -v v14.9.0
node-pre-gyp ERR! node-pre-gyp -v v0.13.0
node-pre-gyp ERR! not ok 
Failed to execute '/home/kushal/.nvm/versions/node/v14.9.0/bin/node /home/kushal/.nvm/versions/node/v14.9.0/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --library=static_library --module=/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/src/node/extension_binary/node-v83-linux-x64-glibc/grpc_node.node --module_name=grpc_node --module_path=/media/kushal/New Volume/GSOCOrgs/Gdevelop/GDevelop/newIDE/app/node_modules/grpc/src/node/extension_binary/node-v83-linux-x64-glibc --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/webpack-dev-server/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/watchpack-chokidar2/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/react-scripts/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/jest-haste-map/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fork-ts-checker-webpack-plugin/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: `node-pre-gyp install --fallback-to-build --library=static_library`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/kushal/.npm/_logs/2020-12-08T16_01_10_776Z-debug.log

I also tried cleaning the npm cache and then installing it. But the command failed.
Any help is highly appreciated.

K-Kumar-01 on 8 Dec 2020

Use Node.js version 12 while we fix an issue with Node.js 14: https://github.com/4ian/GDevelop/pull/2122
Thanks! :)

4ian on 8 Dec 2020

👍1

@4ian and @Bouh
I saw the codebase and it uses react-mosaic-component. It's my first time working with this component, so it might take a bit of time.
Also, as far as I understand the new panel(layer or any other) that is inserted, is inserted at 75 of the space from the top, with new panels stacking below the old ones(if vertically stacked)

K-Kumar-01 on 10 Dec 2020

@4ian and @Bouh
Need a little help.
DeepinScreenshot_20201210210016

So I went through the react mosaic code and found that the onRelease property can be used to get the latest split percentage and direction property.
The above image is there.

My imports
MosaicNode

Functions for onRelease

_onRelease = (currentNode: MosaicNode<number> | null) => {
    console.log('Mosaic.onRelease():', currentNode);
  };

My PROBLEM
Traversing the object itself can be cumbersome
Although I have found a solution on stackoverflow.
Besides, I was not able to fully understand the currentNode and have used it as used in the demo.

Apart from these all, we also need to add state to the SceneEditor for each layer in my opinion as it will be responsible for holding the latest positions which we will pass in place of hardcoded with default values as currently used.

Should I proceed with this solution?

K-Kumar-01 on 10 Dec 2020

Apart from these all, we also need to add state to the SceneEditor for each layer in my opinion as it will be responsible for holding the latest positions which we will pass in place of hardcoded with default values as currently used.

Possibly, though maybe it's something to save not in the SceneEditor state, but in the preferences (much like how we persist the existing layout with setDefaultEditorMosaicNode).
Then as you said, when opening an editor, use the value that was saved. Though I'm not sure if this will entirely be working - if I moved the editor to another place, you somehow need to remember its split percentage but also its position.

So you seem on the right track :) But it's not an easy problem, you must see if there is a way to properly persist the information about where the editor window is, then see if you can set it back when it's opened.

4ian on 11 Dec 2020

Apart from these all, we also need to add state to the SceneEditor for each layer in my opinion as it will be responsible for holding the latest positions which we will pass in place of hardcoded with default values as currently used.

Possibly, though maybe it's something to save not in the SceneEditor state, but in the preferences (much like how we persist the existing layout with setDefaultEditorMosaicNode).
Then as you said, when opening an editor, use the value that was saved. Though I'm not sure if this will entirely be working - if I moved the editor to another place, you somehow need to remember its split percentage but also its position.

So you seem on the right track :) But it's not an easy problem, you must see if there is a way to properly persist the information about where the editor window is, then see if you can set it back when it's opened.

I will try to solve the problem and let you know if I get into any trouble

K-Kumar-01 on 11 Dec 2020

@4ian
I had a doubt. Suppose that somehow we can save the editor state before closing a panel.
Now if the user changes the other layers. and then reopen the layer that it has closed, then opening the state as it was in the previous state would cause problems. So split percentage and direction seem to be the most important while the first and second can introduce more difficulties. Please correct me if I am wrong.

K-Kumar-01 on 12 Dec 2020

Now if the user changes the other layers. and then reopen the layer that it has closed, then opening the state as it was in the previous state would cause problems.

Yes indeed. So I'm not sure the problem is solvable easily, as the layout can have changed. Maybe we could offer a preference to change the default position/split percentage of each panel. Not sure what's the best to do to be honest.

4ian on 12 Dec 2020

Now if the user changes the other layers. and then reopen the layer that it has closed, then opening the state as it was in the previous state would cause problems.

Yes indeed. So I'm not sure the problem is solvable easily, as the layout can have changed. Maybe we could offer a preference to change the default position/split percentage of each panel. Not sure what's the best to do to be honest.

In my opinion, the default opening is the best one as just by using

editorName: string,
position: 'start' | 'end',
splitPercentage: number,
direction: 'row' | 'column'

these properties alone, it is impossible to determine the exact position and location of the panels. We need to change the codebase and add a few more details to be able to solve the problem. This task also is easier said than solved.

At the current moment, the maximum thing which I can do is to make the panels render with the direction and split percentage.
Should I proceed with the above thing?

K-Kumar-01 on 12 Dec 2020

👍1

Was this page helpful?

0 / 5 - 0 ratings