Managing Assets

Most plugins have the need to display images / icons, or even audio / video.

Uploading assets

With Livestorm Plugins we chose not to incorporate an asset pipeline. Instead we provide a CLI command to upload an asset. It will return an absolute URL you will be able to use in your code.

Uploading directories
The easiest way to use assets is to put them into an src/assets folder then use the livestorm asset command this way: livestorm asset src/assets which should give you an output similar to this:

The given URL is the URL of the entire folder in which each individual file is stored.
Then in your code you can use the assets like this:

const CDN = 'https://livestorm-irelan-plugin-assets.s3-eu-west.....'

Chat.send({
  user: {
    avatarUrl: CDN + 'photo1.png'
  }
})

Uploading individual files

# To upload a file named xxx.png run
livestorm asset xxx.png
=> https://plugins.livestorm.co/assets/6f6f430d-9a48-4c9b-92e6-68970d460371/xxx.png

# Then use this url in your code : 
<img src="https://plugins.livestorm.co/assets/6f6f430d-9a48-4c9b-92e6-68970d460371/xxx.png" />

Using the icon param

Most call-to-action APIs (RegisterShareButton, RegisterStageButton, etc) allow you to use an icon as a string. This is a simple way to add actions that respect and match Livestorm UI.

Here is the current list of icons you can use :

bell-off
check
film
columns
check-square
bell
map-pin
file
file-text
user-plus
plus
mic-off
zap
maximize
maximize-2
mail
user
plus-square
radio
volume-1
eye
eye-off
users
external-link
mic
tag
x
chevron-down
square
menu
link
twitter
smile
chevron-up
copy
send
more-horizontal
upload-cloud
message-circle
play
arrow-right
shuffle
globe
linkedin
trash-2
user
key
check
minimize
minimize-2
help-circle
download-cloud
arrow-left
download
code
edit
unlock
star
clock
log-out
share
video-off
monitor
edit-2
message-square
lock
help-circle
search
chevron-left
minus-circle
info
filter
alert-triangle
alert-circle
tag
user-check
chevron-right
calendar
settings
x-circle
video
facebook
book
volume-x
award
arrow-up
arrow-down
activity
chrome
shield
life-buoy
tool
trending-up
more-vertical
pause
phone

These icons come from https://feathericons.com/
Feel free to reach out to us if you need more icons