Custom javascript library to reuse in Button Card

[maxalbani]

HI,

I'd like to create a library of custom javascript functions to be reused in Button Card. I created a common_functions.js file in /config/www I added a resource to lovelace for the created file. I created a simple example function in file common_functions.js:

function test_function(input) {
   var value = input + 1;
   return value;
}

I created an example card:

type: custom:button-card
name: |
   [[[
     return test_function(10);
   ]]]

But button-card doesn't see my custom function

ButtonCardJSTemplateError: ReferenceError: test_function is not defined in 'return test_function(10);'

Any tips?

[Mariusthvdb]

yes, use the configuration templates this card provides.

tooltip_template:
  tooltip: >
    [[[ function capitalizeFirstLetter(string) {
              return string.charAt(0).toUpperCase() + string.slice(1);
              }
        capitalizeFirstLetter(variables.tooltip.replace('_',' ')); ]]]

and then import

type: custom:button-card
template: tooltip_template

[maxalbani]

yes, use the configuration templates this card provides.

tooltip_template:
  tooltip: >
    [[[ function capitalizeFirstLetter(string) {
              return string.charAt(0).toUpperCase() + string.slice(1);
              }
        capitalizeFirstLetter(variables.tooltip.replace('_',' ')); ]]]

and then import

type: custom:button-card
template: tooltip_template

I use templates a lot, but that's not what I asked for. I would like to create my own library of functions and use them in button-card cards.

Thanks

[Mariusthvdb]

well, you can, and add them all to the button_card_templates. Dont see the issue really. Unless you want something outside button-card.

anyways, you should close this issue, as this is completely beyond the scope of this repo.

[maxalbani]

capitalizeFirstLetter

I realize it's not a bug and I'm closing but I keep telling you that what you told me has nothing to do with it. The scope of the capitalizeFirstLetter function remains limited within that template. You obviously didn't understand my need

[Mariusthvdb]

sure. within the template. Callable in all button cards using button-card-templates. Along with all other functions you can declare. And that is what this repo is for. Custom:button-card.

If want to go beyond that, you should write your own custom resource, totally possible, but, beyond the scope of this repo.

You obviously didn't understand

Dont be offensive please. not appreciated.

[maxalbani]

I know what this component is for, I've built entire dashboards on it. For my request I don't want to call the template as I already do but I want to call a globally declared javascript function. It wasn't my intention to be offensive, I was just saying that I can't make myself understood. My English is bad