Help implementing calendar displaying script

[GeorgePerakis]

Hello, I am trying to display my google calendar events dynamically using googleCalendar API. I have managed to fetch events from the platform, and they way i display them by writing to my dashboard.md. However, due to the calendar I implemented needing inline javscript, the buttons do not work.

Another way I thought of is to implement a ready solution (see Event Calendar Widget, and just write on the data json each time the app runs.

Thanks for your time!

[mnaoumov]

Show how exactly you are trying to make it working and what is not working. Attaching a sample vault and a video would help

[GeorgePerakis]

I have made a calendar script in a folder under .obsidian/js:

function initCalendar() {
  document.querySelectorAll('.calendar-day').forEach(day => {
    day.addEventListener('click', function () {
      document.querySelectorAll('.event-block').forEach(el => el.style.display = 'none');
      document.querySelectorAll('.calendar-day').forEach(el => el.classList.remove('selected'));

      const date = this.dataset.date;
      const eventBlock = document.getElementById(`events-${date}`);
      if (eventBlock) eventBlock.style.display = 'block';

      this.classList.add('selected');
    });
  });
}

module.exports = {initCalendar};

The settings are:

but i still get calendar does not export a function

[mnaoumov]

You are not using it correctly. See docs for Startup script.

So you have to name your function invoke.

You should also consider if you need to call this function not only on startup, and call it explicitly somehow. You can call it programmatically or manually.

[GeorgePerakis]

Thanks for the reply!

The initial startup script works fine. I updated my code to include fetching from the API to write to a json file in order to use that data, however i get the following errors:


etc.

It seems that it cannot load the dependencies on the FetchFromApi script. I tried requireAsync but it doesnt seem to work. Here is the code from calendar.ts:

and from index.js:

Some more logic here

Thanks again for your help!!

[mnaoumov]

It will be easier if you prepare a test vault wherr you can reproduce the issue and attach it to the discussion

[GeorgePerakis]

Here is a simplified version of my vault with the issue. Inside the .obsidian/js/CalendarIntergration/src, you will find the startup. For debugging purposes i have commented out the FetchFromApi call in the first line of the function.

If you uncomment it you will see the failed to retrieve packages errors.

Thanks again for your time!!

[mnaoumov]

Ok, I found the problem. Looking at entire logs was important.

.obsidian/js/CalendarIntergration/node_modules/node-fetch/lib/index.js

Line 162-164

try {
	convert = require('encoding').convert;
} catch (e) {}

but the plugin doesn't understand that encoding dependency is optional and fails with Could not resolve module: encoding

[mnaoumov]

As a workaround you can use

[mnaoumov]

Later on, you will get another error

Cannot require 'C:/Users/YourUserName/AppData/Local/Programs/Obsidian/credentials.json'

But this is because you are incorrectly using in .obsidian/js/CalendarIntergration/apiFunctions.js

Line 9:

const CREDENTIALS_PATH = path.join(process.cwd(), 'credentials.json');

process.cwd() is wrong here, you should replace it with __dirname

[GeorgePerakis]

Thank you so much for your help!! Even though there are a lot more errors I am sure you have better things to do. I will try to untangle this mess from now on. I appreciate your time!!