Focus - Hide navigation bar in Kodular Creator

Recently, @Franck_G28 wanted to disable the navigation bar of Kodular Creator because he has a dual screen.

So nobody wants navigation bar again if you split Kodular to Designer and Blocks as separate windows.

And I came up with the idea to solve this problem. I developed a Chrome extension for people who want to disable Kodular Creator’s navigation bar.

You can get it from there:

Chrome

https://chrome.google.com/webstore/detail/nbidcdnhfgdmdkcakmihaijfgponmbal

Thanks to @Daaniiieel he made a Firefox version of Focus. You can get it from here:

Firefox

Daniel works on Firefox version of Focus, and I’m working on Chrome version of Focus. :sweat_smile: So if you found a bug, please report that to right developer. :slightly_smiling_face:

Usage

After you install the extension, go to Kodular Creator, (obviously, the extension is disabled when you open another website) open your project, then just select a mode.

Result

Navigation bars are now hidden!

  • Focus
    Disables full navigation bar.

  • Compact
    Disables only first part of the navigation bar. “FILE”, “TEST”, “EXPORT”, “HELP” will be hidden. Screen name, assets, designer, blocks buttons will be stay visible.

  • Default
    Revert all changes.

Source Code

You can find both versions of Focus in GitHub.

10 Likes

You and @Boban are seriously superheros. :superhero: :man_superhero:

Well done @yusufcihan

4 Likes

A problem: it only affects creator.kodular.io but not c.kodular.io
Btw, if you wrote it as a “WebExtension”, it could be used both in Crome and Firefox, with just one codebase

1 Like

By the way, 3d party (mine) Firefox port is 90% done

1 Like

Oh my bad :sweat_smile: Yeah this extension only works with creator.kodular.io subdomain. I will publish a update which will work for c.kodular.io too.

Yeah I made WebExtension. But for example code is using chrome statements. This is browser in Firefox. As you said, there are little differences. So actually porting Chrome extension to Firefox is easy.

2 Likes

If you told me before, I’d give you the files of the extension. :sweat_smile:

I can decomplile it, but although, you can give me the script you are running, my self-made code failed.

1 Like

Sent on Telegram :wink:

The :fire::fox_face:Firefox port is done! You can download it from there:

The UI is not perfect yet, but I had to release today. It will be fixed in new updates :sweat_smile:

3 Likes

Thank you so much for porting this extension for Firefox! :smile: I added your port to first link. :wink:

1 Like

But working with two screens doesn’t work. I tested it with two tabs for my chrome. What happens on one for instance when live testing doesn’t happen on the other. When i change something in the designer i can see it. But when i do a doit for instance change a color in the blockeditor nothing happens. You have two instances running of the same project and that can only lead to problems i guess. Blocks added in one tab don’t appear in another. Not until the screen is reloaded.

3 Likes

I didn’t test it but maybe it can work with two windows instead of tabs?

Dear @Peter,
Actually, we know it. We do not provide a full solution, because, it would be nearly impossible or so. But the extension does not intend to solve it, read the description:

Hope this helps :smile:

2 Likes

Indeed, it is not a solution to my idea, but it can only be done by Kodular. But I still find this extension useful to save space:)

2 Likes

Focus for :fire: Firefox had just been updated! New design, and rebuilt from the Chrome code (previously it used a whole different code).

Download:

Get the sources:

2 Likes