Getting the browser's current gps/location data?

[justyns]

Is it possible to get the browser's current gps/location data and insert it into a note using the scripting api somehow?

I currently have a Tasker task on android that lets me take quick notes and saves them as a .md file storing my current gps/location data in yaml frontmatter. I'm probably going to try and convert this to use Trilium's api but I was wondering if there's a native way to retrieve this information instead when using the web frontend?

Specifically using the web interface on mobile, I don't think I'd need it from the electron app. My ideal flow would probably be a button on the sidebar that I can click and have it prompt for a short text and put it in a new note with the gps/location attributes pre-filled.

[justyns]

Update. I think I figured out how to do this using the scripting api. I can post the script here once I do some more testing, but basically I had three separate components:

• frontend script - Uses navigator.geolocation.getCurrentPosition to get the browser's current location data and then posts it to /custom/update-location with the current note id
• custom http handler - accepts noteId, longitude, latitude and uses note.setLabel to set them as labels on noteId
• backend script - a 3rd script that just adds a button to the toolbar which calls the frontend script

I'm pretty impressed that I was able to figure out how to get this to work so quickly w/ Trilium, but I'm also wondering if there's a better way to do it? Is there a way for a frontend script to automatically run whenever a new note is created as an example? And is there a way for a frontend script to change the note's attributes/labels without having to call a backend script/custom http handler?

[justyns]

@meichthys That's pretty much why I want it too. I don't use it too often, but I like having a rough idea of where I was when I make journal-type notes. Or even worklog notes, it's helpful to know if I was out of town for work or at a client site/etc.

Here's my current version. I haven't cleaned it up or used @rauenzi 's suggestions yet, but it is working for me so far.

I have three notes:

1. http-update-location / js backend code note for the http handler. Needs the label `#customRequestHandler=update-location `:

const { req, res } = api;
const { secret, noteId, latitude, longitude } = req.body;

if (req.method === 'POST' && secret === 'secretgoeshere') {
  try {
    // Fetch the note you want to update by its noteId
    const note = api.getNote(noteId);

    if (!note) {
      res.status(404).send("Note not found");
      return;
    }

    // Create new label attributes for the note
    const labels = [
      { type: "label", name: "latitude", value: latitude.toString(), isInheritable: false },
      { type: "label", name: "longitude", value: longitude.toString(), isInheritable: false }
    ];

    for (const label of labels) {
      note.setLabel(label.name, label.value);
    }

    res.status(200).send("Attributes updated successfully");
  } catch (error) {
    console.error('An error occurred:', error);
    res.status(500).send("Internal Server Error");
  }
} else {
  res.status(400).send("Bad Request");
}

2. add-gps-coords js frontend code note:

async function addLabelsToNote(noteId, latitude, longitude) {
  // Create the label payload
  const payload = {
    secret: 'secretgoeshere',
    noteId: noteId,
    latitude: latitude.toString(),
    longitude: longitude.toString()
  };

  try {
    const response = await fetch('/custom/update-location', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(payload)
    });

    if (response.ok) {
      console.log('Attributes updated');
    } else {
      console.log('Failed to update attributes');
    }
  } catch (error) {
    console.error('Fetch error:', error);
  }

}

const noteId = api.getActiveContextNote().noteId;
console.log(noteId);

// Request location from browser
navigator.geolocation.getCurrentPosition((position) => {
  const latitude = position.coords.latitude;
  const longitude = position.coords.longitude;

  addLabelsToNote(noteId, latitude, longitude)
    .catch((error) => {
      console.log('An error occurred:', error);
    });
}, (error) => {
  console.log('Geolocation error:', error);
});

3. add-location-toolbar-button - frontend script to add a button to the toolbar:

// Frontend script to add a custom launcher button
api.createOrUpdateLauncher({
  id: 'update_location', 
  type: 'script',
  title: 'Update Location',
  isVisible: true,
  icon: 'bx-map',
  keyboardShortcut: 'ctrl+shift+l', // this can be removed if you don't want a key shortcut
  scriptNoteId: 'iquE6wmrtZyv'  // This should point to the note ID of 'add-gps-coords'
});

[meichthys]

@justyns Thanks! Could you throw this into a git repository or a gist so I can link to it from the great AwesomeTrilium repo?

[zadam]

I believe you can do this by using Entity Events described in the wiki https://github.com/zadam/trilium/wiki/Events#entity-events just make the parent of wherever these notes are stored have that relation as an inheritable property.

The trouble here is that these events can trigger only backend scripts and currently there's no good way to trigger frontend from backend (only the opposite).

[zadam]

I've added api.runOnFrontend() backend script API method to make this less painful. Will be in the next 0.61 release.

[justyns]

Thanks @zadam ! I'll try it out when 0.61 is released, it would make things smoother for sure. I sort of worked around it for now by adding a button to the toolbar that creates a note note and then immediately triggers that script on the new note.

[justyns]

@justyns Thanks! Could you throw this into a git repository or a gist so I can link to it from the great AwesomeTrilium repo?

Sure @meichthys , I just created https://github.com/justyns/trilium-scripts and put it there for now. I have another version I'm working on along with some other scripts, so I figured having one repo to put them in might not be a bad idea.