juliang22 / ObsidianTimestampNotes

This plugin allows side-by-side notetaking with videos. Annotate your notes with timestamps to directly control the video and remember where each note comes from.
196 stars 30 forks source link

Local video not working: streaming error #16

Open spartan opened 2 years ago

spartan commented 2 years ago

Local video feature not working:

OS: Ubuntu 20.04 Obsidian: v0.15.9 Timestamp Notes: latest version

Variant 1: Steps to replicate:

Result:

> [!error] Streaming Error 
> undefined

Variant 2: Steps to replicate:

Result:

> [!error] Streaming Error 
> undefined

Variant 3: Steps to replicate:

Result:

> [!error] Streaming Error 
> undefined
spartan commented 2 years ago

Apparently it works with some videos but not all.

Any suggestion to debug this ?

Thank you.

cbachmann987 commented 2 years ago

Same here, unfortunately.. it plays embedded in the note itself without problems

GeekSquirrel commented 1 year ago

You can't use a file path to open the local video due to the limitation of browser(obsidian is like a browser). To open a local video, you need first open a markdown file, then cmd+p(or ctrl+p) to search command "Timestamp Notes: Open sample modal (complex)" and choose your local file. Yes, it's really wired to use such a name, which should only for demo. I had no idea how to open a local file until I checked the source code. One more thing, the limitation also means that there is no video link button for local file, which is also mentioned at the bottom of the readme file. So you need to re-select the local video every time you restart obsidian, just like you need to re-upload a file when you refresh a web page. It seems that there is no better way to deal with local file, at least for now.

NebulusIO commented 1 year ago

@GeekSquirrel a bit painful experience... at least it's functional! Thanks for the thorough response, makes sense!

irocreate commented 1 year ago

You can't use a file path to open the local video due to the limitation of browser(obsidian is like a browser). To open a local video, you need first open a markdown file, then cmd+p(or ctrl+p) to search command "Timestamp Notes: Open sample modal (complex)" and choose your local file. Yes, it's really wired to use such a name, which should only for demo. I had no idea how to open a local file until I checked the source code. One more thing, the limitation also means that there is no video link button for local file, which is also mentioned at the bottom of the readme file. So you need to re-select the local video every time you restart obsidian, just like you need to re-upload a file when you refresh a web page. It seems that there is no better way to deal with local file, at least for now.

Want to add to this (spent all night trying to figure this out). In order to get React Player to access local file path media, the browser has to enable access to local files (e.g. Chrome needs to be launched with the command --allow-file-access-from-files).

With that said, I have a ton of audio files I need to make notes on and uploading to a online streaming service is NOT an option. My workaround:

Configure your computer as a webserver pointing to your local media repository. Then use a http://localhost:xxxx address to your media files.

GeekSquirrel commented 1 year ago

@LushS-io @irocreate Good news, I have found the perfect solution by digging into another repository, media extended, which is also a video plugin for obsidian. It's buggy now, but I found it can play local video.

After checking its source code, I found that obsidian provide a way to directly access local file

app://local/absolute/path/of/your/file

For example, if the absolute path of the file is /home/user/download/123.mp4, the url would be app://local/home/user/download/123.mp4. Even in Windows, you don't need to change any thing, just copy the absolute path like C:\Users\xxx\download\123.mp4 following app://local/, and it just works.


Though, another bug appeared. If you click the video button again when the video have already been playing, the video will loop among several frames endlessly. Finally, I figured out the bug by digging into react-player, which our project depends on. In our project, the author called seek function in onReady callback function, unfortunately, calling seek function will trigger the onReady again, which causing the endless loop. I moved the seek function into onStart callback function and solved this problem.


I forked this repository and made all the fixes. To use it, just clone my repository into your .obsidian/plugin directory. Also, I added code to convert file:/// to app://local/. So feel free to use file:///absolute/path/of/your/file as the url for your local file, and it will work perfectly this time.

By the way, due to the limitation of browser and react-player, not all video formats are fully supported. Format like mp4, flv may work well with react player. But format like mkv and others may not work as expected. So, consider to convert it to mp4 if your local video not works properly.

blumenschwein commented 1 year ago

@LushS-io @irocreate Good news, I have found the perfect solution by digging into another repository, media extended, which is also a video plugin for obsidian. It's buggy now, but I found it can play local video.

It works, thanks a lot!

However, I think MediaExtended is much easier to use, since I can just click a button to create a timestamp with the current time, and I can also change the name of the label. The only bug happens when I switch between edit and preview mode: Each time, a new pane is inserted below the video player. This bug is described here. Is it possible for you to also fix this bug? That would be great!

GeekSquirrel commented 1 year ago

@LushS-io @irocreate Good news, I have found the perfect solution by digging into another repository, media extended, which is also a video plugin for obsidian. It's buggy now, but I found it can play local video.

It works, thanks a lot!

However, I think MediaExtended is much easier to use, since I can just click a button to create a timestamp with the current time, and I can also change the name of the label. The only bug happens when I switch between edit and preview mode: Each time, a new pane is inserted below the video player. This bug is described here. Is it possible for you to also fix this bug? That would be great!

Actually, you can set a hotkey to insert current time with both timestamp notes and media extended. Also, it's easy to add the editable label name to timestamp notes. But I'm not going to fix it anymore, because I'm now writing a totally new project based on these two projects, which will also support more video platforms and have more features. I'll tell you when I finish it.

donaldguy commented 1 year ago

OP’s Variant 1 & 2 may be fixed by #38 (maybe not though, given variant 3)

or rather variant 1, variant 2 was covered at some point in my testing but not in the PR I posted, it would not be a hard thing to patch in though

zuluwi commented 1 year ago

https://github.com/juliang22/ObsidianTimestampNotes/assets/111116092/455fbe21-aeb5-4ab8-8457-04534f514aa4

zuluwi commented 1 year ago

2023-06-29-22-27-342.mp4

it looks like i did something completely useless resim

michimussato commented 1 year ago

+1 for local files.

So far, I was not successful with the workaround app://local/. My file path contains special characters like [ and ] which could be an issue in general. But still, no local paths with neither special characters nor white space worked.