How can I write and use reusable functions?

[mjkaye]

I have written a number of small, JavaScript-based, Full House Templates. I'm impressed with the power of this plugin. My main objective is to modify existing blocks, with the use of keyboard shortcuts.

However, I would like to reduce code duplication in my templates. Here are a couple of examples:

Assign this block to a Project:

``{
  // do not modify block content
  blocks.skip()
  
  const selected = (await logseq.Editor.getSelectedBlocks())[0]
  if (selected) {
    const content = block.content
	const newContent = content + !content.toLowerCase().includes('project::') ? `\nproject:: [[>/Or/Projects/${cursor()}]]` : ''
    
    // Update the block with the new content
    await logseq.Editor.updateBlock(block.uuid, newContent)
  }
}``

Convert this block to an Action and add an action-type:

``{
  // do not modify block content
  blocks.skip()
  
  const selected = (await logseq.Editor.getSelectedBlocks())[0]
  if (selected) {
    let content = selected.content
    content = !content.startsWith('TODO ') ? `TODO ${content}` : content
	const newContent = content + !content.toLowerCase().includes('action-type::') ? `\naction-type:: [[to/${cursor()}]]` : ''
    // Update the block with the new content
    await logseq.Editor.updateBlock(selected.uuid, newContent)
  }
}``

As you can see, both of these templates add a property to the block. The corresponding code differs only in the property name and property value.

I would like to extract a function that would look something like this, and could be called from both templates:

  function addPropertyToContent(content, propertyName, propertyValue) {
    const newContent = content + !content.toLowerCase().includes(`${propertyName}::`) ? `\n${propertyName}:: ${propertyValue}` : ''
    return newContent
  }

I have read the JavaScript Environment section of the documentation, which suggests that I should be able do what I've described above, but I haven't been able to get it to work.

I've tried adding a block with the following code to the same page, but my templates complain that addPropertyToContent is not available:

``{
  function fnAddPropertyToContent(content, propertyName, propertyValue) {
    const newContent = content + !content.toLowerCase().includes(`${propertyName}::`) ? `\n${propertyName}:: ${propertyValue}` : ''
    return newContent
  }
  var addPropertyToContent = fnAddPropertyToContent
}``

I'd be grateful if you could give me step-by-step instructions to achieve what I've decribed.

[stdword]

I'm impressed with the power of this plugin

Hello, @mjkaye! Thank you ❤️

I would like to extract a function that would look something like this, and could be called from both templates

Quick answer: JS env works only inside the particular template. There is no cross-templated js-functions.
But you can have cross-templated... templates. Use Nesting to achieve the code deduplication.

Long answer: I'll provide step-by-step instructions after weekend.

[mjkaye]

Thank you for the clarification, @stdword.

I look forward to hearing the long answer.

[stdword]

Here is the solution:

- template:: .add-prop
	- ```javascript
	  ``{
	    function addPropertyToContent(content, propertyName, propertyValue) {
	      const newContent = content + (!content.toLowerCase().includes(`${propertyName}::`) ? `\n${propertyName}:: ${propertyValue}` : '')
	      return newContent
	    }
	  }``
	  ``addPropertyToContent(c.args.content, c.args.property, c.args.value)``
	  ```

- template:: assign-project
	- ```javascript
	  ``{  
	    const content = await include('.add-prop', `:content ${c.currentBlock.content}, :property project, :value [[>/Or/Projects/${cursor()}]]`)
	  }``
	  ``content``
	  ```

Notes

• I've drop block update to simplify code. Now it cannot be used for several selected blocks, but if you are using cursor() — you chose to work with only one block all the time.
• Setting cursor position for property values has a bug in Logseq. It'is not a bug of the plugin. See the demo:
  
• If you want to manually code switching focus for blocks — it is complex task in Logseq API in combination with the plugin. You can check this example for details.

[mjkaye]

Thank you for your succinct explanation, @stdword. I like the simplicity of the code and it's helped to make my code more elegant. I've decided to forego the use of cursor().

Having used this in practise, I've realized that my workflow is more streamlined if I can assign numerous blocks to a Project at the same time. Is it possible to modify the code so that it can be used for several blocks at the same time?

Ideally, I would like to use the following workflow. Is this possible:

1. I select several blocks
2. I use a template-shortcut to apply the assign-project template
3. The template code asks me to which Project I want to assign the blocks
4. The template code then adds a project property to each block with the value I specified in the previous step.

[stdword]

Step 3 is not possible. There is no direct way of inputting some value via UI.
I wanted to implement that feature via forms some time ago. But now Logseq team chose a strange way to develop the application, which I do not agree with. And I chose not to invest my efforts in the Logseq infrastructure.

The ways to input value:

• use template arguments (can't be combined with shortcuts)
• use another block's value (indirect workaround)
• use value from clipboard (indirect workaround)

[mjkaye]

Thank you, again, for the clear explanations, @stdword .