Focus - Hide navigation bar in Kodular Creator

Off Topic
#1

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!

screen
screen1280×800 53.4 KB

  • 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
Dual Screen Creator
#2

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

Well done @yusufcihan

4 Likes
#3

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
#4

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

1 Like
#5

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
#6

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

#7

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

1 Like
#8

Sent on Telegram :wink:

#9

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
#10

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

1 Like
#11

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
#12

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

image
image.png819×295 46.5 KB

#13

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:

3 Likes
#14

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
#15

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

image
image1303×682 28.2 KB

Download:

Get the sources:

2 Likes