diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/.gitignore b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/.gitignore new file mode 100755 index 0000000..6e8821b --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/.gitignore @@ -0,0 +1 @@ +.DS_Store diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/README.md b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/README.md new file mode 100644 index 0000000..3372237 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/README.md @@ -0,0 +1,79 @@ +# SoundCloud Pure Player +The project to rewrite [SoundCloud jQuery Player Plugin](https://github.com/soundcloud/soundcloud-custom-player) (© Matas Petrikas, MIT) on a pure js code. + +Using example (add players automatically): +```html + + ... + + + + + + ... + + The Veldt + +
+ Lost In Las Vegas + Revelation + Daybreak +
+ ... + +``` + +Manually adding: +```javascript +var links = document.querySelectorAll('a[href^="https://soundcloud.com/"]'); + +/* add players for each link */ +for ( var i = 0; i < links.length; i++ ) { + links[i].parentNode.replaceChild( + SCPurePlayer.create(links[i]), links[i] + ); +} + +/* or creating a Group */ +links[0].parentNode.insertBefore( + SCPurePlayer.createGroup(links), links[0] +); +links.forEach(function(lnk) { + lnk.remove(); +}); +``` + +Settings: +```javascript +var SC = { + 'API': new SoundCloudAPI, + 'Global': false, // {true: all players share common global params (volume), false: each player uses his own params (volume, timeline) } + 'Volume': 0.8, // default volume slider position (0.8 = 80%; 0.425 = 42.5%; 1 = 100%; 0.07 = 7%; etc.) + /* ... */ +} +``` + +Event listeners: +```javascript +var link = document.querySelector('a[href^="https://soundcloud.com/"]'), + player = SCPurePlayer.create(link); //-> return custom player element + + // possible media event type: ['play', 'pause', 'ended', 'timeupdate', 'volumechange', 'seeking', 'seeked', 'error'] + player.addEventListener('play', function(event) { + /* + the event argument[0] is a CustomEvent object https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent + who includes 'detail' property with two custom keys: + device: { just audio element backend }, + track: { current track info object } + */ + }, false); + +link.parentNode.replaceChild( + player, link +); +``` + +## Browser compatible +Should work on IE9+ / Opera 12.18+ + +For the browsers with no support audio/mpeg or html5 audio, player uses small and fast [Flash MP3 Player with JS API](http://flash-mp3-player.net/players/js/) (© Neolao Production, MIT) diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/artwork-qm.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/artwork-qm.svg new file mode 100755 index 0000000..a07852c --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/artwork-qm.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/gradient-glass.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/gradient-glass.svg new file mode 100644 index 0000000..8d74674 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/gradient-glass.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/info-modern.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/info-modern.svg new file mode 100755 index 0000000..f351d91 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/info-modern.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/pause-modern.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/pause-modern.svg new file mode 100755 index 0000000..d0215cf --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/pause-modern.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/play-modern.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/play-modern.svg new file mode 100755 index 0000000..75da52b --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/img/play-modern.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/sc-player-modern.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/sc-player-modern.css new file mode 100755 index 0000000..0fe14b8 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-modern/sc-player-modern.css @@ -0,0 +1,256 @@ +.sc-player { + width: 200px; + height: 200px; + position: relative; + margin: 5px; + font: .6em Arial,sans-serif; + background-color: #eee; + color: #ddd; + line-height: 1.6em; + text-shadow: none; + display: inline-block; +} +.sc-player a { + text-decoration: none; +} +.sc-player ol, .sc-player li { + margin: 0; + padding: 0; +} + +/*******************************/ +/*********** Artwork ***********/ +/*******************************/ +.sc-artwork-list { + width: 100%; + height: 100%; + background: url('img/artwork-qm.svg') no-repeat center; + background-size: 100%; + list-style-type: none; + position: relative; + box-sizing: border-box; + -moz-box-sizing: border-box; + box-shadow: rgba(0, 0, 0, .35) 0 1px 5px; + float: left; + margin: 0 10px 30px 0; +} +.sc-artwork-list::after { + position: absolute; + top: 0; left: 0; right: 0; bottom: -1px; + content: " "; + background: url('img/gradient-glass.svg'); + background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .15) 50%, transparent 50%); + background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .15) 50%, transparent 50%); + background: -o-linear-gradient(-45deg, rgba(255, 255, 255, .15) 50%, transparent 50%); + box-shadow: rgba(255, 255, 255, .1) 0 1px 0 inset; +} +.sc-artwork-list li { + list-style-type: none; + display: none; +} +.sc-artwork-list li.active { + list-style-type: none; + display: block; +} +.sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +/*******************************/ +/********** Controls ***********/ +/*******************************/ +.sc-controls { + position: absolute; + width: 50px; + height: 50px; + margin-left: -25px; + margin-top: -25px; + top: 50%; + left: 50%; + border: 2px solid #ddd; + border-radius: 100%; + background-color: #333; + opacity: .8; +} +.sc-controls:hover{ + background-color: #333; + opacity: .9; +} +.sc-controls > * { + width: 50px; + height: 50px; + color: transparent; + cursor: pointer; +} +.sc-play { + background: url('img/play-modern.svg') no-repeat center; +} +.sc-pause { + background: url('img/pause-modern.svg') no-repeat center; +} + +/*******************************/ +/*********** Scrubber **********/ +/*******************************/ +.sc-scrubber { + position: absolute; + bottom: 0px; + height: 10px; + width: 200px; + border-radius: 8px; + visibility: hidden; +} +.sc-time-span { + position: relative; +} +.sc-buffer, .sc-played { + height: 9px; + position: absolute; + top: 0; +} +.sc-played { + background-color: rgba(0,0,0,.5); + border: 1px groove #ddd; + opacity: .7; +} +.sc-time-indicators { + position: absolute; + right: 5px; + top: 5px; + background-color: rgba(0,0,0,.4); + border-radius: 4px; + padding: 4px; + visibility: hidden; +} +.sc-waveform-container { + height: 10px; + width: 200px; + position: absolute; +} +.sc-player.played .sc-scrubber, .sc-player.paused .sc-scrubber, .sc-player.played .sc-time-indicators, .sc-player.paused .sc-time-indicators { + visibility: visible; +} + +/*******************************/ +/********** Trackslist *********/ +/*******************************/ +.sc-trackslist { + position: absolute; + width: 100%; + max-height: 30%; + bottom: 0; + overflow: auto; + background-color: rgba(0, 0, 0, .5); + opacity: 0; +} +.sc-trackslist li { + position: relative; + cursor: pointer; + margin: 1px 5px; + padding: 3px 30px 3px 5px; +} +.sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; + position: absolute; + right: 0; + top: 3px; +} +.sc-trackslist li:hover { + background-color: rgba(99, 99, 99, .9); +} +.sc-trackslist li.active { + background-color: rgba(77, 77, 77, .7); +} +.sc-trackslist li.active a, .sc-trackslist li a { + color: #ddd; +} +.sc-trackslist:hover, .sc-trackslist:focus { + opacity: 1; + z-index: 1; +} + +/*******************************/ +/************ Info *************/ +/*******************************/ +.sc-info { + position: absolute; + top: 0px; + width: 190px; + height: 190px; + z-index: 1; + padding: 5px; + background-color: rgba(0, 0, 0, .9); + overflow: auto; +} +.sc-info-toggle { + position: absolute; + top: 9px; + left: 9px; + width: 17px; + height: 17px; + color: transparent; + cursor: pointer; +} +.sc-info-toggle:hover, .sc-player:focus .sc-info-toggle { + background: url('img/info-modern.svg') no-repeat center; + color: transparent; +} +.sc-info-close { + position: absolute; + top: 5px; + right: 5px; + padding: 1px 4px; + color: gray; + cursor: pointer; +} +.sc-info-close:hover { + color: white; +} +.sc-info a { + color: #95bcce; +} +.sc-info a:hover { + color: #5e7681; +} +.sc-info p a { + text-decoration: underline; +} +.sc-info, .sc-info-toggle.active { + visibility: hidden; +} +.sc-info.active { + visibility: visible; +} + +/*******************************/ +/************ Volume ***********/ +/*******************************/ +.sc-volume-slider { + top: -25px; + position: absolute; + width: 110px; + height: 12px; + background-color: #e5e5e5; + border-radius: 2px; +} +.sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; + background-color: #666; + border-right: 1px solid #f6a400; +} + +/*******************************/ +.sc-volume-slider, +.sc-player .hidden, +.sc-waveform-container img, +.sc-no-artwork { + display: none; +} \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-blue.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-blue.css new file mode 100755 index 0000000..5235886 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-blue.css @@ -0,0 +1,163 @@ +/* ----------< Standart blue color >---------------- */ + +.sc-player { + font: .7em Arial, sans-serif; + background-color: #eee; + background: linear-gradient( 165deg, black, #eee 0%, #fff ); + background: -o-linear-gradient( 165deg, black, #eee 0%, #fff ); + background: -moz-linear-gradient( 165deg, black, #eee 0%, #fff ); + background: -webkit-gradient(linear, left top, left 50%, from(black), color-stop(0%, #eee), to(#fff)); + color: #333; + line-height: 1.6em; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.sc-player a { + text-decoration: none; + color: #2955ac; +} + +/* Artworks */ + +.sc-artwork-list { + background: #eee; + background: linear-gradient( left bottom, #eee, #333 ); + background: -o-linear-gradient( left bottom, #eee, #333 ); + background: -moz-linear-gradient( left bottom, #eee, #333 ); + background: -webkit-gradient(linear, left bottom, right top, from(#eee), to(#333)); + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +/* Scrubber */ + +.sc-scrubber { + background-color: #e5e5e5; + border-radius: 8px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.sc-time-span { + background-color: #666; +} + +.sc-buffer, +.sc-played { + background-color: #999; + position: absolute; +} + +.sc-played { + background-color: #039; + background: linear-gradient( top, black, #039, #5d95d2 90% ); + background: -o-linear-gradient( top, black, #039, #5d95d2 90% ); + background: -moz-linear-gradient( top, black, #039, #5d95d2 90% ); + background: -webkit-gradient(linear, left top, left 90%, from(black), color-stop(0%, #039), to(#5d95d2)); +} + +.sc-waveform-container { + width: 100%; + position: absolute; +} + +/* Controls */ + +.sc-controls { + border-radius: 100%; + border: 2px solid white; + background-color: #039; + background: linear-gradient( 135deg, #a1b8e4, #039 70% ); + background: -o-linear-gradient( 135deg, #a1b8e4, #039 70% ); + background: -moz-linear-gradient( 135deg, #a1b8e4, #039 70% ); + background: -webkit-gradient(linear, left top, 30% 90%, from(#a1b8e4), color-stop(70%, #039), to(#039)); + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.sc-controls:hover { + background: linear-gradient( 45deg, #a1b8e4, #039 70% ); + background: -o-linear-gradient( 45deg, #a1b8e4, #039 70% ); + background: -moz-linear-gradient( 45deg, #a1b8e4, #039 70% ); + background: -webkit-gradient(linear, left bottom, 90% 30%, from(#a1b8e4), color-stop(70%, #039), to(#039)); +} + +.sc-controls > * { + color: transparent; +} + +.sc-play { + background: url('img/play-standart.svg') no-repeat center center / 30%; +} +.sc-pause { + background: url('img/pause-standart.svg') no-repeat center center / 30%; +} + +/* Track list */ + +.sc-trackslist li.active, +.sc-trackslist li:hover { + border-radius: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.sc-trackslist li.active a { + color: #fff; +} + +.sc-trackslist li.active { + background-color: #2955ac; + color: #ddd; +} + +.sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; +} + +/* Track info */ + +.sc-info.active { + background: #fff; + opacity: .9; +} + +.sc-info p a { + text-decoration: underline; +} + +.sc-info a:hover { + color: #039; +} + +.sc-info-toggle, +.sc-time-indicators, +.sc-info-close { + background: #fff; + color: #2955ac; + border-radius: 4px; + padding: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.sc-info-toggle:hover, +.sc-info-close:hover { + background: #2955ac; + color: #eee; +} + +.sc-info-close { + padding: 2px 4px; + font-weight: bold; +} + +/* Volume control */ + +.sc-volume-slider { + background-color: #e5e5e5; + border-radius: 2px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.sc-volume-slider .sc-volume-status { + background-color: #666; + border-right: 1px solid #039; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-green.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-green.css new file mode 100755 index 0000000..1260851 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-green.css @@ -0,0 +1,166 @@ +/* ----------< Standart color green >---------------- */ + +.sc-player { + font: .7em Arial, sans-serif; + background-color: #333; + color: #fff; + line-height: 1.6em; + box-shadow: 1px 1px 4px #333; +} + +.sc-player a { + text-decoration: none; + color: #fff; +} + +/* Artworks */ + +.sc-artwork-list { + background: #eee; + background: linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -o-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -moz-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -webkit-gradient(linear, left bottom, right top, from(#eee), color-stop(50%, #888), to(#333)); + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +/* Scrubber */ + +.sc-scrubber { + background-color: #e5e5e5; + border-radius: 2px; +} + +.sc-time-span { + background-color: #666; +} + +.sc-waveform-container { + width: 100%; + position: absolute; +} + +.sc-buffer, +.sc-played { + background-color: #333; + position: absolute; +} + +.sc-played { + background: #22B573; + background: linear-gradient( top, black, #22B573 0, #7decba 90% ); + background: -o-linear-gradient( top, black, #22B573 0, #7decba 90% ); + background: -moz-linear-gradient( top, black, #22B573 0, #7decba 90% ); + background: -webkit-gradient(linear, left top, left 90%, from(black), color-stop(0%, #22B573), to(#7decba)); +} + +/* Controls */ + +.sc-controls { + border-radius: 100%; + border: 2px solid white; + background: #22B573; + background: linear-gradient( 135deg, #fff, #22B573 50% ); + background: -o-linear-gradient( 135deg, #fff, #22B573 50% ); + background: -moz-linear-gradient( 135deg, #fff, #22B573 50% ); + background: -webkit-gradient(linear, left top, 30% 90%, from(#fff), color-stop(50%, #22B573), to(#22B573)); + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.sc-controls > * { + color: transparent; +} + +.sc-controls:hover { + background: linear-gradient( 45deg, #a8e2ca, #22B573 70% ); + background: -o-linear-gradient( 45deg, #a8e2ca, #22B573 70% ); + background: -moz-linear-gradient( 45deg, #a8e2ca, #22B573 70% ); + background: -webkit-gradient(linear, left bottom, 90% 30%, from(#a8e2ca), color-stop(70%, #22B573), to(#22B573)); +} + +.sc-time-indicators { + background: #22B573; + color: #fff; + border-radius: 4px; + padding: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.sc-play { + background: url('img/play-standart.svg') no-repeat center center / 30%; +} +.sc-pause { + background: url('img/pause-standart.svg') no-repeat center center / 30%; +} + +/* Track list */ + +.sc-trackslist li { + background: #333; + color: #b8e9d3; + border-radius: 4px; + transition: background 0.3s ease-in; +} + +.sc-trackslist li:hover { + background: #22B573; +} + +.sc-trackslist li.active { + background: #22B573; + border-radius: 4px; +} + +.sc-trackslist li.active a { + color: #fff; +} + +/* Track info */ + +.sc-info.active, +.sc-info-close:hover, +.sc-info-toggle:hover { + background: #333; + color: #fff; +} + +.sc-info.active { + opacity: .9; +} + +.sc-info a { + color: #b1e8cc; +} + +.sc-info a:hover { + color: #e1f7ee; +} + +.sc-info-toggle { + background: #22B573; + color: #fff; + border-radius: 4px; + padding: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.sc-info-close { + background: #22B573; + color: #fff; + border-radius: 4px; + padding: 2px 4px; + font-weight: bold; +} + +/* Volume control */ + +.sc-volume-slider { + background-color: #e5e5e5; + border-radius: 2px; + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.sc-volume-slider .sc-volume-status { + background-color: #666; + border-right: 1px solid #22B573; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-orange.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-orange.css new file mode 100755 index 0000000..c5837bc --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/colors-orange.css @@ -0,0 +1,180 @@ +/* ----------< Standart color orange >---------------- */ + +.sc-player { + font: .7em Arial, sans-serif; + background-color: #eee; + background: linear-gradient( top, black, #ccc 0%, #fff 70%); + background: -o-linear-gradient( top, black, #ccc 0%, #fff 70%); + background: -moz-linear-gradient( top, black, #ccc 0%, #fff 70%); + background: -webkit-gradient(linear, left top, left 70%, from(black), color-stop(0%, #ccc), to(#fff)); + color: #333; + line-height: 1.6em; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.sc-player a { + text-decoration: none; +} + +/* Artworks */ + +.sc-artwork-list { + background-color: #eee; + background: linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -o-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -moz-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -webkit-gradient(linear, right top, left bottom, from(#333), to(#eee)); + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +/* Scrubber */ + +.sc-scrubber { + background-color: #e5e5e5; + border-radius: 8px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.sc-time-span { + background-color: #ddd; +} + +.sc-buffer, +.sc-played { + background-color: #adadad; + position: absolute; +} + +.sc-played { + background-color: #e74c14; + background: linear-gradient( top, black, #e74c14 0, #f6a400 90% ); + background: -o-linear-gradient( top, black, #e74c14 0, #f6a400 90% ); + background: -moz-linear-gradient( top, black, #e74c14 0, #f6a400 90% ); + background: -webkit-gradient(linear, left top, left 90%, from(black), color-stop(0%, #e74c14), to(#f6a400)); +} + +.sc-waveform-container { + position: absolute; + width: 100%; +} + +/* Controls */ + +.sc-controls { + border-radius: 100%; + border: 2px solid white; + background-color: #f6a400; + background: linear-gradient( 45deg, #e74c14, #f6a400 ); + background: -o-linear-gradient( 45deg, #e74c14, #f6a400 ); + background: -moz-linear-gradient( 45deg, #e74c14, #f6a400 ); + background: -webkit-gradient(linear, left bottom, top right, from(#e74c14), to(#f6a400)); + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.sc-controls:hover { + background: linear-gradient( 225deg, #e74c14, #f6a400 ); + background: -o-linear-gradient( 225deg, #e74c14, #f6a400 ); + background: -moz-linear-gradient( 225deg, #e74c14, #f6a400 ); + background: -webkit-gradient(linear, top right, left bottom, from(#e74c14), to(#f6a400)); +} + +.sc-controls > * { + color: transparent; +} + +.sc-play { + background: url('img/play-standart.svg') no-repeat center center / 30%; +} +.sc-pause { + background: url('img/pause-standart.svg') no-repeat center center / 30%; +} + +/* Track list */ + +.sc-trackslist li.active { + color: #fff; + background: #e74c14; +} + +.sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; +} + +.sc-trackslist li.active, +.sc-trackslist li:hover { + border-radius: 4px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.sc-trackslist li:hover { + background-color: #f6a400; +} + +.sc-trackslist li.active a { + color: #fff; +} + +.sc-trackslist li a { + color: #333; +} + +/* Track info */ + +.sc-info.active { + background: #fff; + opacity: .9; +} + +.sc-info a { + color: #e74c14; +} + +.sc-info p a { + text-decoration: underline; +} + +.sc-info a:hover { + color: #f6a400; +} + +.sc-info-toggle, +.sc-time-indicators { + background: #f6a400; + color: #ab3104; + border-radius: 4px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); + padding: 4px; +} +.sc-info-close, +.sc-info-close:hover { + padding: 2px 4px; + font-weight: bold; + border-radius: 4px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.sc-info-close:hover { + background: #f6a400; + color: #ab3104; +} + +.sc-info-toggle:hover, +.sc-info-close { + background: #fff; + color: #e74c14; +} + +/* Volume control */ + +.sc-volume-slider { + background-color: #e5e5e5; + border-radius: 2px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.sc-volume-slider .sc-volume-status { + background-color: #666; + border-right: 1px solid #f6a400; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/img/pause-standart.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/img/pause-standart.svg new file mode 100644 index 0000000..3fc54ac --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/img/pause-standart.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/img/play-standart.svg b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/img/play-standart.svg new file mode 100644 index 0000000..0b21fd7 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/img/play-standart.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-horizontal.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-horizontal.css new file mode 100755 index 0000000..fb850ff --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-horizontal.css @@ -0,0 +1,193 @@ +/* ----------< Standart structure horizontal >---------------- */ + +.sc-player { + width: 540px; + height: 270px; + position: relative; + margin: 5px; +} + +.sc-player ol, +.sc-player li { + margin: 0; + padding: 0; + list-style-position: inside; +} + +/* Artworks */ + +.sc-artwork-list { + width: 50%; + height: 100%; + list-style-type: none; + position: relative; +} + +.sc-artwork-list li { + list-style-type: none; + display: none; +} + +.sc-artwork-list li.active { + list-style-type: none; + display: block; +} + +.sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +.sc-no-artwork { + display: none; +} + +/* Controls */ + +.sc-controls { + position: absolute; + width: 50px; + height: 50px; + margin-left: -25px; + margin-top: -25px; + top: 50%; + left: 25%; +} + +.sc-controls > * { + width: 50px; + height: 50px; + cursor: pointer; +} + +/* Scrubber */ + +.sc-scrubber { + position: absolute; + left: 10px; + bottom: 10px; + height: 40px; + width: 250px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); + display: block; +} + +.sc-time-span { + height: 30px; + margin: 5px; + position: relative; +} + +.sc-buffer, +.sc-played { + position: absolute; + height: 30px; + top: 0; +} + +.sc-time-span img { + height: 30px; + width: 100%; +} + +.sc-time-indicators { + position: absolute; + right: 280px; + bottom: 10px; +} + +.sc-player.played .sc-time-indicators, +.sc-player.paused .sc-time-indicators { + bottom: 55px; +} + +/* Track list */ + +.sc-trackslist { + position: absolute; + width: 50%; + height: 260px; + top: 5px; + left: 50%; + overflow: auto; +} + +.sc-trackslist li { + cursor: pointer; + margin: 1px 5px; + padding: 3px 30px 3px 5px; + position: relative; +} + +.sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; + position: absolute; + right: 0; + top: 3px; +} + +/* Track info */ + +.sc-info { + position: absolute; + top: 0px; + width: 260px; + height: 260px; + padding: 5px; + z-index: 1; + overflow: auto; + opacity: 0.9; +} + +.sc-info-toggle { + position: absolute; + top: 10px; + left: 10px; + cursor: pointer; +} + +.sc-info-close { + position: absolute; + top: 10px; + right: 10px; + cursor: pointer; +} + +.sc-info, +.sc-info-toggle.active, +.sc-player .sc-scrubber { + visibility: hidden; +} + +.sc-info.active, +.sc-player.played .sc-scrubber, +.sc-player.paused .sc-scrubber { + visibility: visible; +} + +/* Volume control */ + +.sc-volume-slider { + top: -25px; + position: absolute; + width: 110px; + height: 12px; + background-color: white; +} + +.sc-volume-slider .sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; +} + +/* --- */ + +.sc-player .hidden { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-super.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-super.css new file mode 100755 index 0000000..2ea2021 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-super.css @@ -0,0 +1,210 @@ +/* ----------< Standart structure super >---------------- */ + +.sc-player { + width: 160px; + height: 160px; + position: relative; + margin: 5px; +} + +.sc-player ol, +.sc-player li { + margin: 0; + padding: 0; + list-style-position: inside; +} + +.sc-artwork-list { + width: 160px; + height: 160px; + list-style-type: none; + position: relative; +} + +.sc-artwork-list li { + list-style-type: none; + display: none; +} + +.sc-artwork-list li.active { + list-style-type: none; + display: block; +} + +.sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +.sc-no-artwork { + display: none; +} + +/* Controls */ + +.sc-controls { + position: absolute; + width: 50px; + height: 50px; + top: 10px; + left: 180px +} + +.sc-controls > * { + width: 50px; + height: 50px; + cursor: pointer; +} + +/* Scrubber */ + +.sc-scrubber { + position: absolute; + top: 80px; + height: 70px; + width: 600px; + left: 180px; + display: block; +} + +.sc-time-span { + height: 60px; + margin: 5px; + position: relative; +} + +.sc-buffer, .sc-played { + height: 60px; + position: absolute; + top: 0; +} + +.sc-time-span img { + height: 60px; + width: 100%; +} + +.sc-time-indicators { + position: absolute; + left: 700px; +} + +.sc-time-indicators { + top: 43px; +} + +/* Track list */ + +.sc-trackslist { + width: 780px; + min-height: 50%; + overflow: auto; +} + +.sc-trackslist li { + cursor: pointer; + margin: 5px; + padding: 3px 30px 3px 5px; + position: relative; +} + +.sc-track-duration { + position: absolute; + right: 0; + top: 3px; +} + +/* Track info */ + +.sc-info { + position: absolute; + padding: 0 5px; + min-height: 100%; + width: 774px; + top: 0; + z-index: -1; +} + +.sc-info.active { + overflow: auto; + z-index: 1; +} + +.sc-info p { + position: relative; + text-align: center; + top: 50px; +} + +.sc-info-toggle { + position: absolute; + top: 43px; + left: 670px; + cursor: pointer; +} + +.sc-info-close { + position: absolute; + top: 10px; + right: 20px; + cursor: pointer; +} + +.sc-info h3 { + position: absolute; + width: 420px; + left: 240px; + text-align: left; + top: 30px; +} + +.sc-info h4 { + position: absolute; + width: 420px; + left: 240px; + opacity: 0.5; +} + +.sc-download { + position: absolute; + top: 10px; + left: 20px; +} + +.sc-info p, +.sc-info .sc-info-close, +.sc-info .sc-download { + visibility: hidden; +} + +.sc-info.active p, +.sc-info.active .sc-info-close, +.sc-info.active .sc-download { + visibility: visible; +} + +/* Volume control */ + +.sc-volume-slider { + top: -60px; + right: 0; + position: absolute; + width: 110px; + height: 12px; + background-color: white; +} + +.sc-volume-slider .sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; +} + +/* --- */ + +.sc-player .hidden { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-vertical.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-vertical.css new file mode 100755 index 0000000..5b42ad8 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/css/sc-player-standard/structure-vertical.css @@ -0,0 +1,190 @@ +/* ----------< Standart structure vertical >---------------- */ + +.sc-player { + width: 270px; + height: 540px; + position: relative; + margin: 5px; +} + +.sc-player ol, +.sc-player li { + margin: 0; + padding: 0; + list-style-position: inside; +} + +/* Artworks */ + +.sc-artwork-list { + width: 100%; + height: 50%; + list-style-type: none; + position: relative; +} + +.sc-artwork-list li { + list-style-type: none; + display: none; +} + +.sc-artwork-list li.active { + list-style-type: none; + display: block; +} + +.sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +.sc-no-artwork { + display: none; +} + +/* Controls */ + +.sc-controls { + position: absolute; + width: 50px; + height: 50px; + margin-left: -25px; + margin-top: -25px; + top: 25%; + left: 50%; +} + +.sc-controls > * { + width: 50px; + height: 50px; + cursor: pointer; +} + +/* Scrubber */ + +.sc-scrubber { + position: absolute; + bottom: 280px; + height: 40px; + width: 250px; + left: 10px; + display: block; +} + +.sc-time-span { + height: 30px; + margin: 5px; + position: relative; +} + +.sc-buffer, +.sc-played { + height: 30px; + position: absolute; + top: 0; +} + +.sc-time-span img { + height: 30px; + width: 100%; +} + +.sc-time-indicators { + position: absolute; + right: 10px; + top: 235px; +} + +.sc-player.played .sc-time-indicators, +.sc-player.paused .sc-time-indicators { + top: 190px; +} + +/* Track list */ + +.sc-trackslist { + position: absolute; + width: 100%; + height: 50%; + top: 50%; + left: 0; + overflow: auto; +} + +.sc-trackslist li { + cursor: pointer; + margin: 5px; + padding: 3px 30px 3px 5px; + position: relative; +} + +.sc-track-duration { + position: absolute; + right: 0; + top: 3px; +} + +/* Track info */ + +.sc-info { + position: absolute; + top: 0px; + width: 260px; + height: 260px; + padding: 5px; + z-index: 1; + overflow: auto; + opacity: 0.9; +} + +.sc-info-toggle { + position: absolute; + top: 10px; + left: 10px; + cursor: pointer; +} + +.sc-info-close { + position: absolute; + top: 10px; + right: 10px; + cursor: pointer; +} + +.sc-info, +.sc-info-toggle.active, +.sc-player .sc-scrubber { + visibility: hidden; +} + +.sc-info.active, +.sc-player.played .sc-scrubber, +.sc-player.paused .sc-scrubber { + visibility: visible; +} + +/* Volume control */ + +.sc-volume-slider { + top: -25px; + left: 0px; + position: absolute; + width: 110px; + height: 12px; + background-color: white; +} + +.sc-volume-slider .sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; +} + +/* --- */ + +.sc-player .hidden { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/sc-player-modern.html b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/sc-player-modern.html new file mode 100755 index 0000000..5e2dda2 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/sc-player-modern.html @@ -0,0 +1,70 @@ + + + + + SC player example: Modern Skin + + + + + + Standart Player +

Modern Player

+
+ + Daybreak + Lost In Las Vegas + Revelation + Classic Durasic + Friday Feeling [LpmitKev] (Bob Bradley) + The Veldt + Sound Stabs - Pyromaniac + Fantastic - K-391 + On the bridge + + Empty + User Tracks +
+
+

minimalistic skin for the dynamic insertion

+ GitHub +
+ + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/sc-player-standard.html b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/sc-player-standard.html new file mode 100755 index 0000000..82b59f8 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/sc-player-standard.html @@ -0,0 +1,69 @@ + + + + + SC player example: Standard Skin + + + + + + + + + + + + Modern Player +

Standart Skin

+
+

horizontal green blue orange

+
+ Tunguska Electronic Music Society +
+

vertical green blue orange

+
+ The Nth ° +
+
+
+

super green blue orange

+
+
+ Final Frontier + Technicolor + Castlevania - Bloody Tears (Anzo Cover) + Fusk Asker - Bully (Original Mix) + There Is Always Love + Dubmood - Chiptune + Post + A Tiny Spaceship's Final Mission + Shine Get + Demon Groove - Saturate + Demon Groove - Lenningrad 2034 + Dr. Wily's Castle: Stage 1 + Yes, We Have Made it to the Dungeon Of Tropes + In Brightest Day + A Hero Stands Tall + Lavender Town (Pokémon Cover) + XX Intro Dream +
+
+
+
2017
+ + \ No newline at end of file diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-blue.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-blue.css new file mode 100755 index 0000000..32d4c13 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-blue.css @@ -0,0 +1,156 @@ +/* ----------< .blue >---------------- */ + +.blue .sc-player { + font: .7em Arial, sans-serif; + background-color: #eee; + background: linear-gradient( 165deg, black, #eee 0%, #fff ); + background: -o-linear-gradient( 165deg, black, #eee 0%, #fff ); + background: -moz-linear-gradient( 165deg, black, #eee 0%, #fff ); + background: -webkit-gradient(linear, left top, left 50%, from(black), color-stop(0%, #eee), to(#fff)); + color: #333; + line-height: 1.6em; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.blue .sc-player a { + text-decoration: none; + color: #2955ac; +} + +/* Artworks */ + +.blue .sc-artwork-list { + background: #eee; + background: linear-gradient( left bottom, #eee, #333 ); + background: -o-linear-gradient( left bottom, #eee, #333 ); + background: -moz-linear-gradient( left bottom, #eee, #333 ); + background: -webkit-gradient(linear, left bottom, right top, from(#eee), to(#333)); + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +/* Scrubber */ + +.blue .sc-scrubber { + background-color: #e5e5e5; + border-radius: 8px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.blue .sc-time-span { + background-color: #666; +} + +.blue .sc-buffer, +.blue .sc-played { + background-color: #999; + position: absolute; +} + +.blue .sc-played { + background-color: #039; + background: linear-gradient( top, black, #039, #5d95d2 90% ); + background: -o-linear-gradient( top, black, #039, #5d95d2 90% ); + background: -moz-linear-gradient( top, black, #039, #5d95d2 90% ); + background: -webkit-gradient(linear, left top, left 90%, from(black), color-stop(0%, #039), to(#5d95d2)); +} + +.blue .sc-waveform-container { + width: 100%; + position: absolute; +} + +/* Controls */ + +.blue .sc-controls { + border-radius: 100%; + border: 2px solid white; + background-color: #039; + background: linear-gradient( 135deg, #a1b8e4, #039 70% ); + background: -o-linear-gradient( 135deg, #a1b8e4, #039 70% ); + background: -moz-linear-gradient( 135deg, #a1b8e4, #039 70% ); + background: -webkit-gradient(linear, left top, 30% 90%, from(#a1b8e4), color-stop(70%, #039), to(#039)); + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.blue .sc-controls:hover { + background: linear-gradient( 45deg, #a1b8e4, #039 70% ); + background: -o-linear-gradient( 45deg, #a1b8e4, #039 70% ); + background: -moz-linear-gradient( 45deg, #a1b8e4, #039 70% ); + background: -webkit-gradient(linear, left bottom, 90% 30%, from(#a1b8e4), color-stop(70%, #039), to(#039)); +} + +.blue .sc-controls > * { + color: transparent; +} + +/* Track list */ + +.blue .sc-trackslist li.active, +.blue .sc-trackslist li:hover { + border-radius: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.blue .sc-trackslist li.active a { + color: #fff; +} + +.blue .sc-trackslist li.active { + background-color: #2955ac; + color: #ddd; +} + +.blue .sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; +} + +/* Track info */ + +.blue .sc-info.active { + background: #fff; + opacity: .9; +} + +.blue .sc-info p a { + text-decoration: underline; +} + +.blue .sc-info a:hover { + color: #039; +} + +.blue .sc-info-toggle, +.blue .sc-time-indicators, +.blue .sc-info-close { + background: #fff; + color: #2955ac; + border-radius: 4px; + padding: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.blue .sc-info-toggle:hover, +.blue .sc-info-close:hover { + background: #2955ac; + color: #eee; +} + +.blue .sc-info-close { + padding: 2px 4px; + font-weight: bold; +} + +/* Volume control */ + +.blue .sc-volume-slider { + background-color: #e5e5e5; + border-radius: 2px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); +} + +.blue .sc-volume-slider .sc-volume-status { + background-color: #666; + border-right: 1px solid #039; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-green.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-green.css new file mode 100755 index 0000000..2a41f34 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-green.css @@ -0,0 +1,159 @@ +/* ----------< .green >---------------- */ + +.green .sc-player { + font: .7em Arial, sans-serif; + background-color: #333; + color: #fff; + line-height: 1.6em; + box-shadow: 1px 1px 4px #333; +} + +.green .sc-player a { + text-decoration: none; + color: #fff; +} + +/* Artworks */ + +.green .sc-artwork-list { + background: #eee; + background: linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -o-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -moz-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -webkit-gradient(linear, left bottom, right top, from(#eee), color-stop(50%, #888), to(#333)); + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +/* Scrubber */ + +.green .sc-scrubber { + background-color: #e5e5e5; + border-radius: 2px; +} + +.green .sc-time-span { + background-color: #666; +} + +.green .sc-waveform-container { + width: 100%; + position: absolute; +} + +.green .sc-buffer, +.green .sc-played { + background-color: #333; + position: absolute; +} + +.green .sc-played { + background: #22B573; + background: linear-gradient( top, black, #22B573 0, #7decba 90% ); + background: -o-linear-gradient( top, black, #22B573 0, #7decba 90% ); + background: -moz-linear-gradient( top, black, #22B573 0, #7decba 90% ); + background: -webkit-gradient(linear, left top, left 90%, from(black), color-stop(0%, #22B573), to(#7decba)); +} + +/* Controls */ + +.green .sc-controls { + border-radius: 100%; + border: 2px solid white; + background: #22B573; + background: linear-gradient( 135deg, #fff, #22B573 50% ); + background: -o-linear-gradient( 135deg, #fff, #22B573 50% ); + background: -moz-linear-gradient( 135deg, #fff, #22B573 50% ); + background: -webkit-gradient(linear, left top, 30% 90%, from(#fff), color-stop(50%, #22B573), to(#22B573)); + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.green .sc-controls > * { + color: transparent; +} + +.green .sc-controls:hover { + background: linear-gradient( 45deg, #a8e2ca, #22B573 70% ); + background: -o-linear-gradient( 45deg, #a8e2ca, #22B573 70% ); + background: -moz-linear-gradient( 45deg, #a8e2ca, #22B573 70% ); + background: -webkit-gradient(linear, left bottom, 90% 30%, from(#a8e2ca), color-stop(70%, #22B573), to(#22B573)); +} + +.green .sc-time-indicators { + background: #22B573; + color: #fff; + border-radius: 4px; + padding: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +/* Track list */ + +.green .sc-trackslist li { + background: #333; + color: #b8e9d3; + border-radius: 4px; + transition: background 0.3s ease-in; +} + +.green .sc-trackslist li:hover { + background: #22B573; +} + +.green .sc-trackslist li.active { + background: #22B573; + border-radius: 4px; +} + +.green .sc-trackslist li.active a { + color: #fff; +} + +/* Track info */ + +.green .sc-info.active, +.green .sc-info-close:hover, +.green .sc-info-toggle:hover { + background: #333; + color: #fff; +} + +.green .sc-info.active { + opacity: .9; +} + +.green .sc-info a { + color: #b1e8cc; +} + +.green .sc-info a:hover { + color: #e1f7ee; +} + +.green .sc-info-toggle { + background: #22B573; + color: #fff; + border-radius: 4px; + padding: 4px; + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.green .sc-info-close { + background: #22B573; + color: #fff; + border-radius: 4px; + padding: 2px 4px; + font-weight: bold; +} + +/* Volume control */ + +.green .sc-volume-slider { + background-color: #e5e5e5; + border-radius: 2px; + box-shadow: 1px 1px 4px rgba(0,0,0,.2); +} + +.green .sc-volume-slider .sc-volume-status { + background-color: #666; + border-right: 1px solid #22B573; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-horizontal.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-horizontal.css new file mode 100755 index 0000000..22d4fef --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-horizontal.css @@ -0,0 +1,193 @@ +/* ----------< .horizontal >---------------- */ + +.horizontal .sc-player { + width: 540px; + height: 270px; + position: relative; + margin: 5px; +} + +.horizontal .sc-player ol, +.horizontal .sc-player li { + margin: 0; + padding: 0; + list-style-position: inside; +} + +/* Artworks */ + +.horizontal .sc-artwork-list { + width: 50%; + height: 100%; + list-style-type: none; + position: relative; +} + +.horizontal .sc-artwork-list li { + list-style-type: none; + display: none; +} + +.horizontal .sc-artwork-list li.active { + list-style-type: none; + display: block; +} + +.horizontal .sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +.horizontal .sc-no-artwork { + display: none; +} + +/* Controls */ + +.horizontal .sc-controls { + position: absolute; + width: 50px; + height: 50px; + margin-left: -25px; + margin-top: -25px; + top: 50%; + left: 25%; +} + +.horizontal .sc-controls > * { + width: 50px; + height: 50px; + cursor: pointer; +} + +/* Scrubber */ + +.horizontal .sc-scrubber { + position: absolute; + left: 10px; + bottom: 10px; + height: 40px; + width: 250px; + box-shadow: 1px 1px 4px rgba(0,0,0,.3); + display: block; +} + +.horizontal .sc-time-span { + height: 30px; + margin: 5px; + position: relative; +} + +.horizontal .sc-buffer, +.horizontal .sc-played { + position: absolute; + height: 30px; + top: 0; +} + +.horizontal .sc-time-span img { + height: 30px; + width: 100%; +} + +.horizontal .sc-time-indicators { + position: absolute; + right: 280px; + bottom: 10px; +} + +.horizontal .sc-player.played .sc-time-indicators, +.horizontal .sc-player.paused .sc-time-indicators { + bottom: 55px; +} + +/* Track list */ + +.horizontal .sc-trackslist { + position: absolute; + width: 50%; + height: 260px; + top: 5px; + left: 50%; + overflow: auto; +} + +.horizontal .sc-trackslist li { + cursor: pointer; + margin: 1px 5px; + padding: 3px 30px 3px 5px; + position: relative; +} + +.horizontal .sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; + position: absolute; + right: 0; + top: 3px; +} + +/* Track info */ + +.horizontal .sc-info { + position: absolute; + top: 0px; + width: 260px; + height: 260px; + padding: 5px; + z-index: 1; + overflow: auto; + opacity: 0.9; +} + +.horizontal .sc-info-toggle { + position: absolute; + top: 10px; + left: 10px; + cursor: pointer; +} + +.horizontal .sc-info-close { + position: absolute; + top: 10px; + right: 10px; + cursor: pointer; +} + +.horizontal .sc-info, +.horizontal .sc-info-toggle.active, +.horizontal .sc-player .sc-scrubber { + visibility: hidden; +} + +.horizontal .sc-info.active, +.horizontal .sc-player.played .sc-scrubber, +.horizontal .sc-player.paused .sc-scrubber { + visibility: visible; +} + +/* Volume control */ + +.horizontal .sc-volume-slider { + top: -25px; + position: absolute; + width: 110px; + height: 12px; + background-color: white; +} + +.horizontal .sc-volume-slider .sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; +} + +/* --- */ + +.horizontal .sc-player .hidden { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-modern.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-modern.css new file mode 100755 index 0000000..bff8188 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-modern.css @@ -0,0 +1,256 @@ +.sc-player { + width: 200px; + height: 200px; + position: relative; + margin: 5px; + font: .6em Arial,sans-serif; + background-color: #eee; + color: #ddd; + line-height: 1.6em; + text-shadow: none; + display: inline-block; +} +.sc-player a { + text-decoration: none; +} +.sc-player ol, .sc-player li { + margin: 0; + padding: 0; +} + +/*******************************/ +/*********** Artwork ***********/ +/*******************************/ +.sc-artwork-list { + width: 100%; + height: 100%; + background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iNTAwcHgiIGhlaWdodD0iNTAwcHgiIHZpZXdCb3g9IjAgMCA1MDAgNTAwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj48ZGVmcz48bGluZWFyR3JhZGllbnQgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSIgaWQ9ImxpbmVhckdyYWRpZW50LTEiPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIG9mZnNldD0iMCUiPjwvc3RvcD4KPHN0b3Agc3RvcC1jb2xvcj0iI0Q0RDRENCIgb2Zmc2V0PSIxMDAlIj48L3N0b3A+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+PGcgaWQ9IkxheWVyLTEiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEsIC0xKSIgZmlsbD0idXJsKCNsaW5lYXJHcmFkaWVudC0xKSI+PHBhdGggZD0iTS0wLjc5ODY3OTg2OCwwLjAxNDQ0MDQzMzIgTDQ5OC44Mzk5MzQsMC4wMTQ0NDA0MzMyIEw0OTguODM5OTM0LDUwMC45MDk3NDcgTC0wLjc5ODY3OTg2OCw1MDAuOTA5NzQ3IEwtMC43OTg2Nzk4NjgsMC4wMTQ0NDA0MzMyIFoiIGlkPSJTaGFwZSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+PC9wYXRoPjwvZz48ZyBpZD0iIzAwMDAwMGZmIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNDEsIDEwNikiIHN0cm9rZT0iIzAwMCIgc3Ryb2tlLXdpZHRoPSIwLjA5Mzc1IiBmaWxsPSIjMDAwIiBmaWxsLW9wYWNpdHk9IjAuNzciPjxwYXRoIGQ9Ik0yMTAuNDQ4MjUxLDAgQzIxMC40NjI2MjMsNjUuMTg2OTY4NiAyMTAuNDQyNTAzLDEzMC4zNzEwMzMgMjEwLjQ1OTc0OSwxOTUuNTU4MDAxIEMyMTQuMTgxOTI3LDE5NC4yMTAyODcgMjE4LjExMzkyOCwxOTMuNDk4NjcgMjIyLjA2NjA0OCwxOTMuMzk5OTE1IEMyMjEuNzE0LDE5My4zMzQ2NjcgMjI3LjA1MjY4NiwxOTMuNTU3NDkzIDIzMi43OTM2OTMsMTk1LjA3MDY4NCBDMjM3Ljc4NjM4NywxOTYuMzg2NjM5IDI0My4wMjIwNTYsMTk4LjgyMjkzNyAyNDUuODU2Mzc1LDIwMS4wNzM3NTUgQzI1MC4zODYyMjQsMjA0LjY4NDExOSAyNTQuMDIyMTc0LDIwOS41MjMxMSAyNTUuODkwNDQ5LDIxNS4wNjUwMDUgQzI1OC4yMjE0ODIsMjIxLjgzODQzMSAyNTcuNzkzMjE2LDIyOS41MjM4ODkgMjU0LjczMjExOSwyMzUuOTkyMzM3IEMyNTAuODExNjE2LDI0NC4zODY1MDYgMjQyLjk3OTIzMiwyNTAuNTQ0MTY2IDIzNC4yNTI5NSwyNTMuMTY0MDc2IEMyMjYuODExNDY3LDI1NS40NjczOSAyMTguNjcxNTM2LDI1NS4zNDUzOTkgMjExLjI3ODkxNSwyNTIuOTA4NDc1IEMyMDQuMjcxNDQ3LDI1MC41NzMyMTIgMTk3Ljg5NjMxNywyNDYuMDM2Mjk0IDE5My43ODAzNjQsMjM5LjgwMDIxMSBDMTkwLjk3Nzk1MSwyMzUuNjI5MjY3IDE4OS4zNTY4NjMsMjMwLjcwMDIzNCAxODguOTcxNzExLDIyNS42ODY5NjkgQzE4OC45NzQ1ODUsMTY5LjQ2MzQ2MyAxODguOTg4OTU3LDExMy4yMzcwNTIgMTg4Ljk2NTk2Myw1Ny4wMTA2NDExIEMxMzguNjE0NTEyLDY4Ljc1Mzc2NDMgODguMjQ1ODE2OCw4MC40MTU1NTk5IDM3Ljg5MTQ5MjUsOTIuMTM4MzUxMiBDMzIuMzkzMDE1Myw5My40MzA4NzkgMjYuODc3MjkyNSw5NC42NDIwNzkyIDIxLjM5NjA2MDksOTYuMDEwMTI1NSBDMjEuNDEzMzA2NSwxNDIuODgzODYzIDIxLjM5MzE4NjYsMTg5Ljc1NDY5NyAyMS40MDc1NTc5LDIzNi42MjU1MyBDMzEuOTQxNzU1LDIzMi44NjcwMzMgNDQuMTY2MDIyNCwyMzMuOTE4NDgzIDUzLjcwNTcyMjMsMjM5Ljg5MzE1NiBDNTguMjQ5OTQyMSwyNDIuNzIyMTk1IDYyLjE1NjA3NDIsMjQ2LjY1MjA2IDY0Ljc5MTc3OTEsMjUxLjM1NDUzOCBDNjcuMTAyNjkxNywyNTUuNDU4Njc2IDY4LjM2NzM3MDIsMjYwLjE1NTM0NSA2OC40MzM0Nzg0LDI2NC44NzUyNSBDNjguNDYyMjIxMSwyNjkuODYyMzc0IDY3LjE0ODY4LDI3NC44NDY1OTMgNjQuNjY4MTg1NSwyNzkuMTYyNzY0IEM2MC41NjM3Mjg5LDI4Ni4zNDU3MzMgNTMuNTQ0NzYzMywyOTEuNjA4NzkgNDUuNzYxMjQxOSwyOTQuMDc3NjY0IEMzNS45MDgyNDY3LDI5Ny4yNTIzNDQgMjQuNzM1OTYxOCwyOTYuMjE4MzIyIDE1LjczMzc1MDMsMjkxLjAxMzM1NiBDOC4wNjUxOTk3MywyODYuNjUwNzEyIDIuMDMyMTA4NDEsMjc5LjAyMzM0NiAwLjQ3MTM4MDE2OSwyNzAuMTcwMjU3IEMwLjM1NjQwOTM5NiwyNjkuMDgxMDQ4IDAuMDg2MjI4MDc5NywyNjguMDE1MDc1IDAuMDA1NzQ4NTM4NjUsMjY2LjkyNTg2NyBDMC4wMDU3NDg1Mzg2NSwxOTQuMjM2NDI4IDAuMDE0MzcxMzQ2NiwxMjEuNTQ2OTg5IDAsNDguODU3NTUwMiBDNjUuNjg4NTUxMiwzMy42MDg2MjY5IDEzMS4zNzEzNTQsMTguMzMwNjU4MSAxOTcuMDU5OTA1LDMuMDczMDIxMTEgQzIwMS41MjM2NDUsMi4wNTY0MjYyMiAyMDUuOTcwMTQsMC45NTI2OTQ2MzUgMjEwLjQ0ODI1MSwwIFoiIGlkPSJTaGFwZSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+PC9wYXRoPjwvZz48L2c+PC9zdmc+') no-repeat center; + background-size: 100%; + list-style-type: none; + position: relative; + box-sizing: border-box; + -moz-box-sizing: border-box; + box-shadow: rgba(0, 0, 0, .35) 0 1px 5px; + float: left; + margin: 0 10px 30px 0; +} +.sc-artwork-list::after { + position: absolute; + top: 0; left: 0; right: 0; bottom: -1px; + content: " "; + background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZ3JhZCIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9InJnYmEoMjU1LCAyNTUsIDI1NSwgMC4xNSkiIC8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9InJnYmEoMjU1LCAyNTUsIDI1NSwgMCkiIC8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgc3R5bGU9ImZpbGw6dXJsKCNncmFkKTsiIC8+PC9zdmc+'); + background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .15) 50%, transparent 50%); + background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .15) 50%, transparent 50%); + background: -o-linear-gradient(-45deg, rgba(255, 255, 255, .15) 50%, transparent 50%); + box-shadow: rgba(255, 255, 255, .1) 0 1px 0 inset; +} +.sc-artwork-list li { + list-style-type: none; + display: none; +} +.sc-artwork-list li.active { + list-style-type: none; + display: block; +} +.sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +/*******************************/ +/********** Controls ***********/ +/*******************************/ +.sc-controls { + position: absolute; + width: 50px; + height: 50px; + margin-left: -25px; + margin-top: -25px; + top: 50%; + left: 50%; + border: 2px solid #ddd; + border-radius: 100%; + background-color: #333; + opacity: .8; +} +.sc-controls:hover{ + background-color: #333; + opacity: .9; +} +.sc-controls > * { + width: 50px; + height: 50px; + color: transparent; + cursor: pointer; +} +.sc-play { + background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPjxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPjxwYXRoIGQ9Ik0xNC4wNzQ1ODM0LDIuOTQ4MDc4NyBMMjUuMTQxNDkyLDIwLjk5NDAyOSBMMy4wMDc2NzUwMywyMC45OTQwMjkgTDE0LjA3NDU4MzQsMi45NDgwNzg3IEwxNC4wNzQ1ODM0LDIuOTQ4MDc4NyBaIiBpZD0iUGxheSIgc3Ryb2tlPSIjREREIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZmlsbD0iI0RERCIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTQuMDA3Njc1LCAxMS45NDgwNzkpIHJvdGF0ZSg5MC4wMDAwMDApIHRyYW5zbGF0ZSgtMTQuMDA3Njc1LCAtMTEuOTQ4MDc5KSAiPjwvcGF0aD48L2c+PC9zdmc+') no-repeat center; +} +.sc-pause { + background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMjJweCIgaGVpZ2h0PSIyNnB4IiB2aWV3Qm94PSIwIDAgMjIgMjYiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPjxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPjxwYXRoIGQ9Ik0xLDEgTDEsMjUgTDgsMjUgTDgsMSBMMSwxIEwxLDEgWiBNMTQsMSBMMTQsMjUgTDIxLDI1IEwyMSwxIEwxNCwxIEwxNCwxIFoiIGlkPSJTdG9wIiBzdHJva2U9IiNEREQiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBmaWxsPSIjREREIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj48L3BhdGg+PC9nPjwvc3ZnPg==') no-repeat center; +} + +/*******************************/ +/*********** Scrubber **********/ +/*******************************/ +.sc-scrubber { + position: absolute; + bottom: 0px; + height: 10px; + width: 200px; + border-radius: 8px; + visibility: hidden; +} +.sc-time-span { + position: relative; +} +.sc-buffer, .sc-played { + height: 9px; + position: absolute; + top: 0; +} +.sc-played { + background-color: rgba(0,0,0,.5); + border: 1px groove #ddd; + opacity: .7; +} +.sc-time-indicators { + position: absolute; + right: 5px; + top: 5px; + background-color: rgba(0,0,0,.4); + border-radius: 4px; + padding: 4px; + visibility: hidden; +} +.sc-waveform-container { + height: 10px; + width: 200px; + position: absolute; +} +.sc-player.played .sc-scrubber, .sc-player.paused .sc-scrubber, .sc-player.played .sc-time-indicators, .sc-player.paused .sc-time-indicators { + visibility: visible; +} + +/*******************************/ +/********** Trackslist *********/ +/*******************************/ +.sc-trackslist { + position: absolute; + width: 100%; + max-height: 30%; + bottom: 0; + overflow: auto; + background-color: rgba(0, 0, 0, .5); + opacity: 0; +} +.sc-trackslist li { + position: relative; + cursor: pointer; + margin: 1px 5px; + padding: 3px 30px 3px 5px; +} +.sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; + position: absolute; + right: 0; + top: 3px; +} +.sc-trackslist li:hover { + background-color: rgba(99, 99, 99, .9); +} +.sc-trackslist li.active { + background-color: rgba(77, 77, 77, .7); +} +.sc-trackslist li.active a, .sc-trackslist li a { + color: #ddd; +} +.sc-trackslist:hover, .sc-trackslist:focus { + opacity: 1; + z-index: 1; +} + +/*******************************/ +/************ Info *************/ +/*******************************/ +.sc-info { + position: absolute; + top: 0px; + width: 190px; + height: 190px; + z-index: 1; + padding: 5px; + background-color: rgba(0, 0, 0, .9); + overflow: auto; +} +.sc-info-toggle { + position: absolute; + top: 9px; + left: 9px; + width: 17px; + height: 17px; + color: transparent; + cursor: pointer; +} +.sc-info-toggle:hover, .sc-player:focus .sc-info-toggle { + background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTdweCIgaGVpZ2h0PSIxN3B4IiB2aWV3Qm94PSIwIDAgMTcgMTciIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPjxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPjxnIGlkPSJpbmZvIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIj48cGF0aCBkPSJNOC41LDE3IEMxMy4xOTQ0MjA2LDE3IDE3LDEzLjE5NDQyMDYgMTcsOC41IEMxNywzLjgwNTU3OTM5IDEzLjE5NDQyMDYsMCA4LjUsMCBDMy44MDU1NzkzOSwwIDAsMy44MDU1NzkzOSAwLDguNSBDMCwxMy4xOTQ0MjA2IDMuODA1NTc5MzksMTcgOC41LDE3IEw4LjUsMTcgWiIgaWQ9Ik92YWwtMSIgZmlsbC1vcGFjaXR5PSIwLjUiIGZpbGw9IiMwMDAiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD48cGF0aCBkPSJNNy43MTgxNDY3Miw2LjIzNzM5ODM3IEw5LjY0ODY0ODYsNi4yMzczOTgzNyBMOC4yMDA3NzIyLDExLjIyNzY0MjMgQzguMTg3OTAyMTIsMTEuMjc1MzM5IDguMTc1MDMyMjQsMTEuMzIwMDU0IDguMTYyMTYyMTYsMTEuMzYxNzg4NiBDOC4xNDkyOTIwOCwxMS40MDM1MjMyIDguMTM2NDIyMiwxMS40NDgyMzgyIDguMTIzNTUyMTIsMTEuNDk1OTM1IEM4LjA4NDk0MTg5LDExLjYwMzI1MjYgOC4wNTI3NjcxOCwxMS43MTM1NDk2IDguMDI3MDI3MDMsMTEuODI2ODI5MyBDOC4wMDEyODY4NywxMS45NDAxMDkgNy45ODg0MTY5OSwxMi4wNjIzMyA3Ljk4ODQxNjk5LDEyLjE5MzQ5NTkgTDcuOTg4NDE2OTksMTIuMjY1MDQwNyBMNy45ODg0MTY5OSwxMi4zMzY1ODU0IEM4LjAwMTI4NzA3LDEyLjM5NjIwNjMgOC4wMzAyNDQzMSwxMi40NTU4MjYzIDguMDc1Mjg5NTgsMTIuNTE1NDQ3MiBDOC4xMjAzMzQ4NSwxMi41NzUwNjggOC4yMDA3NzE2MiwxMi42MDQ4NzggOC4zMTY2MDIzMiwxMi42MDQ4NzggQzguNDU4MTczMTcsMTIuNjA0ODc4IDguNjQ4MDAzOTYsMTIuNTQ4MjM5IDguODg2MTAwMzksMTIuNDM0OTU5MyBDOS4xMjQxOTY4MSwxMi4zMjE2Nzk3IDkuNTUyMTIwNSwxMi4xMTU5OTA3IDEwLjE2OTg4NDIsMTEuODE3ODg2MiBMMTAuMTg5MTg5MiwxMi43MTIxOTUxIEMxMC4xODkxODkyLDEyLjkzODc1NDUgMTAuMDMxNTMzMSwxMy4xNDQ0NDM1IDkuNzE2MjE2MiwxMy4zMjkyNjgzIEM5LjQwMDg5OTMsMTMuNTE0MDkzMSA5LjA1MDE5NDk4LDEzLjY2MDE2MjEgOC42NjQwOTI2NiwxMy43Njc0Nzk3IEM4LjQwNjY5MTEyLDEzLjgzOTAyNDcgOC4xNTg5NDU4NSwxMy44OTU2NjM3IDcuOTIwODQ5NDIsMTMuOTM3Mzk4NCBDNy42ODI3NTI5OSwxMy45NzkxMzMgNy40OTI5MjIyLDE0IDcuMzUxMzUxMzUsMTQgQzYuOTM5NTA4ODgsMTQgNi42MTEzMjY4MywxMy44OTU2NjUgNi4zNjY3OTUzNywxMy42ODY5OTE5IEM2LjEyMjI2MzksMTMuNDc4MzE4NyA2LDEzLjE2NTMxMzcgNiwxMi43NDc5Njc1IEw2LDEyLjY3NjQyMjggTDYsMTIuNjA0ODc4IEM2LjAxMjg3MDA4LDEyLjQyNjAxNTQgNi4wMzg2MDk4NSwxMi4yNDQxNzQ0IDYuMDc3MjIwMDgsMTIuMDU5MzQ5NiBDNi4xMTU4MzAzMSwxMS44NzQ1MjQ4IDYuMTU0NDM5OTYsMTEuNjk4NjQ1OCA2LjE5MzA1MDE5LDExLjUzMTcwNzMgQzYuMjE4NzkwMzUsMTEuNDcyMDg2NCA2LjI0MTMxMjY0LDExLjQwOTQ4NTQgNi4yNjA2MTc3NiwxMS4zNDM5MDI0IEM2LjI3OTkyMjg4LDExLjI3ODMxOTUgNi4yOTYwMTAyMywxMS4yMTU3MTg1IDYuMzA4ODgwMzEsMTEuMTU2MDk3NiBMNy43MTgxNDY3Miw2LjIzNzM5ODM3IEw3LjcxODE0NjcyLDYuMjM3Mzk4MzcgWiBNOC45OTIyNzc5OSw1LjM0MzA4OTQzIEM4LjczNDg3NjQ1LDUuMzQzMDg5NDMgOC41MzUzOTMyNCw1LjI4OTQzMTQzIDguMzkzODIyMzksNS4xODIxMTM4MiBDOC4yNTIyNTE1NCw1LjA3NDc5NjIxIDguMTU1NzI3NDEsNC45NTU1NTYyMSA4LjEwNDI0NzEsNC44MjQzOTAyNCBMOC4wNjU2MzcwNyw0LjY4MTMwMDgxIEM4LjA1Mjc2Njk5LDQuNjMzNjA0MSA4LjA0NjMzMjA1LDQuNTg1OTA4MSA4LjA0NjMzMjA1LDQuNTM4MjExMzggQzguMDQ2MzMyMDUsNC4xMzI3ODkzIDguMTc4MjQ4MzYsMy43NzUwNjkzIDguNDQyMDg0OTQsMy40NjUwNDA2NSBDOC43MDU5MjE1MywzLjE1NTAxMiA5LjAzNzMyMTA0LDMgOS40MzYyOTM0LDMgQzkuNzMyMzA1MiwzIDkuOTg2NDg1NCwzLjA5MjQxMSAxMC4xOTg4NDE3LDMuMjc3MjM1NzcgQzEwLjQxMTE5OCwzLjQ2MjA2MDU0IDEwLjUxNzM3NDUsMy42OTc1NTk1NCAxMC41MTczNzQ1LDMuOTgzNzM5ODQgQzEwLjUxNzM3NDUsNC4wNTUyODQ5MSAxMC41MDc3MjIxLDQuMTM4NzUyOTEgMTAuNDg4NDE3LDQuMjM0MTQ2MzQgQzEwLjQ2OTExMTksNC4zMjk1Mzk3NyAxMC40MzM3MTk3LDQuNDI0OTMxNzcgMTAuMzgyMjM5NCw0LjUyMDMyNTIgQzEwLjI5MjE0ODgsNC43MjMwMzYyNCAxMC4xMzc3MTAyLDQuOTEwODM5MjQgOS45MTg5MTg5LDUuMDgzNzM5ODQgQzkuNzAwMTI3Niw1LjI1NjY0MDQzIDkuMzkxMjUwMzksNS4zNDMwODk0MyA4Ljk5MjI3Nzk5LDUuMzQzMDg5NDMgTDguOTkyMjc3OTksNS4zNDMwODk0MyBaIiBpZD0iaSIgZmlsbD0iI0ZGRiIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+PC9wYXRoPjwvZz48L2c+PC9zdmc+') no-repeat center; + color: transparent; +} +.sc-info-close { + position: absolute; + top: 5px; + right: 5px; + padding: 1px 4px; + color: gray; + cursor: pointer; +} +.sc-info-close:hover { + color: white; +} +.sc-info a { + color: #95bcce; +} +.sc-info a:hover { + color: #5e7681; +} +.sc-info p a { + text-decoration: underline; +} +.sc-info, .sc-info-toggle.active { + visibility: hidden; +} +.sc-info.active { + visibility: visible; +} + +/*******************************/ +/************ Volume ***********/ +/*******************************/ +.sc-volume-slider { + top: -25px; + position: absolute; + width: 110px; + height: 12px; + background-color: #e5e5e5; + border-radius: 2px; +} +.sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; + background-color: #666; + border-right: 1px solid #f6a400; +} + +/*******************************/ +.sc-volume-slider, +.sc-player .hidden, +.sc-waveform-container img, +.sc-no-artwork { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-orange.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-orange.css new file mode 100755 index 0000000..760273e --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-orange.css @@ -0,0 +1,173 @@ +/* ----------< .orange >---------------- */ + +.orange .sc-player { + font: .7em Arial, sans-serif; + background-color: #eee; + background: linear-gradient( top, black, #ccc 0%, #fff 70%); + background: -o-linear-gradient( top, black, #ccc 0%, #fff 70%); + background: -moz-linear-gradient( top, black, #ccc 0%, #fff 70%); + background: -webkit-gradient(linear, left top, left 70%, from(black), color-stop(0%, #ccc), to(#fff)); + color: #333; + line-height: 1.6em; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.orange .sc-player a { + text-decoration: none; +} + +/* Artworks */ + +.orange .sc-artwork-list { + background-color: #eee; + background: linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -o-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -moz-linear-gradient( left bottom, #eee 20px, #333 350px ); + background: -webkit-gradient(linear, right top, left bottom, from(#333), to(#eee)); + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +/* Scrubber */ + +.orange .sc-scrubber { + background-color: #e5e5e5; + border-radius: 8px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.orange .sc-time-span { + background-color: #ddd; +} + +.orange .sc-buffer, +.orange .sc-played { + background-color: #adadad; + position: absolute; +} + +.orange .sc-played { + background-color: #e74c14; + background: linear-gradient( top, black, #e74c14 0, #f6a400 90% ); + background: -o-linear-gradient( top, black, #e74c14 0, #f6a400 90% ); + background: -moz-linear-gradient( top, black, #e74c14 0, #f6a400 90% ); + background: -webkit-gradient(linear, left top, left 90%, from(black), color-stop(0%, #e74c14), to(#f6a400)); +} + +.orange .sc-waveform-container { + position: absolute; + width: 100%; +} + +/* Controls */ + +.orange .sc-controls { + border-radius: 100%; + border: 2px solid white; + background-color: #f6a400; + background: linear-gradient( 45deg, #e74c14, #f6a400 ); + background: -o-linear-gradient( 45deg, #e74c14, #f6a400 ); + background: -moz-linear-gradient( 45deg, #e74c14, #f6a400 ); + background: -webkit-gradient(linear, left bottom, top right, from(#e74c14), to(#f6a400)); + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.orange .sc-controls:hover { + background: linear-gradient( 225deg, #e74c14, #f6a400 ); + background: -o-linear-gradient( 225deg, #e74c14, #f6a400 ); + background: -moz-linear-gradient( 225deg, #e74c14, #f6a400 ); + background: -webkit-gradient(linear, top right, left bottom, from(#e74c14), to(#f6a400)); +} + +.orange .sc-controls > * { + color: transparent; +} + +/* Track list */ + +.orange .sc-trackslist li.active { + color: #fff; + background: #e74c14; +} + +.orange .sc-track-duration { + text-align: right; + padding: 0 5px; + margin-left: 5px; +} + +.orange .sc-trackslist li.active, +.orange .sc-trackslist li:hover { + border-radius: 4px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.orange .sc-trackslist li:hover { + background-color: #f6a400; +} + +.orange .sc-trackslist li.active a { + color: #fff; +} + +.orange .sc-trackslist li a { + color: #333; +} + +/* Track info */ + +.orange .sc-info.active { + background: #fff; + opacity: .9; +} + +.orange .sc-info a { + color: #e74c14; +} + +.orange .sc-info p a { + text-decoration: underline; +} + +.orange .sc-info a:hover { + color: #f6a400; +} + +.orange .sc-info-toggle, +.orange .sc-time-indicators { + background: #f6a400; + color: #ab3104; + border-radius: 4px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); + padding: 4px; +} +.orange .sc-info-close, +.orange .sc-info-close:hover { + padding: 2px 4px; + font-weight: bold; + border-radius: 4px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.orange .sc-info-close:hover { + background: #f6a400; + color: #ab3104; +} + +.orange .sc-info-toggle:hover, +.orange .sc-info-close { + background: #fff; + color: #e74c14; +} + +/* Volume control */ + +.orange .sc-volume-slider { + background-color: #e5e5e5; + border-radius: 2px; + box-shadow: 1px 1px 3px rgba(0,0,0,.2); +} + +.orange .sc-volume-slider .sc-volume-status { + background-color: #666; + border-right: 1px solid #f6a400; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-standard.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-standard.css new file mode 100755 index 0000000..401a948 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-standard.css @@ -0,0 +1,64 @@ +body { + font-family: Courier, 'Courier New', monospace; + width: 800px; + margin-left: 50px; + color: #333; + text-shadow: none; + clear: both; + display: inline-block; +} + +h1 { + border-bottom: 1px dotted black; + padding: 20px 0; +} + +h3 { + width: 90%; + text-align: center; +} + +.post { + width: 540px; + float: left; +} + +.sidebar { + float: right; + width: 200px; + padding-left: 10px; + padding-bottom: 100%; + border-left: 1px dotted black; +} + +.footer { + float: left; + width: 800px; + padding: 10px 0; + border-top: 1px dotted black; + text-align: right; + margin-top: 10px; +} + +.option-green.selected, .option-blue.selected, .option-orange.selected { + text-decoration: underline; +} +.option-green, .option-blue, .option-orange { + cursor: pointer; +} +.option-green.selected, .option-green:hover { + color: #22B573; +} +.option-blue.selected, .option-blue:hover { + color: #039; +} +.option-orange.selected, .option-orange:hover { + color: #f6a400; +} + +.sc-play { + background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTY0cHgiIGhlaWdodD0iMjIycHgiIHZpZXdCb3g9IjAgMCAxNjQgMjIyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj48ZGVmcz48ZmlsdGVyIHg9Ii01MCUiIHk9Ii01MCUiIHdpZHRoPSIyMDAlIiBoZWlnaHQ9IjIwMCUiIGZpbHRlclVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgaWQ9ImZpbHRlci0xIj48ZmVNb3JwaG9sb2d5IHJhZGl1cz0iNSIgaW49IlNvdXJjZUFscGhhIiBvcGVyYXRvcj0iZGlsYXRlIiByZXN1bHQ9InNoYWRvd1NwcmVhZE91dGVyMSI+PC9mZU1vcnBob2xvZ3k+PGZlT2Zmc2V0IGR4PSItMiIgZHk9IjEiIGluPSJzaGFkb3dTcHJlYWRPdXRlcjEiIHJlc3VsdD0ic2hhZG93T2Zmc2V0T3V0ZXIxIj48L2ZlT2Zmc2V0PjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjAiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjEiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMSI+PC9mZUdhdXNzaWFuQmx1cj48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMSAgIDAgMCAwIDAgMSAgIDAgMCAwIDAgMSAgMCAwIDAgMC4zNSAwIiBpbj0ic2hhZG93Qmx1ck91dGVyMSIgdHlwZT0ibWF0cml4IiByZXN1bHQ9InNoYWRvd01hdHJpeE91dGVyMSI+PC9mZUNvbG9yTWF0cml4PjxmZU1lcmdlPjxmZU1lcmdlTm9kZSBpbj0ic2hhZG93TWF0cml4T3V0ZXIxIj48L2ZlTWVyZ2VOb2RlPjxmZU1lcmdlTm9kZSBpbj0iU291cmNlR3JhcGhpYyI+PC9mZU1lcmdlTm9kZT48L2ZlTWVyZ2U+PC9maWx0ZXI+PC9kZWZzPjxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPjxwYXRoIGQ9Ik01NC45Mjk2ODc1LDEwOS4wMTE3MTkgTDgsNC42Mjg5MDYyNSBMMTYwLjM1OTM3NSwxMDkuMDExNzE5IEw4LDIxNiBMNTQuOTI5Njg3NSwxMDkuMDExNzE5IFoiIGlkPSJUcmlhbmdsZS0xIiBmaWxsPSIjRkZGIiBmaWx0ZXI9InVybCgjZmlsdGVyLTEpIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj48L3BhdGg+PC9nPjwvc3ZnPg==') no-repeat center center / 30%; +} +.sc-pause { + background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTM2cHgiIGhlaWdodD0iMTczcHgiIHZpZXdCb3g9IjAgMCAxMzYgMTczIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj48ZGVmcz48ZmlsdGVyIHg9Ii01MCUiIHk9Ii01MCUiIHdpZHRoPSIyMDAlIiBoZWlnaHQ9IjIwMCUiIGZpbHRlclVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgaWQ9ImZpbHRlci0xIj48ZmVPZmZzZXQgZHg9IjE1IiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIwIiBpbj0ic2hhZG93T2Zmc2V0T3V0ZXIxIiByZXN1bHQ9InNoYWRvd0JsdXJPdXRlcjEiPjwvZmVHYXVzc2lhbkJsdXI+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDEgICAwIDAgMCAwIDEgICAwIDAgMCAwIDEgIDAgMCAwIDAuMzUgMCIgaW49InNoYWRvd0JsdXJPdXRlcjEiIHR5cGU9Im1hdHJpeCIgcmVzdWx0PSJzaGFkb3dNYXRyaXhPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD48ZmVNZXJnZT48ZmVNZXJnZU5vZGUgaW49InNoYWRvd01hdHJpeE91dGVyMSI+PC9mZU1lcmdlTm9kZT48ZmVNZXJnZU5vZGUgaW49IlNvdXJjZUdyYXBoaWMiPjwvZmVNZXJnZU5vZGU+PC9mZU1lcmdlPjwvZmlsdGVyPjxmaWx0ZXIgeD0iLTUwJSIgeT0iLTUwJSIgd2lkdGg9IjIwMCUiIGhlaWdodD0iMjAwJSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iZmlsdGVyLTIiPjxmZU9mZnNldCBkeD0iLTE1IiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIwIiBpbj0ic2hhZG93T2Zmc2V0T3V0ZXIxIiByZXN1bHQ9InNoYWRvd0JsdXJPdXRlcjEiPjwvZmVHYXVzc2lhbkJsdXI+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDEgICAwIDAgMCAwIDEgICAwIDAgMCAwIDEgIDAgMCAwIDAuMzUgMCIgaW49InNoYWRvd0JsdXJPdXRlcjEiIHR5cGU9Im1hdHJpeCIgcmVzdWx0PSJzaGFkb3dNYXRyaXhPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD48ZmVNZXJnZT48ZmVNZXJnZU5vZGUgaW49InNoYWRvd01hdHJpeE91dGVyMSI+PC9mZU1lcmdlTm9kZT48ZmVNZXJnZU5vZGUgaW49IlNvdXJjZUdyYXBoaWMiPjwvZmVNZXJnZU5vZGU+PC9mZU1lcmdlPjwvZmlsdGVyPjwvZGVmcz48ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj48ZyBpZD0iUmVjdGFuZ2xlLTEtKy1SZWN0YW5nbGUtMiIgc2tldGNoOnR5cGU9Ik1TTGF5ZXJHcm91cCIgZmlsbD0iI0ZGRiI+PHJlY3QgaWQ9IlJlY3RhbmdsZS0xIiBmaWx0ZXI9InVybCgjZmlsdGVyLTEpIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIiB4PSIwIiB5PSIwIiB3aWR0aD0iNDAiIGhlaWdodD0iMTczIj48L3JlY3Q+PHJlY3QgaWQ9IlJlY3RhbmdsZS0yIiBmaWx0ZXI9InVybCgjZmlsdGVyLTIpIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIiB4PSI5NiIgeT0iMCIgd2lkdGg9IjQwIiBoZWlnaHQ9IjE3MyI+PC9yZWN0PjwvZz48L2c+PC9zdmc+') no-repeat center center / 30%; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-super.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-super.css new file mode 100755 index 0000000..08757be --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-super.css @@ -0,0 +1,210 @@ +/* ----------< .super >---------------- */ + +.super .sc-player { + width: 160px; + height: 160px; + position: relative; + margin: 5px; +} + +.super .sc-player ol, +.super .sc-player li { + margin: 0; + padding: 0; + list-style-position: inside; +} + +.super .sc-artwork-list { + width: 160px; + height: 160px; + list-style-type: none; + position: relative; +} + +.super .sc-artwork-list li { + list-style-type: none; + display: none; +} + +.super .sc-artwork-list li.active { + list-style-type: none; + display: block; +} + +.super .sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +.super .sc-no-artwork { + display: none; +} + +/* Controls */ + +.super .sc-controls { + position: absolute; + width: 50px; + height: 50px; + top: 10px; + left: 180px +} + +.super .sc-controls > * { + width: 50px; + height: 50px; + cursor: pointer; +} + +/* Scrubber */ + +.super .sc-scrubber { + position: absolute; + top: 80px; + height: 70px; + width: 600px; + left: 180px; + display: block; +} + +.super .sc-time-span { + height: 60px; + margin: 5px; + position: relative; +} + +.super .sc-buffer, .super .sc-played { + height: 60px; + position: absolute; + top: 0; +} + +.super .sc-time-span img { + height: 60px; + width: 100%; +} + +.super .sc-time-indicators { + position: absolute; + left: 700px; +} + +.super .sc-time-indicators { + top: 43px; +} + +/* Track list */ + +.super .sc-trackslist { + width: 780px; + min-height: 50%; + overflow: auto; +} + +.super .sc-trackslist li { + cursor: pointer; + margin: 5px; + padding: 3px 30px 3px 5px; + position: relative; +} + +.super .sc-track-duration { + position: absolute; + right: 0; + top: 3px; +} + +/* Track info */ + +.super .sc-info { + position: absolute; + padding: 0 5px; + min-height: 100%; + width: 774px; + top: 0; + z-index: -1; +} + +.super .sc-info.active { + overflow: auto; + z-index: 1; +} + +.super .sc-info p { + position: relative; + text-align: center; + top: 50px; +} + +.super .sc-info-toggle { + position: absolute; + top: 43px; + left: 670px; + cursor: pointer; +} + +.super .sc-info-close { + position: absolute; + top: 10px; + right: 20px; + cursor: pointer; +} + +.super .sc-info h3 { + position: absolute; + width: 420px; + left: 240px; + text-align: left; + top: 30px; +} + +.super .sc-info h4 { + position: absolute; + width: 420px; + left: 240px; + opacity: 0.5; +} + +.super .sc-download { + position: absolute; + top: 10px; + left: 20px; +} + +.super .sc-info p, +.super .sc-info .sc-info-close, +.super .sc-info .sc-download { + visibility: hidden; +} + +.super .sc-info.active p, +.super .sc-info.active .sc-info-close, +.super .sc-info.active .sc-download { + visibility: visible; +} + +/* Volume control */ + +.super .sc-volume-slider { + top: -60px; + right: 0; + position: absolute; + width: 110px; + height: 12px; + background-color: white; +} + +.super .sc-volume-slider .sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; +} + +/* --- */ + +.horizontal .sc-player .hidden { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-vertical.css b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-vertical.css new file mode 100755 index 0000000..80668d7 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/examples/styles/sc-player-vertical.css @@ -0,0 +1,190 @@ +/* ----------< .vertical >---------------- */ + +.vertical .sc-player { + width: 270px; + height: 540px; + position: relative; + margin: 5px; +} + +.vertical .sc-player ol, +.vertical .sc-player li { + margin: 0; + padding: 0; + list-style-position: inside; +} + +/* Artworks */ + +.vertical .sc-artwork-list { + width: 100%; + height: 50%; + list-style-type: none; + position: relative; +} + +.vertical .sc-artwork-list li { + list-style-type: none; + display: none; +} + +.vertical .sc-artwork-list li.active { + list-style-type: none; + display: block; +} + +.vertical .sc-artwork-list img { + list-style-type: none; + width: 100%; + height: 100%; +} + +.vertical .sc-no-artwork { + display: none; +} + +/* Controls */ + +.vertical .sc-controls { + position: absolute; + width: 50px; + height: 50px; + margin-left: -25px; + margin-top: -25px; + top: 25%; + left: 50%; +} + +.vertical .sc-controls > * { + width: 50px; + height: 50px; + cursor: pointer; +} + +/* Scrubber */ + +.vertical .sc-scrubber { + position: absolute; + bottom: 280px; + height: 40px; + width: 250px; + left: 10px; + display: block; +} + +.vertical .sc-time-span { + height: 30px; + margin: 5px; + position: relative; +} + +.vertical .sc-buffer, +.vertical .sc-played { + height: 30px; + position: absolute; + top: 0; +} + +.vertical .sc-time-span img { + height: 30px; + width: 100%; +} + +.vertical .sc-time-indicators { + position: absolute; + right: 10px; + top: 235px; +} + +.vertical .sc-player.played .sc-time-indicators, +.vertical .sc-player.paused .sc-time-indicators { + top: 190px; +} + +/* Track list */ + +.vertical .sc-trackslist { + position: absolute; + width: 100%; + height: 50%; + top: 50%; + left: 0; + overflow: auto; +} + +.vertical .sc-trackslist li { + cursor: pointer; + margin: 5px; + padding: 3px 30px 3px 5px; + position: relative; +} + +.vertical .sc-track-duration { + position: absolute; + right: 0; + top: 3px; +} + +/* Track info */ + +.vertical .sc-info { + position: absolute; + top: 0px; + width: 260px; + height: 260px; + padding: 5px; + z-index: 1; + overflow: auto; + opacity: 0.9; +} + +.vertical .sc-info-toggle { + position: absolute; + top: 10px; + left: 10px; + cursor: pointer; +} + +.vertical .sc-info-close { + position: absolute; + top: 10px; + right: 10px; + cursor: pointer; +} + +.vertical .sc-info, +.vertical .sc-info-toggle.active, +.vertical .sc-player .sc-scrubber { + visibility: hidden; +} + +.vertical .sc-info.active, +.vertical .sc-player.played .sc-scrubber, +.vertical .sc-player.paused .sc-scrubber { + visibility: visible; +} + +/* Volume control */ + +.vertical .sc-volume-slider { + top: -25px; + left: 0px; + position: absolute; + width: 110px; + height: 12px; + background-color: white; +} + +.vertical .sc-volume-slider .sc-volume-status { + position: absolute; + width: 0%; + height: 10px; + top: 1px; + left: 1px; +} + +/* --- */ + +.vertical .sc-player .hidden { + display: none; +} diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/js/player_mp3_js.swf b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/js/player_mp3_js.swf new file mode 100644 index 0000000..72390d4 Binary files /dev/null and b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/js/player_mp3_js.swf differ diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/js/sc-player.js b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/js/sc-player.js new file mode 100644 index 0000000..e02bd73 --- /dev/null +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloud-pure-player/js/sc-player.js @@ -0,0 +1,751 @@ +/* +* SoundCloud Pure Player +* +* The project to rewrite https://github.com/soundcloud/soundcloud-custom-player ((c) Matas Petrikas, MIT) +* on a pure js code. +* Original project source code: +* https://github.com/OpenA/soundcloud-pure-player +* +* Usage: +* My new dub track +* The link will be automatically replaced by the HTML based player +*/ + +function SoundCloudAPI() { + + var _$ = this; + + Object.defineProperties(this, { + version: { + enumerable: true, + value: '1.0' + }, + apiKey: { + enumerable: true, + writable: true, + value: 'htuiRd1JP11Ww0X72T1C3g' + }, + debug: { + enumerable: true, + writable: true, + value: true + }, + getTracks : { value: $getTracks }, + fetch : { value: $fetch } + }); + + function $fetch(url, callback, errorback) { + + if (!url) { + return $panic('requested url is "'+ url +'"', errorback); + } + if (typeof callback !== 'function') { + return (window.Promise ? new Promise(function(resolve, reject) { + $fetch(url, resolve, reject) + }) : null); + } + + var protocol = (location.protocol === 'https:' ? 'https:' : 'http:'), + resolve = protocol +'//api.soundcloud.com/resolve?url=', + params = 'format=json&consumer_key='+ _$.apiKey, apiUrl; + + // force the secure url in unsecure environment + url = url.replace(/^https?:/, protocol); + + // check if it's already a resolved api url + if ((/api\.soundcloud\.com/).test(url)) { + apiUrl = url + '?' + params; + } else { + apiUrl = resolve + url + '&' + params; + } + + var xhr = new XMLHttpRequest; + xhr.onreadystatechange = function() { + if (this.readyState !== 4) + return; + if (this.status === 200) { + try { + var data = JSON.parse(this.responseText); + } catch(log) { + if (_$.debug && window.console) { + console.error(log) + } + } finally { + callback(data); + } + } else { + return $panic('unable to GET '+ url +' ('+ this.status + + (!this.statusText ? '' : ' '+ this.statusText) +')', errorback); + } + }; + xhr.open('GET', apiUrl, true); + xhr.send(null); + } + + function $panic(msg, errorback) { + if (_$.debug && window.console) { + console.error('SoundCloudAPI: '+ msg); + } + if (typeof errorback !== 'function') { + return (window.Promise ? new Promise(function(resolve, reject) { + reject(new EvalError(msg)); + }) : null); + } else + errorback(new EvalError(msg)); + } + + function $getTracks(url, callback, errorback) { + + if (!url) { + return $panic('requested url is "'+ url +'"', errorback); + } + if (typeof callback !== 'function') { + return (window.Promise ? new Promise(function(resolve, reject) { + $getTracks(url, resolve, reject) + }) : null); + } + + var $bound = function(data) { + if (data) { + if (data.tracks) { + // log('data.tracks', data.tracks); + callback(data.tracks); + } else if (Array.isArray(data)) { + callback(data); + } else if (data.duration){ + // a secret link fix, till the SC API returns permalink with secret on secret response + data.permalink_url = url; + // if track, add to player + callback([data]); + } else if (data.creator || data.username) { + // get user or group tracks, or favorites + $fetch(data.uri + (data.username && url.indexOf('favorites') != -1 ? '/favorites' : '/tracks'), $bound, errorback); + } + } + } + $fetch(url, $bound, errorback); + } +}; + +(function() { + + var SC = { + 'API': new SoundCloudAPI, + 'Global': false, + 'Volume': 0.8, + 'Tracks': {}, + 'Object': {}, + get 'Progress'() { + return 0; + } + } + + var _handler = 'ontouchstart' in window ? { + start: 'touchstart', + move: 'touchmove', + end: 'touchend', + getCoords: function(e) { + return (e.touches.length === 1 ? { x: e.changedTouches[0].clientX, y: e.changedTouches[0].clientY } : null); + } + } : { + start: 'mousedown', + move: 'mousemove', + end: 'mouseup', + getCoords: function(e) { + return (e.button === 0 ? { x: e.clientX, y: e.clientY } : null); + } + }; + + var _Current_ = { + + SavedState : null, + TrackLoaded: null, + SelectTrack: null, + PlayerNode : null, + AudioDevice: createAudioDevice(), + /* Complex */ + set 'Player Volume' (vol) { + this.AudioDevice.volume = this.SavedState.Volume = vol; + this.PlayerNode['_volume_'].firstElementChild.style['width'] = (vol * 100) +'%'; + }, + get 'Player Volume' () { + return this.PlayerNode['_volume_'].firstElementChild.style['width']; + }, + + set 'Track Duration' (sec) { + this.TrackLoaded.duration = sec; + this.PlayerNode['_duration_'].textContent = (sec = timeCalc(sec)); + this.SelectTrack['_duration_'].textContent = sec; + }, + get 'Track Duration' () { + return this.SelectTrack['_duration_'].textContent; + }, + + set 'Track Progress' (sec) { + this.SavedState.Progress = sec; + this.PlayerNode['_position_'].textContent = timeCalc(sec); + this.PlayerNode['_progress_'].style['width'] = (sec / this.TrackLoaded.duration * 100) +'%'; + }, + get 'Track Progress' () { + return this.PlayerNode['_progress_'].style['width']; + }, + + set 'Track Buffered' (buf) { + this.PlayerNode['_buffer_'].style['width'] = buf +'%'; + }, + get 'Track Buffered' () { + return this.PlayerNode['_buffer_'].style['width'] === '100%'; + }, + + invokeEvent: function(name) { + this.PlayerNode.dispatchEvent( + new CustomEvent(name, { + bubbles: true, cancelable: true, + detail: { + track: this.TrackLoaded, device: this.AudioDevice + } + })); + }, + + connect: function(player_node, track_node, saved_state) { + + if (saved_state) { + this.SavedState = saved_state; + } + + if (player_node && player_node !== this.PlayerNode) { + if (this.PlayerNode) { + this.PlayerNode[ '_volume_' ]['on'+ _handler.start] = null; + this.PlayerNode['_waveform_']['on'+ _handler.start] = null; + } + this.PlayerNode = ('_trackslist_' in player_node ? player_node : catchKeyElements('player', player_node)); + this.PlayerNode[ '_volume_' ]['on'+ _handler.start] = barChanger; + this.PlayerNode['_waveform_']['on'+ _handler.start] = barChanger; + this['Player Volume'] = this.SavedState.Volume; + } + + if (!track_node) { + track_node = this.PlayerNode.querySelector('.sc-track.active') || this.PlayerNode['_trackslist_'].firstElementChild; + } + + if (track_node && track_node !== this.SelectTrack) { + (this.PlayerNode.querySelector('.sc-track.active') || {}).className = 'sc-track'; + track_node.className = 'sc-track active'; + + this.SelectTrack = ('_duration_' in track_node ? track_node : catchKeyElements('track', track_node)); + this.TrackLoaded = SC['Tracks'][track_node.id.slice(track_node.id.lastIndexOf('_') + 1)]; + + this['Track Buffered'] = 0; + + updateTrackInfo(this.PlayerNode, this.TrackLoaded); + this['AudioDevice'].src = this.TrackLoaded.stream_url + (this.TrackLoaded.stream_url.indexOf('?') >= 0 ? '&' : '?') +'consumer_key='+ SC['API'].apiKey; + this['AudioDevice'].currentTime = this.SavedState.Progress; + this['AudioDevice'].play(); + } + } + } + + var _fileDownload = 'download' in HTMLAnchorElement.prototype ? function() { + + var anchor = document.createElement('a'); + + (_fileDownload = function(button) { + + var uri = button.href +'?consumer_key='+ SC['API'].apiKey, + track = SC['Tracks'][uri.match(/\/(-?\d+)\//)[1]]; + + if (!track.downloadable) { + + button.textContent = '0%'; + + for (var i = 0, sd = document.querySelectorAll('.sc-download'); i < sd.length; i++) { + sd[i].className = 'sc-disabled'; + } + + var wReq = new XMLHttpRequest; + wReq.responseType = 'blob'; + wReq.onprogress = function(e) { + var percent = Math.round(e.loaded / e.total * 100), + progBar = percent +'% '; + for (; percent > 10; percent -= 10) + progBar += '»'; + button.textContent = progBar; + }; + wReq.onload = function() { + track.blob_uri = (anchor.href = window.URL.createObjectURL(wReq.response)); + track.blob_name = (anchor.download = track.title +'.'+ wReq.response.type.replace('audio/', '').replace('mpeg', 'mp3')); + track.downloadable = !document.body.appendChild(anchor).click(); + button.textContent = '» Download «'; + while (i--) { + sd[i].className = 'sc-download'; + } + }; + wReq.open('GET', uri, true); + wReq.send(null); + } else { + anchor.href = track.blob_uri || uri; + anchor.download = track.blob_name || ''; + document.body.appendChild(anchor).click(); + } + })(arguments[0]); + + } : function(a) { + window.open(a.href +'?consumer_key='+ SC['API'].apiKey, '_blank', 'width=400,height=200'); + }; + + if (SC['Global']) { + window.addEventListener('click', onClickHandler, false); + } + + window.SCPurePlayer = { + create: _scCreate, + createGroup: _scCreateGroup + } + + if (document.readyState === 'loading') { + document.addEventListener('DOMContentLoaded', function(e) { + this.removeEventListener(e.type, arguments.callee, false); + onDOMReady(); + }, false); + } else + onDOMReady(); + + function _scCreateGroup(links) { + var $hash = genGroupId(), + inact = true, + ibx = links.length, + $node = createPlayerDOM(ibx, $hash); + + Array.prototype.slice.call(links, 0).forEach(function(link, it) { + + SC['API'].getTracks(link.href, function(tracks) + { ibx--; + + var tNode = createTrackDOM(tracks[0], $hash), + tChild = $node['_trackslist_'].children['ft_'+ $hash +'_'+ it]; + + $node['_trackslist_'].replaceChild(tNode, tChild); + + for (var j = 1; j < tracks.length; j++) { + tChild = tNode.nextSibling; + tNode = createTrackDOM(tracks[j], $hash); + $node['_trackslist_'].insertBefore(tNode, tChild); + } + + if (it === 0) { + inact = false; + updateTrackInfo($node, tracks[0]); + tNode.className += ' active'; + } else if (ibx === 0 && inact) { + tNode = $node['_trackslist_'].firstElementChild; + updateTrackInfo($node, SC['Tracks'][tNode.id.split('_')[2]]); + tNode.className += ' active'; + } + }, function(error) + { ibx--; + + $node['_trackslist_'].children['ft_'+ $hash +'_'+ it].remove(); + if (ibx === 0) { + var tNode = $node['_trackslist_'].firstElementChild; + + if (!tNode) { + $node.removeAttribute('id'); + } else if (inact) { + updateTrackInfo($node, SC['Tracks'][tNode.id.split('_')[2]]); + tNode.className += ' active'; + } + } + }); + }); + + return $node; + } + + function _scCreate(link) { + var $hash = genGroupId(), + $node = createPlayerDOM(-1, $hash); + + SC['API'].getTracks(link.href, function(tracks){ + for (var j = 0; j < tracks.length; j++) { + var tNode = createTrackDOM(tracks[j], $hash); + + $node['_trackslist_'].insertBefore( + tNode, $node['_trackslist_'].children[j] + ); + if (j === 0) { + updateTrackInfo($node, tracks[j]); + tNode.className += ' active'; + } + } + }, function(error) { + $node.removeAttribute('id'); + }); + + return $node; + } + + function onDOMReady(e) { + Array.prototype.slice.call(document.getElementsByClassName('sc-player'), 0).forEach(function(scp) { + var node = scp.href ? _scCreate(scp) : _scCreateGroup(scp.querySelectorAll('a[href*="soundcloud.com/"]')); + scp.parentNode.replaceChild(node, scp); + }); + if (_Current_['AudioDevice'].tagName === 'OBJECT') { + var engineContainer = document.createElement('scont'); + engineContainer.className = 'sc-engine-container'; + engineContainer.setAttribute('style', 'position: absolute; left: -9000px'); + engineContainer.appendChild(_Current_['AudioDevice']); + document.body.appendChild(engineContainer); + } + } + function onEnd(e) { + var play_next; + _Current_.SavedState.Progress = 0; + _Current_.invokeEvent('ended'); + if ((play_next = _Current_.SelectTrack.nextElementSibling)) { + _Current_.connect(null, play_next); + } else { + _Current_.PlayerNode['_button_'].className = 'sc-play'; + _Current_.PlayerNode['_button_'].textContent = 'Play'; + _Current_.PlayerNode.className = 'sc-player'; + _Current_.SelectTrack.className = 'sc-track'; + _Current_.PlayerNode['_trackslist_'].children[0].className = 'sc-track active'; + if ((play_next = _Current_.PlayerNode.nextElementSibling) && play_next.id && + play_next.className.substring(0, 9) === 'sc-player') { + _Current_.connect(play_next, null, SC['Object'][play_next.id.slice(play_next.id.indexOf('_') + 1)]); + } + } + } + function onTimeUpdate(e) { + _Current_['Track Progress'] = e.target.currentTime; + _Current_.invokeEvent('timeupdate'); + } + function onBufferLoad(e) { + if (!_Current_['Track Buffered']) { + _Current_['Track Buffered'] = this.bytesPercent; + } + } + function onClickHandler(e) { + if (e.button != 0 || !e.target.className) + return; + if (e.target.className.slice(0, 3) === 'sc-') { + var $target = e.target, + $class = $target.classList || $target.className.split(' '), + $sc = $class[0].split('-'); + e.preventDefault(); + switch ($sc[1]) { + case 'download': + _fileDownload($target); + break; + case 'info': + if ($sc[2] === 'close') { + $target.parentNode.className = 'sc-info'; + } else if ($sc[2] === 'toggle') { + $target.parentNode.children[1].className = 'sc-info active'; + } + break; + case 'track': + var $player = $target.parentNode.parentNode; + if ($sc[2]) { + $player = $player.parentNode; + $target = $target.parentNode; + } + var $obj = SC['Object'][$player.id.slice($player.id.indexOf('_') + 1)]; + $obj.Progress = 0; + _Current_.connect($player, $target, $obj); + break; + case 'play': + var $player = $target.parentNode.parentNode; + if (!$player.id) + return; + _Current_.connect($player, null, SC['Object'][$player.id.slice($player.id.indexOf('_') + 1)]); + case 'pause': + _Current_.AudioDevice[$sc[1]](); + case 'disabled': + } + } + } + function onPlayerAction(e) { + for (var i = 0, el = document.querySelectorAll( + '.sc-pause, .sc-player.played, .sc-player.paused' + ); i < el.length; i++) { + if (el[i].className === 'sc-pause') { + el[i].className = 'sc-play'; + el[i].textContent = 'Play' ; + } else { + el[i].className = 'sc-player'; + } + } + var ype = (e.type === 'play' ? 'ause' : 'lay') + _Current_.PlayerNode['_button_'].className = 'sc-p'+ ype; + _Current_.PlayerNode['_button_'].textContent = 'P' + ype; + _Current_.PlayerNode.className = 'sc-player '+ e.type + (e.type === 'play' ? 'ed' : 'd'); + _Current_.invokeEvent(e.type); + } + function barChanger(e) { + var coords = _handler.getCoords(e); + if (!coords) { + return; + } + e.preventDefault(); + + var barMove, barEnd; + var rect = this.getBoundingClientRect(), + x = (coords.x - rect.left) / ('width' in rect ? rect.width : (rect.width = rect.right - rect.left)); + + if (this === _Current_.PlayerNode['_waveform_']) { + var maxs = _Current_.TrackLoaded.duration, + curT = _Current_['AudioDevice'].currentTime, + seek = x > 1 ? maxs : x < 0 ? 0 : Math.floor(maxs * x * 1000000) / 1000000; + _Current_['AudioDevice'].ontimeupdate = null; + _Current_['Track Progress'] = seek; + if (seek > curT || curT < seek) { + _Current_.invokeEvent('seeking'); + } + barMove = function(eM) { + maxs = _Current_.TrackLoaded.duration; + x = (_handler.getCoords(eM).x - rect.left) / rect.width; + seek = x > 1 ? maxs : x < 0 ? 0 : Math.floor(maxs * x * 1000000) / 1000000; + _Current_['Track Progress'] = seek; + _Current_.invokeEvent('seeking'); + } + barEnd = function(eE) { + _Current_['AudioDevice'].ontimeupdate = onTimeUpdate; + _Current_['AudioDevice'].currentTime = seek; + _Current_.invokeEvent('seeked'); + window.removeEventListener(_handler.move, barMove, false); + window.removeEventListener(eE.type, barEnd, false); + } + } else if (this === _Current_.PlayerNode['_volume_']) { + var vol = x > 1 ? 1 : x < 0 ? 0 : Math.round(x * 1000) / 1000, + sav = _Current_.SavedState.Volume; + if (sav > vol || sav < vol) { + _Current_.invokeEvent('volumechange'); + } + _Current_['Player Volume'] = (sav = vol); + barMove = function(eM) { + x = (_handler.getCoords(eM).x - rect.left) / rect.width; + vol = x > 1 ? 1 : x < 0 ? 0 : Math.round(x * 1000) / 1000; + if (sav > vol || sav < vol) { + _Current_.invokeEvent('volumechange'); + } + _Current_['Player Volume'] = vol; + } + barEnd = function(eE) { + window.removeEventListener(_handler.move, barMove, false); + window.removeEventListener(eE.type, barEnd, false); + } + } + window.addEventListener(_handler.move, barMove, false); + window.addEventListener(_handler.end, barEnd, false); + } + + function createAudioDevice(url) { + var audio, html5, flash; + if (typeof HTMLAudioElement !== 'undefined') { + audio = new Audio; + html5 = audio.canPlayType && (/maybe|probably/).test(audio.canPlayType('audio/mpeg')); + } + if (!html5) { + audio = document.createElement('object'); + audio.id = 'scPlayerEngine'; + audio.height = 1; + audio.width = 1; + audio.type = 'application/x-shockwave-flash'; + audio.data = '/js/player_mp3_js.swf'; + audio.innerHTML = ''; + + flash = (window['flashBack2343191116fr_scEngine'] = new Object); + flash.onInit = function() { + Object.defineProperties(audio, { + play : { value: function() { + flash.status = 'process'; + this.SetVariable('method:play', ''); + this.SetVariable('enabled', 'true'); + onPlayerAction({type: 'play'}); }}, + pause : { value: function() { + flash.status = 'waiting'; + this.SetVariable('method:pause', ''); + onPlayerAction({type: 'pause'}); }}, + //stop : { value: function() { this.SetVariable('method:stop', '') }}, + src : { get: function() { return this.url }, + set: function(url) { this.SetVariable('method:setUrl', url) }}, + ended : { get: function() { return flash.status === 'ended' }}, + playing : { get: function() { return JSON.parse(flash.isPlaying); }}, + duration : { get: function() { return Number(flash.duration) / 1000 || 0 }}, + currentTime : { get: function() { return Number(flash.position) / 1000 || 0 }, + set: function(rel) { this.SetVariable('method:setPosition', (rel * 1000)) }}, + volume : { get: function() { return Number(flash.volume) / 100 }, + set: function(vol) { this.SetVariable('method:setVolume', (vol * 100)) }}, + ontimeupdate: { set: function(fn) { flash.onTimeUpdate = fn || function(){} }} + }); + audio['volume'] = SC.Volume; + this.position = 0; + }; + flash.onTimeUpdate = onTimeUpdate; + flash.onBufferLoad = onBufferLoad; + flash.onUpdate = function() { + switch (this.status) { + case 'process': + this.onTimeUpdate({target: audio}); + if (this.position == '0' && this.isPlaying == 'false') { + this.status = 'ended'; + onEnd(); + } + case 'waiting': + this.onBufferLoad(); + } + }; + } else { + var _BufferLoad = null; + audio['volume'] = SC.Volume; + audio['onplay'] = audio['onpause'] = onPlayerAction; + audio['onended'] = onEnd; + audio['ontimeupdate'] = onTimeUpdate; + audio['onerror'] = function(e) { + clearInterval(_BufferLoad); + _Current_.invokeEvent('error'); + }; + audio['onloadedmetadata'] = function(e) { + clearInterval(_BufferLoad); + if (_Current_.TrackLoaded.duration !== this.duration) { + _Current_['Track Duration'] = this.duration; + } + _BufferLoad = setInterval(function() { + if (audio.buffered.length > 0) { + var bytesPercent = audio.buffered.end(audio.buffered.length - 1) / audio.duration; + if (bytesPercent === 1) { + clearInterval(_BufferLoad); + } + _Current_['Track Buffered'] = bytesPercent * 100; + } + }, 100); + }; + } + return audio; + } + function createTrackDOM(track, hash) { + SC['Tracks'][track.id] = track; + var li = document.createElement('li'); + li.id = 'sc-t_'+ hash +'_'+ track.id; + li.className = 'sc-track'; + li.appendChild(( + li['_title_'] = document.createElement('a'))); + li['_title_'].href = track.permalink_url; + li['_title_'].className = 'sc-track-title'; + li['_title_'].textContent = track.title; + li.appendChild(( + li['_duration_'] = document.createElement('span'))); + li['_duration_'].className = 'sc-track-duration'; + li['_duration_'].textContent = timeCalc((track.duration /= 1000)); + return li; + } + function _li(h, l) { + var li ='', i; + for (i = 0; i < l; i++) + li += ''; + return li; + } + function createPlayerDOM(len, hash) { + var div = document.createElement('div'); + div.className = 'sc-player loading'; + div.innerHTML = '
    \n'+ + '

    » Download «\n'+ + '
    X
    \n'+ + '
    \n'+ + '
    \n'+ + '
    Play
    \n'+ + '
    \n'+ + '
      '+ _li(hash, len) +'
    \n'+ + '
    Info
    \n'+ + '
    \n'+ + '  | \n'+ + '
    \n'+ + '
    \n'+ + '
    \n'+ + ' \n'+ + '
    \n'+ + '
    \n'+ + '
    \n'+ + '
    \n'+ + '
    \n'+ + '
    \n'+ + '
    '; + if (hash && len) { + div.id = 'sc-obj_'+ hash; + if (!SC['Global']) { + SC['Object'][hash] = { Volume: SC.Volume, Progress: 0 } + div.addEventListener('click', onClickHandler, false); + } else { + SC['Object'][hash] = SC; + } + } + return catchKeyElements('player', div); + } + + function catchKeyElements(name, _CN_) { + switch(name) { + case 'player': + _CN_['_artwork_'] = _CN_.querySelector('.sc-artwork-list'); + _CN_['_info_'] = _CN_.querySelector('.sc-info'); + _CN_['_button_'] = _CN_.querySelector('.sc-controls').firstElementChild; + _CN_['_trackslist_'] = _CN_.querySelector('.sc-trackslist'); + _CN_['_volume_'] = _CN_.querySelector('.sc-volume-slider'); + _CN_['_waveform_'] = _CN_.querySelector('.sc-waveform-container'); + _CN_['_buffer_'] = _CN_.querySelector('.sc-buffer'); + _CN_['_progress_'] = _CN_.querySelector('.sc-played'); + _CN_['_duration_'] = _CN_.querySelector('.sc-duration'); + _CN_['_position_'] = _CN_.querySelector('.sc-position'); + break; + case 'track': + _CN_['_duration_'] = _CN_.querySelector('.sc-track-duration'); + _CN_['_title_'] = _CN_.querySelector('.sc-track-title'); + } + + return _CN_; + } + + function updateTrackInfo(node, track) { + var artwork = track.artwork_url || track.user.avatar_url; + if (artwork && !/\/(?:default_avatar_|avatars-000044695144-c5ssgx-)/.test(artwork)) { + if (node['_artwork_'].clientWidth > 100) { + var s = findBestMatch([200, 250, 300, 500], node['_artwork_'].clientWidth); + artwork = artwork.replace('-large', '-t'+ s +'x'+ s +'') + }; + (node['_artwork_'].firstElementChild || node['_artwork_'].appendChild( document.createElement('img'))).src = artwork; + } + node['_info_'].children[0].innerHTML = ''+ track.title +''; + node['_info_'].children[1].innerHTML = 'by '+ track.user.username +''; + node['_info_'].children[2].innerHTML = (track.description || 'no Description'); + node['_info_'].children[3].href = (track.downloadable ? track.download_url : track.stream_url); + // update the track duration in the progress bar + node['_duration_'].textContent = timeCalc(track.duration); + node['_position_'].textContent = '00.00'; + // put the waveform into the progress bar + (node['_waveform_'].firstElementChild || node['_waveform_'].appendChild( document.createElement('img'))).src = track.waveform_url; + } + + function findBestMatch(list, toMatch) { + var item, i = 0, len = list.length; + while (i < len && (item = list[i]) < toMatch) + i++; + return item; + } + function timeCalc(secn) { + var s, m, h; + s = Math.floor(secn) % 60; + m = Math.floor(secn / 60) % 60; + h = Math.floor(secn / (60 * 60)); + + return (h > 0 ? h +'.' : '') + (m < 10 && m > -1 ? '0'+ m : m) +'.'+ (s < 10 && s > -1 ? '0'+ s : s); + } + function genGroupId() { + var n = Math.round(Math.random() * 12345679); + while (n in SC['Object']) n++; + return (SC['Object'][n] = n); + } + if (!('preventDefault' in Event.prototype)) { + Event.prototype.preventDefault = function() { + this.returnValue = false; + }; + } +})(); diff --git a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloudcustomplayer/js/pa-sc-player.js b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloudcustomplayer/js/pa-sc-player.js index 5d25a1c..a48dbf9 100644 --- a/sites/all/themes/gui/perfarttimeline/js/libs/soundcloudcustomplayer/js/pa-sc-player.js +++ b/sites/all/themes/gui/perfarttimeline/js/libs/soundcloudcustomplayer/js/pa-sc-player.js @@ -313,17 +313,19 @@ }, headers: { "accept" : "application/json; charset=utf-8", - "Content-Type" : "application/x-www-form-urlencoded", - "Authorization": "OAuth 965bd4363fdd909723749b003be67125" + "Content-Type" : "application/x-www-form-urlencoded" } + }).done(function (data) { + console.log('Token', data); }); + // $.ajax({ // "dataType": "json", // "url": apiUrl, // "data": {}, // "headers": { - // "Authorization": "OAuth " + apiKey + // "Authorization": "OAuth bb68647335a47f104a86dcddf4e70fa8" // }, // "success": function(data) { // // log('data loaded', link.url, data); diff --git a/sites/all/themes/gui/perfarttimeline/js/script.js b/sites/all/themes/gui/perfarttimeline/js/script.js index a0ac5c3..5b73a77 100644 --- a/sites/all/themes/gui/perfarttimeline/js/script.js +++ b/sites/all/themes/gui/perfarttimeline/js/script.js @@ -42,8 +42,8 @@ Drupal.behaviors.init_theme.attach = function (context) { Drupal.behaviors.init_timeline = {}; Drupal.behaviors.init_timeline.attach = function (context) { - $.paScPlayer.defaults.onDomReady = null; - $.paScPlayer.defaults.loadArtworks = 0; + // $.paScPlayer.defaults.onDomReady = null; + // $.paScPlayer.defaults.loadArtworks = 0; if($('html').is('.oldie')) { @@ -1440,12 +1440,18 @@ Drupal.behaviors.init_timeline.attach = function (context) { var $container = $container || $('body'); var ap = ap || false; // console.log('_initPaScPlayer'); - $.paScPlayer.stopAll(); + // $.paScPlayer.stopAll(); var $links = $('a[rel="soundcloud"]', $container); - // console.log('$links', $links); + // // console.log('$links', $links); if($links.size()){ - $links.parents('.field-item').find('span.ext').remove(); - $links.paScPlayer({autoplay:ap}); + // $links.parents('.field-item').find('span.ext').remove(); + // $links.paScPlayer({autoplay:ap}); + /* add players for each link */ + for ( var i = 0; i < $links.length; i++ ) { + $links[i].parentNode.replaceChild( + SCPurePlayer.create($links[i]), $links[i] + ); + } } } diff --git a/sites/all/themes/gui/perfarttimeline/perfarttimeline.info b/sites/all/themes/gui/perfarttimeline/perfarttimeline.info index 586eb38..04db292 100644 --- a/sites/all/themes/gui/perfarttimeline/perfarttimeline.info +++ b/sites/all/themes/gui/perfarttimeline/perfarttimeline.info @@ -13,7 +13,9 @@ stylesheets[all][] = "css/normalize.css" stylesheets[all][] = "fonts/museo_webfont_kit/MyFontsWebfontsKit.css" stylesheets[all][] = "js/libs/timeline/timeline.css" stylesheets[all][] = "js/libs/jquery.jscrollpane.css" -stylesheets[all][] = ""js/libs/soundcloudcustomplayer/css/pa-sc-player.css"" +; stylesheets[all][] = "js/libs/soundcloudcustomplayer/css/pa-sc-player.css" +stylesheets[all][] = "js/libs/soundcloud-pure-player/css/sc-player-standard/structure-horizontal.css" +stylesheets[all][] = "js/libs/soundcloud-pure-player/css/sc-player-standard/colors-blue.css" stylesheets[all][] = "css/listnav.css" stylesheets[all][] = "css/styles.css" ; non-semantic helper classes @@ -28,8 +30,9 @@ scripts[] = "js/libs/jquery.mousewheel.js" scripts[] = "js/libs/mwheelIntent.js" ;scripts[] = "js/libs/grid/jquery.grid.js" scripts[] = "js/libs/jquery.history.js" -scripts[] = "js/libs/soundcloudcustomplayer/js/soundcloud.player.api.js" -scripts[] = "js/libs/soundcloudcustomplayer/js/pa-sc-player.js" +; scripts[] = "js/libs/soundcloudcustomplayer/js/soundcloud.player.api.js" +; scripts[] = "js/libs/soundcloudcustomplayer/js/pa-sc-player.js" +scripts[] = "js/libs/soundcloud-pure-player/js/sc-player.js" scripts[] = "js/libs/jquery.listnav-2.1.js" scripts[] = "js/libs/jquery-cookie-master/jquery.cookie.js" scripts[] = "js/script.js"