Focus - Hide navigation bar in Kodular Creator

(Yusuf Cihan) #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

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.

9 Likes
Dual Screen Creator
(Cian) #2

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

Well done @yusufcihan

4 Likes
(Daniel Vanko) #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
(Daniel Vanko) #4

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

1 Like
(Yusuf Cihan) #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
(Yusuf Cihan) #6

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

(Daniel Vanko) #7

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

1 Like
(Yusuf Cihan) #8

Sent on Telegram :wink:

(Daniel Vanko) #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
(Yusuf Cihan) #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.

2 Likes
(Yusuf Cihan) #12

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

(Daniel Vanko) #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:

2 Likes
(Franck G) #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
(Daniel Vanko) #15

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