Re: custom theme not working

[Beka Westberg]

Hello,

Thanks for your question :D If you're using defineTheme you shouldn't need to register it separately. You just need to make sure the theme is defined before you inject your workspace. Otherwise the workspace will search for the theme you passed to its options struct, and not be able to find it.

I hope that helps! If that recommendation doesn't work, or you have any further questions, please reply!

--Beka

On Tue, Jul 27, 2021 at 1:02 PM Ümit Dönmez <uemit....@gmail.com> wrote:

Still I  get this error:

ERROR Error: Uncaught (in promise): Error: Name "custom" with type "theme" already registered.

Error: Name "custom" with type "theme" already registered.

    at Object.Blockly.registry.register (scripts.js:101)

    at new Blockly.Theme (scripts.js:195)

    at Function.Blockly.Theme.defineTheme (scripts.js:197)

    at new CreateComponent (main.js:206)

    at NodeInjectorFactory.CreateComponent_Factory [as factory] (main.js:339)

    at getNodeInjectable (vendor.js:31226)

    at instantiateRootComponent (vendor.js:37793)

    at createRootComponent (vendor.js:40152)

    at ComponentFactory$1.create (vendor.js:52819)

    at ViewContainerRef.createComponent (vendor.js:50855)

    at resolvePromise (polyfills.js:11530)

    at resolvePromise (polyfills.js:11484)

    at polyfills.js:11596

    at ZoneDelegate.invokeTask (polyfills.js:10723)

    at Object.onInvokeTask (vendor.js:56337)

    at ZoneDelegate.invokeTask (polyfills.js:10722)

    at Zone.runTask (polyfills.js:10495)

    at drainMicroTaskQueue (polyfills.js:10899)

    at ZoneTask.invokeTask [as invoke] (polyfills.js:10808)

    at invokeTask (polyfills.js:11917)

Ümit Dönmez schrieb am Dienstag, 27. Juli 2021 um 17:32:35 UTC+2:

Hi there,

I can't get my custom theme running.

I have the injection in my ngOnInit() like here where I say to use my custom theme.

ngOnInit(): void {
this.workspace = Blockly.inject('blocklyDiv',
{
toolbox: document.getElementById('toolbox'),
zoom:
{
controls: true,
wheel: true
},
grid:
{
spacing: 25,
length: 3,
colour: '#ccc',
snap: true,
},
renderer: 'zelos',
theme: 'custom'
});

And my custom theme is in node_modules/blockly/core/theme/custom.js

'use strict';

goog.provide('Blockly.Themes.Custom');

goog.require('Blockly.Theme');

Blockly.Themes.Custom = Blockly.Theme.defineTheme('custom', {
'base': Blockly.Themes.Classic,
'fontStyle': {
"family": "Arial",
"weight": "bold",
"size": 12,
},
'blockStyles': {
'logic_blocks': {
"colourPrimary": "#7ab1f5",
"colourSecondary": "#A9C5EB",
"colourTertiary": "#d7e4f3"
},
'loop_blocks': {
"colourPrimary": "#5EAE9E",
"colourSecondary": "#8DC7BB",
"colourTertiary": "#CFE7E2"
},
'math_blocks': {
"colourPrimary": "#E994AB",
"colourSecondary": "#F0B9C8",
"colourTertiary": "#FAE7EC"
},
'text_blocks': {
"colourPrimary": "#8282FF",
"colourSecondary": "#B7B7FF",
"colourTertiary": "#DBDBFF"
},
'variable_blocks': {
"colourPrimary": "#d3ab9e",
"colourSecondary": "#d6c2bc",
"colourTertiary": "#d4ccc9"
},
'procedure_blocks': {
"colourPrimary": "#b8b5b5",
"colourSecondary": "#d6d2d2",
"colourTertiary": "#d6d2d2"
},
'motion_blocks': {
"colourPrimary": "#5ad0e2",
"colourSecondary": "#7de1ef",
"colourTertiary": "#a3e7ef",
}

},
'categoryStyles': {
"logic_category": {
"colour": "#7ab1f5",
},
"loop_category": {
"colour": "#5EAE9E",
},
"math_category": {
"colour": "#E994AB",
},
"text_category": {
"colour": "#8282FF",
},
"variable_category": {
"colour": "#d3ab9e",
},
"function_category": {
"colour": "#d6d2d2",
},
"motion_category": {
"colour": "#bde0fe",
}

},
'componentStyles': {
'workspaceBackgroundColour': '#e9e9e9',
'toolboxBackgroundColour': '#3e3e3e',
'toolboxForegroundColour': '#fff',
'flyoutBackgroundColour': '#303030',
'flyoutForegroundColour': '#ccc',
'flyoutOpacity': .8,
'scrollbarColour': '#797979',
'scrollbarOpacity': 0.4
}
});

What do I need to do that the theme can work.

If I set the them in the injection to anything else like dark or classic or the others it works.

Do I need to register my custom theme anywhere?

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/a409a4e3-1586-4922-98ef-8ab60ba806e0n%40googlegroups.com.