Skip to content

Conversation

@ZeroX-DG
Copy link
Member

@ZeroX-DG ZeroX-DG commented Sep 29, 2018

The audio player is here!
To add an audio player to your note your note must obey these rules:

  • There are 3 syntaxes for audio:
@[audio]

@[](audio)

@[audio-reference]

// example

@[file.mp3]

@[](file.mp3)

// link reference must be defined first (I still haven't found out a way to fix this)
// there must be no .mp3, .wav or .ogg in reference
[ref]: file.mp3

@[ref]

  • The audio must be at the start of input or the previous line must be blank.

The audio syntax will automatically be generated when you drag the audio file in.

Enough talking! Demo:

audioboost

@ZeroX-DG ZeroX-DG added the awaiting review ❇️ Pull request is awaiting a review. label Sep 29, 2018
* @returns {String} Generated markdown code
*/
function generateAttachmentMarkdown (fileName, path, showPreview) {
return `${showPreview ? '!' : ''}[${fileName}](${path})`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why did you remove the parameter (and evaluation) ´showPreview´????

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm sorry, I'll fix it right away 😄

} else if (fileType.startsWith('audio')) {
previewType = 'audio'
}
const imageMd = generateAttachmentMarkdown(originalFileName, path.join(STORAGE_FOLDER_PLACEHOLDER, noteKey, fileName), previewType)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

you've modified the previewGeneration on this place as well!

const imageMd = generateAttachmentMarkdown(originalFileName, path.join(STORAGE_FOLDER_PLACEHOLDER, noteKey, fileName), showPreview)
let previewType = null
if (fileType.startsWith('image')) {
previewType = 'image'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe you should use constants istead of strings for this!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good idea!

@daiyam
Copy link
Contributor

daiyam commented Sep 30, 2018

@ZeroX-DG I would recommend a syntax close to the one for images.

For example:

#[](http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_\(1\).ogg)

would be rendered as

<audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg" controls></audio>

This way, we can have references:

Let's play an audio test #[][audio1]

[audio1]: http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg

or simply

Let's play an audio test #[audio1]

[audio1]: http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg

Same for video:

$[BigBuckBunny](http://www.supportduweb.com/page/media/videoTag/BigBuckBunny.ogg)

rendered as

<video src="http://www.supportduweb.com/page/media/videoTag/BigBuckBunny.ogg?0" controls>BigBuckBunny</video>

@ZeroX-DG
Copy link
Member Author

ZeroX-DG commented Oct 1, 2018

@daiyam Thank you for your suggestion, I'm also thinking about the syntax for this and your suggestion looks great!

@arcturus140
Copy link
Contributor

I just recalled vaguely there have been PR's for audio player and slide show so I wondered if they've been released yet.
@ZeroX-DG can you add your player to the Welcome to Boostnote! note that ships with BN? That would highlight the feature. What do you think?
I think the slide show was also from you? I can't find the PR / issue.

@ZeroX-DG
Copy link
Member Author

ZeroX-DG commented Nov 9, 2018

@arcturus140 that's a great idea, I'll add it to the welcome page. The slideshow was actually by @daiyam at #2465

@daiyam
Copy link
Contributor

daiyam commented Nov 9, 2018

@ZeroX-DG I know it's a question of taste but I liked the use of hash sign # for music files because it's remind me if the sharp sign ♯ (wikipedia ) used in music sheets.

@ZeroX-DG
Copy link
Member Author

@daiyam I used @ because @udio 😄 But if you like the # then I'll change it. But before that I'll ask the slack channel about this

@daiyam
Copy link
Contributor

daiyam commented Nov 10, 2018

@ZeroX-DG @udio makes sense. Yes, more opinions are welcome.

@XarisA
Copy link

XarisA commented Nov 10, 2018

@daiyam I used @ because @udio 😄 But if you like the # then I'll change it. But before that I'll ask the slack channel about this

I think that # will be confusing in md for most people because it is related with header. But yeah bomb the slack channel about this.

@daiyam
Copy link
Contributor

daiyam commented Nov 10, 2018

@XarisA I guest but @ is also used to do mentions in GFM. So it could be also confusing 😉

@ZeroX-DG ZeroX-DG changed the title Added audio player [WIP] Added audio player Jan 22, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

awaiting review ❇️ Pull request is awaiting a review.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants