Theme for worpdress 4.6.1
55
.listing
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
drwxr-xr-x 6 wsoinuma psacln 4096 Feb 17 2014 .
|
||||||
|
drwxrwxrwx 6 wsoinuma psacln 4096 Mar 29 2012 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1609 Nov 21 2011 404.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2473 Jan 27 2012 archive.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2940 Nov 21 2011 author.php
|
||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Feb 4 2013 carnaval
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1596 Feb 5 2013 carnaval.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2021 Mar 16 2012 carnaval.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 642 Mar 16 2012 carnaval.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1823 Jan 25 2013 carnaval_old.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1977 Jan 27 2012 category.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3159 Nov 21 2011 comments.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 4630 Mar 7 2012 common.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3495 Nov 21 2011 content-image.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2124 Nov 21 2011 content-link.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 473 Nov 21 2011 content-page.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1776 Apr 16 2012 content-single.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2242 Nov 21 2011 content-status.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3736 Nov 21 2011 content.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 321 Nov 21 2011 editor-style-rtl.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 5011 Nov 21 2011 editor-style.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1804 Feb 17 2014 footer-box.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 309 Feb 4 2013 footer-carnaval.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1765 Feb 17 2014 footer-single.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 295 Nov 21 2011 footer.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2008 Nov 24 2011 front-page.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 14490 Feb 5 2013 functions.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2451 Feb 4 2013 header-carnaval.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2624 Dec 12 2011 header-search.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2511 Dec 12 2011 header-single.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2486 Dec 12 2011 header.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3981 Nov 21 2011 image.php
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Feb 17 2014 images
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2020 Nov 21 2011 index.php
|
||||||
|
dr-xr-xr-x 2 wsoinuma psacln 4096 Dec 15 2011 js
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 30 2012 languages
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 15129 Nov 21 2011 license.txt
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1459 Feb 5 2013 loop-carnaval.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 4084 Mar 1 2012 loop-carnaval_old.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 396 Nov 23 2011 loop-results.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2060 Nov 21 2011 page.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 92 Nov 21 2011 readme.txt
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 10958 Nov 21 2011 rtl.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 62878 Nov 21 2011 screenshot.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1949 Jan 27 2012 search.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1817 Nov 23 2011 search_o.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 680 Nov 21 2011 searchform.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3214 Feb 17 2014 single-marker.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 938 Nov 21 2011 single.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 628 Nov 24 2011 slide-content.php
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 472 Nov 21 2011 style-search.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 453 Nov 21 2011 style-single.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 41807 Aug 21 2013 style.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 40890 Nov 23 2011 style_old.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1963 Jan 27 2012 tag.php
|
48
404.php
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* The template for displaying 404 pages (Not Found).
|
||||||
|
*
|
||||||
|
* @package WordPress
|
||||||
|
* @subpackage Twenty_Eleven
|
||||||
|
* @since Twenty Eleven 1.0
|
||||||
|
*/
|
||||||
|
|
||||||
|
get_header(); ?>
|
||||||
|
|
||||||
|
<div id="primary">
|
||||||
|
<div id="content" role="main">
|
||||||
|
|
||||||
|
<article id="post-0" class="post error404 not-found">
|
||||||
|
<header class="entry-header">
|
||||||
|
<h1 class="entry-title"><?php _e( 'This is somewhat embarrassing, isn’t it?', 'soundmap_theme' ); ?></h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="entry-content">
|
||||||
|
<p><?php _e( 'It seems we can’t find what you’re looking for. Perhaps searching, or one of the links below, can help.', 'soundmap_theme' ); ?></p>
|
||||||
|
|
||||||
|
<?php get_search_form(); ?>
|
||||||
|
|
||||||
|
<?php the_widget( 'WP_Widget_Recent_Posts', array( 'number' => 10 ), array( 'widget_id' => '404' ) ); ?>
|
||||||
|
|
||||||
|
<div class="widget">
|
||||||
|
<h2 class="widgettitle"><?php _e( 'Most Used Categories', 'soundmap_theme' ); ?></h2>
|
||||||
|
<ul>
|
||||||
|
<?php wp_list_categories( array( 'orderby' => 'count', 'order' => 'DESC', 'show_count' => 1, 'title_li' => '', 'number' => 10 ) ); ?>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<?php
|
||||||
|
/* translators: %1$s: smilie */
|
||||||
|
$archive_content = '<p>' . sprintf( __( 'Try looking in the monthly archives. %1$s', 'soundmap_theme' ), convert_smilies( ':)' ) ) . '</p>';
|
||||||
|
the_widget( 'WP_Widget_Archives', array('count' => 0 , 'dropdown' => 1 ), array( 'after_title' => '</h2>'.$archive_content ) );
|
||||||
|
?>
|
||||||
|
|
||||||
|
<?php the_widget( 'WP_Widget_Tag_Cloud' ); ?>
|
||||||
|
|
||||||
|
</div><!-- .entry-content -->
|
||||||
|
</article><!-- #post-0 -->
|
||||||
|
|
||||||
|
</div><!-- #content -->
|
||||||
|
</div><!-- #primary -->
|
||||||
|
|
||||||
|
<?php get_footer(); ?>
|
80
archive.php
Normal file
@ -0,0 +1,80 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* The template for displaying Archive pages.
|
||||||
|
*
|
||||||
|
* Used to display archive-type pages if nothing more specific matches a query.
|
||||||
|
* For example, puts together date-based pages if no date.php file exists.
|
||||||
|
*
|
||||||
|
* Learn more: http://codex.wordpress.org/Template_Hierarchy
|
||||||
|
*
|
||||||
|
* @package WordPress
|
||||||
|
* @subpackage Twenty_Eleven
|
||||||
|
* @since Twenty Eleven 1.0
|
||||||
|
*/
|
||||||
|
|
||||||
|
get_header(); ?>
|
||||||
|
|
||||||
|
<section id="primary">
|
||||||
|
<div id="content" role="main">
|
||||||
|
|
||||||
|
<?php if ( have_posts() ) : ?>
|
||||||
|
<?php
|
||||||
|
|
||||||
|
global $wp_query;
|
||||||
|
$markers_count = $wp_query->post_count;
|
||||||
|
|
||||||
|
|
||||||
|
?>
|
||||||
|
|
||||||
|
<header class="page-header">
|
||||||
|
<h1 class="page-title">
|
||||||
|
<?php if ( is_day() ) : ?>
|
||||||
|
<?php printf( __( 'Daily Archives: %s', 'soundmap_theme' ), '<span>' . get_the_date() . '</span>' ); ?>
|
||||||
|
<?php elseif ( is_month() ) : ?>
|
||||||
|
<?php printf( __( 'Monthly Archives: %s', 'soundmap_theme' ), '<span>' . get_the_date( 'F Y' ) . '</span>' ); ?>
|
||||||
|
<?php elseif ( is_year() ) : ?>
|
||||||
|
<?php printf( __( 'Yearly Archives: %s', 'soundmap_theme' ), '<span>' . get_the_date( 'Y' ) . '</span>' ); ?>
|
||||||
|
<?php else : ?>
|
||||||
|
<?php _e( 'Blog Archives', 'soundmap_theme' ); ?>
|
||||||
|
<?php endif; ?>
|
||||||
|
(<?php echo $markers_count ?>)
|
||||||
|
</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<?php soundmap_theme_content_nav( 'nav-above' ); ?>
|
||||||
|
|
||||||
|
<?php /* Start the Loop */ ?>
|
||||||
|
<?php while ( have_posts() ) : the_post(); ?>
|
||||||
|
|
||||||
|
<?php
|
||||||
|
/* Include the Post-Format-specific template for the content.
|
||||||
|
* If you want to overload this in a child theme then include a file
|
||||||
|
* called content-___.php (where ___ is the Post Format name) and that will be used instead.
|
||||||
|
*/
|
||||||
|
get_template_part( 'content', get_post_format() );
|
||||||
|
?>
|
||||||
|
|
||||||
|
<?php endwhile; ?>
|
||||||
|
|
||||||
|
<?php soundmap_theme_content_nav( 'nav-below' ); ?>
|
||||||
|
|
||||||
|
<?php else : ?>
|
||||||
|
|
||||||
|
<article id="post-0" class="post no-results not-found">
|
||||||
|
<header class="entry-header">
|
||||||
|
<h1 class="entry-title"><?php _e( 'Nothing Found', 'soundmap_theme' ); ?></h1>
|
||||||
|
</header><!-- .entry-header -->
|
||||||
|
|
||||||
|
<div class="entry-content">
|
||||||
|
<p><?php _e( 'Apologies, but no results were found for the requested archive. Perhaps searching will help find a related post.', 'soundmap_theme' ); ?></p>
|
||||||
|
<?php get_search_form(); ?>
|
||||||
|
</div><!-- .entry-content -->
|
||||||
|
</article><!-- #post-0 -->
|
||||||
|
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
</div><!-- #content -->
|
||||||
|
</section><!-- #primary -->
|
||||||
|
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
89
author.php
Normal file
@ -0,0 +1,89 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* The template for displaying Author Archive pages.
|
||||||
|
*
|
||||||
|
* @package WordPress
|
||||||
|
* @subpackage Twenty_Eleven
|
||||||
|
* @since Twenty Eleven 1.0
|
||||||
|
*/
|
||||||
|
|
||||||
|
get_header(); ?>
|
||||||
|
|
||||||
|
<section id="primary">
|
||||||
|
<div id="content" role="main">
|
||||||
|
|
||||||
|
<?php if ( have_posts() ) : ?>
|
||||||
|
|
||||||
|
<?php
|
||||||
|
/* Queue the first post, that way we know
|
||||||
|
* what author we're dealing with (if that is the case).
|
||||||
|
*
|
||||||
|
* We reset this later so we can run the loop
|
||||||
|
* properly with a call to rewind_posts().
|
||||||
|
*/
|
||||||
|
the_post();
|
||||||
|
?>
|
||||||
|
|
||||||
|
<header class="page-header">
|
||||||
|
<h1 class="page-title author"><?php printf( __( 'Author Archives: %s', 'soundmap_theme' ), '<span class="vcard"><a class="url fn n" href="' . esc_url( get_author_posts_url( get_the_author_meta( "ID" ) ) ) . '" title="' . esc_attr( get_the_author() ) . '" rel="me">' . get_the_author() . '</a></span>' ); ?></h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<?php
|
||||||
|
/* Since we called the_post() above, we need to
|
||||||
|
* rewind the loop back to the beginning that way
|
||||||
|
* we can run the loop properly, in full.
|
||||||
|
*/
|
||||||
|
rewind_posts();
|
||||||
|
?>
|
||||||
|
|
||||||
|
<?php soundmap_theme_content_nav( 'nav-above' ); ?>
|
||||||
|
|
||||||
|
<?php
|
||||||
|
// If a user has filled out their description, show a bio on their entries.
|
||||||
|
if ( get_the_author_meta( 'description' ) ) : ?>
|
||||||
|
<div id="author-info">
|
||||||
|
<div id="author-avatar">
|
||||||
|
<?php echo get_avatar( get_the_author_meta( 'user_email' ), apply_filters( 'soundmap_theme_author_bio_avatar_size', 60 ) ); ?>
|
||||||
|
</div><!-- #author-avatar -->
|
||||||
|
<div id="author-description">
|
||||||
|
<h2><?php printf( __( 'About %s', 'soundmap_theme' ), get_the_author() ); ?></h2>
|
||||||
|
<?php the_author_meta( 'description' ); ?>
|
||||||
|
</div><!-- #author-description -->
|
||||||
|
</div><!-- #entry-author-info -->
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php /* Start the Loop */ ?>
|
||||||
|
<?php while ( have_posts() ) : the_post(); ?>
|
||||||
|
|
||||||
|
<?php
|
||||||
|
/* Include the Post-Format-specific template for the content.
|
||||||
|
* If you want to overload this in a child theme then include a file
|
||||||
|
* called content-___.php (where ___ is the Post Format name) and that will be used instead.
|
||||||
|
*/
|
||||||
|
get_template_part( 'content', get_post_format() );
|
||||||
|
?>
|
||||||
|
|
||||||
|
<?php endwhile; ?>
|
||||||
|
|
||||||
|
<?php soundmap_theme_content_nav( 'nav-below' ); ?>
|
||||||
|
|
||||||
|
<?php else : ?>
|
||||||
|
|
||||||
|
<article id="post-0" class="post no-results not-found">
|
||||||
|
<header class="entry-header">
|
||||||
|
<h1 class="entry-title"><?php _e( 'Nothing Found', 'soundmap_theme' ); ?></h1>
|
||||||
|
</header><!-- .entry-header -->
|
||||||
|
|
||||||
|
<div class="entry-content">
|
||||||
|
<p><?php _e( 'Apologies, but no results were found for the requested archive. Perhaps searching will help find a related post.', 'soundmap_theme' ); ?></p>
|
||||||
|
<?php get_search_form(); ?>
|
||||||
|
</div><!-- .entry-content -->
|
||||||
|
</article><!-- #post-0 -->
|
||||||
|
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
</div><!-- #content -->
|
||||||
|
</section><!-- #primary -->
|
||||||
|
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
118
carnaval.css
Normal file
@ -0,0 +1,118 @@
|
|||||||
|
*{
|
||||||
|
outline: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html{
|
||||||
|
background: #000000;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
background-color: transparent;
|
||||||
|
color: #eee;
|
||||||
|
font: 12px/16px ;
|
||||||
|
font-family: 'Terminal Dosis', sans-serif;
|
||||||
|
}
|
||||||
|
a{
|
||||||
|
color: #eee;
|
||||||
|
text-decoration: none;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
#carnaval{
|
||||||
|
width:960px;
|
||||||
|
margin: 20px auto;
|
||||||
|
}
|
||||||
|
#carnaval > div{
|
||||||
|
background-color: rgba(0,0,0,0.5);
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
#title{
|
||||||
|
width: 400px;
|
||||||
|
float: left;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
#title h2{
|
||||||
|
font-size: 60px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
padding: 10px 0 10px 20px;
|
||||||
|
}
|
||||||
|
#track-list{
|
||||||
|
width: 290px;
|
||||||
|
height:380px;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 20px 0;
|
||||||
|
margin-right: 20px;
|
||||||
|
float: left;
|
||||||
|
margin-top: -104px;
|
||||||
|
}
|
||||||
|
#track-list a.active{
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
#tracks-wrapper{
|
||||||
|
height: 380px;
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.antiscroll-wrap{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
#track-list ul{
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
font-size: 13px;
|
||||||
|
padding: 0px 0 20px;
|
||||||
|
}
|
||||||
|
#track-list ul li{
|
||||||
|
padding: 5px 3px 3px 5px;
|
||||||
|
}
|
||||||
|
#track-list ul li:hover{
|
||||||
|
background-color: rgba(20,20,20,0.5);
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
#player{
|
||||||
|
width:256px;
|
||||||
|
float: left;
|
||||||
|
height: 256px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
#info{
|
||||||
|
width:650px;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
#total{
|
||||||
|
position: absolute;
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
}
|
||||||
|
.player-links{
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#info-wrapper{
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
#footer{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
#info-wrapper p{
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
#info-wrapper img{
|
||||||
|
float: left;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.post-title{
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titulo_modificado{
|
||||||
|
color: #999;
|
||||||
|
}
|
108
carnaval.js
Normal file
@ -0,0 +1,108 @@
|
|||||||
|
|
||||||
|
soundManager.url = '/wp-content/themes/soundmap/carnaval/swf/';
|
||||||
|
|
||||||
|
var files_reference=new Array();
|
||||||
|
var files = "";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
soundManager.onready(function(){
|
||||||
|
carnaval.startAutoMode();
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
function Carnaval(){
|
||||||
|
|
||||||
|
var list_ = null;
|
||||||
|
var playlist_ = null;
|
||||||
|
var selBox_ = null;
|
||||||
|
var pointer_ = 0;
|
||||||
|
var self_=this;
|
||||||
|
|
||||||
|
var stEv_ = {
|
||||||
|
play_: self_.play_,
|
||||||
|
stop_: self_.stop_,
|
||||||
|
finish_: self_.finish_
|
||||||
|
};
|
||||||
|
|
||||||
|
var init_ = function (e){
|
||||||
|
console.log("CCCCCCAAAAAARRRRRRNNNNNNNAAAAAAVAVVVVVVVAAAAAALLLLLLLL");
|
||||||
|
list_ = eval('(' + files_reference + ')');
|
||||||
|
playlist_ = jQuery('.playlistLink').addEventListener('click', self_.playlistClick, false);
|
||||||
|
|
||||||
|
// console.log(list_['1398'][0].fileURI);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
var playSong_ = function (e, ev){
|
||||||
|
var l_ = e;
|
||||||
|
var box_ = l_.rel;
|
||||||
|
if(selBox_){
|
||||||
|
jQuery('#' + selBox_).fadeOut(600);
|
||||||
|
soundManager.stop('s_' + selBox_);
|
||||||
|
}
|
||||||
|
selBox_ = box_;
|
||||||
|
jQuery('#' + selBox_).fadeIn(600);
|
||||||
|
var file_ = null;
|
||||||
|
if (list_[selBox_][0]){
|
||||||
|
file_ = list_[selBox_][0].fileURI;
|
||||||
|
}
|
||||||
|
soundManager.createSound({
|
||||||
|
id: 's_' + selBox_,
|
||||||
|
url: file_,
|
||||||
|
autoPlay: true,
|
||||||
|
onplay: ev.play_,
|
||||||
|
onstop: ev.stop_,
|
||||||
|
onfinish: ev.finish_
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
this.playlistClick = function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
var ev_ = {
|
||||||
|
play_: self_.play_,
|
||||||
|
stop_: self_.stop_,
|
||||||
|
finish_: function (){
|
||||||
|
setTimeout(self_.startAutoMode(), '2000');
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
playSong_(e.target, ev_);
|
||||||
|
}; //playlistClick
|
||||||
|
|
||||||
|
this.play_ = function(){
|
||||||
|
console.log("estamos sonando");
|
||||||
|
}; //play
|
||||||
|
this.stop_ = function(){
|
||||||
|
console.log("Estamos parando...");
|
||||||
|
}; //stop
|
||||||
|
this.finish_ = function(){
|
||||||
|
console.log("Acabado");
|
||||||
|
}
|
||||||
|
|
||||||
|
this.startAutoMode = function(){
|
||||||
|
var s_ = playlist_[pointer_];
|
||||||
|
|
||||||
|
var ev_ = {
|
||||||
|
play_: self_.play_,
|
||||||
|
stop_: self_.stop_,
|
||||||
|
finish_: function (){
|
||||||
|
console.log("estamos en buen camino");
|
||||||
|
self_.startAutoMode();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
playSong_(s_, ev_);
|
||||||
|
pointer_++;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', init_ ,false);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
var carnaval = new Carnaval();
|
27
carnaval.php
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Template Name: Carnavales
|
||||||
|
*
|
||||||
|
* A custom page template without sidebar.
|
||||||
|
*
|
||||||
|
* The "Template Name:" bit above allows this to be selectable
|
||||||
|
* from a dropdown menu on the edit page screen.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
get_header("carnaval"); ?>
|
||||||
|
<div id="container" class="one-column">
|
||||||
|
<div id="carnaval" role="main">
|
||||||
|
|
||||||
|
<?php
|
||||||
|
/* Run the loop to output the page.
|
||||||
|
* If you want to overload this in a child theme then include a file
|
||||||
|
* called loop-page.php and that will be used instead.
|
||||||
|
*/
|
||||||
|
get_template_part( 'loop', 'carnaval' );
|
||||||
|
?>
|
||||||
|
|
||||||
|
</div><!-- #content -->
|
||||||
|
</div><!-- #container -->
|
||||||
|
|
||||||
|
<?php get_footer("carnaval"); ?>
|
25
carnaval/.listing
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Feb 4 2013 .
|
||||||
|
drwxr-xr-x 6 wsoinuma psacln 4096 Feb 17 2014 ..
|
||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 antiscroll-master
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1016 Jan 25 2013 antiscroll.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 9563 Jan 25 2013 antiscroll.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 923 Jan 25 2013 back_black.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 97612 Jan 25 2013 c1.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 204385 Jan 25 2013 c2.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 218371 Jan 25 2013 c3.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 135394 Jan 25 2013 c4.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 372349 Jan 25 2013 c5.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 62287 Jan 25 2013 c6.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 115479 Jan 25 2013 c7.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 141231 Jan 25 2013 c8.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 22494 Jan 25 2013 header.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2058 Feb 4 2013 hotsPlayer.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1379 Jan 25 2013 icon_loading_dots.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 493 Jan 25 2013 icon_loading_spinner.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2506 Jan 25 2013 icon_loading_spinner_bigger.gif
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Feb 4 2013 img
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 166426 Jan 25 2013 inauteriak_back.jpg
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Feb 8 2013 js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 148230 Jan 25 2013 soundmanager2.js
|
||||||
|
drwxr-xr-x 8 wsoinuma psacln 4096 Jan 25 2013 soundmanagerv297a-20130101
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Feb 4 2013 swf
|
5
carnaval/antiscroll-master/.listing
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Feb 4 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 5397 Jan 25 2013 README.md
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 deps
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 12107 Jan 25 2013 index.html
|
149
carnaval/antiscroll-master/README.md
Normal file
@ -0,0 +1,149 @@
|
|||||||
|
# Antiscroll: cross-browser native OSX Lion scrollbars
|
||||||
|
|
||||||
|
Antiscroll fixes a fundamental problem JavaScript UI developers commonly face:
|
||||||
|
how do I customize scrollbars so that they get out of the way (for example, for
|
||||||
|
different form widgets), but retain their native scrolling properties (like OS
|
||||||
|
widge scrolling velocity, or OS specific inertia)?
|
||||||
|
|
||||||
|
Antiscroll addresses this issue by providing a cross-browser implementation of
|
||||||
|
the scrollbars popularized by OS X Lion that retains native properties.
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
- Supports mousewheels, trackpads, other input devices natively.
|
||||||
|
- Total size is **1kb** minified and gzipped.
|
||||||
|
- Doesn't magically autowrap your elements with divs (manual wrapping is necessary,
|
||||||
|
please see `index.html` demo)
|
||||||
|
- Fade in/out controlled with CSS3 animations.
|
||||||
|
- Shows scrollbars upon hovering.
|
||||||
|
- Scrollbars are draggable.
|
||||||
|
- Size of container can be dynamically adjusted and scrollbars will adapt.
|
||||||
|
- Supports IE7+, Firefox 3+, Chrome, Safari
|
||||||
|
|
||||||
|
## Demo
|
||||||
|
|
||||||
|
Please click [here](http://learnboost.github.com/antiscroll/) to see it in
|
||||||
|
action.
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
|
||||||
|
1. Wrap scrollable content with the class ```antiscroll-inner```
|
||||||
|
1. Wrap the above with the class ```antiscroll-wrap```
|
||||||
|
1. Include the following Javascript
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
$(function () {
|
||||||
|
$('.antiscroll-wrap').antiscroll();
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### Configuration
|
||||||
|
|
||||||
|
You may remove automatic scrollbar hiding by passing in a key-value to the ```antiscroll()``` function like so:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
$(function () {
|
||||||
|
$('.antiscroll-wrap').antiscroll({
|
||||||
|
autoHide: false
|
||||||
|
});
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
## What does it look like?
|
||||||
|
|
||||||
|
**Firefox 8 `overflow: scroll` and antiscroll on OS X**
|
||||||
|
|
||||||
|
![](http://f.cl.ly/items/3R0y1P1U3r2c0O3Z2533/Image%202011.11.23%208:42:51%20AM.png)
|
||||||
|
![](http://f.cl.ly/items/262V403n221p1F3T2S3K/Image%202011.11.23%208:43:32%20AM.png)
|
||||||
|
|
||||||
|
**IE 9 `overflow: scroll` and antiscroll**
|
||||||
|
|
||||||
|
![](http://f.cl.ly/items/0M0z2t2X42110X3R0313/Image%202011.11.23%2010:35:39%20AM.png)
|
||||||
|
|
||||||
|
## How does it work?
|
||||||
|
|
||||||
|
The idea behind Antiscroll is to leverage real scrollbars, but hide them from the
|
||||||
|
view. The implementation consists of 3 steps.
|
||||||
|
|
||||||
|
### 1. Measure scrollbars width
|
||||||
|
|
||||||
|
In order to measure scrollbars width we use the following technique:
|
||||||
|
|
||||||
|
1. Insert a div with a fixed width and measure the inner width
|
||||||
|
2. Force `overflow: scroll`
|
||||||
|
3. Measure the inner width. The difference is the scrollbar width
|
||||||
|
|
||||||
|
The caveat of this technique is precisely OSX Lion. Since the scrollbars
|
||||||
|
_float_ on top of the content, their width is always zero but they still
|
||||||
|
overlay your content. To address this issue we add an aditional step which
|
||||||
|
consists of declaring `::-webkit-scrollbar` and `::scrollbar` CSS
|
||||||
|
pseudo-properties that set the width of the scrollbars to zero for modern
|
||||||
|
browsers.
|
||||||
|
|
||||||
|
### 2. Adjust the width of the inner element
|
||||||
|
|
||||||
|
The parent element receives `overflow: hidden` and the desired width and height
|
||||||
|
for the widget.
|
||||||
|
|
||||||
|
The inner `.antiscroll-inner` element receives the same width and height, but
|
||||||
|
the script augments this two values with the size of the scrollbars,
|
||||||
|
effectively hiding them.
|
||||||
|
|
||||||
|
![](http://f.cl.ly/items/431G35281X3t052m3J1V/Image%202011.11.23%2010:42:52%20AM.png)
|
||||||
|
|
||||||
|
The inner element is always `overflow: scroll`.
|
||||||
|
|
||||||
|
### 3. Listen on the scroll event
|
||||||
|
|
||||||
|
We attach the `scroll` event to the scrollable element, and we create our
|
||||||
|
scrollbars as absolutely positioned divs. We update our scrollbars based on the
|
||||||
|
detected `scrollLeft` and `scrollTop` of the element.
|
||||||
|
|
||||||
|
## Credits
|
||||||
|
|
||||||
|
This technique was inspired by Facebook's chat sidebar/ticker, which also reproduces
|
||||||
|
Lion's scrollbars, but relying on setting the width of the inner container to an
|
||||||
|
arbitrarily large width, therefore allowing scrolling of a single axis
|
||||||
|
(vertical).
|
||||||
|
|
||||||
|
Scrollbar size detection based on the work of [Jonathan
|
||||||
|
Sharp](http://jdsharp.us/jQuery/minute/calculate-scrollbar-width.php).
|
||||||
|
|
||||||
|
## Dependencies
|
||||||
|
|
||||||
|
- [jQuery](http://github.com/jquery/query)
|
||||||
|
- [jquery-mousewheel](https://github.com/brandonaaron/jquery-mousewheel): optional,
|
||||||
|
only needed if you want to block further scrolling when you reach the boundaries
|
||||||
|
of scrollable element.
|
||||||
|
|
||||||
|
## TODO
|
||||||
|
|
||||||
|
- Automatically leverage Joe Hewitt's
|
||||||
|
[scrollability](https://github.com/joehewitt/scrollability) as a replacement
|
||||||
|
technique if a touch-enabled browser is detected.
|
||||||
|
- IE6 support
|
||||||
|
|
||||||
|
## License
|
||||||
|
|
||||||
|
(The MIT License)
|
||||||
|
|
||||||
|
Copyright (c) 2011 Guillermo Rauch <guillermo@learnboost.com>
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining
|
||||||
|
a copy of this software and associated documentation files (the
|
||||||
|
'Software'), to deal in the Software without restriction, including
|
||||||
|
without limitation the rights to use, copy, modify, merge, publish,
|
||||||
|
distribute, sublicense, and/or sell copies of the Software, and to
|
||||||
|
permit persons to whom the Software is furnished to do so, subject to
|
||||||
|
the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be
|
||||||
|
included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
|
||||||
|
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||||
|
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
||||||
|
IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
|
||||||
|
CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
|
||||||
|
TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
|
||||||
|
SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
4
carnaval/antiscroll-master/deps/.listing
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2235 Jan 25 2013 jquery-mousewheel.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 249158 Jan 25 2013 jquery.js
|
78
carnaval/antiscroll-master/deps/jquery-mousewheel.js
vendored
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
/*! Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net)
|
||||||
|
* Licensed under the MIT License (LICENSE.txt).
|
||||||
|
*
|
||||||
|
* Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
|
||||||
|
* Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
|
||||||
|
* Thanks to: Seamus Leahy for adding deltaX and deltaY
|
||||||
|
*
|
||||||
|
* Version: 3.0.4
|
||||||
|
*
|
||||||
|
* Requires: 1.2.2+
|
||||||
|
*/
|
||||||
|
|
||||||
|
(function($) {
|
||||||
|
|
||||||
|
var types = ['DOMMouseScroll', 'mousewheel'];
|
||||||
|
|
||||||
|
$.event.special.mousewheel = {
|
||||||
|
setup: function() {
|
||||||
|
if ( this.addEventListener ) {
|
||||||
|
for ( var i=types.length; i; ) {
|
||||||
|
this.addEventListener( types[--i], handler, false );
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.onmousewheel = handler;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
teardown: function() {
|
||||||
|
if ( this.removeEventListener ) {
|
||||||
|
for ( var i=types.length; i; ) {
|
||||||
|
this.removeEventListener( types[--i], handler, false );
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.onmousewheel = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$.fn.extend({
|
||||||
|
mousewheel: function(fn) {
|
||||||
|
return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
|
||||||
|
},
|
||||||
|
|
||||||
|
unmousewheel: function(fn) {
|
||||||
|
return this.unbind("mousewheel", fn);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
function handler(event) {
|
||||||
|
var orgEvent = event || window.event, args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true, deltaX = 0, deltaY = 0;
|
||||||
|
event = $.event.fix(orgEvent);
|
||||||
|
event.type = "mousewheel";
|
||||||
|
|
||||||
|
// Old school scrollwheel delta
|
||||||
|
if ( event.wheelDelta ) { delta = event.wheelDelta/120; }
|
||||||
|
if ( event.detail ) { delta = -event.detail/3; }
|
||||||
|
|
||||||
|
// New school multidimensional scroll (touchpads) deltas
|
||||||
|
deltaY = delta;
|
||||||
|
|
||||||
|
// Gecko
|
||||||
|
if ( orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
|
||||||
|
deltaY = 0;
|
||||||
|
deltaX = -1*delta;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Webkit
|
||||||
|
if ( orgEvent.wheelDeltaY !== undefined ) { deltaY = orgEvent.wheelDeltaY/120; }
|
||||||
|
if ( orgEvent.wheelDeltaX !== undefined ) { deltaX = -1*orgEvent.wheelDeltaX/120; }
|
||||||
|
|
||||||
|
// Add event and delta to the front of the arguments
|
||||||
|
args.unshift(event, delta, deltaX, deltaY);
|
||||||
|
|
||||||
|
return $.event.handle.apply(this, args);
|
||||||
|
}
|
||||||
|
|
||||||
|
})(jQuery);
|
9300
carnaval/antiscroll-master/deps/jquery.js
vendored
Normal file
304
carnaval/antiscroll-master/index.html
Normal file
@ -0,0 +1,304 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Antiscroll - os x lion style cross-browser native scrolling on the web that gets out of the way</title>
|
||||||
|
<link href="antiscroll.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
padding: 80px 100px;
|
||||||
|
font: 14px/1.4 'helvetica neue', helvetica, arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box {
|
||||||
|
background: #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box, .box .antiscroll-inner {
|
||||||
|
width: 250px;
|
||||||
|
height: 250px;
|
||||||
|
font: 14px Helvetica, Arial;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box-wrap {
|
||||||
|
margin: 20px 40px;
|
||||||
|
border: 1px solid #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box-inner {
|
||||||
|
background: #eee;
|
||||||
|
padding: 10px;
|
||||||
|
color: #999;
|
||||||
|
text-shadow: 0 1px 0 #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
-webkit-user-select: none;
|
||||||
|
display: block;
|
||||||
|
background: #3b88d8;
|
||||||
|
text-decoration: none;
|
||||||
|
background: -o-linear-gradient(0% 100% 90deg, #377ad0, #52a8e8);
|
||||||
|
background: -moz-linear-gradient(0% 100% 90deg, #377ad0, #52a8e8);
|
||||||
|
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#52a8e8), to(#377ad0));
|
||||||
|
border-top: 1px solid #4081af;
|
||||||
|
border-right: 1px solid #2e69a3;
|
||||||
|
border-bottom: 1px solid #20559a;
|
||||||
|
border-left: 1px solid #2e69a3;
|
||||||
|
-moz-border-radius: 16px;
|
||||||
|
-webkit-border-radius: 16px;
|
||||||
|
border-radius: 16px;
|
||||||
|
-moz-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
|
||||||
|
-webkit-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
|
||||||
|
box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
|
||||||
|
color: #fff;
|
||||||
|
font-family: "lucida grande", sans-serif;
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 1;
|
||||||
|
padding: 3px 0 5px 0;
|
||||||
|
text-align: center;
|
||||||
|
text-shadow: 0 -1px 1px #3275bc;
|
||||||
|
width: 112px;
|
||||||
|
-webkit-background-clip: padding-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button:hover {
|
||||||
|
background: #2a81d7;
|
||||||
|
background: -o-linear-gradient(0% 100% 90deg, #206bcb, #3e9ee5);
|
||||||
|
background: -moz-linear-gradient(0% 100% 90deg, #206bcb, #3e9ee5);
|
||||||
|
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#3e9ee5), to(#206bcb));
|
||||||
|
border-top: 1px solid #2a73a6;
|
||||||
|
border-right: 1px solid #165899;
|
||||||
|
border-bottom: 1px solid #07428f;
|
||||||
|
border-left: 1px solid #165899;
|
||||||
|
-moz-box-shadow: inset 0 1px 0 0 #62b1e9;
|
||||||
|
-webkit-box-shadow: inset 0 1px 0 0 #62b1e9;
|
||||||
|
cursor: pointer;
|
||||||
|
text-shadow: 0 -1px 1px #1d62ab;
|
||||||
|
-webkit-background-clip: padding-box;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button:active {
|
||||||
|
background: #3282d3;
|
||||||
|
border: 1px solid #154c8c;
|
||||||
|
border-bottom: 1px solid #0e408e;
|
||||||
|
-moz-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 #fff;
|
||||||
|
-webkit-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 #fff;
|
||||||
|
box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 #fff;
|
||||||
|
text-shadow: 0 -1px 1px #2361a4;
|
||||||
|
-webkit-background-clip: padding-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul#features {
|
||||||
|
margin: 40px 0;
|
||||||
|
padding: 0 20px;
|
||||||
|
float: left;
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul#features li {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
padding: 0 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul li {
|
||||||
|
margin: 0 5px;
|
||||||
|
padding: 3px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action {
|
||||||
|
color: #0069d6;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action:hover {
|
||||||
|
color: #00438a;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<script src="deps/jquery.js"></script>
|
||||||
|
<script src="deps/jquery-mousewheel.js"></script>
|
||||||
|
<script src="antiscroll.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
scroller = $('.box-wrap').antiscroll().data('antiscroll');
|
||||||
|
|
||||||
|
$("#addRow").click(function() {
|
||||||
|
$('.box-wrap tr:last').clone().appendTo('.box-wrap table');
|
||||||
|
$("#rows b").text($(".box-wrap tr").length);
|
||||||
|
scroller.refresh();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#removeRow").click(function() {
|
||||||
|
$('.box-wrap tr:last').remove();
|
||||||
|
$("#rows b").text($(".box-wrap tr").length);
|
||||||
|
scroller.refresh();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#addCol").click(function() {
|
||||||
|
$('.box-wrap tr').each(function(index, tr) {
|
||||||
|
$('td:last', tr).clone().appendTo(tr);
|
||||||
|
});
|
||||||
|
$("#cols b").text($(".box-wrap tr:last td").length);
|
||||||
|
scroller.refresh();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#removeCol").click(function() {
|
||||||
|
$('.box-wrap tr').find('td:last').remove();
|
||||||
|
$("#cols b").text($(".box-wrap tr:last td").length);
|
||||||
|
scroller.refresh();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#rows b").text($(".box-wrap tr").length);
|
||||||
|
$("#cols b").text($(".box-wrap tr:last td").length);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="page">
|
||||||
|
<h1>Antiscroll</h1>
|
||||||
|
<p>os x lion style cross-browser native scrolling on the web that gets out of the way.</p>
|
||||||
|
<ul id="features">
|
||||||
|
<li>supports mousewheels, trackpads, other input devices natively.</li>
|
||||||
|
<li>total size is <b>1kb</b> minified and gzipped.</li>
|
||||||
|
<li>doesn't magically autowrap your elements with divs (manual wrapping is necessary, please see index.html demo).</li>
|
||||||
|
<li>fade in/out controlled with CSS3 animations.</li>
|
||||||
|
<li>shows scrollbars upon hovering.</li>
|
||||||
|
<li>scrollbars are draggable.</li>
|
||||||
|
<li>size of container can be dynamically adjusted and scrollbars will adapt.</li>
|
||||||
|
<li>supports IE7+, Firefox 3+, Chrome, Safari, Opera</li>
|
||||||
|
</ul>
|
||||||
|
<div class="box-wrap antiscroll-wrap">
|
||||||
|
<div class="box">
|
||||||
|
<div class="antiscroll-inner">
|
||||||
|
<div class="box-inner">
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
<td>Body</td><td>Body</td><td>Body</td><td>Body</td><td>Body</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<br style="clear: both">
|
||||||
|
<a href="https://github.com/learnboost/antiscroll/downloads" class="button">Download</a>
|
||||||
|
|
||||||
|
<br />
|
||||||
|
|
||||||
|
<p id="rows"><b>X</b> rows</p>
|
||||||
|
<ul>
|
||||||
|
<li><a class="action" id="addRow" >Add row</a></li>
|
||||||
|
<li><a class="action" id="removeRow">Remove row</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p id="cols"><b>X</b> cols</p>
|
||||||
|
</ul>
|
||||||
|
<li><a class="action" id="addCol" >Add col</a></li>
|
||||||
|
<li><a class="action" id="removeCol">Remove col</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
50
carnaval/antiscroll.css
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
.antiscroll-wrap {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.antiscroll-scrollbar {
|
||||||
|
background: #eee;
|
||||||
|
background: rgba(255, 255, 255, 0.5);
|
||||||
|
-webkit-border-radius: 7px;
|
||||||
|
-moz-border-radius: 7px;
|
||||||
|
border-radius: 7px;
|
||||||
|
-webkit-box-shadow: 0 0 1px #fff;
|
||||||
|
-moz-box-shadow: 0 0 1px #fff;
|
||||||
|
box-shadow: 0 0 1px #fff;
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
|
||||||
|
-webkit-transition: linear 300ms opacity;
|
||||||
|
-moz-transition: linear 300ms opacity;
|
||||||
|
-o-transition: linear 300ms opacity;
|
||||||
|
}
|
||||||
|
|
||||||
|
.antiscroll-scrollbar-shown {
|
||||||
|
opacity: 1;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
|
||||||
|
}
|
||||||
|
|
||||||
|
.antiscroll-scrollbar-horizontal {
|
||||||
|
height: 7px;
|
||||||
|
margin-left: 2px;
|
||||||
|
bottom: 2px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.antiscroll-scrollbar-vertical {
|
||||||
|
width: 7px;
|
||||||
|
margin-top: 2px;
|
||||||
|
right: 2px;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.antiscroll-inner {
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
.antiscroll-inner::-webkit-scrollbar, .antiscroll-inner::scrollbar {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
441
carnaval/antiscroll.js
Normal file
@ -0,0 +1,441 @@
|
|||||||
|
|
||||||
|
(function ($) {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Augment jQuery prototype.
|
||||||
|
*/
|
||||||
|
|
||||||
|
$.fn.antiscroll = function (options) {
|
||||||
|
return this.each(function () {
|
||||||
|
if ($(this).data('antiscroll')) {
|
||||||
|
$(this).data('antiscroll').destroy();
|
||||||
|
}
|
||||||
|
|
||||||
|
$(this).data('antiscroll', new $.Antiscroll(this, options));
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Expose constructor.
|
||||||
|
*/
|
||||||
|
|
||||||
|
$.Antiscroll = Antiscroll;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Antiscroll pane constructor.
|
||||||
|
*
|
||||||
|
* @param {Element|jQuery} main pane
|
||||||
|
* @parma {Object} options
|
||||||
|
* @api public
|
||||||
|
*/
|
||||||
|
|
||||||
|
function Antiscroll (el, opts) {
|
||||||
|
this.el = $(el);
|
||||||
|
this.options = opts || {};
|
||||||
|
|
||||||
|
this.x = false !== this.options.x;
|
||||||
|
this.y = false !== this.options.y;
|
||||||
|
this.padding = undefined == this.options.padding ? 2 : this.options.padding;
|
||||||
|
|
||||||
|
this.inner = this.el.find('.antiscroll-inner');
|
||||||
|
this.inner.css({
|
||||||
|
'width': '+=' + scrollbarSize()
|
||||||
|
, 'height': '+=' + scrollbarSize()
|
||||||
|
});
|
||||||
|
|
||||||
|
this.refresh();
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* refresh scrollbars
|
||||||
|
*
|
||||||
|
* @api public
|
||||||
|
*/
|
||||||
|
|
||||||
|
Antiscroll.prototype.refresh = function() {
|
||||||
|
var needHScroll = this.inner.get(0).scrollWidth > this.el.width()
|
||||||
|
, needVScroll = this.inner.get(0).scrollHeight > this.el.height();
|
||||||
|
|
||||||
|
if (!this.horizontal && needHScroll && this.x) {
|
||||||
|
this.horizontal = new Scrollbar.Horizontal(this);
|
||||||
|
} else if (this.horizontal && !needHScroll) {
|
||||||
|
this.horizontal.destroy();
|
||||||
|
this.horizontal = null
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!this.vertical && needVScroll && this.y) {
|
||||||
|
this.vertical = new Scrollbar.Vertical(this);
|
||||||
|
} else if (this.vertical && !needVScroll) {
|
||||||
|
this.vertical.destroy();
|
||||||
|
this.vertical = null
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Cleans up.
|
||||||
|
*
|
||||||
|
* @return {Antiscroll} for chaining
|
||||||
|
* @api public
|
||||||
|
*/
|
||||||
|
|
||||||
|
Antiscroll.prototype.destroy = function () {
|
||||||
|
if (this.horizontal) {
|
||||||
|
this.horizontal.destroy();
|
||||||
|
}
|
||||||
|
if (this.vertical) {
|
||||||
|
this.vertical.destroy();
|
||||||
|
}
|
||||||
|
return this;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Rebuild Antiscroll.
|
||||||
|
*
|
||||||
|
* @return {Antiscroll} for chaining
|
||||||
|
* @api public
|
||||||
|
*/
|
||||||
|
|
||||||
|
Antiscroll.prototype.rebuild = function () {
|
||||||
|
this.destroy();
|
||||||
|
this.inner.attr('style', '');
|
||||||
|
Antiscroll.call(this, this.el, this.options);
|
||||||
|
return this;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Scrollbar constructor.
|
||||||
|
*
|
||||||
|
* @param {Element|jQuery} element
|
||||||
|
* @api public
|
||||||
|
*/
|
||||||
|
|
||||||
|
function Scrollbar (pane) {
|
||||||
|
this.pane = pane;
|
||||||
|
this.pane.el.append(this.el);
|
||||||
|
this.innerEl = this.pane.inner.get(0);
|
||||||
|
|
||||||
|
this.dragging = false;
|
||||||
|
this.enter = false;
|
||||||
|
this.shown = false;
|
||||||
|
|
||||||
|
// hovering
|
||||||
|
this.pane.el.mouseenter($.proxy(this, 'mouseenter'));
|
||||||
|
this.pane.el.mouseleave($.proxy(this, 'mouseleave'));
|
||||||
|
|
||||||
|
// dragging
|
||||||
|
this.el.mousedown($.proxy(this, 'mousedown'));
|
||||||
|
|
||||||
|
// scrolling
|
||||||
|
this.pane.inner.scroll($.proxy(this, 'scroll'));
|
||||||
|
|
||||||
|
// wheel -optional-
|
||||||
|
this.pane.inner.bind('mousewheel', $.proxy(this, 'mousewheel'));
|
||||||
|
|
||||||
|
// show
|
||||||
|
var initialDisplay = this.pane.options.initialDisplay;
|
||||||
|
|
||||||
|
if (initialDisplay !== false) {
|
||||||
|
this.show();
|
||||||
|
this.hiding = setTimeout($.proxy(this, 'hide'), parseInt(initialDisplay, 10) || 3000);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Cleans up.
|
||||||
|
*
|
||||||
|
* @return {Scrollbar} for chaining
|
||||||
|
* @api public
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.destroy = function () {
|
||||||
|
this.el.remove();
|
||||||
|
return this;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon mouseenter.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.mouseenter = function () {
|
||||||
|
this.enter = true;
|
||||||
|
this.show();
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon mouseleave.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.mouseleave = function () {
|
||||||
|
this.enter = false;
|
||||||
|
|
||||||
|
if (!this.dragging) {
|
||||||
|
this.hide();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon wrap scroll.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.scroll = function () {
|
||||||
|
if (!this.shown) {
|
||||||
|
this.show();
|
||||||
|
if (!this.enter && !this.dragging) {
|
||||||
|
this.hiding = setTimeout($.proxy(this, 'hide'), 1500);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.update();
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon scrollbar mousedown.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.mousedown = function (ev) {
|
||||||
|
ev.preventDefault();
|
||||||
|
|
||||||
|
this.dragging = true;
|
||||||
|
|
||||||
|
this.startPageY = ev.pageY - parseInt(this.el.css('top'), 10);
|
||||||
|
this.startPageX = ev.pageX - parseInt(this.el.css('left'), 10);
|
||||||
|
|
||||||
|
// prevent crazy selections on IE
|
||||||
|
document.onselectstart = function () { return false; };
|
||||||
|
|
||||||
|
var pane = this.pane
|
||||||
|
, move = $.proxy(this, 'mousemove')
|
||||||
|
, self = this
|
||||||
|
|
||||||
|
$(document)
|
||||||
|
.mousemove(move)
|
||||||
|
.mouseup(function () {
|
||||||
|
self.dragging = false;
|
||||||
|
document.onselectstart = null;
|
||||||
|
|
||||||
|
$(document).unbind('mousemove', move);
|
||||||
|
|
||||||
|
if (!self.enter) {
|
||||||
|
self.hide();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show scrollbar.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.show = function (duration) {
|
||||||
|
if (!this.shown) {
|
||||||
|
this.update();
|
||||||
|
this.el.addClass('antiscroll-scrollbar-shown');
|
||||||
|
if (this.hiding) {
|
||||||
|
clearTimeout(this.hiding);
|
||||||
|
this.hiding = null;
|
||||||
|
}
|
||||||
|
this.shown = true;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Hide scrollbar.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.prototype.hide = function () {
|
||||||
|
var autoHide = this.pane.options.autoHide;
|
||||||
|
if (autoHide !== false && this.shown) {
|
||||||
|
// check for dragging
|
||||||
|
this.el.removeClass('antiscroll-scrollbar-shown');
|
||||||
|
this.shown = false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Horizontal scrollbar constructor
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Horizontal = function (pane) {
|
||||||
|
this.el = $('<div class="antiscroll-scrollbar antiscroll-scrollbar-horizontal">');
|
||||||
|
Scrollbar.call(this, pane);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Inherits from Scrollbar.
|
||||||
|
*/
|
||||||
|
|
||||||
|
inherits(Scrollbar.Horizontal, Scrollbar);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Updates size/position of scrollbar.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Horizontal.prototype.update = function () {
|
||||||
|
var paneWidth = this.pane.el.width()
|
||||||
|
, trackWidth = paneWidth - this.pane.padding * 2
|
||||||
|
, innerEl = this.pane.inner.get(0)
|
||||||
|
|
||||||
|
this.el
|
||||||
|
.css('width', trackWidth * paneWidth / innerEl.scrollWidth)
|
||||||
|
.css('left', trackWidth * innerEl.scrollLeft / innerEl.scrollWidth)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon drag.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Horizontal.prototype.mousemove = function (ev) {
|
||||||
|
var trackWidth = this.pane.el.width() - this.pane.padding * 2
|
||||||
|
, pos = ev.pageX - this.startPageX
|
||||||
|
, barWidth = this.el.width()
|
||||||
|
, innerEl = this.pane.inner.get(0)
|
||||||
|
|
||||||
|
// minimum top is 0, maximum is the track height
|
||||||
|
var y = Math.min(Math.max(pos, 0), trackWidth - barWidth)
|
||||||
|
|
||||||
|
innerEl.scrollLeft = (innerEl.scrollWidth - this.pane.el.width())
|
||||||
|
* y / (trackWidth - barWidth)
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon container mousewheel.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Horizontal.prototype.mousewheel = function (ev, delta, x, y) {
|
||||||
|
if ((x < 0 && 0 == this.pane.inner.get(0).scrollLeft) ||
|
||||||
|
(x > 0 && (this.innerEl.scrollLeft + Math.ceil(this.pane.el.width())
|
||||||
|
== this.innerEl.scrollWidth))) {
|
||||||
|
ev.preventDefault();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Vertical scrollbar constructor
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Vertical = function (pane) {
|
||||||
|
this.el = $('<div class="antiscroll-scrollbar antiscroll-scrollbar-vertical">');
|
||||||
|
Scrollbar.call(this, pane);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Inherits from Scrollbar.
|
||||||
|
*/
|
||||||
|
|
||||||
|
inherits(Scrollbar.Vertical, Scrollbar);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Updates size/position of scrollbar.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Vertical.prototype.update = function () {
|
||||||
|
var paneHeight = this.pane.el.height()
|
||||||
|
, trackHeight = paneHeight - this.pane.padding * 2
|
||||||
|
, innerEl = this.innerEl
|
||||||
|
|
||||||
|
this.el
|
||||||
|
.css('height', trackHeight * paneHeight / innerEl.scrollHeight)
|
||||||
|
.css('top', trackHeight * innerEl.scrollTop / innerEl.scrollHeight)
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon drag.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Vertical.prototype.mousemove = function (ev) {
|
||||||
|
var paneHeight = this.pane.el.height()
|
||||||
|
, trackHeight = paneHeight - this.pane.padding * 2
|
||||||
|
, pos = ev.pageY - this.startPageY
|
||||||
|
, barHeight = this.el.height()
|
||||||
|
, innerEl = this.innerEl
|
||||||
|
|
||||||
|
// minimum top is 0, maximum is the track height
|
||||||
|
var y = Math.min(Math.max(pos, 0), trackHeight - barHeight)
|
||||||
|
|
||||||
|
innerEl.scrollTop = (innerEl.scrollHeight - paneHeight)
|
||||||
|
* y / (trackHeight - barHeight)
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Called upon container mousewheel.
|
||||||
|
*
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
Scrollbar.Vertical.prototype.mousewheel = function (ev, delta, x, y) {
|
||||||
|
if ((y > 0 && 0 == this.innerEl.scrollTop) ||
|
||||||
|
(y < 0 && (this.innerEl.scrollTop + Math.ceil(this.pane.el.height())
|
||||||
|
== this.innerEl.scrollHeight))) {
|
||||||
|
ev.preventDefault();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Cross-browser inheritance.
|
||||||
|
*
|
||||||
|
* @param {Function} constructor
|
||||||
|
* @param {Function} constructor we inherit from
|
||||||
|
* @api private
|
||||||
|
*/
|
||||||
|
|
||||||
|
function inherits (ctorA, ctorB) {
|
||||||
|
function f() {};
|
||||||
|
f.prototype = ctorB.prototype;
|
||||||
|
ctorA.prototype = new f;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Scrollbar size detection.
|
||||||
|
*/
|
||||||
|
|
||||||
|
var size;
|
||||||
|
|
||||||
|
function scrollbarSize () {
|
||||||
|
if (size === undefined) {
|
||||||
|
var div = $(
|
||||||
|
'<div style="width:50px;height:50px;overflow:hidden;'
|
||||||
|
+ 'position:absolute;top:-200px;left:-200px;"><div style="height:100px;">'
|
||||||
|
+ '</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
$('body').append(div);
|
||||||
|
|
||||||
|
var w1 = $('div', div).innerWidth();
|
||||||
|
div.css('overflow-y', 'scroll');
|
||||||
|
var w2 = $('div', div).innerWidth();
|
||||||
|
$(div).remove();
|
||||||
|
|
||||||
|
size = w1 - w2;
|
||||||
|
}
|
||||||
|
|
||||||
|
return size;
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
BIN
carnaval/back_black.png
Normal file
After Width: | Height: | Size: 923 B |
BIN
carnaval/c1.jpg
Normal file
After Width: | Height: | Size: 95 KiB |
BIN
carnaval/c2.jpg
Normal file
After Width: | Height: | Size: 200 KiB |
BIN
carnaval/c3.jpg
Normal file
After Width: | Height: | Size: 213 KiB |
BIN
carnaval/c4.jpg
Normal file
After Width: | Height: | Size: 132 KiB |
BIN
carnaval/c5.jpg
Normal file
After Width: | Height: | Size: 364 KiB |
BIN
carnaval/c6.jpg
Normal file
After Width: | Height: | Size: 61 KiB |
BIN
carnaval/c7.jpg
Normal file
After Width: | Height: | Size: 113 KiB |
BIN
carnaval/c8.jpg
Normal file
After Width: | Height: | Size: 138 KiB |
BIN
carnaval/header.png
Normal file
After Width: | Height: | Size: 22 KiB |
92
carnaval/hotsPlayer.css
Normal file
@ -0,0 +1,92 @@
|
|||||||
|
.hotsPlayer-controls{
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls *{
|
||||||
|
-webkit-transition: all .4s ease;
|
||||||
|
-moz-transition: all .4s ease;
|
||||||
|
-o-transition: all .4s ease;
|
||||||
|
transition: all .4s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
#player{
|
||||||
|
background-color: black;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
.hotsPlayer-controls .hotsControl{
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-play a{
|
||||||
|
background: url(img/play.png) no-repeat center top;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-play.pause a{
|
||||||
|
background: url(img/pause.png) no-repeat center top;
|
||||||
|
}
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-random a{
|
||||||
|
background: url(img/shuffle.png) no-repeat left top;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-random.active a{
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-next a{
|
||||||
|
background: url(img/play-next.png) no-repeat left top;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-prev a{
|
||||||
|
background: url(img/play-prev.png) no-repeat left top;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-down a{
|
||||||
|
background: url(img/down.png) no-repeat left top;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-vol-down a{
|
||||||
|
background: url(img/volumen-low.png) no-repeat left top;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-vol-up a{
|
||||||
|
background: url(img/volumen-high.png) no-repeat left top;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-random a:hover,
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-next a:hover,
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-prev a:hover,
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-down a:hover,
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-vol-down a:hover,
|
||||||
|
.hotsPlayer-controls .hotsPlayer-controls-vol-up a:hover{
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
BIN
carnaval/icon_loading_dots.gif
Normal file
After Width: | Height: | Size: 1.3 KiB |
BIN
carnaval/icon_loading_spinner.gif
Normal file
After Width: | Height: | Size: 493 B |
BIN
carnaval/icon_loading_spinner_bigger.gif
Normal file
After Width: | Height: | Size: 2.4 KiB |
10
carnaval/img/.listing
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Feb 4 2013 .
|
||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Feb 4 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1220 Feb 4 2013 down.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 179 Feb 4 2013 pause.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1201 Feb 4 2013 play-next.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1197 Feb 4 2013 play-prev.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 306 Feb 4 2013 play.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1198 Feb 4 2013 shuffle.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1278 Feb 4 2013 volumen-high.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1255 Feb 4 2013 volumen-low.png
|
BIN
carnaval/img/down.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
carnaval/img/pause.png
Normal file
After Width: | Height: | Size: 179 B |
BIN
carnaval/img/play-next.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
carnaval/img/play-prev.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
carnaval/img/play.png
Normal file
After Width: | Height: | Size: 306 B |
BIN
carnaval/img/shuffle.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
carnaval/img/volumen-high.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
carnaval/img/volumen-low.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
carnaval/inauteriak_back.jpg
Normal file
After Width: | Height: | Size: 162 KiB |
7
carnaval/js/.listing
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Feb 8 2013 .
|
||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Feb 4 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 714 Feb 8 2013 carnaval.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 16394 Feb 8 2013 hotsPlayer.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 53295 Jan 25 2013 jquery.jkit.1.1.13.min.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 218611 Feb 4 2013 paper.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 47390 Jan 25 2013 soundmanager2-jsmin.js
|
31
carnaval/js/carnaval.js
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
|
||||||
|
soundManager.url = '/wp-content/themes/soundmap/carnaval/swf/';
|
||||||
|
|
||||||
|
|
||||||
|
var songChanged = function(evt){
|
||||||
|
var target = evt.info.target;
|
||||||
|
var id = target.dataset.id;
|
||||||
|
var data = {
|
||||||
|
action: 'soundmap_theme_get_post',
|
||||||
|
post_id: id,
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
// since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
|
||||||
|
jQuery.post(WP_Params.ajaxurl + '?lang=' + WP_Params.language, data, function(response) {
|
||||||
|
jQuery('#info-wrapper').empty().append(response);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
jQuery(document).ready(function(){
|
||||||
|
jQuery('body').jKit();
|
||||||
|
jQuery('.antiscroll-wrap').antiscroll();
|
||||||
|
hotsPlayer.draw();
|
||||||
|
hotsPlayer.registerEvent('startPlay', songChanged);
|
||||||
|
|
||||||
|
//hotsPlayer.registerEvent('startPlay', onSongStarted);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
518
carnaval/js/hotsPlayer.js
Normal file
@ -0,0 +1,518 @@
|
|||||||
|
|
||||||
|
function HotsPlayer(){
|
||||||
|
|
||||||
|
var self = this,
|
||||||
|
pl = this,
|
||||||
|
sm = soundManager; // soundManager instance
|
||||||
|
|
||||||
|
this.files = [];
|
||||||
|
this.sounds = [];
|
||||||
|
this.graphicPaths = {};
|
||||||
|
this.ready = false;
|
||||||
|
this.listeners = [];
|
||||||
|
|
||||||
|
this.config = {
|
||||||
|
playerDomID: '#player',
|
||||||
|
playerWidth: 200,
|
||||||
|
playerHeight: 100,
|
||||||
|
canvasHeight:200,
|
||||||
|
canvasWidth:300,
|
||||||
|
autoPlay: true,
|
||||||
|
filesDomID: '#track-list',
|
||||||
|
buttonHeight: 10,
|
||||||
|
volume: 80,
|
||||||
|
random: false,
|
||||||
|
graphic: {
|
||||||
|
circleWidth: 20,
|
||||||
|
waitColor: 'white',
|
||||||
|
loadedColor: 'red',
|
||||||
|
playedColor: 'green',
|
||||||
|
controlsColor: '#333333',
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
this.currentTime = 0;
|
||||||
|
this.currentDuration = 0;
|
||||||
|
this.currentBytes = 0;
|
||||||
|
this.currentTotalBytes = 0;
|
||||||
|
this.state = 'waiting';
|
||||||
|
this.currentIndex = -1;
|
||||||
|
|
||||||
|
this.events = {
|
||||||
|
onfinish: function() {
|
||||||
|
self.playNext();
|
||||||
|
},
|
||||||
|
whileplaying: function() {
|
||||||
|
self.currentTime = this.position;
|
||||||
|
self.currentDuration = this.durationEstimate;
|
||||||
|
self.redrawPlay();
|
||||||
|
},
|
||||||
|
whileloading: function() {
|
||||||
|
self.currentBytes = this.bytesLoaded;
|
||||||
|
self.currentTotalBytes = this.bytesTotal;
|
||||||
|
self.redrawLoad();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
this.playNext = function() {
|
||||||
|
var pos = self.currentIndex + 1;
|
||||||
|
if (pos == self.sounds.length){
|
||||||
|
pos = 0;
|
||||||
|
}
|
||||||
|
if (self.config.random){
|
||||||
|
pos = Math.floor((Math.random()*(self.sounds.length -1 )) + 0);
|
||||||
|
}
|
||||||
|
self.startPlay(pos);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.playPrevious = function() {
|
||||||
|
var pos = self.currentIndex - 1;
|
||||||
|
if (pos == -1 ){
|
||||||
|
pos = self.sounds.length - 1;
|
||||||
|
}
|
||||||
|
if (self.config.random){
|
||||||
|
pos = Math.floor((Math.random()*(self.sounds.length -1 )) + 0);
|
||||||
|
}
|
||||||
|
self.startPlay(pos);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.redrawLoad = function() {
|
||||||
|
var graphics = self.config.graphic;
|
||||||
|
var path = self.config.graphic.loadingBar;
|
||||||
|
var radius = self.config.graphic.loadingRadius;
|
||||||
|
path.remove();
|
||||||
|
if(self.currentBytes ==self.currentTotalBytes ){
|
||||||
|
//path = self.drawArc(radius, 100, 100);
|
||||||
|
}else{
|
||||||
|
path = self.drawArc(radius, self.currentBytes, self.currentTotalBytes);
|
||||||
|
path.strokeColor = graphics.loadedColor;
|
||||||
|
path.strokeWidth = graphics.circleWidth - 5;
|
||||||
|
path.opacity = 0.6;
|
||||||
|
self.config.graphic.loadingBar = path;
|
||||||
|
}
|
||||||
|
paper.view.draw();
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
this.redrawPlay = function() {
|
||||||
|
var graphics = self.config.graphic;
|
||||||
|
var angle = (2 * Math.PI) / self.currentDuration;
|
||||||
|
var path = self.config.graphic.playingBar;
|
||||||
|
var radius = self.config.graphic.playingRadius;
|
||||||
|
path.remove();
|
||||||
|
paper.view.draw();
|
||||||
|
path = self.drawArc(radius, self.currentTime, self.currentDuration);
|
||||||
|
path.strokeColor = graphics.playedColor;
|
||||||
|
path.strokeWidth = graphics.circleWidth - 5 ;
|
||||||
|
path.opacity = 0.6;
|
||||||
|
self.config.graphic.playingBar = path;
|
||||||
|
paper.view.draw();
|
||||||
|
};
|
||||||
|
|
||||||
|
this.init = function() {
|
||||||
|
|
||||||
|
self.loadSongs(self.config.filesDomID);
|
||||||
|
self.loadSounds();
|
||||||
|
|
||||||
|
self.autoStart();
|
||||||
|
self.ready = true;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.startPlay = function(index){
|
||||||
|
var song = self.files[index];
|
||||||
|
self.clearBars();
|
||||||
|
sm.play(song.id, {volume:self.config.volume});
|
||||||
|
self.currentIndex = index;
|
||||||
|
self.state = 'playing';
|
||||||
|
var uri = song.file;
|
||||||
|
jQuery('.hotsPlayer-controls-down a', self.config.playerDomID).attr('href', uri);
|
||||||
|
var evt = {};
|
||||||
|
evt.target = self.activeFile(song.id);
|
||||||
|
self.trigger('startPlay', evt);
|
||||||
|
jQuery('.hotsPlayer-controls-play', self.config.playerDomID).addClass('pause');
|
||||||
|
};
|
||||||
|
|
||||||
|
this.activeFile = function(songID) {
|
||||||
|
jQuery(self.config.filesDomID + ' a').removeClass('active');
|
||||||
|
var idRoto = songID.split('_');
|
||||||
|
var active = jQuery(self.config.filesDomID + ' a[data-id="' + idRoto[1] + '"]');
|
||||||
|
active.addClass('active');
|
||||||
|
return active[0];
|
||||||
|
}
|
||||||
|
|
||||||
|
this.clearBars = function() {
|
||||||
|
var path = self.config.graphic.playingBar;
|
||||||
|
var loadPath = self.config.graphic.loadingBar;
|
||||||
|
path.remove();
|
||||||
|
loadPath.remove();
|
||||||
|
paper.view.draw();
|
||||||
|
};
|
||||||
|
|
||||||
|
this.starPlayByID = function(songID){
|
||||||
|
sm.play(songID, {volume:self.config.volume});
|
||||||
|
var index = self.searchByIndex(songID);
|
||||||
|
self.clearBars();
|
||||||
|
self.currentIndex = index;
|
||||||
|
self.state = 'playing';
|
||||||
|
var song = self.files[index];
|
||||||
|
var uri = song.file;
|
||||||
|
jQuery('.hotsPlayer-controls-down a', self.config.playerDomID).attr('href', uri);
|
||||||
|
jQuery('.hotsPlayer-controls-play', self.config.playerDomID).addClass('pause');
|
||||||
|
var evt = {};
|
||||||
|
evt.target = self.activeFile(song.id);
|
||||||
|
self.trigger('startPlay', evt);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.searchByIndex = function(id) {
|
||||||
|
var salir = false;
|
||||||
|
var pos = 0;
|
||||||
|
while(!salir && pos < self.files.length){
|
||||||
|
if (self.files[pos].id == id){
|
||||||
|
salir = true;
|
||||||
|
}else{
|
||||||
|
pos += 1;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
return pos;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.stop = function(){
|
||||||
|
if (self.state == "playing" || self.state == "paused"){
|
||||||
|
var song = self.files[self.currentIndex];
|
||||||
|
sm.stop(song.id);
|
||||||
|
self.state = 'waiting';
|
||||||
|
jQuery('.hotsPlayer-controls-play', self.config.playerDomID).removeClass('pause');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.handleClick = function(e){
|
||||||
|
var elemento = e.currentTarget;
|
||||||
|
var tipoControl = elemento.dataset.controlType;
|
||||||
|
|
||||||
|
switch (tipoControl){
|
||||||
|
case 'play':
|
||||||
|
e.preventDefault();
|
||||||
|
if (self.state == 'waiting'){
|
||||||
|
if (self.currentIndex == -1){
|
||||||
|
self.startPlay(0);
|
||||||
|
}else{
|
||||||
|
self.startPlay(self.currentIndex);
|
||||||
|
}
|
||||||
|
}else if (self.state == "playing"){
|
||||||
|
self.pause();
|
||||||
|
}else if (self.state == 'paused'){
|
||||||
|
self.resume();
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
case 'random':
|
||||||
|
e.preventDefault();
|
||||||
|
if (self.config.random){
|
||||||
|
jQuery('.hotsPlayer-controls-random', self.config.playerDomID).removeClass('active');
|
||||||
|
self.config.random = false;
|
||||||
|
}else{
|
||||||
|
jQuery('.hotsPlayer-controls-random', self.config.playerDomID).addClass('active');
|
||||||
|
self.config.random = true;
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
case 'next':
|
||||||
|
e.preventDefault();
|
||||||
|
self.stop();
|
||||||
|
self.playNext();
|
||||||
|
break;
|
||||||
|
case 'prev':
|
||||||
|
e.preventDefault();
|
||||||
|
self.stop();
|
||||||
|
self.playPrevious();
|
||||||
|
case 'down':
|
||||||
|
break;
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
this.resume = function() {
|
||||||
|
var song = self.files[self.currentIndex];
|
||||||
|
sm.resume(song.id);
|
||||||
|
self.state = 'playing';
|
||||||
|
jQuery('.hotsPlayer-controls-play', self.config.playerDomID).addClass('pause');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.pause = function() {
|
||||||
|
var song = self.files[self.currentIndex];
|
||||||
|
sm.pause(song.id);
|
||||||
|
self.state = 'paused';
|
||||||
|
jQuery('.hotsPlayer-controls-play', self.config.playerDomID).removeClass('pause');
|
||||||
|
};
|
||||||
|
|
||||||
|
this.draw = function() {
|
||||||
|
// Create an empty project and a view for the canvas:
|
||||||
|
self.insertDomElements();
|
||||||
|
var t =jQuery('canvas', self.config.playerDomID);
|
||||||
|
paper.setup(jQuery('canvas', self.config.playerDomID)[0]);
|
||||||
|
var graphics = self.config.graphic;
|
||||||
|
var centerX = self.config.canvasWidth / 2;
|
||||||
|
var centerY = self.config.canvasHeight / 2;
|
||||||
|
var radius = (((self.config.playerWidth < self.config.playerHeight) ? self.config.playerWidth : self.config.playerHeight ) / 2) - (graphics.circleWidth/2);
|
||||||
|
graphics.radius = radius;
|
||||||
|
graphics.centerX = centerX;
|
||||||
|
graphics.centerY = centerY;
|
||||||
|
|
||||||
|
var waitCircle = new paper.Path.Circle(new paper.Point(centerX,centerY), radius);
|
||||||
|
waitCircle.strokeColor ='white';
|
||||||
|
waitCircle.strokeWidth = graphics.circleWidth;
|
||||||
|
|
||||||
|
//Positioning Controls
|
||||||
|
|
||||||
|
var alturaCirculo = (radius * 2) + 24;
|
||||||
|
var espacio = (alturaCirculo - (self.config.buttonHeight * 4)) / 3;
|
||||||
|
|
||||||
|
jQuery(self.config.playerDomID).width(self.config.canvasWidth).height(self.config.canvasHeight).css('position', 'relative');
|
||||||
|
jQuery('.hotsPlayer-controls').width(self.config.canvasWidth).height(self.config.canvasHeight);
|
||||||
|
jQuery('.hotsPlayer-controls-play', self.config.playerDomID).css('top', centerY-10).css('left',centerX-10).height(20).width(20);
|
||||||
|
var top = centerY - radius - self.config.buttonHeight;
|
||||||
|
var left = centerX + radius + 18;
|
||||||
|
jQuery('.hotsPlayer-controls-random', self.config.playerDomID).css('top',top).css('left', left - 15);
|
||||||
|
|
||||||
|
if (self.config.random){
|
||||||
|
jQuery('.hotsPlayer-controls-random', self.config.playerDomID).addClass('active');
|
||||||
|
}
|
||||||
|
|
||||||
|
top += espacio + self.config.buttonHeight;
|
||||||
|
jQuery('.hotsPlayer-controls-next', self.config.playerDomID).css('top',top).css('left', left);
|
||||||
|
top += espacio + self.config.buttonHeight;
|
||||||
|
jQuery('.hotsPlayer-controls-prev', self.config.playerDomID).css('top',top).css('left', left);
|
||||||
|
top += espacio + self.config.buttonHeight;
|
||||||
|
jQuery('.hotsPlayer-controls-down', self.config.playerDomID).css('top',top).css('left', left - 15);
|
||||||
|
left = centerX - radius - 18 - self.config.buttonHeight;
|
||||||
|
top = centerY - radius - 10;
|
||||||
|
jQuery('.hotsPlayer-controls-vol-up', self.config.playerDomID).css('top',top).css('left', left);
|
||||||
|
top += espacio * 3 + self.config.buttonHeight * 3;
|
||||||
|
jQuery('.hotsPlayer-controls-vol-down', self.config.playerDomID).css('top',top).css('left', left);
|
||||||
|
|
||||||
|
jQuery('.hotsPlayer-controls>div>a').click(self.handleClick);
|
||||||
|
|
||||||
|
var volumenBackBar = new paper.Path.Line(new paper.Point(left + 5, centerY - radius + 10 ), new paper.Point(left + 5,centerY + radius - 10));
|
||||||
|
|
||||||
|
volumenBackBar.strokeWidth = 8;
|
||||||
|
volumenBackBar.strokeColor = 'white';
|
||||||
|
volumenBackBar.opacity = 0.4;
|
||||||
|
var distanciaVolumen = (centerY + radius - 10) - (centerY - radius + 10);
|
||||||
|
var longitudBarra = (distanciaVolumen / 100) * self.config.volume;
|
||||||
|
var volumenBar = new paper.Path.Line(new paper.Point(left + 5, centerY + radius - 10), new paper.Point(left + 5, centerY + radius - 10 - longitudBarra));
|
||||||
|
volumenBar.strokeWidth = 8;
|
||||||
|
volumenBar.strokeColor = 'white';
|
||||||
|
volumenBar.opacity = 0.6;
|
||||||
|
|
||||||
|
var playRadius = radius -10;
|
||||||
|
var start = new paper.Point(centerX, centerY - playRadius);
|
||||||
|
|
||||||
|
var pR = new paper.Path.Arc(start, start, start);
|
||||||
|
pR.strokeColor = 'red';
|
||||||
|
pR.strokeWidth = 25;
|
||||||
|
pR.opacity = 0.6;
|
||||||
|
|
||||||
|
graphics.loadingBar = pR;
|
||||||
|
graphics.loadingRadius = radius - 10;
|
||||||
|
|
||||||
|
var sR = radius +5 ;
|
||||||
|
|
||||||
|
start = new paper.Point(centerX, centerY - sR);
|
||||||
|
//end = new paper.Point(centerX, centerY + sR);
|
||||||
|
//through = new paper.Point(centerX + sR, centerY);
|
||||||
|
var nn = new paper.Path.Arc(start, start, start);
|
||||||
|
nn.strokeColor = 'green';
|
||||||
|
nn.strokeWidth = 15;
|
||||||
|
nn.opacity = 0.6;
|
||||||
|
|
||||||
|
graphics.playingBar = nn;
|
||||||
|
graphics.playingRadius = radius + 6;
|
||||||
|
|
||||||
|
|
||||||
|
paper.view.draw();
|
||||||
|
|
||||||
|
self.autoStart();
|
||||||
|
self.ready = true;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
this.drawArc = function(radio, valor, total){
|
||||||
|
|
||||||
|
|
||||||
|
var centerX = self.config.graphic.centerX;
|
||||||
|
var centerY = self.config.graphic.centerY;
|
||||||
|
var ratio = (valor % total)/ total;
|
||||||
|
|
||||||
|
var angulo =Math.round(360 * ratio);
|
||||||
|
|
||||||
|
var vPoint = new paper.Point({length: radio, angle:-90});
|
||||||
|
var start = new paper.Point(centerX + vPoint.x, centerY + vPoint.y);
|
||||||
|
var middle = vPoint.rotate(angulo/2);
|
||||||
|
var end = vPoint.rotate(angulo);
|
||||||
|
var middlePoint = new paper.Point(centerX + middle.x, centerY + middle.y);
|
||||||
|
var endPoint = new paper.Point(centerX + end.x, centerY + end.y);
|
||||||
|
|
||||||
|
|
||||||
|
return new paper.Path.Arc(start, middlePoint, endPoint);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
this.autoStart = function() {
|
||||||
|
if (self.ready && self.config.autoPlay) {
|
||||||
|
self.startPlay(0);
|
||||||
|
//window.setInterval(function(){self.currentTime = self.currentTime + 2; self.currentDuration = 50; self.redrawPlay();},1000);
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
this.insertDomElements = function() {
|
||||||
|
|
||||||
|
var playerDom = jQuery(self.config.playerDomID);
|
||||||
|
|
||||||
|
var canvas = document.createElement('canvas');
|
||||||
|
canvas.height = self.config.canvasHeight;
|
||||||
|
canvas.width = self.config.canvasWidth;
|
||||||
|
|
||||||
|
var controls = document.createElement('div');
|
||||||
|
controls.className="hotsPlayer-controls";
|
||||||
|
|
||||||
|
var controlPlay = document.createElement('div');
|
||||||
|
controlPlay.className="hotsPlayer-controls-play hotsControl";
|
||||||
|
var controlPlayLink = document.createElement('a');
|
||||||
|
controlPlayLink.dataset.controlType = "play";
|
||||||
|
controlPlayLink.href="#";
|
||||||
|
controlPlay.appendChild(controlPlayLink);
|
||||||
|
|
||||||
|
var controlRandom = document.createElement('div');
|
||||||
|
controlRandom.className = 'hotsPlayer-controls-random hotsControl';
|
||||||
|
var controlRandomLink = document.createElement('a');
|
||||||
|
controlRandomLink.dataset.controlType = "random";
|
||||||
|
controlRandomLink.href="#";
|
||||||
|
controlRandom.appendChild(controlRandomLink);
|
||||||
|
|
||||||
|
var controlNext = document.createElement('div');
|
||||||
|
controlNext.className = 'hotsPlayer-controls-next hotsControl'
|
||||||
|
var controlNextLink = document.createElement('a');
|
||||||
|
controlNextLink.dataset.controlType = "next";
|
||||||
|
controlNextLink.href="#";
|
||||||
|
controlNext.appendChild(controlNextLink);
|
||||||
|
|
||||||
|
var controlPrev = document.createElement('div');
|
||||||
|
controlPrev.className = 'hotsPlayer-controls-prev hotsControl'
|
||||||
|
var controlPrevLink = document.createElement('a');
|
||||||
|
controlPrevLink.dataset.controlType = "prev";
|
||||||
|
controlPrevLink.href="#";
|
||||||
|
controlPrev.appendChild(controlPrevLink);
|
||||||
|
|
||||||
|
var controlDown = document.createElement('div');
|
||||||
|
controlDown.className = 'hotsPlayer-controls-down hotsControl'
|
||||||
|
var controlDownLink = document.createElement('a');
|
||||||
|
controlDownLink.dataset.controlType = "down";
|
||||||
|
controlDownLink.href="#";
|
||||||
|
controlDown.appendChild(controlDownLink);
|
||||||
|
|
||||||
|
var controlVolDown = document.createElement('div');
|
||||||
|
controlVolDown.className = 'hotsPlayer-controls-vol-down hotsControl'
|
||||||
|
var controlVolDownLink = document.createElement('a');
|
||||||
|
controlVolDownLink.dataset.controlType = "vol-down";
|
||||||
|
controlVolDownLink.href="#";
|
||||||
|
controlVolDown.appendChild(controlVolDownLink);
|
||||||
|
|
||||||
|
var controlVolUp = document.createElement('div');
|
||||||
|
controlVolUp.className = 'hotsPlayer-controls-vol-up hotsControl'
|
||||||
|
var controlVolUpLink = document.createElement('a');
|
||||||
|
controlVolUpLink.dataset.controlType = "vol-up";
|
||||||
|
controlVolUpLink.href="#";
|
||||||
|
controlVolUp.appendChild(controlVolUpLink);
|
||||||
|
|
||||||
|
controls.appendChild(controlPlay);
|
||||||
|
controls.appendChild(controlRandom);
|
||||||
|
controls.appendChild(controlNext);
|
||||||
|
controls.appendChild(controlPrev);
|
||||||
|
controls.appendChild(controlDown);
|
||||||
|
controls.appendChild(controlVolDown);
|
||||||
|
controls.appendChild(controlVolUp);
|
||||||
|
|
||||||
|
playerDom.append(canvas);
|
||||||
|
playerDom.append(controls);
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
this.loadSounds = function() {
|
||||||
|
this.sounds = [];
|
||||||
|
for(var i in this.files)
|
||||||
|
{
|
||||||
|
var song = this.files[i];
|
||||||
|
this.sounds.push(sm.createSound({
|
||||||
|
id: song.id,
|
||||||
|
url: song.file,
|
||||||
|
volume: self.config.volume,
|
||||||
|
onfinish: self.events.onfinish,
|
||||||
|
whileplaying: self.events.whileplaying,
|
||||||
|
whileloading: self.events.whileloading
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.handleFileClick = function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var elemento = e.currentTarget;
|
||||||
|
var id = elemento.dataset.id;
|
||||||
|
self.changeSong('hotsPlayer_' + id);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.changeSong = function(songID) {
|
||||||
|
self.stop();
|
||||||
|
self.starPlayByID(songID);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.loadSongs = function(filesDomID) {
|
||||||
|
var files = [];
|
||||||
|
if(filesDomID == null){
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
jQuery(filesDomID + ' a').click(self.handleFileClick);
|
||||||
|
|
||||||
|
jQuery(filesDomID + ' a').each(function (index, Element){
|
||||||
|
var link = Element.href;
|
||||||
|
var songID = Element.dataset.id;
|
||||||
|
self.files.push({
|
||||||
|
file : link,
|
||||||
|
id : 'hotsPlayer_' + songID
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
this.registerEvent = function(type, func){
|
||||||
|
if (func != null) {
|
||||||
|
var listeners = self.listeners[type];
|
||||||
|
if (!listeners) {
|
||||||
|
listeners = [];
|
||||||
|
self.listeners[type] = listeners;
|
||||||
|
}
|
||||||
|
var listener = {func: func};
|
||||||
|
listeners.push(listener);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.trigger = function(type, obj) {
|
||||||
|
var listeners = self.listeners[type];
|
||||||
|
if (listeners) {
|
||||||
|
var callback = listeners[0];
|
||||||
|
var evt = {};
|
||||||
|
evt.obj = self;
|
||||||
|
evt.info = obj;
|
||||||
|
callback.func.apply(self, [evt]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
} // Function HostsPlayer
|
||||||
|
|
||||||
|
paper.install(window);
|
||||||
|
|
||||||
|
var hotsPlayer;
|
||||||
|
hotsPlayer = new HotsPlayer();
|
||||||
|
|
||||||
|
|
||||||
|
// hook into SM2 init
|
||||||
|
soundManager.onready(hotsPlayer.init);
|
11
carnaval/js/jquery.jkit.1.1.13.min.js
vendored
Normal file
7842
carnaval/js/paper.js
Normal file
104
carnaval/js/soundmanager2-jsmin.js
Normal file
@ -0,0 +1,104 @@
|
|||||||
|
/** @license
|
||||||
|
|
||||||
|
|
||||||
|
SoundManager 2: JavaScript Sound for the Web
|
||||||
|
----------------------------------------------
|
||||||
|
http://schillmania.com/projects/soundmanager2/
|
||||||
|
|
||||||
|
Copyright (c) 2007, Scott Schiller. All rights reserved.
|
||||||
|
Code provided under the BSD License:
|
||||||
|
http://schillmania.com/projects/soundmanager2/license.txt
|
||||||
|
|
||||||
|
V2.97a.20111220
|
||||||
|
*/
|
||||||
|
(function(G){function W(W,la){function l(b){return function(a){var d=this._t;return!d||!d._a?(d&&d.sID?c._wD(k+"ignoring "+a.type+": "+d.sID):c._wD(k+"ignoring "+a.type),null):b.call(this,a)}}this.flashVersion=8;this.debugMode=!0;this.debugFlash=!1;this.consoleOnly=this.useConsole=!0;this.waitForWindowLoad=!1;this.bgColor="#ffffff";this.useHighPerformance=!1;this.html5PollingInterval=this.flashPollingInterval=null;this.flashLoadTimeout=1E3;this.wmode=null;this.allowScriptAccess="always";this.useFlashBlock=
|
||||||
|
!1;this.useHTML5Audio=!0;this.html5Test=/^(probably|maybe)$/i;this.preferFlash=!0;this.noSWFCache=!1;this.audioFormats={mp3:{type:['audio/mpeg; codecs="mp3"',"audio/mpeg","audio/mp3","audio/MPA","audio/mpa-robust"],required:!0},mp4:{related:["aac","m4a"],type:['audio/mp4; codecs="mp4a.40.2"',"audio/aac","audio/x-m4a","audio/MP4A-LATM","audio/mpeg4-generic"],required:!1},ogg:{type:["audio/ogg; codecs=vorbis"],required:!1},wav:{type:['audio/wav; codecs="1"',"audio/wav","audio/wave","audio/x-wav"],required:!1}};
|
||||||
|
this.defaultOptions={autoLoad:!1,autoPlay:!1,from:null,loops:1,onid3:null,onload:null,whileloading:null,onplay:null,onpause:null,onresume:null,whileplaying:null,onposition:null,onstop:null,onfailure:null,onfinish:null,multiShot:!0,multiShotEvents:!1,position:null,pan:0,stream:!0,to:null,type:null,usePolicyFile:!1,volume:100};this.flash9Options={isMovieStar:null,usePeakData:!1,useWaveformData:!1,useEQData:!1,onbufferchange:null,ondataerror:null};this.movieStarOptions={bufferTime:3,serverURL:null,onconnect:null,
|
||||||
|
duration:null};this.movieID="sm2-container";this.id=la||"sm2movie";this.debugID="soundmanager-debug";this.debugURLParam=/([#?&])debug=1/i;this.versionNumber="V2.97a.20111220";this.movieURL=this.version=null;this.url=W||null;this.altURL=null;this.enabled=this.swfLoaded=!1;this.oMC=null;this.sounds={};this.soundIDs=[];this.didFlashBlock=this.muted=!1;this.filePattern=null;this.filePatterns={flash8:/\.mp3(\?.*)?$/i,flash9:/\.mp3(\?.*)?$/i};this.features={buffering:!1,peakData:!1,waveformData:!1,eqData:!1,
|
||||||
|
movieStar:!1};this.sandbox={type:null,types:{remote:"remote (domain-based) rules",localWithFile:"local with file access (no internet access)",localWithNetwork:"local with network (internet access only, no local access)",localTrusted:"local, trusted (local+internet access)"},description:null,noRemote:null,noLocal:null};var ma;try{ma="undefined"!==typeof Audio&&"undefined"!==typeof(new Audio).canPlayType}catch(fb){ma=!1}this.hasHTML5=ma;this.html5={usingFlash:null};this.flash={};this.ignoreFlash=this.html5Only=
|
||||||
|
!1;var Ea,c=this,i=null,k="HTML5::",u,p=navigator.userAgent,j=G,O=j.location.href.toString(),h=document,na,X,m,B=[],oa=!0,w,P=!1,Q=!1,n=!1,y=!1,Y=!1,o,Za=0,R,v,pa,H,I,Z,Fa,qa,E,$,aa,J,ra,sa,ba,ca,K,Ga,ta,$a=["log","info","warn","error"],Ha,da,Ia,S=null,ua=null,q,va,L,Ja,ea,fa,wa,s,ga=!1,xa=!1,Ka,La,Ma,ha=0,T=null,ia,z=null,Na,ja,U,C,ya,za,Oa,r,Pa=Array.prototype.slice,F=!1,t,ka,Qa,A,Ra,Aa=p.match(/(ipad|iphone|ipod)/i),ab=p.match(/firefox/i),bb=p.match(/droid/i),D=p.match(/msie/i),cb=p.match(/webkit/i),
|
||||||
|
V=p.match(/safari/i)&&!p.match(/chrome/i),db=p.match(/opera/i),Ba=p.match(/(mobile|pre\/|xoom)/i)||Aa,Ca=!O.match(/usehtml5audio/i)&&!O.match(/sm2\-ignorebadua/i)&&V&&!p.match(/silk/i)&&p.match(/OS X 10_6_([3-7])/i),Sa="undefined"!==typeof console&&"undefined"!==typeof console.log,Da="undefined"!==typeof h.hasFocus?h.hasFocus():null,M=V&&"undefined"===typeof h.hasFocus,Ta=!M,Ua=/(mp3|mp4|mpa)/i,N=h.location?h.location.protocol.match(/http/i):null,Va=!N?"http://":"",Wa=/^\s*audio\/(?:x-)?(?:mpeg4|aac|flv|mov|mp4||m4v|m4a|mp4v|3gp|3g2)\s*(?:$|;)/i,
|
||||||
|
Xa="mpeg4,aac,flv,mov,mp4,m4v,f4v,m4a,mp4v,3gp,3g2".split(","),eb=RegExp("\\.("+Xa.join("|")+")(\\?.*)?$","i");this.mimePattern=/^\s*audio\/(?:x-)?(?:mp(?:eg|3))\s*(?:$|;)/i;this.useAltURL=!N;this._global_a=null;if(Ba&&(c.useHTML5Audio=!0,c.preferFlash=!1,Aa))F=c.ignoreFlash=!0;this.supported=this.ok=function(){return z?n&&!y:c.useHTML5Audio&&c.hasHTML5};this.getMovie=function(c){return u(c)||h[c]||j[c]};this.createSound=function(b){function a(){f=ea(f);c.sounds[e.id]=new Ea(e);c.soundIDs.push(e.id);
|
||||||
|
return c.sounds[e.id]}var d,f=null,e=d=null;d="soundManager.createSound(): "+q(!n?"notReady":"notOK");if(!n||!c.ok())return wa(d),!1;2===arguments.length&&(b={id:arguments[0],url:arguments[1]});f=v(b);f.url=ia(f.url);e=f;e.id.toString().charAt(0).match(/^[0-9]$/)&&c._wD("soundManager.createSound(): "+q("badID",e.id),2);c._wD("soundManager.createSound(): "+e.id+" ("+e.url+")",1);if(s(e.id,!0))return c._wD("soundManager.createSound(): "+e.id+" exists",1),c.sounds[e.id];if(ja(e))d=a(),c._wD("Loading sound "+
|
||||||
|
e.id+" via HTML5"),d._setup_html5(e);else{if(8<m){if(null===e.isMovieStar)e.isMovieStar=e.serverURL||(e.type?e.type.match(Wa):!1)||e.url.match(eb);e.isMovieStar&&c._wD("soundManager.createSound(): using MovieStar handling");if(e.isMovieStar){if(e.usePeakData)o("noPeak"),e.usePeakData=!1;1<e.loops&&o("noNSLoop")}}e=fa(e,"soundManager.createSound(): ");d=a();if(8===m)i._createSound(e.id,e.loops||1,e.usePolicyFile);else if(i._createSound(e.id,e.url,e.usePeakData,e.useWaveformData,e.useEQData,e.isMovieStar,
|
||||||
|
e.isMovieStar?e.bufferTime:!1,e.loops||1,e.serverURL,e.duration||null,e.autoPlay,!0,e.autoLoad,e.usePolicyFile),!e.serverURL)d.connected=!0,e.onconnect&&e.onconnect.apply(d);!e.serverURL&&(e.autoLoad||e.autoPlay)&&d.load(e)}!e.serverURL&&e.autoPlay&&d.play();return d};this.destroySound=function(b,a){if(!s(b))return!1;var d=c.sounds[b],f;d._iO={};d.stop();d.unload();for(f=0;f<c.soundIDs.length;f++)if(c.soundIDs[f]===b){c.soundIDs.splice(f,1);break}a||d.destruct(!0);delete c.sounds[b];return!0};this.load=
|
||||||
|
function(b,a){return!s(b)?!1:c.sounds[b].load(a)};this.unload=function(b){return!s(b)?!1:c.sounds[b].unload()};this.onposition=this.onPosition=function(b,a,d,f){return!s(b)?!1:c.sounds[b].onposition(a,d,f)};this.clearOnPosition=function(b,a,d){return!s(b)?!1:c.sounds[b].clearOnPosition(a,d)};this.start=this.play=function(b,a){if(!n||!c.ok())return wa("soundManager.play(): "+q(!n?"notReady":"notOK")),!1;if(!s(b)){a instanceof Object||(a={url:a});return a&&a.url?(c._wD('soundManager.play(): attempting to create "'+
|
||||||
|
b+'"',1),a.id=b,c.createSound(a).play()):!1}return c.sounds[b].play(a)};this.setPosition=function(b,a){return!s(b)?!1:c.sounds[b].setPosition(a)};this.stop=function(b){if(!s(b))return!1;c._wD("soundManager.stop("+b+")",1);return c.sounds[b].stop()};this.stopAll=function(){var b;c._wD("soundManager.stopAll()",1);for(b in c.sounds)c.sounds.hasOwnProperty(b)&&c.sounds[b].stop()};this.pause=function(b){return!s(b)?!1:c.sounds[b].pause()};this.pauseAll=function(){var b;for(b=c.soundIDs.length;b--;)c.sounds[c.soundIDs[b]].pause()};
|
||||||
|
this.resume=function(b){return!s(b)?!1:c.sounds[b].resume()};this.resumeAll=function(){var b;for(b=c.soundIDs.length;b--;)c.sounds[c.soundIDs[b]].resume()};this.togglePause=function(b){return!s(b)?!1:c.sounds[b].togglePause()};this.setPan=function(b,a){return!s(b)?!1:c.sounds[b].setPan(a)};this.setVolume=function(b,a){return!s(b)?!1:c.sounds[b].setVolume(a)};this.mute=function(b){var a=0;"string"!==typeof b&&(b=null);if(b){if(!s(b))return!1;c._wD('soundManager.mute(): Muting "'+b+'"');return c.sounds[b].mute()}c._wD("soundManager.mute(): Muting all sounds");
|
||||||
|
for(a=c.soundIDs.length;a--;)c.sounds[c.soundIDs[a]].mute();return c.muted=!0};this.muteAll=function(){c.mute()};this.unmute=function(b){"string"!==typeof b&&(b=null);if(b){if(!s(b))return!1;c._wD('soundManager.unmute(): Unmuting "'+b+'"');return c.sounds[b].unmute()}c._wD("soundManager.unmute(): Unmuting all sounds");for(b=c.soundIDs.length;b--;)c.sounds[c.soundIDs[b]].unmute();c.muted=!1;return!0};this.unmuteAll=function(){c.unmute()};this.toggleMute=function(b){return!s(b)?!1:c.sounds[b].toggleMute()};
|
||||||
|
this.getMemoryUse=function(){var c=0;i&&8!==m&&(c=parseInt(i._getMemoryUse(),10));return c};this.disable=function(b){var a;"undefined"===typeof b&&(b=!1);if(y)return!1;y=!0;o("shutdown",1);for(a=c.soundIDs.length;a--;)Ha(c.sounds[c.soundIDs[a]]);R(b);r.remove(j,"load",I);return!0};this.canPlayMIME=function(b){var a;c.hasHTML5&&(a=U({type:b}));return!z||a?a:b?!!(8<m&&b.match(Wa)||b.match(c.mimePattern)):null};this.canPlayURL=function(b){var a;c.hasHTML5&&(a=U({url:b}));return!z||a?a:b?!!b.match(c.filePattern):
|
||||||
|
null};this.canPlayLink=function(b){return"undefined"!==typeof b.type&&b.type&&c.canPlayMIME(b.type)?!0:c.canPlayURL(b.href)};this.getSoundById=function(b,a){if(!b)throw Error("soundManager.getSoundById(): sID is null/undefined");var d=c.sounds[b];!d&&!a&&c._wD('"'+b+'" is an invalid sound ID.',2);return d};this.onready=function(b,a){if(b&&b instanceof Function)return n&&c._wD(q("queue","onready")),a||(a=j),pa("onready",b,a),H(),!0;throw q("needFunction","onready");};this.ontimeout=function(b,a){if(b&&
|
||||||
|
b instanceof Function)return n&&c._wD(q("queue","ontimeout")),a||(a=j),pa("ontimeout",b,a),H({type:"ontimeout"}),!0;throw q("needFunction","ontimeout");};this._wD=this._writeDebug=function(b,a,d){var f,e;if(!c.debugMode)return!1;"undefined"!==typeof d&&d&&(b=b+" | "+(new Date).getTime());if(Sa&&c.useConsole){d=$a[a];if("undefined"!==typeof console[d])console[d](b);else console.log(b);if(c.consoleOnly)return!0}try{f=u("soundmanager-debug");if(!f)return!1;e=h.createElement("div");if(0===++Za%2)e.className=
|
||||||
|
"sm2-alt";a="undefined"===typeof a?0:parseInt(a,10);e.appendChild(h.createTextNode(b));if(a){if(2<=a)e.style.fontWeight="bold";if(3===a)e.style.color="#ff3333"}f.insertBefore(e,f.firstChild)}catch(i){}return!0};this._debug=function(){var b,a;o("currentObj",1);for(b=0,a=c.soundIDs.length;b<a;b++)c.sounds[c.soundIDs[b]]._debug()};this.reboot=function(){c._wD("soundManager.reboot()");c.soundIDs.length&&c._wD("Destroying "+c.soundIDs.length+" SMSound objects...");var b,a;for(b=c.soundIDs.length;b--;)c.sounds[c.soundIDs[b]].destruct();
|
||||||
|
try{if(D)ua=i.innerHTML;S=i.parentNode.removeChild(i);c._wD("Flash movie removed.")}catch(d){o("badRemove",2)}ua=S=z=null;c.enabled=sa=n=ga=xa=P=Q=y=c.swfLoaded=!1;c.soundIDs=c.sounds=[];i=null;for(b in B)if(B.hasOwnProperty(b))for(a=B[b].length;a--;)B[b][a].fired=!1;c._wD("soundManager: Rebooting...");j.setTimeout(c.beginDelayedInit,20)};this.getMoviePercent=function(){return i&&"undefined"!==typeof i.PercentLoaded?i.PercentLoaded():null};this.beginDelayedInit=function(){Y=!0;J();setTimeout(function(){if(xa)return!1;
|
||||||
|
ca();aa();return xa=!0},20);Z()};this.destruct=function(){c._wD("soundManager.destruct()");c.disable(!0)};Ea=function(b){var a=this,d,f,e,h,g,Ya,j=!1,x=[],l=0,n,r,p=null,t=null,u=null;this.sID=b.id;this.url=b.url;this._iO=this.instanceOptions=this.options=v(b);this.pan=this.options.pan;this.volume=this.options.volume;this.isHTML5=!1;this._a=null;this.id3={};this._debug=function(){if(c.debugMode){var b=null,e=[],d,f;for(b in a.options)null!==a.options[b]&&(a.options[b]instanceof Function?(d=a.options[b].toString(),
|
||||||
|
d=d.replace(/\s\s+/g," "),f=d.indexOf("{"),e.push(" "+b+": {"+d.substr(f+1,Math.min(Math.max(d.indexOf("\n")-1,64),64)).replace(/\n/g,"")+"... }")):e.push(" "+b+": "+a.options[b]));c._wD("SMSound() merged options: {\n"+e.join(", \n")+"\n}")}};this._debug();this.load=function(b){var d=null;if("undefined"!==typeof b)a._iO=v(b,a.options),a.instanceOptions=a._iO;else if(b=a.options,a._iO=b,a.instanceOptions=a._iO,p&&p!==a.url)o("manURL"),a._iO.url=a.url,a.url=null;if(!a._iO.url)a._iO.url=a.url;a._iO.url=
|
||||||
|
ia(a._iO.url);c._wD("SMSound.load(): "+a._iO.url,1);if(a._iO.url===a.url&&0!==a.readyState&&2!==a.readyState)return o("onURL",1),3===a.readyState&&a._iO.onload&&a._iO.onload.apply(a,[!!a.duration]),a;b=a._iO;p=a.url;a.loaded=!1;a.readyState=1;a.playState=0;if(ja(b))d=a._setup_html5(b),d._called_load?c._wD(k+"ignoring request to load again: "+a.sID):(c._wD(k+"load: "+a.sID),a._html5_canplay=!1,a._a.autobuffer="auto",a._a.preload="auto",d.load(),d._called_load=!0,b.autoPlay&&a.play());else try{a.isHTML5=
|
||||||
|
!1,a._iO=fa(ea(b)),b=a._iO,8===m?i._load(a.sID,b.url,b.stream,b.autoPlay,b.whileloading?1:0,b.loops||1,b.usePolicyFile):i._load(a.sID,b.url,!!b.stream,!!b.autoPlay,b.loops||1,!!b.autoLoad,b.usePolicyFile)}catch(e){o("smError",2),w("onload",!1),K({type:"SMSOUND_LOAD_JS_EXCEPTION",fatal:!0})}return a};this.unload=function(){0!==a.readyState&&(c._wD('SMSound.unload(): "'+a.sID+'"'),a.isHTML5?(h(),a._a&&(a._a.pause(),ya(a._a))):8===m?i._unload(a.sID,"about:blank"):i._unload(a.sID),d());return a};this.destruct=
|
||||||
|
function(b){c._wD('SMSound.destruct(): "'+a.sID+'"');if(a.isHTML5){if(h(),a._a)a._a.pause(),ya(a._a),F||e(),a._a._t=null,a._a=null}else a._iO.onfailure=null,i._destroySound(a.sID);b||c.destroySound(a.sID,!0)};this.start=this.play=function(b,d){var e,d=void 0===d?!0:d;b||(b={});a._iO=v(b,a._iO);a._iO=v(a._iO,a.options);a._iO.url=ia(a._iO.url);a.instanceOptions=a._iO;if(a._iO.serverURL&&!a.connected)return a.getAutoPlay()||(c._wD("SMSound.play(): Netstream not connected yet - setting autoPlay"),a.setAutoPlay(!0)),
|
||||||
|
a;ja(a._iO)&&(a._setup_html5(a._iO),g());if(1===a.playState&&!a.paused)if(e=a._iO.multiShot)c._wD('SMSound.play(): "'+a.sID+'" already playing (multi-shot)',1);else return c._wD('SMSound.play(): "'+a.sID+'" already playing (one-shot)',1),a;if(a.loaded)c._wD('SMSound.play(): "'+a.sID+'"');else if(0===a.readyState){c._wD('SMSound.play(): Attempting to load "'+a.sID+'"',1);if(!a.isHTML5)a._iO.autoPlay=!0;a.load(a._iO)}else{if(2===a.readyState)return c._wD('SMSound.play(): Could not load "'+a.sID+'" - exiting',
|
||||||
|
2),a;c._wD('SMSound.play(): "'+a.sID+'" is loading - attempting to play..',1)}if(!a.isHTML5&&9===m&&0<a.position&&a.position===a.duration)c._wD('SMSound.play(): "'+a.sID+'": Sound at end, resetting to position:0'),b.position=0;if(a.paused&&a.position&&0<a.position)c._wD('SMSound.play(): "'+a.sID+'" is resuming from paused state',1),a.resume();else{a._iO=v(b,a._iO);if(null!==a._iO.from&&null!==a._iO.to&&0===a.instanceCount&&0===a.playState&&!a._iO.serverURL){e=function(){a._iO=v(b,a._iO);a.play(a._iO)};
|
||||||
|
if(a.isHTML5&&!a._html5_canplay)return c._wD('SMSound.play(): Beginning load of "'+a.sID+'" for from/to case'),a.load({_oncanplay:e}),!1;if(!a.isHTML5&&!a.loaded&&(!a.readyState||2!==a.readyState))return c._wD('SMSound.play(): Preloading "'+a.sID+'" for from/to case'),a.load({onload:e}),!1;a._iO=r()}c._wD('SMSound.play(): "'+a.sID+'" is starting to play');(!a.instanceCount||a._iO.multiShotEvents||!a.isHTML5&&8<m&&!a.getAutoPlay())&&a.instanceCount++;0===a.playState&&a._iO.onposition&&Ya(a);a.playState=
|
||||||
|
1;a.paused=!1;a.position="undefined"!==typeof a._iO.position&&!isNaN(a._iO.position)?a._iO.position:0;if(!a.isHTML5)a._iO=fa(ea(a._iO));a._iO.onplay&&d&&(a._iO.onplay.apply(a),j=!0);a.setVolume(a._iO.volume,!0);a.setPan(a._iO.pan,!0);a.isHTML5?(g(),e=a._setup_html5(),a.setPosition(a._iO.position),e.play()):i._start(a.sID,a._iO.loops||1,9===m?a._iO.position:a._iO.position/1E3)}return a};this.stop=function(c){var b=a._iO;if(1===a.playState){a._onbufferchange(0);a._resetOnPosition(0);a.paused=!1;if(!a.isHTML5)a.playState=
|
||||||
|
0;n();b.to&&a.clearOnPosition(b.to);if(a.isHTML5){if(a._a)c=a.position,a.setPosition(0),a.position=c,a._a.pause(),a.playState=0,a._onTimer(),h()}else i._stop(a.sID,c),b.serverURL&&a.unload();a.instanceCount=0;a._iO={};b.onstop&&b.onstop.apply(a)}return a};this.setAutoPlay=function(b){c._wD("sound "+a.sID+" turned autoplay "+(b?"on":"off"));a._iO.autoPlay=b;a.isHTML5||(i._setAutoPlay(a.sID,b),b&&!a.instanceCount&&1===a.readyState&&(a.instanceCount++,c._wD("sound "+a.sID+" incremented instance count to "+
|
||||||
|
a.instanceCount)))};this.getAutoPlay=function(){return a._iO.autoPlay};this.setPosition=function(b){void 0===b&&(b=0);var d=a.isHTML5?Math.max(b,0):Math.min(a.duration||a._iO.duration,Math.max(b,0));a.position=d;b=a.position/1E3;a._resetOnPosition(a.position);a._iO.position=d;if(a.isHTML5){if(a._a)if(a._html5_canplay){if(a._a.currentTime!==b){c._wD("setPosition("+b+"): setting position");try{a._a.currentTime=b,(0===a.playState||a.paused)&&a._a.pause()}catch(e){c._wD("setPosition("+b+"): setting position failed: "+
|
||||||
|
e.message,2)}}}else c._wD("setPosition("+b+"): delaying, sound not ready")}else b=9===m?a.position:b,a.readyState&&2!==a.readyState&&i._setPosition(a.sID,b,a.paused||!a.playState);a.isHTML5&&a.paused&&a._onTimer(!0);return a};this.pause=function(b){if(a.paused||0===a.playState&&1!==a.readyState)return a;c._wD("SMSound.pause()");a.paused=!0;a.isHTML5?(a._setup_html5().pause(),h()):(b||void 0===b)&&i._pause(a.sID);a._iO.onpause&&a._iO.onpause.apply(a);return a};this.resume=function(){var b=a._iO;if(!a.paused)return a;
|
||||||
|
c._wD("SMSound.resume()");a.paused=!1;a.playState=1;a.isHTML5?(a._setup_html5().play(),g()):(b.isMovieStar&&!b.serverURL&&a.setPosition(a.position),i._pause(a.sID));j&&b.onplay?(b.onplay.apply(a),j=!0):b.onresume&&b.onresume.apply(a);return a};this.togglePause=function(){c._wD("SMSound.togglePause()");if(0===a.playState)return a.play({position:9===m&&!a.isHTML5?a.position:a.position/1E3}),a;a.paused?a.resume():a.pause();return a};this.setPan=function(b,c){"undefined"===typeof b&&(b=0);"undefined"===
|
||||||
|
typeof c&&(c=!1);a.isHTML5||i._setPan(a.sID,b);a._iO.pan=b;if(!c)a.pan=b,a.options.pan=b;return a};this.setVolume=function(b,d){"undefined"===typeof b&&(b=100);"undefined"===typeof d&&(d=!1);if(a.isHTML5){if(a._a)a._a.volume=Math.max(0,Math.min(1,b/100))}else i._setVolume(a.sID,c.muted&&!a.muted||a.muted?0:b);a._iO.volume=b;if(!d)a.volume=b,a.options.volume=b;return a};this.mute=function(){a.muted=!0;if(a.isHTML5){if(a._a)a._a.muted=!0}else i._setVolume(a.sID,0);return a};this.unmute=function(){a.muted=
|
||||||
|
!1;var b="undefined"!==typeof a._iO.volume;if(a.isHTML5){if(a._a)a._a.muted=!1}else i._setVolume(a.sID,b?a._iO.volume:a.options.volume);return a};this.toggleMute=function(){return a.muted?a.unmute():a.mute()};this.onposition=this.onPosition=function(b,c,d){x.push({position:b,method:c,scope:"undefined"!==typeof d?d:a,fired:!1});return a};this.clearOnPosition=function(a,b){var c,a=parseInt(a,10);if(isNaN(a))return!1;for(c=0;c<x.length;c++)if(a===x[c].position&&(!b||b===x[c].method))x[c].fired&&l--,
|
||||||
|
x.splice(c,1)};this._processOnPosition=function(){var b,c;b=x.length;if(!b||!a.playState||l>=b)return!1;for(;b--;)if(c=x[b],!c.fired&&a.position>=c.position)c.fired=!0,l++,c.method.apply(c.scope,[c.position]);return!0};this._resetOnPosition=function(a){var b,c;b=x.length;if(!b)return!1;for(;b--;)if(c=x[b],c.fired&&a<=c.position)c.fired=!1,l--;return!0};r=function(){var b=a._iO,d=b.from,e=b.to,f,g;g=function(){c._wD(a.sID+': "to" time of '+e+" reached.");a.clearOnPosition(e,g);a.stop()};f=function(){c._wD(a.sID+
|
||||||
|
': playing "from" '+d);if(null!==e&&!isNaN(e))a.onPosition(e,g)};if(null!==d&&!isNaN(d))b.position=d,b.multiShot=!1,f();return b};Ya=function(){var b=a._iO.onposition;if(b)for(var c in b)if(b.hasOwnProperty(c))a.onPosition(parseInt(c,10),b[c])};n=function(){var b=a._iO.onposition;if(b)for(var c in b)b.hasOwnProperty(c)&&a.clearOnPosition(parseInt(c,10))};g=function(){a.isHTML5&&Ka(a)};h=function(){a.isHTML5&&La(a)};d=function(){x=[];l=0;j=!1;a._hasTimer=null;a._a=null;a._html5_canplay=!1;a.bytesLoaded=
|
||||||
|
null;a.bytesTotal=null;a.duration=a._iO&&a._iO.duration?a._iO.duration:null;a.durationEstimate=null;a.eqData=[];a.eqData.left=[];a.eqData.right=[];a.failures=0;a.isBuffering=!1;a.instanceOptions={};a.instanceCount=0;a.loaded=!1;a.metadata={};a.readyState=0;a.muted=!1;a.paused=!1;a.peakData={left:0,right:0};a.waveformData={left:[],right:[]};a.playState=0;a.position=null};d();this._onTimer=function(b){var c,d=!1,e={};if(a._hasTimer||b){if(a._a&&(b||(0<a.playState||1===a.readyState)&&!a.paused)){c=a._get_html5_duration();
|
||||||
|
if(c!==t)t=c,a.duration=c,d=!0;a.durationEstimate=a.duration;c=1E3*a._a.currentTime||0;c!==u&&(u=c,d=!0);(d||b)&&a._whileplaying(c,e,e,e,e);return d}return!1}};this._get_html5_duration=function(){var b=a._iO,c=a._a?1E3*a._a.duration:b?b.duration:void 0;return c&&!isNaN(c)&&Infinity!==c?c:b?b.duration:null};this._setup_html5=function(b){var b=v(a._iO,b),e=decodeURI,g=F?c._global_a:a._a,h=e(b.url),i=g&&g._t?g._t.instanceOptions:null;if(g){if(g._t&&(!F&&h===e(p)||F&&i.url===b.url&&(!p||p===i.url)))return g;
|
||||||
|
c._wD("setting new URL on existing object: "+h+(p?", old URL: "+p:""));F&&g._t&&g._t.playState&&b.url!==i.url&&g._t.stop();d();g.src=b.url;p=a.url=b.url;g._called_load=!1}else{c._wD("creating HTML5 Audio() element with URL: "+h);g=new Audio(b.url);g._called_load=!1;if(bb)g._called_load=!0;if(F)c._global_a=g}a.isHTML5=!0;a._a=g;g._t=a;f();g.loop=1<b.loops?"loop":"";b.autoLoad||b.autoPlay?a.load():(g.autobuffer=!1,g.preload="none");g.loop=1<b.loops?"loop":"";return g};f=function(){if(a._a._added_events)return!1;
|
||||||
|
var b;c._wD(k+"adding event listeners: "+a.sID);a._a._added_events=!0;for(b in A)A.hasOwnProperty(b)&&a._a&&a._a.addEventListener(b,A[b],!1);return!0};e=function(){var b;c._wD(k+"removing event listeners: "+a.sID);a._a._added_events=!1;for(b in A)A.hasOwnProperty(b)&&a._a&&a._a.removeEventListener(b,A[b],!1)};this._onload=function(b){var d,b=!!b;c._wD(d+'"'+a.sID+'"'+(b?" loaded.":" failed to load? - "+a.url),b?1:2);d="SMSound._onload(): ";!b&&!a.isHTML5&&(!0===c.sandbox.noRemote&&c._wD(d+q("noNet"),
|
||||||
|
1),!0===c.sandbox.noLocal&&c._wD(d+q("noLocal"),1));a.loaded=b;a.readyState=b?3:2;a._onbufferchange(0);a._iO.onload&&a._iO.onload.apply(a,[b]);return!0};this._onbufferchange=function(b){if(0===a.playState||b&&a.isBuffering||!b&&!a.isBuffering)return!1;a.isBuffering=1===b;a._iO.onbufferchange&&(c._wD("SMSound._onbufferchange(): "+b),a._iO.onbufferchange.apply(a));return!0};this._onsuspend=function(){a._iO.onsuspend&&(c._wD("SMSound._onsuspend()"),a._iO.onsuspend.apply(a));return!0};this._onfailure=
|
||||||
|
function(b,d,e){a.failures++;c._wD('SMSound._onfailure(): "'+a.sID+'" count '+a.failures);if(a._iO.onfailure&&1===a.failures)a._iO.onfailure(a,b,d,e);else c._wD("SMSound._onfailure(): ignoring")};this._onfinish=function(){var b=a._iO.onfinish;a._onbufferchange(0);a._resetOnPosition(0);if(a.instanceCount){a.instanceCount--;if(!a.instanceCount)n(),a.playState=0,a.paused=!1,a.instanceCount=0,a.instanceOptions={},a._iO={},h();if((!a.instanceCount||a._iO.multiShotEvents)&&b)c._wD('SMSound._onfinish(): "'+
|
||||||
|
a.sID+'"'),b.apply(a)}};this._whileloading=function(b,c,d,e){var f=a._iO;a.bytesLoaded=b;a.bytesTotal=c;a.duration=Math.floor(d);a.bufferLength=e;if(f.isMovieStar)a.durationEstimate=a.duration;else if(a.durationEstimate=f.duration?a.duration>f.duration?a.duration:f.duration:parseInt(a.bytesTotal/a.bytesLoaded*a.duration,10),void 0===a.durationEstimate)a.durationEstimate=a.duration;3!==a.readyState&&f.whileloading&&f.whileloading.apply(a)};this._whileplaying=function(b,c,d,e,f){var g=a._iO;if(isNaN(b)||
|
||||||
|
null===b)return!1;a.position=b;a._processOnPosition();if(!a.isHTML5&&8<m){if(g.usePeakData&&"undefined"!==typeof c&&c)a.peakData={left:c.leftPeak,right:c.rightPeak};if(g.useWaveformData&&"undefined"!==typeof d&&d)a.waveformData={left:d.split(","),right:e.split(",")};if(g.useEQData&&"undefined"!==typeof f&&f&&f.leftEQ&&(b=f.leftEQ.split(","),a.eqData=b,a.eqData.left=b,"undefined"!==typeof f.rightEQ&&f.rightEQ))a.eqData.right=f.rightEQ.split(",")}1===a.playState&&(!a.isHTML5&&8===m&&!a.position&&a.isBuffering&&
|
||||||
|
a._onbufferchange(0),g.whileplaying&&g.whileplaying.apply(a));return!0};this._onmetadata=function(b,d){c._wD('SMSound._onmetadata(): "'+this.sID+'" metadata received.');var e={},f,g;for(f=0,g=b.length;f<g;f++)e[b[f]]=d[f];a.metadata=e;a._iO.onmetadata&&a._iO.onmetadata.apply(a)};this._onid3=function(b,d){c._wD('SMSound._onid3(): "'+this.sID+'" ID3 data received.');var e=[],f,g;for(f=0,g=b.length;f<g;f++)e[b[f]]=d[f];a.id3=v(a.id3,e);a._iO.onid3&&a._iO.onid3.apply(a)};this._onconnect=function(b){b=
|
||||||
|
1===b;c._wD('SMSound._onconnect(): "'+a.sID+'"'+(b?" connected.":" failed to connect? - "+a.url),b?1:2);if(a.connected=b)a.failures=0,s(a.sID)&&(a.getAutoPlay()?a.play(void 0,a.getAutoPlay()):a._iO.autoLoad&&a.load()),a._iO.onconnect&&a._iO.onconnect.apply(a,[b])};this._ondataerror=function(b){0<a.playState&&(c._wD("SMSound._ondataerror(): "+b),a._iO.ondataerror&&a._iO.ondataerror.apply(a))}};ba=function(){return h.body||h._docElement||h.getElementsByTagName("div")[0]};u=function(b){return h.getElementById(b)};
|
||||||
|
v=function(b,a){var d={},f,e;for(f in b)b.hasOwnProperty(f)&&(d[f]=b[f]);f="undefined"===typeof a?c.defaultOptions:a;for(e in f)f.hasOwnProperty(e)&&"undefined"===typeof d[e]&&(d[e]=f[e]);return d};r=function(){function b(a){var a=Pa.call(a),b=a.length;c?(a[1]="on"+a[1],3<b&&a.pop()):3===b&&a.push(!1);return a}function a(a,b){var g=a.shift(),h=[f[b]];if(c)g[h](a[0],a[1]);else g[h].apply(g,a)}var c=j.attachEvent,f={add:c?"attachEvent":"addEventListener",remove:c?"detachEvent":"removeEventListener"};
|
||||||
|
return{add:function(){a(b(arguments),"add")},remove:function(){a(b(arguments),"remove")}}}();A={abort:l(function(){c._wD(k+"abort: "+this._t.sID)}),canplay:l(function(){var b=this._t;if(b._html5_canplay)return!0;b._html5_canplay=!0;c._wD(k+"canplay: "+b.sID+", "+b.url);b._onbufferchange(0);var a=!isNaN(b.position)?b.position/1E3:null;if(b.position&&this.currentTime!==a){c._wD(k+"canplay: setting position to "+a);try{this.currentTime=a}catch(d){c._wD(k+"setting position failed: "+d.message,2)}}b._iO._oncanplay&&
|
||||||
|
b._iO._oncanplay()}),load:l(function(){var b=this._t;b.loaded||(b._onbufferchange(0),b._whileloading(b.bytesTotal,b.bytesTotal,b._get_html5_duration()),b._onload(!0))}),emptied:l(function(){c._wD(k+"emptied: "+this._t.sID)}),ended:l(function(){var b=this._t;c._wD(k+"ended: "+b.sID);b._onfinish()}),error:l(function(){c._wD(k+"error: "+this.error.code);this._t._onload(!1)}),loadeddata:l(function(){var b=this._t,a=b.bytesTotal||1;c._wD(k+"loadeddata: "+this._t.sID);if(!b._loaded&&!V)b.duration=b._get_html5_duration(),
|
||||||
|
b._whileloading(a,a,b._get_html5_duration()),b._onload(!0)}),loadedmetadata:l(function(){c._wD(k+"loadedmetadata: "+this._t.sID)}),loadstart:l(function(){c._wD(k+"loadstart: "+this._t.sID);this._t._onbufferchange(1)}),play:l(function(){c._wD(k+"play: "+this._t.sID+", "+this._t.url);this._t._onbufferchange(0)}),playing:l(function(){c._wD(k+"playing: "+this._t.sID);this._t._onbufferchange(0)}),progress:l(function(b){var a=this._t;if(a.loaded)return!1;var d,f,e;e=0;var h="progress"===b.type;f=b.target.buffered;
|
||||||
|
var g=b.loaded||0,i=b.total||1;if(f&&f.length){for(d=f.length;d--;)e=f.end(d)-f.start(d);g=e/b.target.duration;if(h&&1<f.length){e=[];f=f.length;for(d=0;d<f;d++)e.push(b.target.buffered.start(d)+"-"+b.target.buffered.end(d));c._wD(k+"progress: timeRanges: "+e.join(", "))}h&&!isNaN(g)&&c._wD(k+"progress: "+a.sID+": "+Math.floor(100*g)+"% loaded")}isNaN(g)||(a._onbufferchange(0),a._whileloading(g,i,a._get_html5_duration()),g&&i&&g===i&&A.load.call(this,b))}),ratechange:l(function(){c._wD(k+"ratechange: "+
|
||||||
|
this._t.sID)}),suspend:l(function(b){var a=this._t;c._wD(k+"suspend: "+a.sID);A.progress.call(this,b);a._onsuspend()}),stalled:l(function(){c._wD(k+"stalled: "+this._t.sID)}),timeupdate:l(function(){this._t._onTimer()}),waiting:l(function(){var b=this._t;c._wD(k+"waiting: "+b.sID);b._onbufferchange(1)})};ja=function(b){return!b.serverURL&&(b.type?U({type:b.type}):U({url:b.url})||c.html5Only)};ya=function(b){if(b)b.src=ab?"":"about:blank"};U=function(b){function a(a){return c.preferFlash&&t&&!c.ignoreFlash&&
|
||||||
|
"undefined"!==typeof c.flash[a]&&c.flash[a]}if(!c.useHTML5Audio||!c.hasHTML5)return!1;var d=b.url||null,b=b.type||null,f=c.audioFormats,e;if(b&&"undefined"!==c.html5[b])return c.html5[b]&&!a(b);if(!C){C=[];for(e in f)f.hasOwnProperty(e)&&(C.push(e),f[e].related&&(C=C.concat(f[e].related)));C=RegExp("\\.("+C.join("|")+")(\\?.*)?$","i")}e=d?d.toLowerCase().match(C):null;if(!e||!e.length)if(b)d=b.indexOf(";"),e=(-1!==d?b.substr(0,d):b).substr(6);else return!1;else e=e[1];if(e&&"undefined"!==typeof c.html5[e])return c.html5[e]&&
|
||||||
|
!a(e);b="audio/"+e;d=c.html5.canPlayType({type:b});return(c.html5[e]=d)&&c.html5[b]&&!a(b)};Oa=function(){function b(b){var d,e,f=!1;if(!a||"function"!==typeof a.canPlayType)return!1;if(b instanceof Array){for(d=0,e=b.length;d<e&&!f;d++)if(c.html5[b[d]]||a.canPlayType(b[d]).match(c.html5Test))f=!0,c.html5[b[d]]=!0,c.flash[b[d]]=!(!c.preferFlash||!t||!b[d].match(Ua));return f}b=a&&"function"===typeof a.canPlayType?a.canPlayType(b):!1;return!(!b||!b.match(c.html5Test))}if(!c.useHTML5Audio||"undefined"===
|
||||||
|
typeof Audio)return!1;var a="undefined"!==typeof Audio?db?new Audio(null):new Audio:null,d,f={},e,h;e=c.audioFormats;for(d in e)if(e.hasOwnProperty(d)&&(f[d]=b(e[d].type),f["audio/"+d]=f[d],c.flash[d]=c.preferFlash&&!c.ignoreFlash&&d.match(Ua)?!0:!1,e[d]&&e[d].related))for(h=e[d].related.length;h--;)f["audio/"+e[d].related[h]]=f[d],c.html5[e[d].related[h]]=f[d],c.flash[e[d].related[h]]=f[d];f.canPlayType=a?b:null;c.html5=v(c.html5,f);return!0};$={notReady:"Not loaded yet - wait for soundManager.onload()/onready()",
|
||||||
|
notOK:"Audio support is not available.",domError:"soundManager::createMovie(): appendChild/innerHTML call failed. DOM not ready or other error.",spcWmode:"soundManager::createMovie(): Removing wmode, preventing known SWF loading issue(s)",swf404:"soundManager: Verify that %s is a valid path.",tryDebug:"Try soundManager.debugFlash = true for more security details (output goes to SWF.)",checkSWF:"See SWF output for more debug info.",localFail:"soundManager: Non-HTTP page ("+h.location.protocol+" URL?) Review Flash player security settings for this special case:\nhttp://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html\nMay need to add/allow path, eg. c:/sm2/ or /users/me/sm2/",
|
||||||
|
waitFocus:"soundManager: Special case: Waiting for focus-related event..",waitImpatient:"soundManager: Getting impatient, still waiting for Flash%s...",waitForever:"soundManager: Waiting indefinitely for Flash (will recover if unblocked)...",needFunction:"soundManager: Function object expected for %s",badID:'Warning: Sound ID "%s" should be a string, starting with a non-numeric character',currentObj:"--- soundManager._debug(): Current sound objects ---",waitEI:"soundManager::initMovie(): Waiting for ExternalInterface call from Flash..",
|
||||||
|
waitOnload:"soundManager: Waiting for window.onload()",docLoaded:"soundManager: Document already loaded",onload:"soundManager::initComplete(): calling soundManager.onload()",onloadOK:"soundManager.onload() complete",init:"soundManager::init()",didInit:"soundManager::init(): Already called?",flashJS:"soundManager: Attempting to call Flash from JS..",secNote:"Flash security note: Network/internet URLs will not load due to security restrictions. Access can be configured via Flash Player Global Security Settings Page: http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html",
|
||||||
|
badRemove:"Warning: Failed to remove flash movie.",noPeak:"Warning: peakData features unsupported for movieStar formats",shutdown:"soundManager.disable(): Shutting down",queue:"soundManager: Queueing %s handler",smFail:"soundManager: Failed to initialise.",smError:"SMSound.load(): Exception: JS-Flash communication failed, or JS error.",fbTimeout:"No flash response, applying .swf_timedout CSS..",fbLoaded:"Flash loaded",fbHandler:"soundManager::flashBlockHandler()",manURL:"SMSound.load(): Using manually-assigned URL",
|
||||||
|
onURL:"soundManager.load(): current URL already assigned.",badFV:'soundManager.flashVersion must be 8 or 9. "%s" is invalid. Reverting to %s.',as2loop:"Note: Setting stream:false so looping can work (flash 8 limitation)",noNSLoop:"Note: Looping not implemented for MovieStar formats",needfl9:"Note: Switching to flash 9, required for MP4 formats.",mfTimeout:"Setting flashLoadTimeout = 0 (infinite) for off-screen, mobile flash case",mfOn:"mobileFlash::enabling on-screen flash repositioning",policy:"Enabling usePolicyFile for data access"};
|
||||||
|
q=function(){var b=Pa.call(arguments),a=b.shift(),a=$&&$[a]?$[a]:"",c,f;if(a&&b&&b.length)for(c=0,f=b.length;c<f;c++)a=a.replace("%s",b[c]);return a};ea=function(b){if(8===m&&1<b.loops&&b.stream)o("as2loop"),b.stream=!1;return b};fa=function(b,a){if(b&&!b.usePolicyFile&&(b.onid3||b.usePeakData||b.useWaveformData||b.useEQData))c._wD((a||"")+q("policy")),b.usePolicyFile=!0;return b};wa=function(b){"undefined"!==typeof console&&"undefined"!==typeof console.warn?console.warn(b):c._wD(b)};na=function(){return!1};
|
||||||
|
Ha=function(b){for(var a in b)b.hasOwnProperty(a)&&"function"===typeof b[a]&&(b[a]=na)};da=function(b){"undefined"===typeof b&&(b=!1);if(y||b)o("smFail",2),c.disable(b)};Ia=function(b){var a=null;if(b)if(b.match(/\.swf(\?.*)?$/i)){if(a=b.substr(b.toLowerCase().lastIndexOf(".swf?")+4))return b}else b.lastIndexOf("/")!==b.length-1&&(b+="/");b=(b&&-1!==b.lastIndexOf("/")?b.substr(0,b.lastIndexOf("/")+1):"./")+c.movieURL;c.noSWFCache&&(b+="?ts="+(new Date).getTime());return b};qa=function(){m=parseInt(c.flashVersion,
|
||||||
|
10);if(8!==m&&9!==m)c._wD(q("badFV",m,8)),c.flashVersion=m=8;var b=c.debugMode||c.debugFlash?"_debug.swf":".swf";if(c.useHTML5Audio&&!c.html5Only&&c.audioFormats.mp4.required&&9>m)c._wD(q("needfl9")),c.flashVersion=m=9;c.version=c.versionNumber+(c.html5Only?" (HTML5-only mode)":9===m?" (AS3/Flash 9)":" (AS2/Flash 8)");8<m?(c.defaultOptions=v(c.defaultOptions,c.flash9Options),c.features.buffering=!0,c.defaultOptions=v(c.defaultOptions,c.movieStarOptions),c.filePatterns.flash9=RegExp("\\.(mp3|"+Xa.join("|")+
|
||||||
|
")(\\?.*)?$","i"),c.features.movieStar=!0):c.features.movieStar=!1;c.filePattern=c.filePatterns[8!==m?"flash9":"flash8"];c.movieURL=(8===m?"soundmanager2.swf":"soundmanager2_flash9.swf").replace(".swf",b);c.features.peakData=c.features.waveformData=c.features.eqData=8<m};Ga=function(b,a){if(!i)return!1;i._setPolling(b,a)};ta=function(){if(c.debugURLParam.test(O))c.debugMode=!0;if(u(c.debugID))return!1;var b,a,d,f;if(c.debugMode&&!u(c.debugID)&&(!Sa||!c.useConsole||!c.consoleOnly)){b=h.createElement("div");
|
||||||
|
b.id=c.debugID+"-toggle";a={position:"fixed",bottom:"0px",right:"0px",width:"1.2em",height:"1.2em",lineHeight:"1.2em",margin:"2px",textAlign:"center",border:"1px solid #999",cursor:"pointer",background:"#fff",color:"#333",zIndex:10001};b.appendChild(h.createTextNode("-"));b.onclick=Ja;b.title="Toggle SM2 debug console";if(p.match(/msie 6/i))b.style.position="absolute",b.style.cursor="hand";for(f in a)a.hasOwnProperty(f)&&(b.style[f]=a[f]);a=h.createElement("div");a.id=c.debugID;a.style.display=c.debugMode?
|
||||||
|
"block":"none";if(c.debugMode&&!u(b.id)){try{d=ba(),d.appendChild(b)}catch(e){throw Error(q("domError")+" \n"+e.toString());}d.appendChild(a)}}};s=this.getSoundById;o=function(b,a){return b?c._wD(q(b),a):""};if(O.indexOf("sm2-debug=alert")+1&&c.debugMode)c._wD=function(b){G.alert(b)};Ja=function(){var b=u(c.debugID),a=u(c.debugID+"-toggle");if(!b)return!1;oa?(a.innerHTML="+",b.style.display="none"):(a.innerHTML="-",b.style.display="block");oa=!oa};w=function(b,a,c){if("undefined"!==typeof sm2Debugger)try{sm2Debugger.handleEvent(b,
|
||||||
|
a,c)}catch(f){}return!0};L=function(){var b=[];c.debugMode&&b.push("sm2_debug");c.debugFlash&&b.push("flash_debug");c.useHighPerformance&&b.push("high_performance");return b.join(" ")};va=function(){var b=q("fbHandler"),a=c.getMoviePercent(),d={type:"FLASHBLOCK"};if(c.html5Only)return!1;if(c.ok()){if(c.didFlashBlock&&c._wD(b+": Unblocked"),c.oMC)c.oMC.className=[L(),"movieContainer","swf_loaded"+(c.didFlashBlock?" swf_unblocked":"")].join(" ")}else{if(z)c.oMC.className=L()+" movieContainer "+(null===
|
||||||
|
a?"swf_timedout":"swf_error"),c._wD(b+": "+q("fbTimeout")+(a?" ("+q("fbLoaded")+")":""));c.didFlashBlock=!0;H({type:"ontimeout",ignoreInit:!0,error:d});K(d)}};pa=function(b,a,c){"undefined"===typeof B[b]&&(B[b]=[]);B[b].push({method:a,scope:c||null,fired:!1})};H=function(b){b||(b={type:"onready"});if(!n&&b&&!b.ignoreInit||"ontimeout"===b.type&&c.ok())return!1;var a={success:b&&b.ignoreInit?c.ok():!y},d=b&&b.type?B[b.type]||[]:[],f=[],e,h=[a],g=z&&c.useFlashBlock&&!c.ok();if(b.error)h[0].error=b.error;
|
||||||
|
for(a=0,e=d.length;a<e;a++)!0!==d[a].fired&&f.push(d[a]);if(f.length){c._wD("soundManager: Firing "+f.length+" "+b.type+"() item"+(1===f.length?"":"s"));for(a=0,e=f.length;a<e;a++)if(f[a].scope?f[a].method.apply(f[a].scope,h):f[a].method.apply(this,h),!g)f[a].fired=!0}return!0};I=function(){j.setTimeout(function(){c.useFlashBlock&&va();H();c.onload instanceof Function&&(o("onload",1),c.onload.apply(j),o("onloadOK",1));c.waitForWindowLoad&&r.add(j,"load",I)},1)};ka=function(){if(void 0!==t)return t;
|
||||||
|
var b=!1,a=navigator,c=a.plugins,f,e=j.ActiveXObject;if(c&&c.length)(a=a.mimeTypes)&&a["application/x-shockwave-flash"]&&a["application/x-shockwave-flash"].enabledPlugin&&a["application/x-shockwave-flash"].enabledPlugin.description&&(b=!0);else if("undefined"!==typeof e){try{f=new e("ShockwaveFlash.ShockwaveFlash")}catch(h){}b=!!f}return t=b};Na=function(){var b,a;if(Aa&&p.match(/os (1|2|3_0|3_1)/i)){c.hasHTML5=!1;c.html5Only=!0;if(c.oMC)c.oMC.style.display="none";return!1}if(c.useHTML5Audio){if(!c.html5||
|
||||||
|
!c.html5.canPlayType)return c._wD("SoundManager: No HTML5 Audio() support detected."),c.hasHTML5=!1,!0;c.hasHTML5=!0;if(Ca&&(c._wD("soundManager::Note: Buggy HTML5 Audio in Safari on this OS X release, see https://bugs.webkit.org/show_bug.cgi?id=32159 - "+(!t?" would use flash fallback for MP3/MP4, but none detected.":"will use flash fallback for MP3/MP4, if available"),1),ka()))return!0}else return!0;for(a in c.audioFormats)if(c.audioFormats.hasOwnProperty(a)&&(c.audioFormats[a].required&&!c.html5.canPlayType(c.audioFormats[a].type)||
|
||||||
|
c.flash[a]||c.flash[c.audioFormats[a].type]))b=!0;c.ignoreFlash&&(b=!1);c.html5Only=c.hasHTML5&&c.useHTML5Audio&&!b;return!c.html5Only};ia=function(b){var a,d,f=0;if(b instanceof Array){for(a=0,d=b.length;a<d;a++)if(b[a]instanceof Object){if(c.canPlayMIME(b[a].type)){f=a;break}}else if(c.canPlayURL(b[a])){f=a;break}if(b[f].url)b[f]=b[f].url;return b[f]}return b};Ka=function(b){if(!b._hasTimer)b._hasTimer=!0,!Ba&&c.html5PollingInterval&&(null===T&&0===ha&&(T=G.setInterval(Ma,c.html5PollingInterval)),
|
||||||
|
ha++)};La=function(b){if(b._hasTimer)b._hasTimer=!1,!Ba&&c.html5PollingInterval&&ha--};Ma=function(){var b;if(null!==T&&!ha)return G.clearInterval(T),T=null,!1;for(b=c.soundIDs.length;b--;)c.sounds[c.soundIDs[b]].isHTML5&&c.sounds[c.soundIDs[b]]._hasTimer&&c.sounds[c.soundIDs[b]]._onTimer()};K=function(b){b="undefined"!==typeof b?b:{};c.onerror instanceof Function&&c.onerror.apply(j,[{type:"undefined"!==typeof b.type?b.type:null}]);"undefined"!==typeof b.fatal&&b.fatal&&c.disable()};Qa=function(){if(!Ca||
|
||||||
|
!ka())return!1;var b=c.audioFormats,a,d;for(d in b)if(b.hasOwnProperty(d)&&("mp3"===d||"mp4"===d))if(c._wD("soundManager: Using flash fallback for "+d+" format"),c.html5[d]=!1,b[d]&&b[d].related)for(a=b[d].related.length;a--;)c.html5[b[d].related[a]]=!1};this._setSandboxType=function(b){var a=c.sandbox;a.type=b;a.description=a.types["undefined"!==typeof a.types[b]?b:"unknown"];c._wD("Flash security sandbox type: "+a.type);if("localWithFile"===a.type)a.noRemote=!0,a.noLocal=!1,o("secNote",2);else if("localWithNetwork"===
|
||||||
|
a.type)a.noRemote=!1,a.noLocal=!0;else if("localTrusted"===a.type)a.noRemote=!1,a.noLocal=!1};this._externalInterfaceOK=function(b,a){if(c.swfLoaded)return!1;var d,f=(new Date).getTime();c._wD("soundManager::externalInterfaceOK()"+(b?" (~"+(f-b)+" ms)":""));w("swf",!0);w("flashtojs",!0);c.swfLoaded=!0;M=!1;Ca&&Qa();if(!a||a.replace(/\+dev/i,"")!==c.versionNumber.replace(/\+dev/i,""))return d='soundManager: Fatal: JavaScript file build "'+c.versionNumber+'" does not match Flash SWF build "'+a+'" at '+
|
||||||
|
c.url+". Ensure both are up-to-date.",setTimeout(function(){throw Error(d);},0),!1;D?setTimeout(X,100):X()};ca=function(b,a){function d(){c._wD("-- SoundManager 2 "+c.version+(!c.html5Only&&c.useHTML5Audio?c.hasHTML5?" + HTML5 audio":", no HTML5 audio support":"")+(!c.html5Only?(c.useHighPerformance?", high performance mode, ":", ")+((c.flashPollingInterval?"custom ("+c.flashPollingInterval+"ms)":"normal")+" polling")+(c.wmode?", wmode: "+c.wmode:"")+(c.debugFlash?", flash debug mode":"")+(c.useFlashBlock?
|
||||||
|
", flashBlock mode":""):"")+" --",1)}function f(a,b){return'<param name="'+a+'" value="'+b+'" />'}if(P&&Q)return!1;if(c.html5Only)return qa(),d(),c.oMC=u(c.movieID),X(),Q=P=!0,!1;var e=a||c.url,i=c.altURL||e,g;g=ba();var j,m,k=L(),l,n=null,n=(n=h.getElementsByTagName("html")[0])&&n.dir&&n.dir.match(/rtl/i),b="undefined"===typeof b?c.id:b;qa();c.url=Ia(N?e:i);a=c.url;c.wmode=!c.wmode&&c.useHighPerformance?"transparent":c.wmode;if(null!==c.wmode&&(p.match(/msie 8/i)||!D&&!c.useHighPerformance)&&navigator.platform.match(/win32|win64/i))o("spcWmode"),
|
||||||
|
c.wmode=null;g={name:b,id:b,src:a,width:"auto",height:"auto",quality:"high",allowScriptAccess:c.allowScriptAccess,bgcolor:c.bgColor,pluginspage:Va+"www.macromedia.com/go/getflashplayer",title:"JS/Flash audio component (SoundManager 2)",type:"application/x-shockwave-flash",wmode:c.wmode,hasPriority:"true"};if(c.debugFlash)g.FlashVars="debug=1";c.wmode||delete g.wmode;if(D)e=h.createElement("div"),m=['<object id="'+b+'" data="'+a+'" type="'+g.type+'" title="'+g.title+'" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="'+
|
||||||
|
Va+'download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="'+g.width+'" height="'+g.height+'">',f("movie",a),f("AllowScriptAccess",c.allowScriptAccess),f("quality",g.quality),c.wmode?f("wmode",c.wmode):"",f("bgcolor",c.bgColor),f("hasPriority","true"),c.debugFlash?f("FlashVars",g.FlashVars):"","</object>"].join("");else for(j in e=h.createElement("embed"),g)g.hasOwnProperty(j)&&e.setAttribute(j,g[j]);ta();k=L();if(g=ba())if(c.oMC=u(c.movieID)||h.createElement("div"),
|
||||||
|
c.oMC.id){l=c.oMC.className;c.oMC.className=(l?l+" ":"movieContainer")+(k?" "+k:"");c.oMC.appendChild(e);if(D)j=c.oMC.appendChild(h.createElement("div")),j.className="sm2-object-box",j.innerHTML=m;Q=!0}else{c.oMC.id=c.movieID;c.oMC.className="movieContainer "+k;j=k=null;if(!c.useFlashBlock)if(c.useHighPerformance)k={position:"fixed",width:"8px",height:"8px",bottom:"0px",left:"0px",overflow:"hidden"};else if(k={position:"absolute",width:"6px",height:"6px",top:"-9999px",left:"-9999px"},n)k.left=Math.abs(parseInt(k.left,
|
||||||
|
10))+"px";if(cb)c.oMC.style.zIndex=1E4;if(!c.debugFlash)for(l in k)k.hasOwnProperty(l)&&(c.oMC.style[l]=k[l]);try{D||c.oMC.appendChild(e);g.appendChild(c.oMC);if(D)j=c.oMC.appendChild(h.createElement("div")),j.className="sm2-object-box",j.innerHTML=m;Q=!0}catch(r){throw Error(q("domError")+" \n"+r.toString());}}P=!0;d();c._wD("soundManager::createMovie(): Trying to load "+a+(!N&&c.altURL?" (alternate URL)":""),1);return!0};aa=function(){if(c.html5Only)return ca(),!1;if(i)return!1;i=c.getMovie(c.id);
|
||||||
|
if(!i)S?(D?c.oMC.innerHTML=ua:c.oMC.appendChild(S),S=null,P=!0):ca(c.id,c.url),i=c.getMovie(c.id);i&&o("waitEI");c.oninitmovie instanceof Function&&setTimeout(c.oninitmovie,1);return!0};Z=function(){setTimeout(Fa,1E3)};Fa=function(){if(ga)return!1;ga=!0;r.remove(j,"load",Z);if(M&&!Da)return o("waitFocus"),!1;var b;n||(b=c.getMoviePercent(),c._wD(q("waitImpatient",100===b?" (SWF loaded)":0<b?" (SWF "+b+"% loaded)":"")));setTimeout(function(){b=c.getMoviePercent();n||(c._wD("soundManager: No Flash response within expected time.\nLikely causes: "+
|
||||||
|
(0===b?"Loading "+c.movieURL+" may have failed (and/or Flash "+m+"+ not present?), ":"")+"Flash blocked or JS-Flash security error."+(c.debugFlash?" "+q("checkSWF"):""),2),!N&&b&&(o("localFail",2),c.debugFlash||o("tryDebug",2)),0===b&&c._wD(q("swf404",c.url)),w("flashtojs",!1,": Timed out"+N?" (Check flash security or flash blockers)":" (No plugin/missing SWF?)"));!n&&Ta&&(null===b?c.useFlashBlock||0===c.flashLoadTimeout?(c.useFlashBlock&&va(),o("waitForever")):da(!0):0===c.flashLoadTimeout?o("waitForever"):
|
||||||
|
da(!0))},c.flashLoadTimeout)};E=function(){function b(){r.remove(j,"focus",E);r.remove(j,"load",E)}if(Da||!M)return b(),!0;Da=Ta=!0;c._wD("soundManager::handleFocus()");V&&M&&r.remove(j,"mousemove",E);ga=!1;b();return!0};Ra=function(){var b,a=[];if(c.useHTML5Audio&&c.hasHTML5){for(b in c.audioFormats)c.audioFormats.hasOwnProperty(b)&&a.push(b+": "+c.html5[b]+(!c.html5[b]&&t&&c.flash[b]?" (using flash)":c.preferFlash&&c.flash[b]&&t?" (preferring flash)":!c.html5[b]?" ("+(c.audioFormats[b].required?
|
||||||
|
"required, ":"")+"and no flash support)":""));c._wD("-- SoundManager 2: HTML5 support tests ("+c.html5Test+"): "+a.join(", ")+" --",1)}};R=function(b){if(n)return!1;if(c.html5Only)return c._wD("-- SoundManager 2: loaded --"),n=!0,I(),w("onload",!0),!0;var a;if(!c.useFlashBlock||!c.flashLoadTimeout||c.getMoviePercent())n=!0,y&&(a={type:!t&&z?"NO_FLASH":"INIT_TIMEOUT"});c._wD("-- SoundManager 2 "+(y?"failed to load":"loaded")+" ("+(y?"security/load error":"OK")+") --",1);if(y||b){if(c.useFlashBlock&&
|
||||||
|
c.oMC)c.oMC.className=L()+" "+(null===c.getMoviePercent()?"swf_timedout":"swf_error");H({type:"ontimeout",error:a});w("onload",!1);K(a);return!1}w("onload",!0);if(c.waitForWindowLoad&&!Y)return o("waitOnload"),r.add(j,"load",I),!1;c.waitForWindowLoad&&Y&&o("docLoaded");I();return!0};X=function(){o("init");if(n)return o("didInit"),!1;if(c.html5Only){if(!n)r.remove(j,"load",c.beginDelayedInit),c.enabled=!0,R();return!0}aa();try{o("flashJS"),i._externalInterfaceTest(!1),Ga(!0,c.flashPollingInterval||
|
||||||
|
(c.useHighPerformance?10:50)),c.debugMode||i._disableDebug(),c.enabled=!0,w("jstoflash",!0),c.html5Only||r.add(j,"unload",na)}catch(b){return c._wD("js/flash exception: "+b.toString()),w("jstoflash",!1),K({type:"JS_TO_FLASH_EXCEPTION",fatal:!0}),da(!0),R(),!1}R();r.remove(j,"load",c.beginDelayedInit);return!0};J=function(){if(sa)return!1;sa=!0;ta();var b=O.toLowerCase(),a=null,a=null,d="undefined"!==typeof console&&"undefined"!==typeof console.log;if(-1!==b.indexOf("sm2-usehtml5audio="))a="1"===b.charAt(b.indexOf("sm2-usehtml5audio=")+
|
||||||
|
18),d&&console.log((a?"Enabling ":"Disabling ")+"useHTML5Audio via URL parameter"),c.useHTML5Audio=a;if(-1!==b.indexOf("sm2-preferflash="))a="1"===b.charAt(b.indexOf("sm2-preferflash=")+16),d&&console.log((a?"Enabling ":"Disabling ")+"preferFlash via URL parameter"),c.preferFlash=a;if(!t&&c.hasHTML5)c._wD("SoundManager: No Flash detected"+(!c.useHTML5Audio?", enabling HTML5.":". Trying HTML5-only mode.")),c.useHTML5Audio=!0,c.preferFlash=!1;Oa();c.html5.usingFlash=Na();z=c.html5.usingFlash;Ra();if(!t&&
|
||||||
|
z)c._wD("SoundManager: Fatal error: Flash is needed to play some required formats, but is not available."),c.flashLoadTimeout=1;h.removeEventListener&&h.removeEventListener("DOMContentLoaded",J,!1);aa();return!0};za=function(){"complete"===h.readyState&&(J(),h.detachEvent("onreadystatechange",za));return!0};ra=function(){Y=!0;r.remove(j,"load",ra)};ka();r.add(j,"focus",E);r.add(j,"load",E);r.add(j,"load",Z);r.add(j,"load",ra);V&&M&&r.add(j,"mousemove",E);h.addEventListener?h.addEventListener("DOMContentLoaded",
|
||||||
|
J,!1):h.attachEvent?h.attachEvent("onreadystatechange",za):(w("onload",!1),K({type:"NO_DOM2_EVENTS",fatal:!0}));"complete"===h.readyState&&setTimeout(J,100)}var la=null;if("undefined"===typeof SM2_DEFER||!SM2_DEFER)la=new W;G.SoundManager=W;G.soundManager=la})(window);
|
5689
carnaval/soundmanager2.js
Normal file
11
carnaval/soundmanagerv297a-20130101/.listing
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
drwxr-xr-x 8 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Feb 4 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3279 Jan 25 2013 README.rdoc
|
||||||
|
drwxr-xr-x 18 wsoinuma psacln 4096 Jan 25 2013 demo
|
||||||
|
drwxr-xr-x 7 wsoinuma psacln 4096 Jan 25 2013 doc
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 33239 Jan 25 2013 index.html
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1567 Jan 25 2013 license.txt
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 script
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 src
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 swf
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 troubleshoot
|
71
carnaval/soundmanagerv297a-20130101/README.rdoc
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
== SoundManager 2: JavaScript Sound for the Web
|
||||||
|
|
||||||
|
By wrapping and extending HTML5 and Flash Audio APIs, SoundManager 2 brings reliable cross-platform audio to JavaScript.
|
||||||
|
|
||||||
|
== HTML5 Audio() Support
|
||||||
|
|
||||||
|
* 100% Flash-free MP3 + MP4/AAC where supported
|
||||||
|
* Compatible with Apple iPad 3.2, iPhone/iOS 4 and newer
|
||||||
|
* Fallback to Flash for MP3/MP4 support, as needed
|
||||||
|
* SM2 API is transparent; HTML5/flash switching handled internally
|
||||||
|
* HTML5 API support approximates Flash 8 API features
|
||||||
|
* Some other formats (WAV/OGG) supported via HTML5, depending on browser
|
||||||
|
* See "useHTML5Audio" property for implementation details
|
||||||
|
|
||||||
|
== Basic API Features (Flash 8)
|
||||||
|
|
||||||
|
* Load, stop, play, pause, mute, seek, pan and volume control of sounds from Javascript
|
||||||
|
* Events: onload, whileloading, whileplaying, onfinish and more
|
||||||
|
* ID3V1 and ID3V2 tag support for MP3s (title, artist, genre etc.)
|
||||||
|
|
||||||
|
== Shiny Flash 9 Features
|
||||||
|
|
||||||
|
* RTMP / Flash Media Server streaming support (new, experimental)
|
||||||
|
* MPEG-4 (AAC, HE-AAC, H.264) audio support
|
||||||
|
* "MultiShot" play (layered/chorusing effects)
|
||||||
|
* Waveform/frequency spectrum data
|
||||||
|
* Peak (L/R channel volume) data
|
||||||
|
* Audio buffering state/event handling
|
||||||
|
|
||||||
|
== General Tech Stuff
|
||||||
|
|
||||||
|
* Full API Documentation with examples and notes
|
||||||
|
* console.log()-style debug output and troubleshooting tools
|
||||||
|
* Community-based discussion/support
|
||||||
|
|
||||||
|
== As Heard On The Internets
|
||||||
|
|
||||||
|
A few nifty sites that have implemented SM2 for driving audio:
|
||||||
|
|
||||||
|
* SoundCloud / The Cloud Player
|
||||||
|
* last.fm
|
||||||
|
* Opera (media player component)
|
||||||
|
* 8tracks
|
||||||
|
* Discogs
|
||||||
|
* The Hype Machine
|
||||||
|
* nyan.cat
|
||||||
|
* turntable.fm
|
||||||
|
* AudioGalaxy
|
||||||
|
|
||||||
|
== Project home, documentation, live demos etc.:
|
||||||
|
|
||||||
|
http://www.schillmania.com/projects/soundmanager2/
|
||||||
|
|
||||||
|
== Compiling JS builds (-nodebug, -jsmin) and Flash components, AS2/AS3 to SWF
|
||||||
|
|
||||||
|
An Ant build file defines the tasks for compiling JS and SWF components, useful if you make changes to the SM2 source and want to recompile.
|
||||||
|
Google's Closure Compiler is used for the JS. AS2 compilation is done by MTASC, and AS3 is handled by Adobe's Open Source Flex SDK (mxmlc) compiler.
|
||||||
|
Refer to the build.xml file for compiler downloads and path definitions.
|
||||||
|
|
||||||
|
== Versioning / Development Notes
|
||||||
|
|
||||||
|
Releases are versioned by date, e.g., V2.97a.20110424 and are tagged as such.*
|
||||||
|
The latest official release is always on trunk/master.
|
||||||
|
Post-release development builds may be available on the appropriate +DEV branch, eg., V2.97a.20110801+DEV
|
||||||
|
|
||||||
|
== Forks and Pull Requests
|
||||||
|
|
||||||
|
Firstly, thank you for wanting to contribute! Bug fixes and tweaks are welcomed, particularly if they follow the general coding style of the project.
|
||||||
|
If making a pull request, use the project's current +DEV development branch as the merge target instead of "master", if possible (please and thank-you.)
|
||||||
|
|
||||||
|
* SoundManager 2 has been at "version" 2.97 for a long time, because 2.97 was arguably the best llama-ass-whipping version of WinAmp. (WinAmp 3 was not as good, and WinAmp 5 was "the best of 2 and 3 combined.") This MP3 player was my favourite Windows app during the 90's, and is missed as there's nothing quite like it on OS X where I spend most of my time these days.
|
24
carnaval/soundmanagerv297a-20130101/demo/.listing
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
drwxr-xr-x 18 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 8 wsoinuma psacln 4096 Jan 25 2013 ..
|
||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 360-player
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 _image
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 _mp3
|
||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 animation
|
||||||
|
drwxr-xr-x 5 wsoinuma psacln 4096 Jan 25 2013 animation-1
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 animation-2a
|
||||||
|
drwxr-xr-x 6 wsoinuma psacln 4096 Jan 25 2013 animation-2b
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 api
|
||||||
|
drwxr-xr-x 6 wsoinuma psacln 4096 Jan 25 2013 cassette-tape
|
||||||
|
drwxr-xr-x 4 wsoinuma psacln 4096 Jan 25 2013 christmas-lights
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 403 Jan 25 2013 debug.css
|
||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 flashblock
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 60306 Jan 25 2013 index-rollup.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 75804 Jan 25 2013 index-rollup.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 52309 Jan 25 2013 index.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 875 Jan 25 2013 index.html
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 23704 Jan 25 2013 index.js
|
||||||
|
drwxr-xr-x 5 wsoinuma psacln 4096 Jan 25 2013 mp3-player-button
|
||||||
|
drwxr-xr-x 6 wsoinuma psacln 4096 Jan 25 2013 mpc
|
||||||
|
drwxr-xr-x 5 wsoinuma psacln 4096 Jan 25 2013 page-player
|
||||||
|
drwxr-xr-x 5 wsoinuma psacln 4096 Jan 25 2013 play-mp3-links
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 template
|
32
carnaval/soundmanagerv297a-20130101/demo/360-player/.listing
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 18 wsoinuma psacln 4096 Jan 25 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 31168 Jan 25 2013 360 button - large.psd
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 38695 Jan 25 2013 360 button.psd
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 329 Jan 25 2013 360-button-pause-light.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 430 Jan 25 2013 360-button-pause-light.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 329 Jan 25 2013 360-button-pause.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 422 Jan 25 2013 360-button-pause.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 441 Jan 25 2013 360-button-play-light.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 477 Jan 25 2013 360-button-play-light.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 441 Jan 25 2013 360-button-play.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 474 Jan 25 2013 360-button-play.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 889 Jan 25 2013 360-button-vis-pause-light.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1304 Jan 25 2013 360-button-vis-pause-light.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 881 Jan 25 2013 360-button-vis-pause.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1293 Jan 25 2013 360-button-vis-pause.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1009 Jan 25 2013 360-button-vis-play-light.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1441 Jan 25 2013 360-button-vis-play-light.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1001 Jan 25 2013 360-button-vis-play.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1381 Jan 25 2013 360-button-vis-play.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 5709 Jan 25 2013 360player-visualization.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 6353 Jan 25 2013 360player.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 4272 Jan 25 2013 canvas-visualization-basic.html
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 15110 Jan 25 2013 canvas-visualization.html
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3411 Jan 25 2013 demo-slider-controls.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 23574 Jan 25 2013 demo-slider-controls.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1101 Jan 25 2013 demo.css
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1379 Jan 25 2013 icon_loading_dots.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 493 Jan 25 2013 icon_loading_spinner.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2506 Jan 25 2013 icon_loading_spinner_bigger.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 6615 Jan 25 2013 index.html
|
||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 script
|
After Width: | Height: | Size: 329 B |
After Width: | Height: | Size: 430 B |
After Width: | Height: | Size: 329 B |
After Width: | Height: | Size: 422 B |
After Width: | Height: | Size: 441 B |
After Width: | Height: | Size: 477 B |
After Width: | Height: | Size: 441 B |
After Width: | Height: | Size: 474 B |
After Width: | Height: | Size: 889 B |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 881 B |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1009 B |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 1001 B |
After Width: | Height: | Size: 1.3 KiB |
@ -0,0 +1,156 @@
|
|||||||
|
/* larger canvas, spectrum + EQ visualization and other items */
|
||||||
|
|
||||||
|
.ui360-vis,
|
||||||
|
.ui360-vis .sm2-360ui,
|
||||||
|
.sm2-inline-list .ui360-vis {
|
||||||
|
/* size of the container for the circle, etc. */
|
||||||
|
width:256px;
|
||||||
|
height:256px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis {
|
||||||
|
position:relative;
|
||||||
|
/* a little extra spacing */
|
||||||
|
padding-top:1px;
|
||||||
|
padding-bottom:1px;
|
||||||
|
margin-bottom:-18px; /* approximate "line height" we want */
|
||||||
|
padding-left:248px;
|
||||||
|
margin-left:0px;
|
||||||
|
background-position:22.6% 50%; /* (~109px) initial play button position */
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis {
|
||||||
|
cursor:pointer
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis a {
|
||||||
|
font:14px "helvetica neue",helvetica,monaco,lucida,terminal,monospace;
|
||||||
|
white-space:nowrap;
|
||||||
|
text-indent:0px; /* undo inline style */
|
||||||
|
top:46%; /* ehh. */
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis a {
|
||||||
|
line-height:256px;
|
||||||
|
top:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis .sm2-360ui {
|
||||||
|
margin-left:-256px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis .sm2-timing {
|
||||||
|
font:bold 24px "helvetica neue",helvetica,monaco,lucida,terminal,monospace;
|
||||||
|
color:#333;
|
||||||
|
text-align:center;
|
||||||
|
line-height:256px;
|
||||||
|
text-indent:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis,
|
||||||
|
.sm2-inline-list .ui360-vis .sm2-360ui {
|
||||||
|
margin-left:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis {
|
||||||
|
margin:8px 13px 7px 0px;
|
||||||
|
padding-left:0px;
|
||||||
|
background-position:50% 50%; /* initial play button position */
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis .sm2-360ui {
|
||||||
|
border:1px solid #eee;
|
||||||
|
/* offset the border */
|
||||||
|
margin-left:-1px;
|
||||||
|
margin-top:-1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis a {
|
||||||
|
position:absolute;
|
||||||
|
display:inline;
|
||||||
|
left:0px;
|
||||||
|
bottom:0px;
|
||||||
|
top:1px;
|
||||||
|
width:100%; /* 2px padding in box */
|
||||||
|
height:99%; /* dumb vertical hack */
|
||||||
|
*height:256px; /* IE is dumb. */
|
||||||
|
overflow:hidden;
|
||||||
|
font-size:small;
|
||||||
|
font-weight:300;
|
||||||
|
color:#333;
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
line-height:488px; /* bottom vertical alignment for text */
|
||||||
|
*line-height:480px; /* IE again */
|
||||||
|
text-align:center;
|
||||||
|
border-radius:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360 a:hover {
|
||||||
|
background-color:transparent; /* reset */
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis:hover .sm2-360ui,
|
||||||
|
.sm2-inline-list .ui360-vis a.sm2_link:hover,
|
||||||
|
.sm2-inline-list .ui360-vis a.sm2_link:active,
|
||||||
|
.sm2-inline-list .ui360-vis a.sm2_link:focus {
|
||||||
|
background-color:transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360-vis:hover a.sm2_link {
|
||||||
|
background-color:#fafafa;
|
||||||
|
*background-color:transparent; /* eh, screw IE. */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Use a bigger loading image for this layout */
|
||||||
|
|
||||||
|
.ui360-vis .sm2-360btn,
|
||||||
|
.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn,
|
||||||
|
.ui360-vis .sm2-360ui.sm2_playing .sm2-360btn {
|
||||||
|
width:48px;
|
||||||
|
height:48px;
|
||||||
|
margin-left:-24px;
|
||||||
|
margin-top:-24px;
|
||||||
|
border-radius: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis,
|
||||||
|
.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn,
|
||||||
|
.ui360-vis .sm2-360btn-default {
|
||||||
|
background:transparent url(360-button-vis-play.png) no-repeat 50% 50%;
|
||||||
|
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAABuVBMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADv7++lpaXr6+uAgIDk5OQzMzPt7e1tbW3n5+dgYGDW1tZNTU10dHQ5OTnw8PCvr6/e3t6JiYlAQEDb29vo6OgrKyuqqqrq6uq4uLjf399AQEDGxsbq6uqAgIDY2Nje3t61tbXp6enU1NTu7u7r6+vl5eXt7e2fn5/n5+fDw8Ph4eHv7+/t7e3CwsLW1tbu7u7b29vw8PDm5uYgICDp6enY2Nji4uLo6Ojm5uakpKTS0tLPz8/h4eHw8PDs7Ozj4+Pa2trg4ODx8fHT09Pk5OTPz8/S0tLBwcGmpqawsLCOjo7h4eHn5+fo6OgAAADY2NjNzc3n5+cAAADd3d3Gxsbu7u7t7e0AAADX19fl5eXi4uLf39/Hx8fn5+fs7Ozg4ODR0dHX19e4uLjv7+/z8/P09PTy8vL19fXv7+/n5+fx8fH29vbs7Ozq6urm5ubo6Ojw8PDu7u7p6enr6+sAAAB/f3/Z2dn39/fh4eGOjo4ODg7t7e3l5eWWlpba2tqjo6NVVVXk5OTe3t65ubnMzMzExMTf39/GxsampqZiYmJNcTiZAAAAbXRSTlMAAQIEAwcFCAb5EdAImAXpB6oIUAoLCfsgZQ0EVrsGEr4ZYQgbsgpUYxikNd/aatQQli+R7rlUUdas6+8I+VaFruoOOV/S8Nq5sWL8UqmKUFsuHyTcrtsJm0z7C49V3NMKkdKXuk7S7oVeVSv7tAAEVwAAAu5JREFUeF6llmVz3DwURmNLsr1pmJmZmZmxzMwsybS8gXJfhl9cKXbHEK+TmZ4P/nDnOXN1NbalHD8CQ7QRGDmhnIQhBDYQnkhheRECSVIQQrLMHookAciUkHhBw1zVwuLShcJIpPDC0uJC1VxDQTaFx1srSvM3DUxU1TRVlWBjM7+0opUrQaupLSnrLK7ELIepwaCYmbiyuLOspJY38eeLykdGxzDhYQfKCmOjI+VFPkMQYF7NZD0l2DgFJrR+siYPegxBzBvqeoQxpgGw8qOuoTz3HGw9udUPCaFZIORhdS5blZOHjXWDBIdABusanb0S4MpqEw4XcNPqCrQFQQTN+XwPQ8CY5jcDUbB3KLdlg6hnQDZacqEgWA3a2rF6Jri9zWohwI6dXXK2QHZ3OqBw0qC7B6vnAPd0sxZMkHr7VNPD34YZgNrXK3EBSgPU9HJ4eIQDDDogQS4ow4QJxy4+MmKs4oYJZFhhggjQuMoKHoHzn3bsQx1HQOTClOkXLP6lviZTtjCjmn7B5g/izqszliBHTB+HDhl3PSJbwnxSS3n45HDkVLXkvCWg5Uws7eHgJ98/uKqxzLI9w3o6oXuwhd+OPNVEet0WtnU9/sWNJfz1u6cY1/VtLghQuRgk/PmBmT7hogJPXo3L8YQed3Nw8PWfuB89Eb8scUGUrl33DfH/N93BGeH6NUnkArh1O5FOuNETp2GR27cAE/iaJu6mz8HdCQnan+i96XQmdgaZ9PQ9+xMVoPJgNhrNhBKNzj5Q+E/AavH4SSz6OZRo7Mlj3oDDp7jyPJoKJfr8CpvAOUrQi6eppJaVZOrpCwTdP1cgr93UjKxoN9dka2KX8ealZtBADO3lG2+e7xRAd7Y0igOg2tYdBKD/CBIBenf/lYGJD2y8uv8OgaBDDkry3v57SlQXhL7f35OlwJOXGUBBl571JykmzCIE02T/s0tIASyf/R6Arr59fcM62G+8fnsVhdwFwq4Ov345Of/15wd0RYY81HHUTQAAAABJRU5ErkJggg==);
|
||||||
|
*background-image:url(360-button-vis-play.png);
|
||||||
|
_background:transparent url(360-button-vis-play.gif) no-repeat 50% 50%;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis:hover .sm2-360btn,
|
||||||
|
.ui360-vis .sm2-360btn-default:hover,
|
||||||
|
.ui360-vis .sm2-360ui.sm2_paused .sm2-360btn:hover {
|
||||||
|
background:transparent url(360-button-vis-play-light.png) no-repeat 50% 50%;
|
||||||
|
_background:transparent url(360-button-vis-play.gif) no-repeat 50% 50%;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.ui360-vis .sm2-360ui.sm2_playing .sm2-360btn:hover,
|
||||||
|
.ui360-vis .sm2-360btn-playing:hover {
|
||||||
|
background:transparent url(360-button-vis-pause-light.png) no-repeat 50% 50%;
|
||||||
|
_background:transparent url(360-button-vis-pause-light.gif) no-repeat 50% 50%;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis {
|
||||||
|
/* non-JS / before-loaded state */
|
||||||
|
background-position: 21% 50%;
|
||||||
|
_background:transparent url(360-button-vis-play.gif) no-repeat 21% 50%; /* IE 6-only: special crap GIF */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis .sm2-360btn-default {
|
||||||
|
/* real button, post-loaded state */
|
||||||
|
_background:transparent url(360-button-vis-play.gif) no-repeat 50% 50%; /* IE 6-only: special crap GIF */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360-vis .sm2-360ui.sm2_dragging .sm2-360btn {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
@ -0,0 +1,271 @@
|
|||||||
|
/* General warning: Beta-ish. Code could be a bit cleaner. */
|
||||||
|
|
||||||
|
.ui360, /* entire UI */
|
||||||
|
.sm2-360ui { /* canvas container */
|
||||||
|
position:relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360,
|
||||||
|
.sm2-360ui {
|
||||||
|
min-width:50px; /* should always be at least this. */
|
||||||
|
min-height:50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-360ui {
|
||||||
|
width:50px;
|
||||||
|
height:50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360,
|
||||||
|
.ui360 * {
|
||||||
|
vertical-align:middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-360ui {
|
||||||
|
position:relative;
|
||||||
|
display:inline-block; /* firefox 3 et al */
|
||||||
|
float:left; /* IE 6+7, firefox 2 needs this, inline-block would work with fx3 and others */
|
||||||
|
*display:inline;
|
||||||
|
/*
|
||||||
|
clear:left;
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-360ui.sm2_playing,
|
||||||
|
.sm2-360ui.sm2_paused {
|
||||||
|
/* bump on top when active */
|
||||||
|
z-index:10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 a { /* .sm2_link class added to playable links by SM2 */
|
||||||
|
float:left;
|
||||||
|
display:inline;
|
||||||
|
position:relative;
|
||||||
|
color:#000;
|
||||||
|
text-decoration:none;
|
||||||
|
left:3px; /* slight spacing on left UI */
|
||||||
|
top:18px; /* vertical align */
|
||||||
|
text-indent:50px; /* make room for UI at left */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 a.sm2_link { /* SM2 has now started */
|
||||||
|
text-indent:0px; /* UI now in place. */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 a,
|
||||||
|
.ui360 a:hover,
|
||||||
|
.ui360 a:focus {
|
||||||
|
padding:2px;
|
||||||
|
margin-left:-2px;
|
||||||
|
margin-top:-2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 a:hover,
|
||||||
|
.ui360 a:focus {
|
||||||
|
background:#eee;
|
||||||
|
border-radius:3px;
|
||||||
|
outline:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-canvas {
|
||||||
|
position:absolute;
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-timing {
|
||||||
|
position:absolute;
|
||||||
|
display:block;
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
margin:0px;
|
||||||
|
font:11px "helvetica neue",helvetica,monaco,lucida,terminal,monospace;
|
||||||
|
color:#666;
|
||||||
|
text-align:center;
|
||||||
|
line-height:50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-timing.alignTweak {
|
||||||
|
text-indent:1px; /* devious center-alignment tweak for Safari (might break things for others.) */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-cover {
|
||||||
|
position:absolute;
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
z-index:2;
|
||||||
|
display:none;
|
||||||
|
background-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==); /* old-skool bug: IE 9 won't catch mouse events otherwise. /smash */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360btn {
|
||||||
|
position:absolute;
|
||||||
|
display:block;
|
||||||
|
top:50%;
|
||||||
|
left:50%;
|
||||||
|
/*
|
||||||
|
width:22px;
|
||||||
|
height:22px;
|
||||||
|
margin-left:-11px;
|
||||||
|
margin-top:-11px;
|
||||||
|
*/
|
||||||
|
/* by default, cover whole space. make smaller when playing. */
|
||||||
|
width:50px;
|
||||||
|
height:50px;
|
||||||
|
margin-left:-25px;
|
||||||
|
margin-top:-25px;
|
||||||
|
border-radius: 25px;
|
||||||
|
cursor:pointer;
|
||||||
|
z-index:3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360data {
|
||||||
|
display:inline-block;
|
||||||
|
font-family:helvetica;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-block .ui360 .sm2-360btn,
|
||||||
|
.ui360 .sm2-360ui.sm2_playing .sm2-360btn,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-360btn {
|
||||||
|
/* smaller clickable button, in center */
|
||||||
|
width:22px;
|
||||||
|
height:22px;
|
||||||
|
margin-left:-11px;
|
||||||
|
margin-top:-11px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_playing .sm2-cover,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-cover {
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* this could be optimized a fair bit. */
|
||||||
|
|
||||||
|
.ui360,
|
||||||
|
.ui360 .sm2-360btn-default,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-360btn {
|
||||||
|
background:transparent url(360-button-play.png) no-reoeat;
|
||||||
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAABoUlEQVR42sWVu2oCQRhGU/s8gpVYJeQJNkZSbiH4QNuLlQZS21sJayGYaOEFVFDxNiremj9zig2uzk5YQpKFg8PMd75ZZle9E5Ff4e+Ll8tlQuNoPI2vUcCYOdbIxCmm9F5T0YgNMmS/LebSwWdNa7VayXq9ls1mI9vtVna7nQBj5lgjQxYHN7KY3QkiUbDf7+V4PMrpdArBHGtkyOJc3/n1mVaUUl+F5/PZSrABDi4dpmKH3QkixQEHlw5TsccZmsRCoSD1et1ajkuHqdg/HA5GKZPJCOTzeanVasYMLh2mYsXDIGAoDuG6rlSr1WCdBxrcsTIWazgrQiHS6bSRYJ3XDzeq2O/3+9Ltdm9IpVIhstmslEqlUAY36ii8ZrMpjUbjhmQyKeA4jhSLRWMGN+rhOZ1Oh8ANuVxOyuUy40hwo163RK/XeyPQbrdjgYNr/ILAYDB41Gf1wZnFAQfX+iM0HA5fxuPx+2g0Ej22QoYsDq61mGsymTxMp9NX/Sk2yJDFsRZfXpzXbDZ7WiwW3nw+9zUKGDPHGpkL5V//mn7OJyJZApyzeUS5AAAAAElFTkSuQmCC);
|
||||||
|
*background-image: url(360-button-play.png);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 {
|
||||||
|
/*
|
||||||
|
"fake" button shown before SM2 has started, non-JS/non-SM2 case etc.
|
||||||
|
background image will be removed via JS, in threeSixyPlayer.init()
|
||||||
|
*/
|
||||||
|
background-position: 14px 50%;
|
||||||
|
_background:transparent url(360-button-play.gif) no-repeat 14px 50%; /* IE 6-only: special crap GIF */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360btn-default,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-360btn {
|
||||||
|
background-position:50% 50%;
|
||||||
|
_background:transparent url(360-button-play.gif) no-repeat 50% 50%; /* IE 6-only: special crap GIF */
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360btn-default,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-360btn {
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360btn-default:hover,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-360btn:hover {
|
||||||
|
background:transparent url(360-button-play-light.png) no-repeat 50% 50%;
|
||||||
|
_background:transparent url(360-button-play.gif) no-repeat 50% 50%;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_playing .sm2-360btn:hover,
|
||||||
|
.ui360 .sm2-360btn-playing:hover {
|
||||||
|
background:transparent url(360-button-pause-light.png) no-repeat 50% 50%;
|
||||||
|
_background:transparent url(360-button-pause-light.gif) no-repeat 50% 50%;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_playing .sm2-timing {
|
||||||
|
visibility:visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_buffering .sm2-timing {
|
||||||
|
visibility:hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui .sm2-timing,
|
||||||
|
.ui360 .sm2-360ui .sm2-360btn:hover + .sm2-timing,
|
||||||
|
.ui360 .sm2-360ui.sm2_paused .sm2-timing {
|
||||||
|
visibility:hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_dragging .sm2-timing,
|
||||||
|
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover + .sm2-timing {
|
||||||
|
/* paused + dragging */
|
||||||
|
visibility:visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_playing .sm2-360btn,
|
||||||
|
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn,
|
||||||
|
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover,
|
||||||
|
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn-playing:hover {
|
||||||
|
/* don't let pause button show on hover when dragging (or paused and dragging) */
|
||||||
|
background:transparent;
|
||||||
|
cursor:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 .sm2-360ui.sm2_buffering .sm2-360btn,
|
||||||
|
.ui360 .sm2-360ui.sm2_buffering .sm2-360btn:hover {
|
||||||
|
background:transparent url(icon_loading_spinner.gif) no-repeat 50% 50%;
|
||||||
|
opacity:0.5;
|
||||||
|
visibility:visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* inline list style */
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360,
|
||||||
|
.sm2-inline-block .ui360 {
|
||||||
|
position:relative;
|
||||||
|
display:inline-block;
|
||||||
|
float:left;
|
||||||
|
_display:inline;
|
||||||
|
margin-bottom:-15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360 {
|
||||||
|
/* inline player: minor tweak, tighten spacing */
|
||||||
|
margin-right:-2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-block .ui360 {
|
||||||
|
margin-right:8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-inline-list .ui360 a {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* annotations */
|
||||||
|
|
||||||
|
ul.ui360playlist {
|
||||||
|
list-style-type:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.ui360playlist,
|
||||||
|
ul.ui360playlist li {
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.ui360 div.metadata {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.ui360 a span.metadata,
|
||||||
|
div.ui360 a span.metadata * {
|
||||||
|
/* name of track, note etc. */
|
||||||
|
vertical-align:baseline;
|
||||||
|
}
|
@ -0,0 +1,132 @@
|
|||||||
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||||
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
|
||||||
|
<head>
|
||||||
|
<title>360° MP3 player UI demo (SoundManager 2): Javascript + Canvas Visualization, basic example</title>
|
||||||
|
<meta name="robots" content="noindex" />
|
||||||
|
<meta name="description" content="Basic example of 360-degree circular control for MP3 links, with EQ and spectrum visualization options" />
|
||||||
|
<!-- demo: make the fonts nicer etc. -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="../index.css" />
|
||||||
|
|
||||||
|
<!-- soundManager.useFlashBlock: related CSS -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="../flashblock/flashblock.css" />
|
||||||
|
|
||||||
|
<!-- required -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="360player.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="360player-visualization.css" />
|
||||||
|
|
||||||
|
<!-- special IE-only canvas fix -->
|
||||||
|
<!--[if IE]><script type="text/javascript" src="script/excanvas.js"></script><![endif]-->
|
||||||
|
|
||||||
|
<!-- Apache-licensed animation library -->
|
||||||
|
<script type="text/javascript" src="script/berniecode-animator.js"></script>
|
||||||
|
|
||||||
|
<!-- the core stuff -->
|
||||||
|
<script type="text/javascript" src="../../script/soundmanager2.js"></script>
|
||||||
|
<script type="text/javascript" src="script/360player.js"></script>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
|
soundManager.setup({
|
||||||
|
// path to directory containing SM2 SWF
|
||||||
|
url: '../../swf/'
|
||||||
|
});
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.scaleFont = (navigator.userAgent.match(/msie/i)?false:true);
|
||||||
|
threeSixtyPlayer.config.showHMSTime = true;
|
||||||
|
|
||||||
|
// enable some spectrum stuffs
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.useWaveformData = true;
|
||||||
|
threeSixtyPlayer.config.useEQData = true;
|
||||||
|
|
||||||
|
// enable this in SM2 as well, as needed
|
||||||
|
|
||||||
|
if (threeSixtyPlayer.config.useWaveformData) {
|
||||||
|
soundManager.flash9Options.useWaveformData = true;
|
||||||
|
}
|
||||||
|
if (threeSixtyPlayer.config.useEQData) {
|
||||||
|
soundManager.flash9Options.useEQData = true;
|
||||||
|
}
|
||||||
|
if (threeSixtyPlayer.config.usePeakData) {
|
||||||
|
soundManager.flash9Options.usePeakData = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (threeSixtyPlayer.config.useWaveformData || threeSixtyPlayer.flash9Options.useEQData || threeSixtyPlayer.flash9Options.usePeakData) {
|
||||||
|
// even if HTML5 supports MP3, prefer flash so the visualization features can be used.
|
||||||
|
soundManager.preferFlash = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// favicon is expensive CPU-wise, but can be enabled.
|
||||||
|
threeSixtyPlayer.config.useFavIcon = false;
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<link rel="stylesheet" type="text/css" href="demo.css" />
|
||||||
|
<style type="text/css">
|
||||||
|
|
||||||
|
#left h2 {
|
||||||
|
padding-top:0px;
|
||||||
|
margin-bottom:0.25em;
|
||||||
|
color:#666;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre.block {
|
||||||
|
margin-top:0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* special case */
|
||||||
|
|
||||||
|
#left {
|
||||||
|
width:auto;
|
||||||
|
max-width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div id="left">
|
||||||
|
|
||||||
|
<h1><a href="http://schillmania.com/projects/soundmanager2/demo/360-player/">360° Player Demo</a> - Visualization Example, Basic Template</h1>
|
||||||
|
|
||||||
|
<p class="note" style="color:#666;margin-bottom:0.5em">Canvas-based UI with visualization options. <b>Note: No EQ/spectrum support for IE < 9 (too slow.) Data not implemented in HTML5.</b></p>
|
||||||
|
|
||||||
|
<div style="clear:left"></div>
|
||||||
|
|
||||||
|
<div id="sm2-container">
|
||||||
|
<!-- sm2 flash goes here -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- here are the MP3 links, which are decorated with the 360 canvas element/UI etc. -->
|
||||||
|
|
||||||
|
<h2 style="margin-top:1em">Inline list</h2>
|
||||||
|
|
||||||
|
<div class="sm2-inline-list"> <!-- remove this class to have one item per line -->
|
||||||
|
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/mpc/audio/CRASH_1.mp3">Crash 1</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/mpc/audio/CRASH_5.mp3">Crash 5</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/mpc/audio/CRASH_6.mp3">Crash 6</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/mpc/audio/CHINA_1.mp3">China 1</a></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2 style="clear:both;padding-top:1em">Block list</h2>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/_mp3/sine,%20square,%20sawtooth,%20rando.mp3">Sine, Square, Sawtooth, Wave (Warning: LOUD)</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/_mp3/1hz-10khz-sweep.mp3">1-10 Khz Sweep (Warning: LOUD)</a></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p style="margin-left:1em">
|
||||||
|
<a href="http://www.schillmania.com/projects/soundmanager2/" title="SoundManager 2 home">SoundManager 2 project page</a> (not an MP3 link)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -0,0 +1,359 @@
|
|||||||
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||||
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
|
||||||
|
<head>
|
||||||
|
<title>360° MP3 player UI demo (SoundManager 2): Javascript + Canvas Visualization</title>
|
||||||
|
<meta name="robots" content="noindex" />
|
||||||
|
<meta name="description" content="Javascript + Canvas + SoundManager 2: 360-degree circular control / jog wheel example for playing MP3 links, with EQ and spectrum visualization options" />
|
||||||
|
<!-- demo, make the fonts nicer etc. -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="../index.css" />
|
||||||
|
|
||||||
|
<!-- soundManager.useFlashBlock: related CSS -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="../flashblock/flashblock.css" />
|
||||||
|
|
||||||
|
<!-- required -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="360player.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="360player-visualization.css" />
|
||||||
|
|
||||||
|
<!-- special IE-only canvas fix -->
|
||||||
|
<!--[if IE]><script type="text/javascript" src="script/excanvas.js"></script><![endif]-->
|
||||||
|
|
||||||
|
<!-- Apache-licensed animation library -->
|
||||||
|
<script type="text/javascript" src="script/berniecode-animator.js"></script>
|
||||||
|
|
||||||
|
<!-- the core stuff -->
|
||||||
|
<script type="text/javascript" src="../../script/soundmanager2.js"></script>
|
||||||
|
<script type="text/javascript" src="script/360player.js"></script>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
|
soundManager.setup({
|
||||||
|
// path to directory containing SM2 SWF
|
||||||
|
url: '../../swf/'
|
||||||
|
});
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.scaleFont = (navigator.userAgent.match(/msie/i)?false:true);
|
||||||
|
threeSixtyPlayer.config.showHMSTime = true;
|
||||||
|
|
||||||
|
// enable some spectrum stuffs
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.useWaveformData = true;
|
||||||
|
threeSixtyPlayer.config.useEQData = true;
|
||||||
|
|
||||||
|
// enable this in SM2 as well, as needed
|
||||||
|
|
||||||
|
if (threeSixtyPlayer.config.useWaveformData) {
|
||||||
|
soundManager.flash9Options.useWaveformData = true;
|
||||||
|
}
|
||||||
|
if (threeSixtyPlayer.config.useEQData) {
|
||||||
|
soundManager.flash9Options.useEQData = true;
|
||||||
|
}
|
||||||
|
if (threeSixtyPlayer.config.usePeakData) {
|
||||||
|
soundManager.flash9Options.usePeakData = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (threeSixtyPlayer.config.useWaveformData || threeSixtyPlayer.flash9Options.useEQData || threeSixtyPlayer.flash9Options.usePeakData) {
|
||||||
|
// even if HTML5 supports MP3, prefer flash so the visualization features can be used.
|
||||||
|
soundManager.preferFlash = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// favicon is expensive CPU-wise, but can be used.
|
||||||
|
if (window.location.href.match(/hifi/i)) {
|
||||||
|
threeSixtyPlayer.config.useFavIcon = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (window.location.href.match(/html5/i)) {
|
||||||
|
// for testing IE 9, etc.
|
||||||
|
soundManager.useHTML5Audio = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- DEMO only, customization UI: Yahoo! YUI colorpicker stuff -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/slider/assets/skins/sam/slider.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/colorpicker/assets/skins/sam/colorpicker.css" />
|
||||||
|
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
|
||||||
|
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/animation/animation-min.js"></script>
|
||||||
|
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/dragdrop/dragdrop-min.js"></script>
|
||||||
|
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/slider/slider-min.js"></script>
|
||||||
|
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/element/element-min.js"></script>
|
||||||
|
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/colorpicker/colorpicker-min.js"></script>
|
||||||
|
|
||||||
|
<link rel="stylesheet" type="text/css" href="demo.css" />
|
||||||
|
<style type="text/css">
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-image: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#left h2 {
|
||||||
|
padding-top:0px;
|
||||||
|
margin-bottom:0.25em;
|
||||||
|
color:#666;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre.block {
|
||||||
|
margin-top:0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* special case */
|
||||||
|
|
||||||
|
#left {
|
||||||
|
width:auto;
|
||||||
|
max-width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui360 span {
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<!-- demo configuration stuff, you don't need this -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="demo-slider-controls.css" />
|
||||||
|
<script type="text/javascript" src="demo-slider-controls.js"></script>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div id="left">
|
||||||
|
|
||||||
|
<h1><a href="http://www.schillmania.com/projects/soundmanager2/" title="Javascript MP3 player project home">SoundManager 2</a> / <a href="http://schillmania.com/projects/soundmanager2/demo/360-player/">360° Player Demo</a>: JS + Canvas Visualization</h1>
|
||||||
|
|
||||||
|
<p class="note" style="color:#666;margin-top:0.5em;margin-bottom:0.5em">Canvas-based UI with visualization options. <b>Note: Spectrum/EQ visualizations disabled for IE < 9 (too slow.) Data is not implemented under HTML5.</b></p>
|
||||||
|
<p class="note" style="color:#666;margin-bottom:0.5em">You can also <a href="#debug=1" onclick="window.location.href = this.href;window.location.reload()" title="Enable debug mode, show frames per second">show FPS</a><span id="config-link"> or <a href="#customize" onclick="window.location.href=this.href;window.location.reload()">customize the UI</a></span><span id="hifi">, or see the <a href="#hifi=1" onclick="window.location.href=this.href;window.location.reload()">hi-fi version</a></span>. Check the <a href="canvas-visualization-basic.html">basic template</a> for a minimal code example; also see the <a href="../360-player/" title="360° player UI">default 360° UI</a>.</p>
|
||||||
|
|
||||||
|
<!-- customization crap -->
|
||||||
|
|
||||||
|
<div id="config-ui" style="clear:both;position:relative;max-width:1110px;margin-top:1em;display:none">
|
||||||
|
|
||||||
|
<div style="position:relative">
|
||||||
|
|
||||||
|
<form action="#" method="get">
|
||||||
|
|
||||||
|
<div id="controls">
|
||||||
|
|
||||||
|
<div class="checkbox">
|
||||||
|
<div>
|
||||||
|
<input id="use-waveform" type="checkbox" checked="checked" title="Enable waveform feature." onclick="controller.updateExample();controller.updateExampleCode()" value="Apply" /> Waveform
|
||||||
|
<input id="disabled-1" type="checkbox" title="Enable EQ (spectrum) feature." onclick="controller.updateExample();controller.updateExampleCode()" value="Apply" style="margin-left:1em" checked="checked" /> EQ
|
||||||
|
<input type="checkbox" name="use-amplifier" id="use-amplifier" checked="checked" onclick="controller.updateExample();controller.updateExampleCode()" style="margin-left:1em"> Amplifier
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="clear:left"></div>
|
||||||
|
|
||||||
|
<dl class="col">
|
||||||
|
|
||||||
|
<dt>Circle Diameter</dt>
|
||||||
|
<dd class="title">Size</dd>
|
||||||
|
<dd>1-256</dd>
|
||||||
|
<dd class="control">
|
||||||
|
<div class="bar" title="Click to move here"></div>
|
||||||
|
<div class="slider" title="Size of circle"></div>
|
||||||
|
</dd>
|
||||||
|
|
||||||
|
<dt>Waveform Thickness</dt>
|
||||||
|
<dd class="title">thickness</dd>
|
||||||
|
<dd>1-100</dd>
|
||||||
|
<dd class="control">
|
||||||
|
<div class="bar" title="Click to move here"></div>
|
||||||
|
<div class="slider" title="Thickness of line"></div>
|
||||||
|
</dd>
|
||||||
|
|
||||||
|
<dt>Wave Downsample</dt>
|
||||||
|
<dd class="title">(Scale)</dd>
|
||||||
|
<dd>1-16</dd>
|
||||||
|
<dd class="control">
|
||||||
|
<div class="bar" title="Click to move here"></div>
|
||||||
|
<div class="slider" title="Amount to downsample waveform data by"></div>
|
||||||
|
</dd>
|
||||||
|
|
||||||
|
<dt>EQ Thickness</dt>
|
||||||
|
<dd class="title">thickness</dd>
|
||||||
|
<dd>1-50</dd>
|
||||||
|
<dd class="control">
|
||||||
|
<div class="bar" title="Click to move here"></div>
|
||||||
|
<div class="slider" title="Thickness of line"></div>
|
||||||
|
</dd>
|
||||||
|
|
||||||
|
<dt>EQ Downsample</dt>
|
||||||
|
<dd class="title">(Scale)</dd>
|
||||||
|
<dd>1-16</dd>
|
||||||
|
<dd class="control">
|
||||||
|
<div class="bar" title="Click to move here"></div>
|
||||||
|
<div class="slider" title="Amount to downsample EQ data by"></div>
|
||||||
|
</dd>
|
||||||
|
|
||||||
|
<dt>Ring Thickness</dt>
|
||||||
|
<dd class="title">(Scale)</dd>
|
||||||
|
<dd>1-200</dd>
|
||||||
|
<dd class="control">
|
||||||
|
<div class="bar" title="Click to move here"></div>
|
||||||
|
<div class="slider" title="Scale factor for the ring width"></div>
|
||||||
|
</dd>
|
||||||
|
|
||||||
|
</dl>
|
||||||
|
|
||||||
|
<div id="options" class="col">
|
||||||
|
|
||||||
|
<div>
|
||||||
|
Waveform position:
|
||||||
|
<input type="radio" name="waveform-inside" id="waveform-inside" value="true" checked="checked" onclick="controller.updateExample();controller.updateExampleCode()"> Inside | <input type="radio" name="waveform-inside" id="waveform-inside" value="false" onclick="controller.updateExample();controller.updateExampleCode()"> Outside
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
EQ position:
|
||||||
|
<input type="radio" name="eq-inside" id="eq-inside" value="true" onclick="controller.updateExample();controller.updateExampleCode()"> Inside | <input type="radio" name="eq-inside" id="eq-inside" value="false" checked="checked" onclick="controller.updateExample();controller.updateExampleCode()"> Outside
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
Waveform color:
|
||||||
|
<input type="text" name="waveform-color" id="waveform-color" value="#000000" onclick="createCP(this,setWaveformColor)" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
EQ color:
|
||||||
|
<input type="text" name="eq-color" id="eq-color" value="#000000" onclick="createCP(this,setEQColor)" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
Loaded ring color:
|
||||||
|
<input type="text" name="loaded-ring-color" id="loaded-ring-color" value="#000000" onclick="createCP(this,setLoadedRingColor)" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
Progress ring color:
|
||||||
|
<input type="text" name="progress-ring-color" id="progress-ring-color" value="#000000" onclick="createCP(this,setProgressRingColor)" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
Background ring color:
|
||||||
|
<input type="text" name="bg-ring-color" id="bg-ring-color" value="#000000" onclick="createCP(this,setBackgroundRingColor)" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="compact">
|
||||||
|
<input type="button" onclick="controller.randomize()" value="Randomize controls" title="Assign random control values" style="font-size:x-small" />
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="cp-container">
|
||||||
|
<!-- color picker stuff goes here -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="config-code-block" style="float:right;display:inline;margin-left:1em;margin-top:-0.7em">
|
||||||
|
<!--
|
||||||
|
<pre id="config-link" class="block"><code style="cursor:pointer" onclick="document.getElementById('config-link').style.display='none';document.getElementById('config-pre-block').style.display='block';return false"> [click to show code] </code></pre>
|
||||||
|
-->
|
||||||
|
<pre id="config-pre-block" class="block"><code id="config-code">Code goes here</code></pre>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p style="clear:left">Get a sound playing, then adjust the values to see real-time updates.</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- here are the MP3 links, which are decorated with the 360 canvas element/UI etc. -->
|
||||||
|
|
||||||
|
<div id="sm2-container">
|
||||||
|
<!-- sm2 flash goes here -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2 style="margin-top:1em">Inline list</h2>
|
||||||
|
|
||||||
|
<div class="sm2-inline-list"> <!-- remove this class to have one item per line -->
|
||||||
|
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/sm2/The%20Fugitives%20-%20Graffiti%20Sex.mp3">The Fugitives - Graffiti Sex</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/sm2/Adrian%20Glynn%20-%20Blue%20Belle%20Lament.mp3">Adrian Glynn - Blue Belle Lament</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/sm2/SonReal%20-%20I%20Tried.mp3">SonReal - I Tried</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/sm2/SonReal%20-%20People%20Asking.mp3">SonReal - People Asking</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/mpc/20060826%20-%20Armstrong.mp3">20060826 - Armstrong Groove</a></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="note medium-note" style="clear:both"><b>Artist thank-yous</b>: "Graffiti Sex" courtesy of <a href="http://www.fugitives.ca/" title="A group of musicians, poets, and multi-instrumentalists from Vancouver, Canada">The Fugitives</a>. "Blue Belle Lament" courtesy of <a href="http://www.adrianglynn.com/" title="Adrian Glynn, Vancouver-based Singer/Songwriter">Adrian Glynn</a>. "I Tried" and "People Asking" courtesy of <a href="http://sonreal.bandcamp.com/album/the-lightyear-mixtape" title="The Lightyear Mixtape from SonReal, Vancouver-based hip-hop artist">SonReal</a>.</p>
|
||||||
|
|
||||||
|
<h2 style="clear:left;padding-top:1em">Block list</h2>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/mpc/20090207%20-%20Loverman.mp3">20090207 - Loverman</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="http://freshly-ground.com/data/audio/sm2/dialup.mp3">56K Modem dial-up sound (Warning: <span style="color:#ff3333">LOUD</span>)</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/_mp3/1hz-10khz-sweep.mp3">1-10 Khz Sweep (Warning: <span style="color:#ff3333">LOUD</span>)</a></div>
|
||||||
|
<div class="ui360 ui360-vis"><a href="../../demo/_mp3/sine,%20square,%20sawtooth,%20rando.mp3">Sine, Square, Sawtooth, Wave (Warning: <span style="color:#ff3333">LOUD</span>)</a></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="note medium-note" style="clear:left">56K Modem sound (Creative Commons license) via <a href="http://www.freesound.org/samplesViewSingle.php?id=16475">dialup.mp3</a>, from freesound.org user <a href="http://www.freesound.org/usersViewSingle.php?id=54447">Jlew</a>.</p>
|
||||||
|
|
||||||
|
|
||||||
|
<h2 style="clear:left;padding-top:1em">Variant: Annotations/meta-data</h2>
|
||||||
|
|
||||||
|
|
||||||
|
<ul class="ui360playlist">
|
||||||
|
|
||||||
|
<li>
|
||||||
|
|
||||||
|
<div class="ui360 ui360-vis">
|
||||||
|
<a href="http://freshly-ground.com/data/audio/binaural/A%20Virtual%20Haircut%20in%20San%20Francisco%20%283%20Scenes%29.mp3">A Virtual Haircut (3 scenes)</a>
|
||||||
|
<div class="metadata">
|
||||||
|
<div class="duration">4:43</div> <!-- total track time (for positioning while loading, until determined -->
|
||||||
|
<ul>
|
||||||
|
<li><p>Electric razor</p><span>0:00</span></li> <!-- first scene -->
|
||||||
|
<li><p>Water, scissors</p><span>2:41</span></li> <!-- start time of second scene -->
|
||||||
|
<li><p>More razor work</p><span>4:00</span></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
|
||||||
|
<div class="ui360 ui360-vis">
|
||||||
|
<a href="http://freshly-ground.com/data/audio/binaural/Rubber%20Chicken%20Launch%20%28office%29.mp3">Rubber Chicken Launch (Office)</a>
|
||||||
|
|
||||||
|
<div class="metadata">
|
||||||
|
<div class="duration">0:47</div>
|
||||||
|
<ul>
|
||||||
|
<li><p>First attempt</p><span>0:00</span></li>
|
||||||
|
<li><p>Fire!</p><span>0:02</span></li>
|
||||||
|
<li><p>"Too much angle"</p><span>0:05</span></li>
|
||||||
|
<li><p>Random chicken noise</p><span>0:18</span></li>
|
||||||
|
<li><p>"Wait a second"</p><span>0:31</span></li>
|
||||||
|
<li><p>Derrr..</p><span>0:34</span></li>
|
||||||
|
<li><p>Launch attempt #2</p><span>0:36</span></li>
|
||||||
|
<li><p>"Wrong angle"</p><span>0:39</span></li>
|
||||||
|
<li><p>"Fail"</p><span>0:42</span></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div style="clear:both"></div>
|
||||||
|
|
||||||
|
<p style="margin-left:1em">
|
||||||
|
<a href="http://www.schillmania.com/projects/soundmanager2/" title="SoundManager 2 home">SoundManager 2 project page</a> (not an MP3 link)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
if (window.location.toString().match(/#customize/i)) {
|
||||||
|
document.getElementById('config-link').style.display = 'none';
|
||||||
|
document.getElementById('config-ui').style.display = 'block';
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -0,0 +1,179 @@
|
|||||||
|
#cp-container { position:relative;float:left;display:inline; margin-left:1em;padding: 6px; background-color: #f6f6f6; border:1px solid #eee; width: 320px; height:180px;z-index:2; }
|
||||||
|
|
||||||
|
.yui-picker-controls li,
|
||||||
|
.yui-picker-controls input {
|
||||||
|
font-size:1em;
|
||||||
|
font-family:"helvetica neue",helvetica,arial,verdana;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls {
|
||||||
|
position:relative;
|
||||||
|
margin-top:1.5em;
|
||||||
|
font-size:0.85em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#options {
|
||||||
|
float:left;
|
||||||
|
display:inline;
|
||||||
|
margin-bottom:0.5em;
|
||||||
|
margin-top:-1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .checkbox {
|
||||||
|
float:left;
|
||||||
|
display:inline;
|
||||||
|
width:21.2em;
|
||||||
|
margin-right:2.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .checkbox div {
|
||||||
|
/* tab */
|
||||||
|
width:auto;
|
||||||
|
padding:0.4em;
|
||||||
|
border:1px solid #ddd;
|
||||||
|
border-bottom:none;
|
||||||
|
background:#eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .checkbox div,
|
||||||
|
#controls .checkbox input {
|
||||||
|
font-family:arial,tahoma,verdana,"sans serif";
|
||||||
|
font-size:1em;
|
||||||
|
vertical-align:middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dl {
|
||||||
|
width:21em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dl.col {
|
||||||
|
position:relative;
|
||||||
|
float:left;
|
||||||
|
display:inline;
|
||||||
|
margin:0px;
|
||||||
|
margin-right:1em;
|
||||||
|
padding:0.75em;
|
||||||
|
/*
|
||||||
|
height:12.4em;
|
||||||
|
*/
|
||||||
|
height:auto;
|
||||||
|
border:1px solid #ddd;
|
||||||
|
background:#f6f6f6;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .disabled {
|
||||||
|
color:#ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .disabled dt,
|
||||||
|
#controls .disabled dd {
|
||||||
|
color:#999;
|
||||||
|
opacity:0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dl dd p {
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dt,
|
||||||
|
#controls dd {
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dt {
|
||||||
|
border-bottom:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dt {
|
||||||
|
float:left;
|
||||||
|
display:inline;
|
||||||
|
background:transparent;
|
||||||
|
padding-right:0.7em;
|
||||||
|
margin-right:0.7em;
|
||||||
|
border-right:1px solid #ccc;
|
||||||
|
font-size:1.1em;
|
||||||
|
color:#333;
|
||||||
|
font-family:"helvetica neue",helvetica,verdana,arial,"sans serif";
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls dd {
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
font-size:0.9em;
|
||||||
|
vertical-align:middle;
|
||||||
|
color:#666;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .title {
|
||||||
|
float:left;
|
||||||
|
display:inline;
|
||||||
|
margin-right:0.6em;
|
||||||
|
color:#333;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* those slider bits you might be wondering about */
|
||||||
|
|
||||||
|
#controls .control {
|
||||||
|
position:relative;
|
||||||
|
border-left:0px;
|
||||||
|
width:214px;
|
||||||
|
height:20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .control .bar {
|
||||||
|
position:absolute;
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
width:214px;
|
||||||
|
height:20px;
|
||||||
|
background:transparent url(../_image/slider-bar.gif) no-repeat 0px 9px;
|
||||||
|
cursor:pointer;
|
||||||
|
cursor:hand;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .control .slider {
|
||||||
|
position:absolute;
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
width:20px;
|
||||||
|
height:20px;
|
||||||
|
background:transparent url(../_image/slider.png) no-repeat 0px 0px;
|
||||||
|
*background:none;
|
||||||
|
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider.png');
|
||||||
|
cursor:pointer;
|
||||||
|
cursor:hand;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .control .slider:hover {
|
||||||
|
background:transparent url(../_image/slider-1.png) no-repeat 0px 0px;
|
||||||
|
*background:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .control .slider.hover {
|
||||||
|
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider-1.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .disabled .control .slider {
|
||||||
|
background:transparent url(../_image/slider-disabled.png) no-repeat 0px 0px;
|
||||||
|
*background:none;
|
||||||
|
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider-disabled.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .disabled .control .slider:hover {
|
||||||
|
background:transparent url(../_image/slider-disabled-1.png) no-repeat 0px 0px;
|
||||||
|
*background:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls .disabled .control .slider.hover {
|
||||||
|
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider-disabled-1.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
#controls input[type=text] {
|
||||||
|
width:5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#options div {
|
||||||
|
margin-bottom:0.25em;
|
||||||
|
}
|
@ -0,0 +1,750 @@
|
|||||||
|
/*
|
||||||
|
Ancient fireworks slider control code (2005)
|
||||||
|
Kinda/sorta refactored for SM2 360 demo
|
||||||
|
http://schillmania.com/projects/fireworks/
|
||||||
|
--------------------------------------------
|
||||||
|
Not required for your use!
|
||||||
|
*/
|
||||||
|
|
||||||
|
function Animator2() {
|
||||||
|
var self = this;
|
||||||
|
this.tweens = [];
|
||||||
|
this.tweens['default'] = [1,2,3,4,5,6,7,8,9,10,9,8,7,6,5,4,3,2,1];
|
||||||
|
this.tweens['blast'] = [12,12,11,10,10,9,8,7,6,5,4,3,2,1];
|
||||||
|
this.tweens['fade'] = [10,10,10,10,10,10,10,10,10,10];
|
||||||
|
this.queue = [];
|
||||||
|
this.queue.IDs = [];
|
||||||
|
this.active = false;
|
||||||
|
this.timer = null;
|
||||||
|
|
||||||
|
this.createTween = function(start,end,type) {
|
||||||
|
// return array of tween coordinate data (start->end)
|
||||||
|
type = type||'default';
|
||||||
|
var tween = [start];
|
||||||
|
var tmp = start;
|
||||||
|
var diff = end-start;
|
||||||
|
var x = self.tweens[type].length;
|
||||||
|
for (var i=0; i<x; i++) {
|
||||||
|
tmp += diff*self.tweens[type][i]*0.01;
|
||||||
|
tween[i] = new Object();
|
||||||
|
tween[i].data = tmp;
|
||||||
|
tween[i].event = null;
|
||||||
|
}
|
||||||
|
return tween;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.enqueue = function(o,fMethod,fOnComplete) {
|
||||||
|
// add object and associated methods to animation queue
|
||||||
|
// writeDebug('animator.enqueue()');
|
||||||
|
if (!fMethod) {
|
||||||
|
// writeDebug('animator.enqueue(): missing fMethod');
|
||||||
|
}
|
||||||
|
if (typeof(self.queue.IDs[o.oID])=='undefined') {
|
||||||
|
// writeDebug('animator.enqueue(): added '+o.oID);
|
||||||
|
var i = self.queue.length;
|
||||||
|
self.queue.IDs[o.oID] = i;
|
||||||
|
self.queue[i] = o;
|
||||||
|
} else {
|
||||||
|
// writeDebug('animator.enqueue(): '+o.oID+' already queued');
|
||||||
|
var i = self.queue.IDs[o.oID]; // retrieve queue index
|
||||||
|
self.queue[i].active = true;
|
||||||
|
self.queue[i].frame = 0;
|
||||||
|
}
|
||||||
|
o.active = true; // flag for animation
|
||||||
|
self.queue[i]._method = fMethod;
|
||||||
|
self.queue[i]._oncomplete = fOnComplete?fOnComplete:null;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.animate = function() {
|
||||||
|
var active = 0;
|
||||||
|
for (var i=self.queue.length; i--;) {
|
||||||
|
if (self.queue[i].active) {
|
||||||
|
self.queue[i]._method();
|
||||||
|
active++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (active==0 && self.timer) {
|
||||||
|
// all animations finished
|
||||||
|
self.stop();
|
||||||
|
} else {
|
||||||
|
// writeDebug(active+' active');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.start = function() {
|
||||||
|
if (self.timer || self.active) {
|
||||||
|
// writeDebug('animator.start(): already active');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
// writeDebug('animator.start()'); // report only if started
|
||||||
|
self.active = true;
|
||||||
|
self.timer = setInterval(self.animate,mc.intervalRate);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.stop = function() {
|
||||||
|
// writeDebug('animator.stop()',true);
|
||||||
|
clearInterval(self.timer);
|
||||||
|
self.timer = null;
|
||||||
|
self.active = false;
|
||||||
|
self.queue = [];
|
||||||
|
self.queue.IDs = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function MainController() {
|
||||||
|
var self = this;
|
||||||
|
this.intervalRate = 20; // rate (ms) to run animation at, general best default = 20
|
||||||
|
this.DEBUG = true; // debug mode disabled by default
|
||||||
|
this.oFW = null;
|
||||||
|
this.isIE = (navigator.appVersion.indexOf('MSIE')+1);
|
||||||
|
this.isOpera = (navigator.userAgent.toLowerCase().indexOf('opera')+1);
|
||||||
|
if (this.isOpera) this.isIE = false; // no impersonation allowed here!
|
||||||
|
this.animator = null;
|
||||||
|
this.gOID = 0; // global object ID counter (for animation queue)
|
||||||
|
this.particleTypes = 6;
|
||||||
|
this.particleXY = 10;
|
||||||
|
this.tweenFade = [100,90,80,70,60,50,40,30,20,10,0];
|
||||||
|
this.isSafari = (navigator.appVersion.toLowerCase().indexOf('safari')+1?1:0);
|
||||||
|
this.canvasX = null;
|
||||||
|
this.canvasY = null;
|
||||||
|
this.screenY = null; // screen area (not entire page)
|
||||||
|
self.scrollY = null;
|
||||||
|
|
||||||
|
self.getWindowCoords = function() {
|
||||||
|
self.canvasX = (document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth);
|
||||||
|
self.canvasY = (document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight);
|
||||||
|
self.screenY = self.canvasY;
|
||||||
|
self.scrollY = parseInt(window.scrollY||document.documentElement.scrollTop||document.body.scrollTop);
|
||||||
|
self.canvasY += self.scrollY;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.getWindowCoordsAlt = function() {
|
||||||
|
self.canvasX = window.innerWidth;
|
||||||
|
self.canvasY = window.innerHeight;
|
||||||
|
self.screenY = self.canvasY;
|
||||||
|
self.scrollY = parseInt(window.scrollY||document.documentElement.scrollTop||document.body.scrollTop);
|
||||||
|
self.canvasY += self.scrollY;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.getPanX = function(x) {
|
||||||
|
x = parseInt(x);
|
||||||
|
var pos = x/self.canvasX;
|
||||||
|
if (pos<0.4) {
|
||||||
|
pos *= -1;
|
||||||
|
} else if (pos >= 0.4 && pos <= 0.6) {
|
||||||
|
pos = 0.5;
|
||||||
|
}
|
||||||
|
pos = parseInt(pos*100);
|
||||||
|
// writeDebug('getPanX('+x+'): '+pos+'%');
|
||||||
|
return pos;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.isEmpty = function(o) {
|
||||||
|
// needs further hacking
|
||||||
|
return (typeof(o)=='undefined'||(o==null&&o!=0)||(o==''&&o!=0)||o=='null');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.init = function() {
|
||||||
|
// self.oFW = document.getElementById('fw');
|
||||||
|
// self.oFP = document.getElementById('fp');
|
||||||
|
// if (typeof(enableDebugMode)!='undefined' && (self.DEBUG||window.location.toString().toLowerCase().indexOf('debug')>=0)) enableDebugMode();
|
||||||
|
self.getWindowCoords();
|
||||||
|
self.animator = new Animator2();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.destructor = function() {
|
||||||
|
/*
|
||||||
|
for (var i=self.fireworks.length; i--;) {
|
||||||
|
self.fireworks[i] = null;
|
||||||
|
}
|
||||||
|
self.fireworks = null;
|
||||||
|
if (soundManager) {
|
||||||
|
soundManager.destructor();
|
||||||
|
soundManager = null;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.isSafari || this.isOpera) this.getWindowCoords = this.getWindowCoordsAlt;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function Controller(o) {
|
||||||
|
var self = this;
|
||||||
|
this.o = o;
|
||||||
|
this.controls = [];
|
||||||
|
this.cb = [];
|
||||||
|
this.options = [];
|
||||||
|
this.functionExample = document.getElementById('function-example');
|
||||||
|
this.fbIE = null;
|
||||||
|
|
||||||
|
this.randomize = function() {
|
||||||
|
for (var i=1; i<self.controls.length; i++) {
|
||||||
|
setTimeout(self.controls[i].randomize,20+(20*i+1));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.cbClick = function(nIndex) {
|
||||||
|
document.getElementById('controls').getElementsByTagName('dl')[nIndex].className = 'col'+(this.checked==false||this.checked==''?' disabled':'');
|
||||||
|
self.updateExample();
|
||||||
|
self.updateExampleCode();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateExample = function() {
|
||||||
|
if (threeSixtyPlayer) {
|
||||||
|
var val = self.controls[0].value;
|
||||||
|
threeSixtyPlayer.config.circleDiameter = self.controls[0].value;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.circleRadius = self.controls[0].value/2;
|
||||||
|
// update some stuff
|
||||||
|
|
||||||
|
// set the cover width/height to match the canvas
|
||||||
|
if (threeSixtyPlayer.lastSound) {
|
||||||
|
// always set cover to max area?
|
||||||
|
// threeSixtyPlayer.lastSound._data.oCover.style.width = 250+'px';
|
||||||
|
// threeSixtyPlayer.lastSound._data.oCover.style.height = 250+'px';
|
||||||
|
// threeSixtyPlayer.lastSound._data.oCover.style.width = threeSixtyPlayer.config.circleDiameter+'px';
|
||||||
|
// threeSixtyPlayer.lastSound._data.oCover.style.height = threeSixtyPlayer.config.circleDiameter+'px';
|
||||||
|
threeSixtyPlayer.refreshCoords(threeSixtyPlayer.lastSound);
|
||||||
|
}
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.waveformDataLineRatio = (self.controls[1].value/100)*2;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.waveformDataDownsample = (self.controls[2].value);
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.eqDataLineRatio = parseInt((self.controls[3].value/100)*3*1000)/1000;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.eqDataDownsample = (self.controls[4].value);
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.scaleArcWidth = (self.controls[5].value/100);
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.useEQData = (document.getElementById('disabled-1').checked?true:false);
|
||||||
|
|
||||||
|
// radio buttons
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.useWaveformData=(document.getElementById('use-waveform').checked?true:false);
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.waveformDataOutside = document.getElementById('waveform-inside').checked?false:true;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.eqDataOutside = document.getElementById('eq-inside').checked?false:true;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.useAmplifier = (document.getElementById('use-amplifier').checked?true:false);
|
||||||
|
|
||||||
|
// threeSixtyPlayer.refreshCoords();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (threeSixtyPlayer.lastSound) {
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.circleDiameter = self.controls[0].value;
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.circleRadius = self.controls[0].value/2;
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.waveformDataLineRatio = (self.controls[1].value/100)*2;
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.waveformDataDownsample = (self.controls[2].value);
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.eqDataLineRatio = parseInt((self.controls[3].value/100)*3*1000)/1000;
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.eqDataDownsample = (self.controls[4].value);
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.useEQData = (document.getElementById('disabled-1').checked?true:false);
|
||||||
|
|
||||||
|
// radio buttons
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.useWaveformData=(document.getElementById('use-waveform').checked?true:false);
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.waveformDataOutside = document.getElementById('waveform-inside').checked?false:true;
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.eqDataOutside = document.getElementById('eq-inside').checked?false:true;
|
||||||
|
|
||||||
|
threeSixtyPlayer.lastSound._360data.useAmplifier = (document.getElementById('use-amplifier').checked?true:false);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateExampleCode = function() {
|
||||||
|
// set innerHTML
|
||||||
|
document.getElementById('config-code').innerHTML = "\
|
||||||
|
// 360player.js, config section\n\
|
||||||
|
\n\
|
||||||
|
this.config = {\n\
|
||||||
|
\n\
|
||||||
|
playNext: <span>"+threeSixtyPlayer.config.playNext+"</span>,\n\
|
||||||
|
autoPlay: <span>"+threeSixtyPlayer.config.autoPlay+"</span>,\n\
|
||||||
|
allowMultiple: <span>"+threeSixtyPlayer.config.allowMultiple+"</span>,\n\
|
||||||
|
loadRingColor: <span>'"+threeSixtyPlayer.config.loadRingColor+"'</span>,\n\
|
||||||
|
playRingColor: <span>'"+threeSixtyPlayer.config.playRingColor+"'</span>,\n\
|
||||||
|
backgroundRingColor: <span>'"+threeSixtyPlayer.config.backgroundRingColor+"'</span>,\n\
|
||||||
|
circleDiameter: <span>"+threeSixtyPlayer.config.circleDiameter+"</span>,\n\
|
||||||
|
circleRadius: <span>"+threeSixtyPlayer.config.circleRadius+"</span>,\n\
|
||||||
|
animDuration: <span>"+threeSixtyPlayer.config.animDuration+"</span>,\n\
|
||||||
|
animTransition: <span>Animator.tx.bouncy</span>,\n\
|
||||||
|
showHMSTime: <span>"+threeSixtyPlayer.config.showHMSTime+"</span>,\n\
|
||||||
|
\n\
|
||||||
|
useWaveformData: <span>"+threeSixtyPlayer.config.useWaveformData+"</span>,\n\
|
||||||
|
waveformDataColor: <span>'"+threeSixtyPlayer.config.waveformDataColor+"'</span>,\n\
|
||||||
|
waveformDataDownsample: <span>"+threeSixtyPlayer.config.waveformDataDownsample+"</span>,\n\
|
||||||
|
waveformDataOutside: <span>"+threeSixtyPlayer.config.waveformDataOutside+"</span>,\n\
|
||||||
|
waveformDataConstrain: <span>false</span>,\n\
|
||||||
|
waveformDataLineRatio: <span>"+threeSixtyPlayer.config.waveformDataLineRatio+"</span>,\n\
|
||||||
|
\n\
|
||||||
|
useEQData: <span>"+threeSixtyPlayer.config.useEQData+"</span>,\n\
|
||||||
|
eqDataColor: <span>'"+threeSixtyPlayer.config.eqDataColor+"'</span>,\n\
|
||||||
|
eqDataDownsample: <span>"+threeSixtyPlayer.config.eqDataDownsample+"</span>,\n\
|
||||||
|
eqDataOutside: <span>"+threeSixtyPlayer.config.eqDataOutside+"</span>,\n\
|
||||||
|
eqDataLineRatio: <span>"+threeSixtyPlayer.config.eqDataLineRatio+"</span>,\n\
|
||||||
|
\n\
|
||||||
|
usePeakData: <span>"+threeSixtyPlayer.config.usePeakData+"</span>,\n\
|
||||||
|
peakDataColor: <span>'"+threeSixtyPlayer.config.peakDataColor+"'</span>,\n\
|
||||||
|
peakDataOutside: <span>"+threeSixtyPlayer.config.peakDataOutside+"</span>,\n\
|
||||||
|
peakDataLineRatio: <span>"+threeSixtyPlayer.config.peakDataLineRatio+"</span>,\n\
|
||||||
|
\n\
|
||||||
|
useAmplifier: <span>"+threeSixtyPlayer.config.useAmplifier+"</span>\n\
|
||||||
|
\n\
|
||||||
|
}";
|
||||||
|
document.getElementById('config-code').style.display = 'block'; // weird Fx fix
|
||||||
|
}
|
||||||
|
|
||||||
|
this.createCustomFirework = function() {
|
||||||
|
}
|
||||||
|
|
||||||
|
this.destructor = function() {
|
||||||
|
for (var i=self.controls.length; i--;) {
|
||||||
|
self.controls[i].destructor();
|
||||||
|
}
|
||||||
|
for (i=self.cb.length; i--;) {
|
||||||
|
self.cb.onclick = null;
|
||||||
|
self.cb[i] = null;
|
||||||
|
}
|
||||||
|
for (i=self.options.length; i--;) {
|
||||||
|
self.options[i] = null;
|
||||||
|
}
|
||||||
|
if (navigator.userAgent.match(/msie/i)) {
|
||||||
|
self.fbIE.onmouseover = null;
|
||||||
|
self.fbIE.onmouseout = null;
|
||||||
|
self.fbIE = null;
|
||||||
|
}
|
||||||
|
self.cb = null;
|
||||||
|
self.options = null;
|
||||||
|
self.controls = null;
|
||||||
|
self.functionExample = null;
|
||||||
|
self.o = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
var items = parseInt(this.o.length/3);
|
||||||
|
for (var i=0; i<items; i++) {
|
||||||
|
this.controls[this.controls.length] = new Slider(this.o[(3*i)+2].getElementsByTagName('div')[1],this.o[(3*i)+1],this.o[(3*i)+2].getElementsByTagName('div')[0]);
|
||||||
|
}
|
||||||
|
this.cb = [document.getElementById('disabled-0'),document.getElementById('disabled-1')];
|
||||||
|
/*
|
||||||
|
for (i=this.cb.length; i--;) {
|
||||||
|
this.cb[i]._index = i;
|
||||||
|
this.cb[i].onclick = this.cbClick;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
this.options = [];
|
||||||
|
/*
|
||||||
|
this.cb[1].checked = false;
|
||||||
|
this.options = [document.getElementById('opt-random0'),document.getElementById('opt-random1')];
|
||||||
|
this.options[0].checked = false;
|
||||||
|
this.options[1].checked = true;
|
||||||
|
if (navigator.userAgent.match(/msie/i)) {
|
||||||
|
this.fbIE = document.getElementById('fireButton');
|
||||||
|
this.fbIE.onmouseover = function() {this.className='hover';}
|
||||||
|
this.fbIE.onmouseout = function() {this.className='';}
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
setTimeout(function(){
|
||||||
|
// default values for controls
|
||||||
|
var values = [
|
||||||
|
256,
|
||||||
|
65,
|
||||||
|
40,
|
||||||
|
72,
|
||||||
|
48,
|
||||||
|
100
|
||||||
|
];
|
||||||
|
for (var i=0; i<values.length; i++) {
|
||||||
|
self.controls[i].setValue(values[i]); // defaults
|
||||||
|
}
|
||||||
|
},1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function Slider(o,oV,oB) {
|
||||||
|
var self = this;
|
||||||
|
this.o = o;
|
||||||
|
this.oV = oV;
|
||||||
|
this.oB = oB;
|
||||||
|
this.scale = parseInt(oV.innerHTML.toString().substr(2));
|
||||||
|
this.oID = 'sc'+(gOID++);
|
||||||
|
this.offX = 0;
|
||||||
|
this.x = 0;
|
||||||
|
this.xMin = 0-10;
|
||||||
|
this.xMax = self.o.parentNode.offsetWidth-10;
|
||||||
|
this.value = 0;
|
||||||
|
this.timer = null;
|
||||||
|
this._className = this.o.className;
|
||||||
|
this.tween = [];
|
||||||
|
this.frame = 0;
|
||||||
|
|
||||||
|
this.over = function() {
|
||||||
|
this.className = self._className+' hover';
|
||||||
|
event.cancelBubble=true;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.out = function() {
|
||||||
|
this.className = self._className;
|
||||||
|
event.cancelBubble=true;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.down = function(e) {
|
||||||
|
var e = e?e:event;
|
||||||
|
self.offX = e.clientX-self.o.offsetLeft;
|
||||||
|
addEvent(document,'mousemove',self.move);
|
||||||
|
addEvent(document,'mouseup',self.up);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.barClick = function(e) {
|
||||||
|
var e=e?e:event;
|
||||||
|
self.slide(self.x,e.clientX-self.o.parentNode.parentNode.offsetLeft-self.o.offsetWidth);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.move = function(e) {
|
||||||
|
var e=e?e:event;
|
||||||
|
var x = e.clientX-self.offX;
|
||||||
|
if (x>self.xMax) {
|
||||||
|
x = self.xMax;
|
||||||
|
} else if (x<self.xMin) {
|
||||||
|
x = self.xMin;
|
||||||
|
}
|
||||||
|
if (x != self.x) {
|
||||||
|
self.moveTo(x);
|
||||||
|
self.doUpdate();
|
||||||
|
controller.updateExample();
|
||||||
|
controller.updateExampleCode();
|
||||||
|
}
|
||||||
|
e.stopPropgation?e.stopPropagation():e.cancelBubble=true;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.up = function(e) {
|
||||||
|
removeEvent(document,'mousemove',self.move);
|
||||||
|
removeEvent(document,'mouseup',self.up);
|
||||||
|
// controller.updateExample();
|
||||||
|
controller.updateExampleCode();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.slide = function(x0,x1) {
|
||||||
|
self.tween = mc.animator.createTween(x0,x1);
|
||||||
|
mc.animator.enqueue(self,self.animate,function(){
|
||||||
|
controller.updateExample()
|
||||||
|
controller.updateExampleCode();
|
||||||
|
});
|
||||||
|
mc.animator.start();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.moveTo = function(x) {
|
||||||
|
self.x = x;
|
||||||
|
self.o.style.marginLeft = x+'px';
|
||||||
|
}
|
||||||
|
|
||||||
|
this.animate = function() {
|
||||||
|
self.moveTo(self.tween[self.frame].data);
|
||||||
|
self.doUpdate(50);
|
||||||
|
controller.updateExample();
|
||||||
|
if (self.frame++>=self.tween.length-1) {
|
||||||
|
self.active = false;
|
||||||
|
self.frame = 0;
|
||||||
|
if (self._oncomplete) self._oncomplete();
|
||||||
|
// self.doUpdate();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
self.doUpdate();
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.doUpdate = function(t) {
|
||||||
|
// if (!self.timer) self.timer = setTimeout(self.update,t||20);
|
||||||
|
self.update();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.update = function() {
|
||||||
|
self.timer = null;
|
||||||
|
self.value = 1+parseInt(self.x/self.xMax*(self.scale-1));
|
||||||
|
if (self.value<1) self.value = 1;
|
||||||
|
// if (self.oV.innerHTML != self.value) self.oV.innerHTML = self.value;
|
||||||
|
// self.oV.innerHTML = self.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.setValue = function(x) {
|
||||||
|
self.slide(self.x,Math.min(self.xMax,x));
|
||||||
|
}
|
||||||
|
|
||||||
|
this.randomize = function() {
|
||||||
|
self.slide(self.x,parseInt(Math.random()*self.xMax));
|
||||||
|
}
|
||||||
|
|
||||||
|
this.destructor = function() {
|
||||||
|
self.o.onmouseover = null;
|
||||||
|
self.o.onmouseout = null;
|
||||||
|
self.o.onmousedown = null;
|
||||||
|
self.o = null;
|
||||||
|
self.oV = null;
|
||||||
|
self.oB.onclick = null;
|
||||||
|
self.oB = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (soundManager.isIE) {
|
||||||
|
// IE is lame, no :hover
|
||||||
|
this.o.onmouseover = this.over;
|
||||||
|
this.o.onmouseout = this.out;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.o.onmousedown = this.down;
|
||||||
|
this.oB.onclick = this.barClick;
|
||||||
|
self.update();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
var gOID = 0;
|
||||||
|
|
||||||
|
function demoInit() {
|
||||||
|
controller = new Controller(document.getElementById('controls').getElementsByTagName('dd'));
|
||||||
|
}
|
||||||
|
|
||||||
|
function demoDestuctor() {
|
||||||
|
controller.destructor();
|
||||||
|
controller = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
var controller = null;
|
||||||
|
|
||||||
|
var mc = new MainController();
|
||||||
|
// create null objects if APIs not present
|
||||||
|
|
||||||
|
function createCP(oInput,oHandler) {
|
||||||
|
var Event = YAHOO.util.Event;
|
||||||
|
|
||||||
|
cpHandler = oHandler;
|
||||||
|
if (picker != null) {
|
||||||
|
// picker.showcontrols(true);
|
||||||
|
var c = oInput.value.substr(1);
|
||||||
|
picker.setValue(hex2decArray([c.substr(0,2),c.substr(2,2),c.substr(4,2)]),true); // be silent
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
Event.onDOMReady(function() {
|
||||||
|
picker = new YAHOO.widget.ColorPicker("cp-container", {
|
||||||
|
showhsvcontrols: true,
|
||||||
|
showhexcontrols: true,
|
||||||
|
images: {
|
||||||
|
PICKER_THUMB: "../_image/picker_thumb.png",
|
||||||
|
HUE_THUMB: "../_image/hue_thumb.png"
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// picker.showcontrols(false);
|
||||||
|
//a listener for logging RGB color changes;
|
||||||
|
//this will only be visible if logger is enabled:
|
||||||
|
var onRgbChange = function(o) {
|
||||||
|
/*o is an object
|
||||||
|
{ newValue: (array of R, G, B values),
|
||||||
|
prevValue: (array of R, G, B values),
|
||||||
|
type: "rgbChange"
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
cpHandler(o.newValue);
|
||||||
|
controller.updateExampleCode();
|
||||||
|
}
|
||||||
|
|
||||||
|
//subscribe to the rgbChange event;
|
||||||
|
picker.on("rgbChange", onRgbChange);
|
||||||
|
|
||||||
|
//use setValue to reset the value to white:
|
||||||
|
Event.on("reset", "click", function(e) {
|
||||||
|
picker.setValue([255, 255, 255], false); //false here means that rgbChange
|
||||||
|
//wil fire; true would silence it
|
||||||
|
});
|
||||||
|
|
||||||
|
//use the "get" method to get the current value
|
||||||
|
//of one of the Color Picker's properties; in
|
||||||
|
//this case, we'll get the hex value and write it
|
||||||
|
//to the log:
|
||||||
|
Event.on("gethex", "click", function(e) {
|
||||||
|
console.log("Current hex value: " + picker.get("hex"));
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
var picker = null;
|
||||||
|
|
||||||
|
cpHandler = function() {
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// hex -> dec / dec -> hex
|
||||||
|
// http://www.southwest.com.au/~jfuller/binary/converter.htm
|
||||||
|
|
||||||
|
function dec2hex(cval) {
|
||||||
|
if (cval > 255) cval = 255;
|
||||||
|
var hexascii = "0123456789ABCDEF";
|
||||||
|
var cval0 = Math.floor(cval/16);
|
||||||
|
var cval1 = cval-(cval0*16);
|
||||||
|
var c1 = hexascii.charAt(cval0);
|
||||||
|
var c2 = hexascii.charAt(cval1);
|
||||||
|
return (c1+c2);
|
||||||
|
}
|
||||||
|
|
||||||
|
function hex2dec(cval) {
|
||||||
|
cval = cval.toUpperCase();
|
||||||
|
var tval = 0;
|
||||||
|
var hexascii = "0123456789ABCDEF";
|
||||||
|
var mychar, ch;
|
||||||
|
for (var c=0; c<cval.length; c++) {
|
||||||
|
mychar = cval.charAt(c);
|
||||||
|
for (ch=0; ch<16; ch++) {
|
||||||
|
if (mychar == hexascii.charAt(ch)) {
|
||||||
|
tval += ch;
|
||||||
|
if (c<cval.length-1) tval *= 16;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return tval;
|
||||||
|
}
|
||||||
|
|
||||||
|
function hex2decArray(hArray) {
|
||||||
|
var result = [];
|
||||||
|
for (var i=0,j=hArray.length; i<j; i++) {
|
||||||
|
result[i] = hex2dec(hArray[i]);
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
function dec2hexArray(dArray) {
|
||||||
|
var result = [];
|
||||||
|
for (var i=0,j=dArray.length; i<j; i++) {
|
||||||
|
result[i] = dec2hex(dArray[i]);
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.waveformDataColor = '#'+dec2hexArray([self.controls[5].value,self.controls[6].value,self.controls[7].value]).join('');
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.eqDataColor = '#'+dec2hexArray([self.controls[8].value,self.controls[9].value,self.controls[10].value]).join('');
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.loadRingColor = '#'+dec2hexArray([self.controls[11].value,self.controls[12].value,self.controls[13].value]).join('');
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.playRingColor = '#'+dec2hexArray([self.controls[14].value,self.controls[15].value,self.controls[16].value]).join('');
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.waveformDataLineRatio = (self.controls[1].value/100)*2;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.waveformDataDownsample = (self.controls[2].value);
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.eqDataLineRatio = (self.controls[3].value/100)*3;
|
||||||
|
|
||||||
|
threeSixtyPlayer.config.eqDataDownsample = (self.controls[4].value);
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
function _id(sID) {
|
||||||
|
return document.getElementById(sID);
|
||||||
|
}
|
||||||
|
|
||||||
|
function setWaveformColor(sColor) {
|
||||||
|
var value = '#'+(dec2hexArray(sColor).join(''));
|
||||||
|
threeSixtyPlayer.config.waveformDataColor = value;
|
||||||
|
_id('waveform-color').value = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setEQColor(sColor) {
|
||||||
|
var value = '#'+dec2hexArray(sColor).join('');
|
||||||
|
_id('eq-color').value = value;
|
||||||
|
threeSixtyPlayer.config.eqDataColor = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setLoadedRingColor(sColor) {
|
||||||
|
var value = '#'+dec2hexArray(sColor).join('');
|
||||||
|
_id('loaded-ring-color').value = value;
|
||||||
|
threeSixtyPlayer.config.loadRingColor = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setProgressRingColor(sColor) {
|
||||||
|
var value = '#'+dec2hexArray(sColor).join('');
|
||||||
|
_id('progress-ring-color').value = value;
|
||||||
|
threeSixtyPlayer.config.playRingColor = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setBackgroundRingColor(sColor) {
|
||||||
|
var value = '#'+dec2hexArray(sColor).join('');
|
||||||
|
_id('bg-ring-color').value = value;
|
||||||
|
threeSixtyPlayer.config.backgroundRingColor = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function addEvent(o,evtName,evtHandler) {
|
||||||
|
typeof window.addEventListener !== 'undefined' ? o.addEventListener(evtName,evtHandler,false) : o.attachEvent('on'+evtName,evtHandler);
|
||||||
|
}
|
||||||
|
|
||||||
|
function removeEvent(o,evtName,evtHandler) {
|
||||||
|
typeof window.removeEventListener !== 'undefined' ? o.removeEventListener(evtName,evtHandler,false) : o.detachEvent('on'+evtName,evtHandler);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (window.location.toString().match(/#customize/i)) {
|
||||||
|
addEvent(window,'resize',mc.getWindowCoords);
|
||||||
|
addEvent(window,'scroll',mc.getWindowCoords);
|
||||||
|
addEvent(window,'load',mc.init);
|
||||||
|
addEvent(window,'load',demoInit);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (window.location.toString().match(/hifi/i)) {
|
||||||
|
soundManager.onready(function(){
|
||||||
|
document.getElementById('hifi').style.display = 'none';
|
||||||
|
|
||||||
|
threeSixtyPlayer.config = {
|
||||||
|
|
||||||
|
playNext: false,
|
||||||
|
autoPlay: false,
|
||||||
|
loadRingColor: '#ccc',
|
||||||
|
playRingColor: '#000',
|
||||||
|
backgroundRingColor: '#eee',
|
||||||
|
circleDiameter: 256,
|
||||||
|
circleRadius: 128,
|
||||||
|
animDuration: 500,
|
||||||
|
animTransition: Animator.tx.bouncy,
|
||||||
|
showHMSTime: true,
|
||||||
|
|
||||||
|
useWaveformData: true,
|
||||||
|
waveformDataColor: '#0099ff',
|
||||||
|
waveformDataDownsample: 1,
|
||||||
|
waveformDataOutside: true,
|
||||||
|
waveformDataConstrain: false,
|
||||||
|
waveformDataLineRatio: 0.56,
|
||||||
|
|
||||||
|
useEQData: true,
|
||||||
|
eqDataColor: '#339933',
|
||||||
|
eqDataDownsample: 1,
|
||||||
|
eqDataOutside: true,
|
||||||
|
eqDataLineRatio: 0.72,
|
||||||
|
|
||||||
|
usePeakData: true,
|
||||||
|
peakDataColor: '#ff33ff',
|
||||||
|
peakDataOutside: true,
|
||||||
|
peakDataLineRatio: 0.5,
|
||||||
|
scaleArcWidth: 1, // thickness factor of playback progress ring
|
||||||
|
useAmplifier: true
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
64
carnaval/soundmanagerv297a-20130101/demo/360-player/demo.css
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
/**
|
||||||
|
* In-page demo CSS - see external CSS for actual relevant stuff.
|
||||||
|
*/
|
||||||
|
|
||||||
|
#soundmanager-debug {
|
||||||
|
/* SM2 debug container (optional, makes debug more useable) */
|
||||||
|
position:absolute;position:fixed;*position:absolute;bottom:10px;right:10px;width:50em;height:18em;overflow:auto;background:#fff;margin:1em;padding:1em;border:1px solid #999;font-family:"lucida console",verdana,tahoma,"sans serif";font-size:x-small;line-height:1.5em;opacity:0.9;filter:alpha(opacity=90);
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font:75% normal verdana,arial,tahoma,"sans serif";
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
font:3em arial,tahoma,verdana;
|
||||||
|
font-weight:normal;
|
||||||
|
margin-bottom:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin-top:0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2 {
|
||||||
|
letter-spacing: -0.005em; /* zomg web x.0! ;) */
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size:2em;
|
||||||
|
margin-top:0px;
|
||||||
|
margin-bottom:0.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size:1.5em;
|
||||||
|
margin-bottom:1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 a,
|
||||||
|
h1 a:hover {
|
||||||
|
color:#000;
|
||||||
|
text-decoration:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 a:hover {
|
||||||
|
text-decoration:underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.notes {
|
||||||
|
margin-left:0px;
|
||||||
|
padding-left:1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note {
|
||||||
|
margin-top:0px;
|
||||||
|
font-style:italic;
|
||||||
|
color:#999;
|
||||||
|
margin-bottom:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#left {
|
||||||
|
max-width:56em;
|
||||||
|
margin-left:1em;
|
||||||
|
}
|
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 493 B |
After Width: | Height: | Size: 2.4 KiB |
173
carnaval/soundmanagerv297a-20130101/demo/360-player/index.html
Normal file
@ -0,0 +1,173 @@
|
|||||||
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||||
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
|
||||||
|
<head>
|
||||||
|
<title>360° MP3 player UI demo (SoundManager 2)</title>
|
||||||
|
<meta name="robots" content="noindex" />
|
||||||
|
<meta name="description" content="Javascript-driven sound, canvas-based MP3 player UI demo: 360-degree circular control / jog wheel example for playing MP3 links using SoundManager 2, Javascript and Canvas.">
|
||||||
|
|
||||||
|
<!-- required -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="360player.css" />
|
||||||
|
|
||||||
|
<!-- special IE-only canvas fix -->
|
||||||
|
<!--[if IE]><script type="text/javascript" src="script/excanvas.js"></script><![endif]-->
|
||||||
|
|
||||||
|
<!-- Apache-licensed animation library -->
|
||||||
|
<script type="text/javascript" src="script/berniecode-animator.js"></script>
|
||||||
|
|
||||||
|
<!-- the core stuff -->
|
||||||
|
<script type="text/javascript" src="../../script/soundmanager2.js"></script>
|
||||||
|
<script type="text/javascript" src="script/360player.js"></script>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
soundManager.setup({
|
||||||
|
// path to directory containing SM2 SWF
|
||||||
|
url: '../../swf/'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- stuff you don't need -->
|
||||||
|
<!-- makes the fonts nicer etc. -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="../index.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="demo.css" />
|
||||||
|
|
||||||
|
<!-- soundManager.useFlashBlock: related CSS -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="../flashblock/flashblock.css" />
|
||||||
|
|
||||||
|
<style type="text/css">
|
||||||
|
|
||||||
|
/* Demo page, general layout */
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-image: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#left {
|
||||||
|
position:relative;
|
||||||
|
width:950px;
|
||||||
|
max-width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#left h2 {
|
||||||
|
padding-top:0px;
|
||||||
|
margin-bottom:0.25em;
|
||||||
|
color:#666;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre.block {
|
||||||
|
margin-top:0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div id="left">
|
||||||
|
|
||||||
|
<h1><a href="http://www.schillmania.com/projects/soundmanager2/" title="Javascript MP3 player project home">SoundManager 2</a> / <a href="http://schillmania.com/projects/soundmanager2/demo/360-player/">360° Player</a>: JavaScript + Canvas UI</h1>
|
||||||
|
|
||||||
|
<p class="note" style="color:#666;margin-top:0.5em;margin-bottom:0.5em">Canvas-based UI. Load progress, seek, play/pause etc. Also see <a href="canvas-visualization.html" title="Javascript canvas visualization with waveform/eq data">360° UI visualization</a> demo.</p>
|
||||||
|
|
||||||
|
<div id="sm2-container">
|
||||||
|
<!-- flash movie is added here -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="margin-top:1.25em">
|
||||||
|
|
||||||
|
<div style="float:left;display:inline;min-width:200px"> <!-- float is just for this demo layout, you don't need it. -->
|
||||||
|
|
||||||
|
<div class="ui360" style="margin-top:-0.55em"><a href="../_mp3/rain.mp3">Rain</a></div>
|
||||||
|
|
||||||
|
<div class="ui360"><a href="http://freshly-ground.com/data/audio/mpc/20090119%20-%20Untitled%20Groove.mp3">20090119 - Untitled Groove</a></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div style="float:left;display:inline;margin-left:40px;border-left:1px solid #ccc;padding-left:30px;width:152px">
|
||||||
|
|
||||||
|
<p style="margin-top:1em;margin-bottom:0px">Alternate style: inline</p>
|
||||||
|
|
||||||
|
<div class="sm2-inline-list" style="margin-bottom:10px"> <!-- note the CSS class, changes the layout -->
|
||||||
|
|
||||||
|
<div class="ui360"><a href="http://www.freshly-ground.com/data/audio/binaural/Mak.mp3">Angry cow sound?</a></div>
|
||||||
|
<div class="ui360"><a href="http://www.freshly-ground.com/data/audio/binaural/Things that open, close and roll.mp3">Things that open, close and roll</a></div>
|
||||||
|
<div class="ui360"><a href="http://www.freshly-ground.com/misc/music/20060826%20-%20Armstrong.mp3">20060826 - Armstrong</a></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="clear:both"></div>
|
||||||
|
|
||||||
|
|
||||||
|
<h3>How This Works</h3>
|
||||||
|
|
||||||
|
<p>The script looks for a container element matching <code>div.<span>ui360</span></code>, and then the first link inside of it.</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
|
||||||
|
<pre class="block"><code><div class="<span>ui360</span>">
|
||||||
|
<a href="/path/to/an.mp3">play "an.mp3"</a>
|
||||||
|
</div></code></pre>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>When the 360 player script loads, it adds a <code>UI</code> template to the block, prepending it in front of the MP3 link:</p>
|
||||||
|
|
||||||
|
<pre class="block"><code><div class="<span>ui360</span>">
|
||||||
|
<span><span><-- dynamically-inserted block --></span></span>
|
||||||
|
<div class="<span>ui</span>">
|
||||||
|
<canvas class="<span>sm2-canvas</span>"></canvas>
|
||||||
|
<span class="<span>sm2-360btn</span>"></span>
|
||||||
|
<div class="<span>sm2-timing</span>"></div>
|
||||||
|
<div class="<span>sm2-cover</span>"></div>
|
||||||
|
</div>
|
||||||
|
<span><span><-- /UI --></span></span>
|
||||||
|
<a href="<span>/path/to/an.mp3</span>">
|
||||||
|
</div></code></pre>
|
||||||
|
|
||||||
|
<h3>Customizing the UI</h3>
|
||||||
|
|
||||||
|
<p>The player's default 50x50-pixel canvas is defined both within JavaScript and CSS. For an example with different values, see this <a href="canvas-visualization.html" title="360° UI: larger version">larger version</a>.</p>
|
||||||
|
|
||||||
|
<pre class="block"><code>threeSixtyPlayer.config = {
|
||||||
|
playNext: <span>false</span>, <span><span>// stop after one sound, or play through list until end</span></span>
|
||||||
|
autoPlay: <span>false</span>, <span><span>// start playing the first sound right away</span></span>
|
||||||
|
allowMultiple: <span>true</span>, <span><span>// let many sounds play at once (false = one at a time)</span></span>
|
||||||
|
loadRingColor: <span>'#ccc',</span> <span><span>// amount of sound which has loaded</span></span>
|
||||||
|
playRingColor: <span>'#000'</span>, <span><span>// amount of sound which has played</span></span>
|
||||||
|
backgroundRingColor: <span>'#eee', </span><span><span>// "default" color shown underneath everything else</span></span>
|
||||||
|
animDuration: <span>500</span>,
|
||||||
|
animTransition: <span>Animator.tx.bouncy</span> <span><span>// http://www.berniecode.com/writing/animator.html</span></span>
|
||||||
|
}</code></pre>
|
||||||
|
|
||||||
|
<p>The CSS for the canvas UI block is a bit ugly, but JavaScript reads the width of the <code>.sm2-360ui</code> element in the DOM as set by CSS and uses that to later draw and update the canvas element while playing.</p>
|
||||||
|
|
||||||
|
<pre class="block"><code>.ui360,
|
||||||
|
.sm2-360ui {
|
||||||
|
<span><span>/* size of the container for the circle, etc. */</span></span>
|
||||||
|
width:<span>50px</span>;
|
||||||
|
height:<span>50px</span>;
|
||||||
|
}
|
||||||
|
</code></pre>
|
||||||
|
|
||||||
|
<h3>Third-party Components</h3>
|
||||||
|
|
||||||
|
<p>This demo includes use of <a href="http://www.berniecode.com/writing/animator.html">Bernie's Better Animation Class</a> (Apache licensed) for some animation effects.</p>
|
||||||
|
<p>Also, some loader/spinner icons from <a href="http://ajaxload.info">ajaxload.info</a> are used for showing loading/buffering states.</p>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<p>
|
||||||
|
<a href="http://www.schillmania.com/projects/soundmanager2/" title="SoundManager 2 home">SoundManager 2 project page</a> (not an MP3 link)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -0,0 +1,5 @@
|
|||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 3 wsoinuma psacln 4096 Jan 25 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 47305 Jan 25 2013 360player.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 24206 Jan 25 2013 berniecode-animator.js
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 11567 Jan 25 2013 excanvas.js
|
@ -0,0 +1,674 @@
|
|||||||
|
/** @license
|
||||||
|
Animator.js 1.1.9
|
||||||
|
|
||||||
|
This library is released under the BSD license:
|
||||||
|
|
||||||
|
Copyright (c) 2006, Bernard Sumption. All rights reserved.
|
||||||
|
|
||||||
|
Redistribution and use in source and binary forms, with or without
|
||||||
|
modification, are permitted provided that the following conditions are met:
|
||||||
|
|
||||||
|
Redistributions of source code must retain the above copyright notice, this
|
||||||
|
list of conditions and the following disclaimer. Redistributions in binary
|
||||||
|
form must reproduce the above copyright notice, this list of conditions and
|
||||||
|
the following disclaimer in the documentation and/or other materials
|
||||||
|
provided with the distribution. Neither the name BernieCode nor
|
||||||
|
the names of its contributors may be used to endorse or promote products
|
||||||
|
derived from this software without specific prior written permission.
|
||||||
|
|
||||||
|
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
|
||||||
|
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
|
||||||
|
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
|
||||||
|
ARE DISCLAIMED. IN NO EVENT SHALL THE REGENTS OR CONTRIBUTORS BE LIABLE FOR
|
||||||
|
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
|
||||||
|
DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
|
||||||
|
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
|
||||||
|
CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT
|
||||||
|
LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY
|
||||||
|
OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH
|
||||||
|
DAMAGE.
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// http://www.berniecode.com/writing/animator.html
|
||||||
|
|
||||||
|
// Applies a sequence of numbers between 0 and 1 to a number of subjects
|
||||||
|
// construct - see setOptions for parameters
|
||||||
|
function Animator(options) {
|
||||||
|
this.setOptions(options);
|
||||||
|
var _this = this;
|
||||||
|
this.timerDelegate = function(){_this.onTimerEvent()};
|
||||||
|
this.subjects = [];
|
||||||
|
this.subjectScopes = [];
|
||||||
|
this.target = 0;
|
||||||
|
this.state = 0;
|
||||||
|
this.lastTime = null;
|
||||||
|
};
|
||||||
|
Animator.prototype = {
|
||||||
|
// apply defaults
|
||||||
|
setOptions: function(options) {
|
||||||
|
this.options = Animator.applyDefaults({
|
||||||
|
interval: 20, // time between animation frames
|
||||||
|
duration: 400, // length of animation
|
||||||
|
onComplete: function(){},
|
||||||
|
onStep: function(){},
|
||||||
|
transition: Animator.tx.easeInOut
|
||||||
|
}, options);
|
||||||
|
},
|
||||||
|
// animate from the current state to provided value
|
||||||
|
seekTo: function(to) {
|
||||||
|
this.seekFromTo(this.state, to);
|
||||||
|
},
|
||||||
|
// animate from the current state to provided value
|
||||||
|
seekFromTo: function(from, to) {
|
||||||
|
this.target = Math.max(0, Math.min(1, to));
|
||||||
|
this.state = Math.max(0, Math.min(1, from));
|
||||||
|
this.lastTime = new Date().getTime();
|
||||||
|
if (!this.intervalId) {
|
||||||
|
this.intervalId = window.setInterval(this.timerDelegate, this.options.interval);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// animate from the current state to provided value
|
||||||
|
jumpTo: function(to) {
|
||||||
|
this.target = this.state = Math.max(0, Math.min(1, to));
|
||||||
|
this.propagate();
|
||||||
|
},
|
||||||
|
// seek to the opposite of the current target
|
||||||
|
toggle: function() {
|
||||||
|
this.seekTo(1 - this.target);
|
||||||
|
},
|
||||||
|
// add a function or an object with a method setState(state) that will be called with a number
|
||||||
|
// between 0 and 1 on each frame of the animation
|
||||||
|
addSubject: function(subject,scope) {
|
||||||
|
this.subjects[this.subjects.length] = subject;
|
||||||
|
this.subjectScopes[this.subjectScopes.length] = scope;
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
// remove all subjects
|
||||||
|
clearSubjects: function() {
|
||||||
|
this.subjects = [];
|
||||||
|
this.subjectScopes = [];
|
||||||
|
},
|
||||||
|
// forward the current state to the animation subjects
|
||||||
|
propagate: function() {
|
||||||
|
var value = this.options.transition(this.state);
|
||||||
|
for (var i=0; i<this.subjects.length; i++) {
|
||||||
|
if (this.subjects[i].setState) {
|
||||||
|
this.subjects[i].setState(value);
|
||||||
|
} else {
|
||||||
|
this.subjects[i].apply(this.subjectScopes[i],[value]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// called once per frame to update the current state
|
||||||
|
onTimerEvent: function() {
|
||||||
|
var now = new Date().getTime();
|
||||||
|
var timePassed = now - this.lastTime;
|
||||||
|
this.lastTime = now;
|
||||||
|
var movement = (timePassed / this.options.duration) * (this.state < this.target ? 1 : -1);
|
||||||
|
if (Math.abs(movement) >= Math.abs(this.state - this.target)) {
|
||||||
|
this.state = this.target;
|
||||||
|
} else {
|
||||||
|
this.state += movement;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
this.propagate();
|
||||||
|
} finally {
|
||||||
|
this.options.onStep.call(this);
|
||||||
|
if (this.target == this.state) {
|
||||||
|
window.clearInterval(this.intervalId);
|
||||||
|
this.intervalId = null;
|
||||||
|
this.options.onComplete.call(this);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// shortcuts
|
||||||
|
play: function() {this.seekFromTo(0, 1)},
|
||||||
|
reverse: function() {this.seekFromTo(1, 0)},
|
||||||
|
// return a string describing this Animator, for debugging
|
||||||
|
inspect: function() {
|
||||||
|
var str = "#<Animator:\n";
|
||||||
|
for (var i=0; i<this.subjects.length; i++) {
|
||||||
|
str += this.subjects[i].inspect();
|
||||||
|
}
|
||||||
|
str += ">";
|
||||||
|
return str;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// merge the properties of two objects
|
||||||
|
Animator.applyDefaults = function(defaults, prefs) {
|
||||||
|
prefs = prefs || {};
|
||||||
|
var prop, result = {};
|
||||||
|
for (prop in defaults) result[prop] = prefs[prop] !== undefined ? prefs[prop] : defaults[prop];
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
// make an array from any object
|
||||||
|
Animator.makeArray = function(o) {
|
||||||
|
if (o == null) return [];
|
||||||
|
if (!o.length) return [o];
|
||||||
|
var result = [];
|
||||||
|
for (var i=0; i<o.length; i++) result[i] = o[i];
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
// convert a dash-delimited-property to a camelCaseProperty (c/o Prototype, thanks Sam!)
|
||||||
|
Animator.camelize = function(string) {
|
||||||
|
var oStringList = string.split('-');
|
||||||
|
if (oStringList.length == 1) return oStringList[0];
|
||||||
|
|
||||||
|
var camelizedString = string.indexOf('-') == 0
|
||||||
|
? oStringList[0].charAt(0).toUpperCase() + oStringList[0].substring(1)
|
||||||
|
: oStringList[0];
|
||||||
|
|
||||||
|
for (var i = 1, len = oStringList.length; i < len; i++) {
|
||||||
|
var s = oStringList[i];
|
||||||
|
camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
|
||||||
|
}
|
||||||
|
return camelizedString;
|
||||||
|
}
|
||||||
|
// syntactic sugar for creating CSSStyleSubjects
|
||||||
|
Animator.apply = function(el, style, options) {
|
||||||
|
if (style instanceof Array) {
|
||||||
|
return new Animator(options).addSubject(new CSSStyleSubject(el, style[0], style[1]));
|
||||||
|
}
|
||||||
|
return new Animator(options).addSubject(new CSSStyleSubject(el, style));
|
||||||
|
}
|
||||||
|
// make a transition function that gradually accelerates. pass a=1 for smooth
|
||||||
|
// gravitational acceleration, higher values for an exaggerated effect
|
||||||
|
Animator.makeEaseIn = function(a) {
|
||||||
|
return function(state) {
|
||||||
|
return Math.pow(state, a*2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// as makeEaseIn but for deceleration
|
||||||
|
Animator.makeEaseOut = function(a) {
|
||||||
|
return function(state) {
|
||||||
|
return 1 - Math.pow(1 - state, a*2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// make a transition function that, like an object with momentum being attracted to a point,
|
||||||
|
// goes past the target then returns
|
||||||
|
Animator.makeElastic = function(bounces) {
|
||||||
|
return function(state) {
|
||||||
|
state = Animator.tx.easeInOut(state);
|
||||||
|
return ((1-Math.cos(state * Math.PI * bounces)) * (1 - state)) + state;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// make an Attack Decay Sustain Release envelope that starts and finishes on the same level
|
||||||
|
//
|
||||||
|
Animator.makeADSR = function(attackEnd, decayEnd, sustainEnd, sustainLevel) {
|
||||||
|
if (sustainLevel == null) sustainLevel = 0.5;
|
||||||
|
return function(state) {
|
||||||
|
if (state < attackEnd) {
|
||||||
|
return state / attackEnd;
|
||||||
|
}
|
||||||
|
if (state < decayEnd) {
|
||||||
|
return 1 - ((state - attackEnd) / (decayEnd - attackEnd) * (1 - sustainLevel));
|
||||||
|
}
|
||||||
|
if (state < sustainEnd) {
|
||||||
|
return sustainLevel;
|
||||||
|
}
|
||||||
|
return sustainLevel * (1 - ((state - sustainEnd) / (1 - sustainEnd)));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// make a transition function that, like a ball falling to floor, reaches the target and/
|
||||||
|
// bounces back again
|
||||||
|
Animator.makeBounce = function(bounces) {
|
||||||
|
var fn = Animator.makeElastic(bounces);
|
||||||
|
return function(state) {
|
||||||
|
state = fn(state);
|
||||||
|
return state <= 1 ? state : 2-state;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// pre-made transition functions to use with the 'transition' option
|
||||||
|
Animator.tx = {
|
||||||
|
easeInOut: function(pos){
|
||||||
|
return ((-Math.cos(pos*Math.PI)/2) + 0.5);
|
||||||
|
},
|
||||||
|
linear: function(x) {
|
||||||
|
return x;
|
||||||
|
},
|
||||||
|
easeIn: Animator.makeEaseIn(1.5),
|
||||||
|
easeOut: Animator.makeEaseOut(1.5),
|
||||||
|
strongEaseIn: Animator.makeEaseIn(2.5),
|
||||||
|
strongEaseOut: Animator.makeEaseOut(2.5),
|
||||||
|
elastic: Animator.makeElastic(1),
|
||||||
|
veryElastic: Animator.makeElastic(3),
|
||||||
|
bouncy: Animator.makeBounce(1),
|
||||||
|
veryBouncy: Animator.makeBounce(3)
|
||||||
|
}
|
||||||
|
|
||||||
|
// animates a pixel-based style property between two integer values
|
||||||
|
function NumericalStyleSubject(els, property, from, to, units) {
|
||||||
|
this.els = Animator.makeArray(els);
|
||||||
|
if (property == 'opacity' && window.ActiveXObject) {
|
||||||
|
this.property = 'filter';
|
||||||
|
} else {
|
||||||
|
this.property = Animator.camelize(property);
|
||||||
|
}
|
||||||
|
this.from = parseFloat(from);
|
||||||
|
this.to = parseFloat(to);
|
||||||
|
this.units = units != null ? units : 'px';
|
||||||
|
}
|
||||||
|
NumericalStyleSubject.prototype = {
|
||||||
|
setState: function(state) {
|
||||||
|
var style = this.getStyle(state);
|
||||||
|
var visibility = (this.property == 'opacity' && state == 0) ? 'hidden' : '';
|
||||||
|
var j=0;
|
||||||
|
for (var i=0; i<this.els.length; i++) {
|
||||||
|
try {
|
||||||
|
this.els[i].style[this.property] = style;
|
||||||
|
} catch (e) {
|
||||||
|
// ignore fontWeight - intermediate numerical values cause exeptions in firefox
|
||||||
|
if (this.property != 'fontWeight') throw e;
|
||||||
|
}
|
||||||
|
if (j++ > 20) return;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getStyle: function(state) {
|
||||||
|
state = this.from + ((this.to - this.from) * state);
|
||||||
|
if (this.property == 'filter') return "alpha(opacity=" + Math.round(state*100) + ")";
|
||||||
|
if (this.property == 'opacity') return state;
|
||||||
|
return Math.round(state) + this.units;
|
||||||
|
},
|
||||||
|
inspect: function() {
|
||||||
|
return "\t" + this.property + "(" + this.from + this.units + " to " + this.to + this.units + ")\n";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// animates a colour based style property between two hex values
|
||||||
|
function ColorStyleSubject(els, property, from, to) {
|
||||||
|
this.els = Animator.makeArray(els);
|
||||||
|
this.property = Animator.camelize(property);
|
||||||
|
this.to = this.expandColor(to);
|
||||||
|
this.from = this.expandColor(from);
|
||||||
|
this.origFrom = from;
|
||||||
|
this.origTo = to;
|
||||||
|
}
|
||||||
|
|
||||||
|
ColorStyleSubject.prototype = {
|
||||||
|
// parse "#FFFF00" to [256, 256, 0]
|
||||||
|
expandColor: function(color) {
|
||||||
|
var hexColor, red, green, blue;
|
||||||
|
hexColor = ColorStyleSubject.parseColor(color);
|
||||||
|
if (hexColor) {
|
||||||
|
red = parseInt(hexColor.slice(1, 3), 16);
|
||||||
|
green = parseInt(hexColor.slice(3, 5), 16);
|
||||||
|
blue = parseInt(hexColor.slice(5, 7), 16);
|
||||||
|
return [red,green,blue]
|
||||||
|
}
|
||||||
|
if (window.DEBUG) {
|
||||||
|
alert("Invalid colour: '" + color + "'");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getValueForState: function(color, state) {
|
||||||
|
return Math.round(this.from[color] + ((this.to[color] - this.from[color]) * state));
|
||||||
|
},
|
||||||
|
setState: function(state) {
|
||||||
|
var color = '#'
|
||||||
|
+ ColorStyleSubject.toColorPart(this.getValueForState(0, state))
|
||||||
|
+ ColorStyleSubject.toColorPart(this.getValueForState(1, state))
|
||||||
|
+ ColorStyleSubject.toColorPart(this.getValueForState(2, state));
|
||||||
|
for (var i=0; i<this.els.length; i++) {
|
||||||
|
this.els[i].style[this.property] = color;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
inspect: function() {
|
||||||
|
return "\t" + this.property + "(" + this.origFrom + " to " + this.origTo + ")\n";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// return a properly formatted 6-digit hex colour spec, or false
|
||||||
|
ColorStyleSubject.parseColor = function(string) {
|
||||||
|
var color = '#', match;
|
||||||
|
if(match = ColorStyleSubject.parseColor.rgbRe.exec(string)) {
|
||||||
|
var part;
|
||||||
|
for (var i=1; i<=3; i++) {
|
||||||
|
part = Math.max(0, Math.min(255, parseInt(match[i])));
|
||||||
|
color += ColorStyleSubject.toColorPart(part);
|
||||||
|
}
|
||||||
|
return color;
|
||||||
|
}
|
||||||
|
if (match = ColorStyleSubject.parseColor.hexRe.exec(string)) {
|
||||||
|
if(match[1].length == 3) {
|
||||||
|
for (var i=0; i<3; i++) {
|
||||||
|
color += match[1].charAt(i) + match[1].charAt(i);
|
||||||
|
}
|
||||||
|
return color;
|
||||||
|
}
|
||||||
|
return '#' + match[1];
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
// convert a number to a 2 digit hex string
|
||||||
|
ColorStyleSubject.toColorPart = function(number) {
|
||||||
|
if (number > 255) number = 255;
|
||||||
|
var digits = number.toString(16);
|
||||||
|
if (number < 16) return '0' + digits;
|
||||||
|
return digits;
|
||||||
|
}
|
||||||
|
ColorStyleSubject.parseColor.rgbRe = /^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i;
|
||||||
|
ColorStyleSubject.parseColor.hexRe = /^\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/;
|
||||||
|
|
||||||
|
// Animates discrete styles, i.e. ones that do not scale but have discrete values
|
||||||
|
// that can't be interpolated
|
||||||
|
function DiscreteStyleSubject(els, property, from, to, threshold) {
|
||||||
|
this.els = Animator.makeArray(els);
|
||||||
|
this.property = Animator.camelize(property);
|
||||||
|
this.from = from;
|
||||||
|
this.to = to;
|
||||||
|
this.threshold = threshold || 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
DiscreteStyleSubject.prototype = {
|
||||||
|
setState: function(state) {
|
||||||
|
var j=0;
|
||||||
|
for (var i=0; i<this.els.length; i++) {
|
||||||
|
this.els[i].style[this.property] = state <= this.threshold ? this.from : this.to;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
inspect: function() {
|
||||||
|
return "\t" + this.property + "(" + this.from + " to " + this.to + " @ " + this.threshold + ")\n";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// animates between two styles defined using CSS.
|
||||||
|
// if style1 and style2 are present, animate between them, if only style1
|
||||||
|
// is present, animate between the element's current style and style1
|
||||||
|
function CSSStyleSubject(els, style1, style2) {
|
||||||
|
els = Animator.makeArray(els);
|
||||||
|
this.subjects = [];
|
||||||
|
if (els.length == 0) return;
|
||||||
|
var prop, toStyle, fromStyle;
|
||||||
|
if (style2) {
|
||||||
|
fromStyle = this.parseStyle(style1, els[0]);
|
||||||
|
toStyle = this.parseStyle(style2, els[0]);
|
||||||
|
} else {
|
||||||
|
toStyle = this.parseStyle(style1, els[0]);
|
||||||
|
fromStyle = {};
|
||||||
|
for (prop in toStyle) {
|
||||||
|
fromStyle[prop] = CSSStyleSubject.getStyle(els[0], prop);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// remove unchanging properties
|
||||||
|
var prop;
|
||||||
|
for (prop in fromStyle) {
|
||||||
|
if (fromStyle[prop] == toStyle[prop]) {
|
||||||
|
delete fromStyle[prop];
|
||||||
|
delete toStyle[prop];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// discover the type (numerical or colour) of each style
|
||||||
|
var prop, units, match, type, from, to;
|
||||||
|
for (prop in fromStyle) {
|
||||||
|
var fromProp = String(fromStyle[prop]);
|
||||||
|
var toProp = String(toStyle[prop]);
|
||||||
|
if (toStyle[prop] == null) {
|
||||||
|
if (window.DEBUG) alert("No to style provided for '" + prop + '"');
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (from = ColorStyleSubject.parseColor(fromProp)) {
|
||||||
|
to = ColorStyleSubject.parseColor(toProp);
|
||||||
|
type = ColorStyleSubject;
|
||||||
|
} else if (fromProp.match(CSSStyleSubject.numericalRe)
|
||||||
|
&& toProp.match(CSSStyleSubject.numericalRe)) {
|
||||||
|
from = parseFloat(fromProp);
|
||||||
|
to = parseFloat(toProp);
|
||||||
|
type = NumericalStyleSubject;
|
||||||
|
match = CSSStyleSubject.numericalRe.exec(fromProp);
|
||||||
|
var reResult = CSSStyleSubject.numericalRe.exec(toProp);
|
||||||
|
if (match[1] != null) {
|
||||||
|
units = match[1];
|
||||||
|
} else if (reResult[1] != null) {
|
||||||
|
units = reResult[1];
|
||||||
|
} else {
|
||||||
|
units = reResult;
|
||||||
|
}
|
||||||
|
} else if (fromProp.match(CSSStyleSubject.discreteRe)
|
||||||
|
&& toProp.match(CSSStyleSubject.discreteRe)) {
|
||||||
|
from = fromProp;
|
||||||
|
to = toProp;
|
||||||
|
type = DiscreteStyleSubject;
|
||||||
|
units = 0; // hack - how to get an animator option down to here
|
||||||
|
} else {
|
||||||
|
if (window.DEBUG) {
|
||||||
|
alert("Unrecognised format for value of "
|
||||||
|
+ prop + ": '" + fromStyle[prop] + "'");
|
||||||
|
}
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
this.subjects[this.subjects.length] = new type(els, prop, from, to, units);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
CSSStyleSubject.prototype = {
|
||||||
|
// parses "width: 400px; color: #FFBB2E" to {width: "400px", color: "#FFBB2E"}
|
||||||
|
parseStyle: function(style, el) {
|
||||||
|
var rtn = {};
|
||||||
|
// if style is a rule set
|
||||||
|
if (style.indexOf(":") != -1) {
|
||||||
|
var styles = style.split(";");
|
||||||
|
for (var i=0; i<styles.length; i++) {
|
||||||
|
var parts = CSSStyleSubject.ruleRe.exec(styles[i]);
|
||||||
|
if (parts) {
|
||||||
|
rtn[parts[1]] = parts[2];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// else assume style is a class name
|
||||||
|
else {
|
||||||
|
var prop, value, oldClass;
|
||||||
|
oldClass = el.className;
|
||||||
|
el.className = style;
|
||||||
|
for (var i=0; i<CSSStyleSubject.cssProperties.length; i++) {
|
||||||
|
prop = CSSStyleSubject.cssProperties[i];
|
||||||
|
value = CSSStyleSubject.getStyle(el, prop);
|
||||||
|
if (value != null) {
|
||||||
|
rtn[prop] = value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
el.className = oldClass;
|
||||||
|
}
|
||||||
|
return rtn;
|
||||||
|
|
||||||
|
},
|
||||||
|
setState: function(state) {
|
||||||
|
for (var i=0; i<this.subjects.length; i++) {
|
||||||
|
this.subjects[i].setState(state);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
inspect: function() {
|
||||||
|
var str = "";
|
||||||
|
for (var i=0; i<this.subjects.length; i++) {
|
||||||
|
str += this.subjects[i].inspect();
|
||||||
|
}
|
||||||
|
return str;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// get the current value of a css property,
|
||||||
|
CSSStyleSubject.getStyle = function(el, property){
|
||||||
|
var style;
|
||||||
|
if(document.defaultView && document.defaultView.getComputedStyle){
|
||||||
|
style = document.defaultView.getComputedStyle(el, "").getPropertyValue(property);
|
||||||
|
if (style) {
|
||||||
|
return style;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
property = Animator.camelize(property);
|
||||||
|
if(el.currentStyle){
|
||||||
|
style = el.currentStyle[property];
|
||||||
|
}
|
||||||
|
return style || el.style[property]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
CSSStyleSubject.ruleRe = /^\s*([a-zA-Z\-]+)\s*:\s*(\S(.+\S)?)\s*$/;
|
||||||
|
CSSStyleSubject.numericalRe = /^-?\d+(?:\.\d+)?(%|[a-zA-Z]{2})?$/;
|
||||||
|
CSSStyleSubject.discreteRe = /^\w+$/;
|
||||||
|
|
||||||
|
// required because the style object of elements isn't enumerable in Safari
|
||||||
|
/*
|
||||||
|
CSSStyleSubject.cssProperties = ['background-color','border','border-color','border-spacing',
|
||||||
|
'border-style','border-top','border-right','border-bottom','border-left','border-top-color',
|
||||||
|
'border-right-color','border-bottom-color','border-left-color','border-top-width','border-right-width',
|
||||||
|
'border-bottom-width','border-left-width','border-width','bottom','color','font-size','font-size-adjust',
|
||||||
|
'font-stretch','font-style','height','left','letter-spacing','line-height','margin','margin-top',
|
||||||
|
'margin-right','margin-bottom','margin-left','marker-offset','max-height','max-width','min-height',
|
||||||
|
'min-width','orphans','outline','outline-color','outline-style','outline-width','overflow','padding',
|
||||||
|
'padding-top','padding-right','padding-bottom','padding-left','quotes','right','size','text-indent',
|
||||||
|
'top','width','word-spacing','z-index','opacity','outline-offset'];*/
|
||||||
|
|
||||||
|
|
||||||
|
CSSStyleSubject.cssProperties = ['azimuth','background','background-attachment','background-color','background-image','background-position','background-repeat','border-collapse','border-color','border-spacing','border-style','border-top','border-top-color','border-right-color','border-bottom-color','border-left-color','border-top-style','border-right-style','border-bottom-style','border-left-style','border-top-width','border-right-width','border-bottom-width','border-left-width','border-width','bottom','clear','clip','color','content','cursor','direction','display','elevation','empty-cells','css-float','font','font-family','font-size','font-size-adjust','font-stretch','font-style','font-variant','font-weight','height','left','letter-spacing','line-height','list-style','list-style-image','list-style-position','list-style-type','margin','margin-top','margin-right','margin-bottom','margin-left','max-height','max-width','min-height','min-width','orphans','outline','outline-color','outline-style','outline-width','overflow','padding','padding-top','padding-right','padding-bottom','padding-left','pause','position','right','size','table-layout','text-align','text-decoration','text-indent','text-shadow','text-transform','top','vertical-align','visibility','white-space','width','word-spacing','z-index','opacity','outline-offset','overflow-x','overflow-y'];
|
||||||
|
|
||||||
|
|
||||||
|
// chains several Animator objects together
|
||||||
|
function AnimatorChain(animators, options) {
|
||||||
|
this.animators = animators;
|
||||||
|
this.setOptions(options);
|
||||||
|
for (var i=0; i<this.animators.length; i++) {
|
||||||
|
this.listenTo(this.animators[i]);
|
||||||
|
}
|
||||||
|
this.forwards = false;
|
||||||
|
this.current = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
AnimatorChain.prototype = {
|
||||||
|
// apply defaults
|
||||||
|
setOptions: function(options) {
|
||||||
|
this.options = Animator.applyDefaults({
|
||||||
|
// by default, each call to AnimatorChain.play() calls jumpTo(0) of each animator
|
||||||
|
// before playing, which can cause flickering if you have multiple animators all
|
||||||
|
// targeting the same element. Set this to false to avoid this.
|
||||||
|
resetOnPlay: true
|
||||||
|
}, options);
|
||||||
|
},
|
||||||
|
// play each animator in turn
|
||||||
|
play: function() {
|
||||||
|
this.forwards = true;
|
||||||
|
this.current = -1;
|
||||||
|
if (this.options.resetOnPlay) {
|
||||||
|
for (var i=0; i<this.animators.length; i++) {
|
||||||
|
this.animators[i].jumpTo(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.advance();
|
||||||
|
},
|
||||||
|
// play all animators backwards
|
||||||
|
reverse: function() {
|
||||||
|
this.forwards = false;
|
||||||
|
this.current = this.animators.length;
|
||||||
|
if (this.options.resetOnPlay) {
|
||||||
|
for (var i=0; i<this.animators.length; i++) {
|
||||||
|
this.animators[i].jumpTo(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.advance();
|
||||||
|
},
|
||||||
|
// if we have just play()'d, then call reverse(), and vice versa
|
||||||
|
toggle: function() {
|
||||||
|
if (this.forwards) {
|
||||||
|
this.seekTo(0);
|
||||||
|
} else {
|
||||||
|
this.seekTo(1);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// internal: install an event listener on an animator's onComplete option
|
||||||
|
// to trigger the next animator
|
||||||
|
listenTo: function(animator) {
|
||||||
|
var oldOnComplete = animator.options.onComplete;
|
||||||
|
var _this = this;
|
||||||
|
animator.options.onComplete = function() {
|
||||||
|
if (oldOnComplete) oldOnComplete.call(animator);
|
||||||
|
_this.advance();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// play the next animator
|
||||||
|
advance: function() {
|
||||||
|
if (this.forwards) {
|
||||||
|
if (this.animators[this.current + 1] == null) return;
|
||||||
|
this.current++;
|
||||||
|
this.animators[this.current].play();
|
||||||
|
} else {
|
||||||
|
if (this.animators[this.current - 1] == null) return;
|
||||||
|
this.current--;
|
||||||
|
this.animators[this.current].reverse();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// this function is provided for drop-in compatibility with Animator objects,
|
||||||
|
// but only accepts 0 and 1 as target values
|
||||||
|
seekTo: function(target) {
|
||||||
|
if (target <= 0) {
|
||||||
|
this.forwards = false;
|
||||||
|
this.animators[this.current].seekTo(0);
|
||||||
|
} else {
|
||||||
|
this.forwards = true;
|
||||||
|
this.animators[this.current].seekTo(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// an Accordion is a class that creates and controls a number of Animators. An array of elements is passed in,
|
||||||
|
// and for each element an Animator and a activator button is created. When an Animator's activator button is
|
||||||
|
// clicked, the Animator and all before it seek to 0, and all Animators after it seek to 1. This can be used to
|
||||||
|
// create the classic Accordion effect, hence the name.
|
||||||
|
// see setOptions for arguments
|
||||||
|
function Accordion(options) {
|
||||||
|
this.setOptions(options);
|
||||||
|
var selected = this.options.initialSection, current;
|
||||||
|
if (this.options.rememberance) {
|
||||||
|
current = document.location.hash.substring(1);
|
||||||
|
}
|
||||||
|
this.rememberanceTexts = [];
|
||||||
|
this.ans = [];
|
||||||
|
var _this = this;
|
||||||
|
for (var i=0; i<this.options.sections.length; i++) {
|
||||||
|
var el = this.options.sections[i];
|
||||||
|
var an = new Animator(this.options.animatorOptions);
|
||||||
|
var from = this.options.from + (this.options.shift * i);
|
||||||
|
var to = this.options.to + (this.options.shift * i);
|
||||||
|
an.addSubject(new NumericalStyleSubject(el, this.options.property, from, to, this.options.units));
|
||||||
|
an.jumpTo(0);
|
||||||
|
var activator = this.options.getActivator(el);
|
||||||
|
activator.index = i;
|
||||||
|
activator.onclick = function(){_this.show(this.index)};
|
||||||
|
this.ans[this.ans.length] = an;
|
||||||
|
this.rememberanceTexts[i] = activator.innerHTML.replace(/\s/g, "");
|
||||||
|
if (this.rememberanceTexts[i] === current) {
|
||||||
|
selected = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.show(selected);
|
||||||
|
}
|
||||||
|
|
||||||
|
Accordion.prototype = {
|
||||||
|
// apply defaults
|
||||||
|
setOptions: function(options) {
|
||||||
|
this.options = Object.extend({
|
||||||
|
// REQUIRED: an array of elements to use as the accordion sections
|
||||||
|
sections: null,
|
||||||
|
// a function that locates an activator button element given a section element.
|
||||||
|
// by default it takes a button id from the section's "activator" attibute
|
||||||
|
getActivator: function(el) {return document.getElementById(el.getAttribute("activator"))},
|
||||||
|
// shifts each animator's range, for example with options {from:0,to:100,shift:20}
|
||||||
|
// the animators' ranges will be 0-100, 20-120, 40-140 etc.
|
||||||
|
shift: 0,
|
||||||
|
// the first page to show
|
||||||
|
initialSection: 0,
|
||||||
|
// if set to true, document.location.hash will be used to preserve the open section across page reloads
|
||||||
|
rememberance: true,
|
||||||
|
// constructor arguments to the Animator objects
|
||||||
|
animatorOptions: {}
|
||||||
|
}, options || {});
|
||||||
|
},
|
||||||
|
show: function(section) {
|
||||||
|
for (var i=0; i<this.ans.length; i++) {
|
||||||
|
this.ans[i].seekTo(i > section ? 1 : 0);
|
||||||
|
}
|
||||||
|
if (this.options.rememberance) {
|
||||||
|
document.location.hash = this.rememberanceTexts[section];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
42
carnaval/soundmanagerv297a-20130101/demo/_image/.listing
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
drwxr-xr-x 2 wsoinuma psacln 4096 Jan 25 2013 .
|
||||||
|
drwxr-xr-x 18 wsoinuma psacln 4096 Jan 25 2013 ..
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 11416 Jan 25 2013 360ui-screenshot1.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 12040 Jan 25 2013 360ui-screenshot2.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 8983 Jan 25 2013 360ui-screenshot3.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 20140 Jan 25 2013 360ui-screenshot4.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 49436 Jan 25 2013 cassette-tape-ui-screenshot.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 119888 Jan 25 2013 cassette-tape-ui-screenshot.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 23588 Jan 25 2013 christmas-lights.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 119590 Jan 25 2013 christmas-lights.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 24531 Jan 25 2013 chunk-webfont.svg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 20496 Jan 25 2013 chunk-webfont.ttf
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 13660 Jan 25 2013 chunk-webfont.woff
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 19626 Jan 25 2013 dejavusansmono-webfont.eot
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 23040 Jan 25 2013 dejavusansmono-webfont.woff
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 12510 Jan 25 2013 fitter-happier-waveform.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 25471 Jan 25 2013 fitter-happier-waveform.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 218 Jan 25 2013 flash9-dark.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 244 Jan 25 2013 flash9.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 89 Jan 25 2013 getsatisfaction-icon.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 1895 Jan 25 2013 glyphish-dot-com-icons-and-android-sprite.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 133 Jan 25 2013 hue_thumb.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 33987 Jan 25 2013 logo-sprite.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 2781 Jan 25 2013 mpc-screenshot.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 3224 Jan 25 2013 muxtape-logo.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 201 Jan 25 2013 new-bw.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 181 Jan 25 2013 new-dark.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 205 Jan 25 2013 new.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 7659 Jan 25 2013 noise-dark.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 7613 Jan 25 2013 noise.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 125 Jan 25 2013 picker_thumb.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 877 Jan 25 2013 slider-1.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 101 Jan 25 2013 slider-bar.gif
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 570 Jan 25 2013 slider.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 34895 Jan 25 2013 soundmanager2-speaker.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 5929 Jan 25 2013 speaker.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 4702 Jan 25 2013 survivor-screenshot.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 185 Jan 25 2013 tiny_grid.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 832 Jan 25 2013 wedge.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 13063 Jan 25 2013 wheelsofsteel-full-ui.jpg
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 53661 Jan 25 2013 wheelsofsteel-full-ui.png
|
||||||
|
-rw-r--r-- 1 wsoinuma psacln 14946 Jan 25 2013 wheelsofsteel-single-deck-256.jpg
|
After Width: | Height: | Size: 11 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 8.8 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 48 KiB |
After Width: | Height: | Size: 117 KiB |
After Width: | Height: | Size: 23 KiB |
After Width: | Height: | Size: 117 KiB |
@ -0,0 +1,127 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<metadata>
|
||||||
|
This is a custom SVG webfont generated by Font Squirrel.
|
||||||
|
Copyright : Generated in 2010 by FontLab Studio Copyright info pending
|
||||||
|
</metadata>
|
||||||
|
<defs>
|
||||||
|
<font id="ChunkFiveRegular" horiz-adv-x="696" >
|
||||||
|
<font-face units-per-em="2048" ascent="1536" descent="-512" />
|
||||||
|
<missing-glyph horiz-adv-x="500" />
|
||||||
|
<glyph unicode="!" horiz-adv-x="630" d="M57 209q0 84 64.5 150.5t169.5 66.5q106 0 175 -63.5t69 -153.5q0 -88 -68 -149.5t-176 -61.5q-98 0 -166 64.5t-68 146.5zM66 1042v390h489v-390l-109 -516h-270z" />
|
||||||
|
<glyph unicode=""" horiz-adv-x="1032" d="M72 1436h393l-62 -613h-256zM567 1436h394l-74 -613h-256z" />
|
||||||
|
<glyph unicode="#" horiz-adv-x="1536" d="M31 375v278h299l59 234h-246v278h316l96 375h270l-96 -375h275l96 375h270l-96 -375h231v-278h-301l-59 -234h248v-278h-320l-94 -377l-270 4l94 373h-275l-94 -377l-270 4l94 373h-227zM600 653h274l60 234h-275z" />
|
||||||
|
<glyph unicode="$" horiz-adv-x="1234" d="M31 35v493h321q0 -57 27 -98t70 -60.5t78.5 -27.5t72.5 -10q150 0 150 100q0 41 -69 74t-166 66.5t-195.5 81.5t-167 141.5t-68.5 220.5q0 188 113.5 289.5t261.5 111.5v172h289v-213q78 -37 114 -100l17 115h299v-480h-316q0 104 -63.5 166t-163.5 62q-43 0 -82 -28 t-39 -77q0 -47 51 -84t128 -62.5t166 -64.5t166 -84t128 -128t51 -189.5t-41 -186t-109.5 -123.5t-144 -64.5t-161.5 -22.5v-211h-289v268q-55 31 -107 76l-22 -123h-299z" />
|
||||||
|
<glyph unicode="%" horiz-adv-x="1906" d="M31 1051q0 180 125 298.5t288 118.5q199 0 310.5 -114.5t111.5 -309.5q0 -184 -110.5 -300.5t-302.5 -116.5q-186 0 -304 115.5t-118 308.5zM336 1051q0 -104 37 -170t80 -66q47 0 76.5 62.5t29.5 166.5q0 100 -32.5 166t-80.5 66q-41 2 -75.5 -60.5t-34.5 -164.5zM387 0 l885 1432h233l-887 -1432h-231zM1040 424q0 180 125 299t289 119q199 0 310.5 -115t111.5 -309q0 -184 -110.5 -301t-303.5 -117q-186 0 -304 115.5t-118 308.5zM1346 424q0 -104 36.5 -170t79.5 -66q47 0 77 62.5t30 167.5q0 100 -33 165.5t-80 65.5q-41 2 -75.5 -60.5 t-34.5 -164.5z" />
|
||||||
|
<glyph unicode="&" horiz-adv-x="1579" d="M20 420q0 264 302 418q-63 41 -106.5 115.5t-43.5 154.5q0 135 125 241.5t313 106.5q219 0 333 -106.5t114 -241.5q0 -111 -67.5 -184.5t-166.5 -114.5l191 -191q59 111 106 273h439v-258h-201q-47 -135 -117 -242l127 -125h119v-266h-305l-133 131q-80 -74 -210 -116 t-276 -42q-250 0 -396.5 126t-146.5 321zM403 432q0 -70 51.5 -113t114.5 -43q145 0 242 86l-260 256h-8q-51 -33 -95.5 -84t-44.5 -102zM506 1114q0 -94 123 -147q6 -4 29.5 14t46 52t22.5 69q0 51 -28.5 88t-90.5 37q-43 0 -72.5 -35t-29.5 -78z" />
|
||||||
|
<glyph unicode="'" horiz-adv-x="559" d="M74 1436h405l-73 -613h-256z" />
|
||||||
|
<glyph unicode="(" horiz-adv-x="794" d="M51 639q0 170 50.5 341t128 303t154.5 227.5t148 158.5l211 -217q-59 -74 -94 -122t-96 -156.5t-93 -243.5t-32 -291q0 -162 29.5 -301t85 -245.5t97.5 -168t103 -133.5l-211 -219q-193 174 -337 459.5t-144 607.5z" />
|
||||||
|
<glyph unicode=")" horiz-adv-x="794" d="M51 -211q61 72 103.5 133.5t97.5 168t85 245.5t30 301q0 156 -32 291t-93.5 243.5t-96 156.5t-94.5 122l211 217q72 -63 148.5 -158.5t154.5 -227.5t128 -303t50 -341q0 -322 -144 -607.5t-337 -459.5z" />
|
||||||
|
<glyph unicode="*" horiz-adv-x="845" d="M10 1085l84 201l234 -108l-27 254h252l-33 -261l232 115l84 -201l-248 -81l184 -197l-186 -143l-162 227l-170 -234l-180 152l178 192z" />
|
||||||
|
<glyph unicode="+" horiz-adv-x="1120" d="M51 625v266h377v377h266v-377h375v-266h-375v-375h-266v375h-377z" />
|
||||||
|
<glyph unicode="," horiz-adv-x="557" d="M-12 -264q115 145 162 294.5t32 370.5l373 -98q6 -195 -82 -376t-250 -324z" />
|
||||||
|
<glyph unicode="-" d="M51 352v273h594v-273h-594z" />
|
||||||
|
<glyph unicode="." horiz-adv-x="528" d="M31 213q0 86 63.5 159.5t168 73.5t170 -73.5t65.5 -159.5q0 -96 -62.5 -158.5t-173.5 -62.5q-98 0 -164.5 67.5t-66.5 153.5z" />
|
||||||
|
<glyph unicode="/" horiz-adv-x="1073" d="M10 -160l762 1700h291l-762 -1704z" />
|
||||||
|
<glyph unicode="0" horiz-adv-x="1226" d="M31 723q0 326 160.5 530.5t416.5 204.5q293 0 440.5 -199.5t147.5 -549.5q0 -344 -150.5 -539t-427.5 -195q-266 0 -426.5 190.5t-160.5 557.5zM436 723q0 -186 57.5 -308t124.5 -122q72 0 119 115.5t47 300.5q0 182 -51 300.5t-127 118.5q-61 2 -115.5 -113.5 t-54.5 -291.5z" />
|
||||||
|
<glyph unicode="1" horiz-adv-x="1015" d="M51 1163l42 21l44 21l39 21q29 15 43 26l41 31q27 19 47 40l48 48q28 28 55 61h364v-1160h191v-272h-820v272h205v760l-205 -96z" />
|
||||||
|
<glyph unicode="2" horiz-adv-x="1208" d="M51 0v297q82 135 140.5 201.5t158.5 146.5q47 43 150.5 111.5t158 121t54.5 109.5q0 135 -172 135q-51 0 -103.5 -29.5t-77 -53t-71.5 -72.5l-221 233q219 254 532 254q209 0 348 -123t139 -325q0 -164 -70.5 -251t-256.5 -208q-86 -55 -180.5 -136t-126.5 -139h360v164 h344v-436h-1106z" />
|
||||||
|
<glyph unicode="3" horiz-adv-x="1105" d="M31 205l209 217q133 -133 270 -133q86 0 135 41t49 116q0 150 -170 150h-153v244h149q76 0 125 36.5t49 104.5q0 78 -54 120t-126 42q-123 0 -240 -123l-198 240q66 72 188.5 133t249.5 61q248 0 385 -117.5t137 -316.5q0 -143 -151 -260q190 -137 190 -336 q0 -213 -170 -332t-397 -119q-141 0 -278.5 70t-198.5 162z" />
|
||||||
|
<glyph unicode="4" horiz-adv-x="1196" d="M20 403v293l590 736h424v-807h109v-222h-109v-133h111v-270h-664v270h129v133h-590zM307 625h303v379z" />
|
||||||
|
<glyph unicode="5" horiz-adv-x="1181" d="M31 221l223 232q147 -152 287 -152q102 0 163.5 57.5t61.5 147.5q0 82 -60.5 140.5t-148.5 58.5q-102 0 -192 -95l-263 117l125 705h811v-306h-551l-34 -198q76 49 221 49q193 0 335 -130t142 -355q0 -125 -53.5 -225.5t-141.5 -163t-195.5 -96.5t-221.5 -34 q-150 0 -296 75t-212 173z" />
|
||||||
|
<glyph unicode="6" horiz-adv-x="1189" d="M33 623q-2 96 8 191t47 213t99.5 207t178 152.5t269.5 67.5q109 4 253 -42t230 -120l-139 -266q-178 104 -299 104q-111 -2 -181.5 -80.5t-86.5 -197.5q41 41 115.5 71.5t152.5 32.5q201 8 340 -121.5t139 -334.5q0 -213 -143.5 -361.5t-386.5 -156.5q-256 -8 -422 165 t-174 476zM416 545q0 -88 50 -165t140 -77q78 0 133.5 51.5t53.5 124.5q-2 72 -42 128.5t-124 54.5q-121 -6 -211 -117z" />
|
||||||
|
<glyph unicode="7" horiz-adv-x="1159" d="M31 1026v406h1108v-273l-551 -1159h-443l549 1159h-336v-133h-327z" />
|
||||||
|
<glyph unicode="8" horiz-adv-x="1144" d="M31 420q0 102 61.5 206.5t159.5 153.5q-74 45 -114 120t-40 153q0 176 131 289.5t357 113.5q231 0 360 -113.5t129 -289.5q0 -96 -49 -170t-123 -109q100 -49 155.5 -147.5t55.5 -206.5q0 -193 -148.5 -320t-392.5 -127q-250 0 -396 126t-146 321zM385 432 q0 -72 56.5 -120t133.5 -48q80 0 133.5 44t55.5 124q0 94 -81 136t-179 46q-49 -29 -84 -79t-35 -103zM434 1069q0 -51 39 -84t79 -41t85 -10q98 47 98 135q0 55 -46 92t-107 37q-59 0 -103.5 -39t-44.5 -90z" />
|
||||||
|
<glyph unicode="9" horiz-adv-x="1202" d="M31 936q0 213 143 361.5t387 156.5q258 8 429 -166t179 -475q2 -106 -8 -205.5t-50 -215.5t-104.5 -202t-181 -145t-270.5 -63q-109 -4 -253 42t-230 119l139 267q178 -104 299 -105q117 4 184.5 76t65.5 203q-98 -98 -250 -105q-201 -8 -340 122t-139 335zM397 956 q2 -72 42 -128t124 -54q102 4 193 117q0 94 -42 168t-130 74q-78 0 -133.5 -51.5t-53.5 -125.5z" />
|
||||||
|
<glyph unicode=":" horiz-adv-x="520" d="M31 201q0 86 62.5 157.5t164.5 71.5q104 0 167.5 -72.5t63.5 -156.5q0 -92 -64.5 -154.5t-166.5 -62.5q-96 0 -161.5 66.5t-65.5 150.5zM31 823q0 86 62.5 158t164.5 72q104 0 167.5 -73t63.5 -157q0 -94 -62 -155.5t-169 -61.5q-92 0 -159.5 67.5t-67.5 149.5z" />
|
||||||
|
<glyph unicode=";" horiz-adv-x="618" d="M10 -264l236 -133q162 143 250 324.5t82 375.5l-373 98q14 -221 -33 -370.5t-162 -294.5zM121 788q0 86 63.5 160t168 74t170 -74t65.5 -160q0 -94 -63.5 -157.5t-172.5 -63.5q-94 0 -162.5 68.5t-68.5 152.5z" />
|
||||||
|
<glyph unicode="<" horiz-adv-x="1124" d="M72 694v256l880 363l101 -250l-627 -240l627 -241l-101 -250z" />
|
||||||
|
<glyph unicode="=" horiz-adv-x="946" d="M51 352v273h844v-273h-844zM51 805v272h844v-272h-844z" />
|
||||||
|
<glyph unicode=">" horiz-adv-x="1124" d="M72 584l626 239l-626 242l100 250l881 -363v-256l-881 -362z" />
|
||||||
|
<glyph unicode="?" horiz-adv-x="1064" d="M4 1200q227 264 533 264q213 0 350 -109.5t137 -310.5q0 -74 -34 -136t-82 -104t-95 -77t-81 -69.5t-34 -67.5v-113h-379l-2 164q0 63 51.5 126.5t112 105.5t111.5 90.5t51 85.5q0 96 -151 96q-61 0 -134 -49t-133 -119zM264 209q0 84 64.5 150.5t169.5 66.5 q106 0 174.5 -63.5t68.5 -153.5q0 -88 -67.5 -149.5t-175.5 -61.5q-98 0 -166 64.5t-68 146.5z" />
|
||||||
|
<glyph unicode="@" horiz-adv-x="1595" d="M10 465q0 106 28 218t89 221.5t148 195.5t217.5 139t283.5 53q369 0 589 -207.5t220 -521.5q0 -57 -10 -116.5t-37 -126t-66.5 -116.5t-108.5 -83t-155 -33q-129 16 -184 68q-135 -98 -270 -99q-143 0 -257 119t-114 299q0 100 45 199.5t143.5 174.5t225.5 75 q113 0 200 -107l13 82l202 -27l-82 -583q2 0 3 -2q41 -25 75 -25q109 0 158 96.5t49 204.5q0 238 -174 396.5t-465 158.5q-147 0 -266 -63.5t-187.5 -163.5t-104.5 -210t-36 -216q0 -254 183.5 -433t449.5 -179q270 0 455 133l20 16l99 -141q-8 -8 -24.5 -19.5t-72 -43 t-118 -55.5t-159.5 -43t-200 -19q-326 0 -565.5 221t-239.5 563zM608 475q0 -92 44 -152.5t102 -60.5q88 0 172 49l39 267q-68 141 -168 141q-86 0 -137.5 -78t-51.5 -166z" />
|
||||||
|
<glyph unicode="A" horiz-adv-x="1685" d="M31 0v268h139l276 899h-84v265h787l362 -1164h144v-268h-821v268h194l-43 140h-420l-43 -140h160v-268h-651zM641 653h268l-135 443z" />
|
||||||
|
<glyph unicode="B" horiz-adv-x="1406" d="M51 0v266h119v901h-119v265h764q502 0 502 -351q0 -131 -44 -201.5t-157 -115.5q121 -33 195.5 -120t74.5 -228q0 -217 -131 -316.5t-426 -99.5h-778zM594 266h164q68 0 117 48t49 128t-45 130.5t-127 50.5h-158v-357zM594 854h125q78 0 108.5 40t30.5 118 q0 70 -38 109.5t-97 39.5h-129v-307z" />
|
||||||
|
<glyph unicode="C" horiz-adv-x="1404" d="M31 702q0 168 59.5 314.5t151.5 240t200.5 146.5t210.5 53q211 0 316 -139l47 115h321v-582h-366q-4 109 -59.5 183.5t-157.5 74.5q-109 0 -176.5 -117t-67.5 -289q0 -162 80 -273.5t219 -111.5q31 0 62.5 8.5t58 20.5t53.5 29.5t46.5 34t40 36t30.5 31.5l22 27l13 14 l239 -262q-262 -289 -620 -289q-328 0 -525.5 197.5t-197.5 537.5z" />
|
||||||
|
<glyph unicode="D" horiz-adv-x="1474" d="M51 0v272h127v889h-127v271h625q362 0 570 -197t208 -500q0 -350 -205 -542.5t-581 -192.5h-617zM598 272h78q156 2 231.5 130t75.5 333q0 180 -77 303t-230 123h-78v-889z" />
|
||||||
|
<glyph unicode="E" horiz-adv-x="1337" d="M51 0v272h129v889h-129v271h1235v-453h-354v182h-328v-282h389v-273h-389v-334h328v191h354v-463h-1235z" />
|
||||||
|
<glyph unicode="F" horiz-adv-x="1306" d="M51 0v272h127v889h-127v271h1225v-453h-363v182h-309v-356h389v-273h-389v-260h209v-272h-762z" />
|
||||||
|
<glyph unicode="G" horiz-adv-x="1589" d="M31 702q0 324 189.5 539t438.5 215q70 0 130.5 -11t98.5 -25.5t70.5 -37t48 -38t32 -36t20.5 -24.5l43 148h305v-605h-367q-4 121 -71.5 190.5t-161.5 69.5q-121 0 -201 -113.5t-80 -271.5q0 -162 76 -269t205 -107q139 0 197 100v86h-125v219h680v-219h-82v-512h-410 l-63 129q-37 -61 -127.5 -104t-202.5 -43q-274 0 -458.5 197t-184.5 523z" />
|
||||||
|
<glyph unicode="H" horiz-adv-x="1572" d="M51 0v270h113v891h-113v271h664v-271h-127v-309h389v309h-121v271h666v-271h-119v-891h119v-270h-666v270h121v310h-389v-310h127v-270h-664z" />
|
||||||
|
<glyph unicode="I" horiz-adv-x="782" d="M51 0v272h129v889h-129v271h680v-271h-127v-889h127v-272h-680z" />
|
||||||
|
<glyph unicode="J" horiz-adv-x="948" d="M41 -125q41 -18 92 -18q170 0 170 295v1011h-176v269h770v-269h-170v-1011q0 -283 -135 -426.5t-442 -143.5q-51 0 -107 23z" />
|
||||||
|
<glyph unicode="K" horiz-adv-x="1669" d="M51 0v266h111v901h-111v265h645v-265h-110v-333l381 333h-148v265h682v-265h-119l-297 -256l414 -645h119v-266h-799v266h139l-221 348l-151 -129v-219h110v-266h-645z" />
|
||||||
|
<glyph unicode="L" horiz-adv-x="1249" d="M51 0v272h113v889h-113v271h647v-271h-108v-889h264v260h344v-532h-1147z" />
|
||||||
|
<glyph unicode="M" horiz-adv-x="2064" d="M51 0v264h111v903h-109v265h776l207 -766l197 766h780v-265h-112v-901h112v-266h-647v266h117l-2 684v121h-8q-35 -190 -60 -274l-215 -797h-428l-229 817q-35 119 -43 254h-9v-807h117v-264h-555z" />
|
||||||
|
<glyph unicode="N" horiz-adv-x="1671" d="M51 0v264h121v903h-119v265h588l504 -752l-2 487h-139v265h616v-265h-135v-1167h-441l-522 780v-516h158v-264h-629z" />
|
||||||
|
<glyph unicode="O" horiz-adv-x="1515" d="M31 723q0 332 200.5 539.5t518.5 207.5q367 0 551 -202.5t184 -558.5q0 -350 -188.5 -548t-532.5 -198q-334 0 -533.5 193.5t-199.5 566.5zM537 723q0 -199 63.5 -318.5t163.5 -119.5q96 0 152.5 115.5t56.5 308.5q0 199 -56.5 322.5t-168.5 123.5h-4q-92 0 -149 -120 q-58 -122 -58 -312z" />
|
||||||
|
<glyph unicode="P" horiz-adv-x="1310" d="M51 0v270h115v893h-115v269h664q172 0 287.5 -34t174 -99.5t81 -137t22.5 -168.5q0 -195 -153.5 -300t-385.5 -105h-155v-318h125v-270h-660zM586 809h92q90 0 145.5 45t55.5 125q0 90 -50.5 138t-140.5 48h-102v-356z" />
|
||||||
|
<glyph unicode="Q" horiz-adv-x="1546" d="M31 725q0 315 190.5 514t497.5 199q350 0 525 -193.5t175 -533.5q0 -326 -170 -512q35 -133 90 -133q41 0 41 92v59h136v-104q0 -143 -80 -235.5t-228 -92.5q-119 0 -199.5 64.5t-117.5 162.5q-74 -12 -160 -12q-319 0 -509.5 186.5t-190.5 538.5zM481 725q0 -66 8 -113 q94 98 242 99q119 0 230 -80q4 49 4 80q0 182 -69 305t-179 123h-3q-92 0 -162 -118q-71 -120 -71 -296zM594 375q61 -68 137 -68q57 0 109 45q-12 86 -36 129t-73 43q-84 1 -137 -149z" />
|
||||||
|
<glyph unicode="R" horiz-adv-x="1509" d="M51 0v270h115v893h-115v269h666q172 0 287.5 -32t175 -93.5t82 -131t22.5 -165.5q0 -117 -83 -198t-214 -99q109 -16 188.5 -99.5t79.5 -191.5q0 -139 50 -139q47 0 47 65v68h137v-113q0 -143 -70.5 -235.5t-228.5 -92.5q-199 0 -298 99.5t-99 281.5q0 143 -36 187.5 t-169 44.5v-318h125v-270h-662zM588 817h92q90 0 143.5 43t53.5 123q0 182 -187 182h-102v-348z" />
|
||||||
|
<glyph unicode="S" horiz-adv-x="1454" d="M51 0v516h381q0 -61 26.5 -103t71.5 -62.5t82 -29t78 -10.5q174 0 174 103q0 37 -58 65.5t-145.5 48t-189.5 57.5t-189 87t-145.5 141t-58.5 215q0 109 47 196t122 139t156.5 78.5t161.5 26.5q317 0 428 -208l21 172h352v-514h-371q0 111 -74.5 174t-187.5 63 q-51 0 -96 -29.5t-45 -78.5q0 -57 84 -100.5t202.5 -81.5t237.5 -87t203 -145t84 -230q0 -115 -49 -201.5t-131 -136t-174.5 -73t-188.5 -23.5q-268 0 -428 189l-22 -158h-359z" />
|
||||||
|
<glyph unicode="T" horiz-adv-x="1435" d="M31 899v533h1374v-533h-301v262h-172v-889h170v-272h-762v272h168v889h-176v-262h-301z" />
|
||||||
|
<glyph unicode="U" horiz-adv-x="1509" d="M31 1165v267h651v-265h-111v-442q0 -233 49.5 -316t155.5 -83q70 0 111 25.5t68.5 116.5t27.5 259v434h-111v271h607v-265h-111v-497q0 -705 -588 -705q-635 18 -635 694v506h-114z" />
|
||||||
|
<glyph unicode="V" horiz-adv-x="1583" d="M-20 1165v267h755l-2 -267h-110l174 -458q59 -180 63 -248h10q6 92 74 260l186 446h-106l-2 267h582v-267h-101l-491 -1165h-377l-543 1165h-112z" />
|
||||||
|
<glyph unicode="W" horiz-adv-x="2078" d="M-20 1165v267h675v-267h-118l53 -299q29 -123 65 -403h11q4 47 100 508l102 461h426l129 -566q39 -182 62 -403h10q16 178 61 391l70 311h-113v267h586v-267h-112l-306 -1165h-485l-123 487q-27 98 -51 254h-8q-14 -102 -49 -249l-125 -492h-475l-271 1165h-114z" />
|
||||||
|
<glyph unicode="X" horiz-adv-x="1710" d="M51 0v264h178l301 391l-370 510h-107v267h811v-267h-119l201 -272l209 272h-180v267h680v-267h-174l-310 -395l369 -504h119v-266h-817v266h116l-155 209l-43 57l-211 -268h182v-264h-680z" />
|
||||||
|
<glyph unicode="Y" horiz-adv-x="1370" d="M-20 1169v263h700v-263h-107l119 -217q6 -16 33 -81.5t31 -84.5h8q4 18 76 177l112 206h-112v263h551v-263h-111l-379 -665v-238h115v-266h-656v266h117v242l-397 661h-100z" />
|
||||||
|
<glyph unicode="Z" horiz-adv-x="1462" d="M51 0v266l746 895l-387 -2l2 -266h-349v539h1344l4 -273l-749 -889h378l2 262h363v-532h-1354z" />
|
||||||
|
<glyph unicode="[" horiz-adv-x="1474" d="M59 0v270h115v893h-115v271h664q170 0 286.5 -39t175 -108.5t81 -145.5t22.5 -174q0 -215 -221 -338l229 -363h119v-266h-393l-340 549h-88v-279h125v-270h-660zM594 809h92q90 0 145.5 45t55.5 125q0 90 -50.5 138t-140.5 48h-102v-356z" />
|
||||||
|
<glyph unicode="\" horiz-adv-x="1073" d="M10 1540h291l762 -1700l-291 -4z" />
|
||||||
|
<glyph unicode="]" horiz-adv-x="1325" d="M61 0v266h84v1002h-84v268h474v-926l237 142h-147v272h573v-272h-158l-129 -76l285 -408h84v-268h-332l-344 489l-72 -49v-172h146v-268h-617z" />
|
||||||
|
<glyph unicode="^" horiz-adv-x="1222" d="M20 621l445 813h297l440 -813h-364l-224 458l-229 -458h-365z" />
|
||||||
|
<glyph unicode="_" horiz-adv-x="1431" d="M51 -2v170h1329v-170h-1329z" />
|
||||||
|
<glyph unicode="a" horiz-adv-x="1228" d="M31 303q0 170 124 273.5t302 103.5q55 0 103 -16.5t69.5 -31t29.5 -24.5v72q0 115 -194 115q-135 0 -305 -95l-86 238q242 145 446 145q100 0 191.5 -20.5t176.5 -65.5t136 -132t51 -203v-400h123v-262h-438l-49 92q-51 -70 -129 -100.5t-148 -30.5q-162 0 -282.5 88 t-120.5 254zM420 324q0 -43 30.5 -70t77.5 -27q43 0 79 20.5t52 47.5v78q-35 59 -120 59q-119 1 -119 -108z" />
|
||||||
|
<glyph unicode="b" horiz-adv-x="1343" d="M63 0v266h87v1002h-87v268h496v-592q33 39 113 67.5t155 28.5q223 0 350 -158q122 -154 122 -364q0 -7 -1 -14q-4 -240 -131 -383.5t-342 -143.5q-74 0 -128 14.5t-80.5 31t-61.5 47.5l-31 -70h-461zM555 489q0 -102 44 -173.5t103 -71.5q66 0 106 69.5t40 186.5 q0 98 -41 175t-107 77q-63 0 -107 -73q-39 -64 -39 -162q0 -14 1 -28z" />
|
||||||
|
<glyph unicode="c" horiz-adv-x="1087" d="M2 518q0 256 145.5 390t358.5 134q158 0 256 -116l35 98h241v-463h-301q-4 88 -34.5 151.5t-94.5 63.5q-86 0 -133 -76.5t-47 -185.5q0 -102 57.5 -171t153.5 -71h5q136 0 243 117l180 -209q-80 -88 -213 -148.5t-289 -60.5q-240 0 -401.5 143.5t-161.5 403.5z" />
|
||||||
|
<glyph unicode="d" horiz-adv-x="1298" d="M20 522q0 231 139.5 376.5t336.5 145.5q135 0 258 -77v303h-95v266h510v-1270h99v-266h-480l-34 76q-102 -94 -258 -94q-211 0 -343.5 159.5t-132.5 380.5zM461 522q0 -98 41 -175t106 -77q63 0 108 73q39 64 38 162v27q0 102 -44 174t-104 72q-66 0 -105.5 -69.5 t-39.5 -186.5z" />
|
||||||
|
<glyph unicode="e" horiz-adv-x="1110" d="M10 518q0 246 156 390.5t395 144.5q180 0 312.5 -83t177.5 -214q23 -66 27 -156q1 -14 1 -27q0 -78 -24 -163h-645q6 -31 14 -51.5t29.5 -52.5t64.5 -48t103 -16q168 0 286 98l172 -199q-207 -178 -528 -178q-215 0 -378 141.5t-163 413.5zM416 612h309q-2 74 -32.5 119 t-119.5 45q-82 0 -117.5 -53.5t-39.5 -110.5z" />
|
||||||
|
<glyph unicode="f" horiz-adv-x="790" d="M51 758v266h84v174q0 43 6 84t31 97.5t66 96.5t119.5 68.5t183.5 28.5q80 0 170 -15.5t131 -35.5l-123 -236q-45 20 -113 21q-66 0 -65 -109v-174h186v-266h-186v-490h123v-268h-611v268h82v490h-84z" />
|
||||||
|
<glyph unicode="g" horiz-adv-x="1310" d="M20 518q0 244 133.5 385t381.5 141q63 0 123.5 -25.5t93.5 -57.5l41 63h487v-268h-123v-613q0 -262 -161.5 -411.5t-477.5 -151.5q-152 2 -272.5 56.5t-196.5 123.5l109 228q49 -43 151.5 -87t204.5 -44q125 0 181.5 57t56.5 135v70q-88 -113 -240 -113 q-246 0 -369 148.5t-123 363.5zM457 522q0 -98 41 -175t106 -77q63 0 108 73q39 64 38 162v27q0 102 -44 174t-104 72q-66 0 -105.5 -69.5t-39.5 -186.5z" />
|
||||||
|
<glyph unicode="h" horiz-adv-x="1353" d="M51 0v268h86v1002h-86v266h496v-639q25 41 124 102.5t197 61.5q113 0 189 -38t110.5 -108.5t47 -140t12.5 -164.5v-342h96v-268h-526v557q0 39 -2 61.5t-12.5 57.5t-37 53.5t-69.5 18.5q-129 0 -129 -191v-289h147v-268h-643z" />
|
||||||
|
<glyph unicode="i" horiz-adv-x="675" d="M51 0v268h86v490h-86v266h475v-756h99v-268h-574zM109 1323q0 78 60 143.5t160.5 65.5t163 -65.5t62.5 -143.5q0 -88 -60.5 -147.5t-164.5 -59.5q-92 0 -156.5 64.5t-64.5 142.5z" />
|
||||||
|
<glyph unicode="j" horiz-adv-x="737" d="M29 -154q68 0 114.5 24t69.5 51.5t35 77.5t13 74.5t1 69.5v615h-86v266h475v-881q0 -86 -12 -157.5t-51 -151.5t-104.5 -135t-181.5 -91t-273 -36v274zM233 1323q0 78 60.5 143.5t161 65.5t163 -65.5t62.5 -143.5q0 -88 -60.5 -147.5t-164.5 -59.5q-92 0 -157 64.5 t-65 142.5z" />
|
||||||
|
<glyph unicode="k" horiz-adv-x="1339" d="M78 0v266h84v1002h-84v268h473v-926l237 142h-147v270h573v-270h-157l-139 -88l276 -396h102v-268h-606v268h86l-155 221l-72 -49v-172h76v-268h-547z" />
|
||||||
|
<glyph unicode="l" horiz-adv-x="679" d="M51 0v268h88v1004h-86v264h475v-1268h121v-268h-598z" />
|
||||||
|
<glyph unicode="m" horiz-adv-x="1859" d="M51 0v268h86v484h-86v270h387l45 -121q125 150 256 150q72 0 128.5 -14.5t92 -42t51 -46t33.5 -45.5q131 147 302 148q119 0 198.5 -40t117.5 -115t52.5 -152.5t14.5 -184.5v-283h100v-276h-520v502q0 12 1 44t1 50t-2 46t-7.5 45.5t-13.5 34.5t-22.5 25.5t-34.5 8.5 q-61 0 -85 -38t-24 -112v-332h123v-274h-530v522q0 137 -14.5 185.5t-71.5 48.5q-92 0 -92 -123v-365h122v-268h-608z" />
|
||||||
|
<glyph unicode="n" horiz-adv-x="1325" d="M51 0v268h86v490h-86v266h436l48 -127q119 164 292 164q92 0 161 -26.5t108 -68.5t62.5 -104.5t31.5 -121t8 -130.5v-342h96v-268h-516v559v48q0 11 -5 47t-16.5 50.5t-35 30t-57.5 15.5q-129 0 -129 -191v-291h147v-268h-631z" />
|
||||||
|
<glyph unicode="o" horiz-adv-x="1175" d="M191 904q167 144 393 145q250 -4 407.5 -147.5t161.5 -393.5v-6q0 -243 -158 -385q-160 -143 -401 -144q-238 0 -406 143q-166 141 -165 394q-1 248 168 394zM442 514q0 -125 43 -201.5t109 -76.5q63 0 101 76.5t38 195.5t-40 195.5t-109 78.5q-59 0 -100.5 -77.5 t-41.5 -190.5z" />
|
||||||
|
<glyph unicode="p" horiz-adv-x="1306" d="M51 -150h86v902h-86v272h469l35 -72q119 88 248 88q229 0 356 -153.5t127 -382.5q0 -240 -132 -383.5t-335 -143.5q-172 0 -266 80v-207h111v-268h-613v268zM553 489q0 -102 44 -173.5t103 -71.5q66 0 106 69.5t40 186.5q0 98 -41 175t-107 77q-63 0 -107 -73 q-39 -64 -39 -162q0 -14 1 -28z" />
|
||||||
|
<glyph unicode="q" horiz-adv-x="1351" d="M51 518q0 256 137.5 391t352.5 135q88 0 155.5 -27.5t87.5 -53.5l39 61h477v-266h-100v-955h100v-274h-649v268h133v271q-104 -86 -262 -86q-201 0 -336 147t-135 389zM492 516q0 -102 44 -174t103 -72q66 0 105.5 70t39.5 186q0 98 -41 175t-106 77q-63 0 -108 -72 q-39 -64 -38 -162q0 -14 1 -28z" />
|
||||||
|
<glyph unicode="r" horiz-adv-x="847" d="M51 0v268h90v490h-88v266h385l62 -131q25 45 44 70.5t54 55.5t89 43t130 13v-368q-147 0 -218 -49.5t-71 -178.5v-211h103v-268h-580z" />
|
||||||
|
<glyph unicode="s" horiz-adv-x="1040" d="M31 0v369h274q0 -49 44 -83t89 -44.5t84 -10.5q90 0 90 70q0 18 -16 31.5t-48 24t-66 19.5l-84 22q-50 13 -87 26q-272 96 -272 328q0 143 115.5 220t244.5 77q102 0 187.5 -46.5t118.5 -113.5l16 135h252v-369h-266q0 63 -64.5 109.5t-144.5 46.5t-80 -74 q0 -16 12 -29.5t41 -26.5t51.5 -21.5t72.5 -24.5l75 -25q80 -27 120.5 -45t98 -56t84 -94.5t26.5 -131.5q0 -139 -112.5 -223.5t-268.5 -84.5q-104 0 -189 43t-124 107l-18 -125h-256z" />
|
||||||
|
<glyph unicode="t" horiz-adv-x="743" d="M31 758v266h110v188l377 121v-309h195v-266h-195v-365q0 -8 -1 -29.5t0 -34t2 -29.5t5 -27.5t11.5 -21.5t19.5 -16.5t29 -5.5q47 0 129 35v-262q-41 -16 -122 -27.5t-126 -11.5q-90 0 -150.5 21.5t-94.5 52.5t-51 94.5t-21.5 114.5t-6.5 147v365h-110z" />
|
||||||
|
<glyph unicode="u" horiz-adv-x="1292" d="M31 754v270h495v-494q0 -135 24.5 -196.5t86.5 -61.5q55 0 92 44t37 112v326h-135v270h530v-752h101v-272h-388l-55 129l-20 -23q-20 -25 -28 -31l-30 -29q-23 -22 -41 -30t-44.5 -21t-58.5 -18.5t-69 -5.5q-227 0 -319 119t-92 381v283h-86z" />
|
||||||
|
<glyph unicode="v" horiz-adv-x="1255" d="M0 764v260h623v-260h-103l94 -217q45 -133 54 -215h8q4 94 61 225l99 207h-109v260h528v-260h-106l-354 -764h-318l-381 764h-96z" />
|
||||||
|
<glyph unicode="w" horiz-adv-x="1785" d="M0 758v266h551v-266h-70l45 -150q41 -139 52 -295h4q20 268 84 482l65 229h379l78 -266q59 -188 88 -445h4q18 193 55 324l35 121h-84v266h500v-266h-84l-240 -758h-432l-141 463l-148 -463h-422l-231 758h-88z" />
|
||||||
|
<glyph unicode="x" horiz-adv-x="1329" d="M41 0v254h137l209 235l-254 279h-92v256h664v-256h-97l144 -156l153 156h-137v256h522v-256h-135l-217 -219l258 -295h96v-254h-653v254h96l-155 166l-148 -166h133v-254h-524z" />
|
||||||
|
<glyph unicode="y" horiz-adv-x="1187" d="M-18 762v262h630v-260h-96l133 -320l133 320h-94v260h520v-254h-98l-389 -946q-23 -49 -40 -80t-54 -76t-80 -70.5t-111.5 -44t-154.5 -18.5q-139 8 -248 103l153 241q68 -59 119 -69q9 -2 18 -2q34 0 62 26q35 33 51 84l29 86l-399 758h-84z" />
|
||||||
|
<glyph unicode="z" horiz-adv-x="1132" d="M51 0v268l494 492h-228v-146h-266v410h1014v-264l-487 -492h215v140h288v-408h-1030z" />
|
||||||
|
<glyph unicode="|" horiz-adv-x="681" d="M205 -418v1854h272v-1854h-272z" />
|
||||||
|
<glyph unicode="­" d="M51 352v273h594v-273h-594z" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="833" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="1669" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="833" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="1669" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="555" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="415" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="276" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="276" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="206" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="333" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="92" />
|
||||||
|
<glyph unicode="‐" d="M51 352v273h594v-273h-594z" />
|
||||||
|
<glyph unicode="‑" d="M51 352v273h594v-273h-594z" />
|
||||||
|
<glyph unicode="‒" d="M51 352v273h594v-273h-594z" />
|
||||||
|
<glyph unicode="–" horiz-adv-x="915" d="M66 352v273h772v-273h-772z" />
|
||||||
|
<glyph unicode="—" horiz-adv-x="1292" d="M86 352v273h1104v-273h-1104z" />
|
||||||
|
<glyph unicode="’" horiz-adv-x="559" d="M74 1436h405l-73 -613h-256z" />
|
||||||
|
<glyph unicode="“" horiz-adv-x="1032" d="M72 1436h393l-62 -613h-256zM567 1436h394l-74 -613h-256z" />
|
||||||
|
<glyph unicode="”" horiz-adv-x="1032" d="M72 1436h393l-62 -613h-256zM567 1436h394l-74 -613h-256z" />
|
||||||
|
<glyph unicode="…" horiz-adv-x="1585" d="M1088 213q0 86 63.5 159.5t168 73.5t170 -73.5t65.5 -159.5q0 -96 -62.5 -158.5t-173.5 -62.5q-98 0 -164.5 67.5t-66.5 153.5zM559 213q0 86 63.5 159.5t168 73.5t170 -73.5t65.5 -159.5q0 -96 -62.5 -158.5t-173.5 -62.5q-98 0 -164.5 67.5t-66.5 153.5zM31 213 q0 86 63.5 159.5t168 73.5t170 -73.5t65.5 -159.5q0 -96 -62.5 -158.5t-173.5 -62.5q-98 0 -164.5 67.5t-66.5 153.5z" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="333" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="415" />
|
||||||
|
<glyph unicode="" horiz-adv-x="1025" d="M0 1025h1025v-1025h-1025v1025z" />
|
||||||
|
</font>
|
||||||
|
</defs></svg>
|
After Width: | Height: | Size: 24 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 25 KiB |