Go Back   Winamp & Shoutcast Forums > Visualizations > MilkDrop

 
Thread Tools Search this Thread Display Modes
Prev Previous Post   Next Post Next
Old 19th August 2020, 06:01   #1
EatMe
Junior Member
 
Join Date: Aug 2020
Posts: 6
MilkDrop easy to implement on webpages with EatMe/JBerg/Butterchurn 2.6.7.1e-complete

Presenting!!!

http://https://github.com/free-music....7.1e-complete
license: https://github.com/free-music-by-eat...master/LICENSE

butterchurn_example_with_fullscreen_func.zip

The music page on my website contains MilkDrop visuals from the EatMe/JBerg/Butterchurn v2.6.7.1e-complete (GitHub).
The original project is Butterchurnviz by JBerg and contains an update in the v.2.6.7.1e-complete with a manual and new functions.
You can right-click or push long on mobiles on the visuals for a full view experience.
Left click or tap shortly on the visuals to change the current visual presets.
EatMe/JBerg/Butterchurn v2.6.7.1e-complete (GitHub) is released under a MIT license for Commercial, Private, Distribution and Modification usage,
with No Liability Granted and No Warranty Granted under the conditions of a License and Copyright notice.

Butterchurn-v2.6.7.1e complete - with HTML_butterchurn_example_e.htm
@free-music-by-eatme free-music-by-eatme released this 2 hours ago

…easy to implement manual

see https://butterchurnviz.com/ for the original project.
see nightride.fm for an interlaced version with radiostream.
see eatme.pro/music for a right-click fullscreen with music.

play audio link, html audio element and directly showing butterchurn MilkDrop visuals are in the HTML_butterchurn_example_e.htm
butterchurn.js example

?audiotoplay=(audio file or stream URL)
in the example document parameters will load an audio file or stream. the user must press play.

in this example attached:
right click / push longer than 500 msec on mobile
fullscreen/restore

left click / tap shorter than 500 msec on mobile
change preset

needed: ((x) indicates changes were made)

(x) streaming or file source with HTTP Headers set to "Access-Control-Allow-Origin: *" (being a star, shift-8)
on the webserver to contain a HTTP Header that allows you to use the mp3 on (x) all (or your) pages.

(x) butterchurn.js

set the location in the script src header below
eatme.pro/filedmin/scripts/butterchurn.js as of now contains my editing version, see attached for this working
edit butterchurn.js var section at begin of file to set screen size, if not in stylesheet, z-index (layout order)
default: 100x100 "98" "1" fullscreen=false
butterchurn.min.js - see attached

set the location in the script src header below
butterchurnExtraImages.min.js - see attached

set the location in the script src header below
butterchurnPresets.min.js - see attached

set the location in the script src header below
butterchurnPresetsExtra.min.js - see attached

set the location in the script src header below
butterchurnPresetsExtra2.min.js - see attached

set the location in the script src header below
butterchurn_initvar.js - used to be called helper.js - see attached

set the location in the script src header below
jquery 1.12.14.min.js works - ajax.googleapis has a slow response but can be multi-site cached

set the location in the script src header below
not required: butterchurn_isSupported.js - old code that is in included below in this example to check if it is supported.. https://ajax.googleapis.com/ajax/lib.../jquery.min.js - loaded below

https://ajax.googleapis.com/ajax/lib.../jquery.min.js is the newest referred by w3schools, not tested
//required: jquery 1 12 14 or something min.js here from google with a slow response time

EatMe/JBerg/Butterchurn v2.6.7.1e-complete (GitHub) is released under a MIT license for Commercial, Private, Distribution and Modification usage, with No Liability Granted and No Warranty Granted under the conditions of a License and Copyright notice.
https://github.com/free-music-by-eat...master/LICENSE

Download example - easy to implement MilkDrop on your own website - and code files:
[url]http://https://github.com/free-music....7.1e-complete

special shout outs to:
Ryan Geiss for creating MilkDrop
Nullsoft for creating Winamp
All the amazing preset creators, special thanks to Flexi

EatMe/JBerg/Butterchurn v2.6.7.1e-complete update and example html on GitHub
by EatMe - http://eatme.pro/about - free music and science

Radio http://nightride.fm where I found the first interlaced implementation

Original http://butterchurnviz.com javascript port on GitHub by Jonathan Berg - http://jonathanberg.nl/
EatMe is offline   Reply With Quote
 
Go Back   Winamp & Shoutcast Forums > Visualizations > MilkDrop

Tags
eatme, javascript, jberg, milkdrop

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump