About Dingle

Dingle is an MP3 player with visualizations based on the DingX Sound Spectrum system.  It is built to run on Actionscript 3.

The main aim of Dingle is to create a fully / pure AS3-based music player without the use of ANY resource libraries (MCs, etc.), that is customizable, and supports visualizations that are a class of its own.

Currently, it supports at least 3 visualizations from DingX.

This technology shipped on 17 Jan, 2010.  It is still being updated.  Please note that a plugin is currently being built for the JW player to support DingX.

 

Usage

Embed it like a normal SWF.  Preferably, use SWF Object for embedding.

Dingle is (almost) fully configurable.  Please access the Config.as file found in the org.joelTong.dingle package.  For more information on the individual variables, please refer to the appended comments.  Additionally, can view the configuration file here.

  /*
.########..####.##....##..######...##.......########
.##.....##..##..###...##.##....##..##.......##......
.##.....##..##..####..##.##........##.......##......
.##.....##..##..##.##.##.##...####.##.......######..
.##.....##..##..##..####.##....##..##.......##......
.##.....##..##..##...###.##....##..##.......##......
.########..####.##....##..######...########.########
*/

/*--------------------------------------------------------------------------------------
 * Dingle MP3 Flash (AS3) Music player with realtime sound spectrum visualization
 * 
 * @version 	Dingle Ver. 1.0
 * @author 		TONG HAOWEN JOEL
 * @email 		me [at] joeltong [dot] org
 * @website		http://www.joeltong.org/blog/
 * 
 *--------------------------------------------------------------------------------------
 * 
 * Copyright 2010 Tong Haowen Joel

 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at

 *   http://www.apache.org/licenses/LICENSE-2.0

 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * 
 *--------------------------------------------------------------------------------------*/


package org.joelTong.dingle
{
	
	/**
	 * joeltong.org
	 * @author JOELTONG
	 * joel [dot] tong [at] gmail [dot] com
	 */
	
	 import flash.text.TextFormatAlign;
	 
	public class Config {
		
		public static var DINGLE_VERSION:String = "1.10";									//VERSION NUMBER.  DO NOT ALTER.
		
		/* Controls the width / height of movie */
		public static var WIDTH:int = 200;													//width of stage
		public static var HEIGHT:int = 200;													//height of stage
		
		/* Outline for MP3 Player */
		public static var OUTLINE_THICKNESS:Number = 2;										//stage border thickness
		public static var OUTLINE_COLOR:uint = 0xFF0000;									//stage border color
		
		
		/* Controls the font settings used for song name header */
		public static var SONG_HEADER_FONT:String = "SF New Republic";						//song header font size
		public static var SONG_HEADER_WIDTH:int = WIDTH;									//song header textbox width.  Do not alter.
		public static var SONG_HEADER_HEIGHT:int = 25;										//song header textbox height
		public static var SONG_HEADER_SIZE:int = 16;										//song header text size
		public static var SONG_HEADER_COLOR:uint = 0xFFCC00;								//song header text color
		public static var SONG_HEADER_DEFAULT:String = "Song Name";							//song header default caption
		public static var SONG_HEADER_ALIGN:String = TextFormatAlign.CENTER;				//song header text alignment
		public static var SONG_HEADER_ALPHA:Number = 1;										//song header transparency (decimal).
		
		
		/* Controls the font settings used for artist name header */						
		public static var ARTIST_HEADER_FONT:String = "SF New Republic";					//artist header font face
		public static var ARTIST_HEADER_WIDTH:int = WIDTH;									//artist header width.  DO NOT ALTER.
		public static var ARTIST_HEADER_HEIGHT:int = 20;									//artist header textbox height
		public static var ARTIST_HEADER_SIZE:int = 16;										//artist header font size
		public static var ARTIST_HEADER_COLOR:uint = 0xFFCC00;								//artist header font color
		public static var ARTIST_HEADER_DEFAULT:String = "Artist Name";						//artist header default caption
		public static var ARTIST_HEADER_ALIGN:String = TextFormatAlign.RIGHT;				//artist header text alignment
		public static var ARTIST_HEADER_ALPHA:Number = 1;									//artist header transparency (decimal).
		
		/* Generic filter options for the artist and song name header */
		public static var HEADER_GLOW_COLOR:uint = 0xFFCC00;								//header captions glow color
		public static var HEADER_GLOW_ALPHA:Number = 0.7;									//header captions glow transparency
		public static var HEADER_GLOW_BLUR_X:Number = 6;									//header captions glow blur X
		public static var HEADER_GLOW_BLUR_Y:Number = 6;									//header captions glow blur Y
		public static var HEADER_GLOW_STRENGTH:Number = 2;									//header captions glow strength
		public static var HEADER_GLOW_QUALITY:Number = 2;									//header captions glow quality
		
		public static var HEADER_BLUR_BLUR_X:Number = 1.2;									//header captions blur, blur X
		public static var HEADER_BLUR_BLUR_Y:Number = 1.2;									//header captions blur, blur Y
		public static var HEADER_BLUR_QUALITY:Number = 1;									//header captions blur quality
		
		
		/* Progress bar settings */
		public static var PROGRESS_BAR_WIDTH:int = 150;										//progress bar width.  DO NOT ALTER.
		public static var PROGRESS_BAR_PADDING:int = 20;									//padding to use.  best way of altering progress bar width.
		public static var PROGRESS_BAR_HEIGHT:int = 7;										//progress bar height
		
		public static var PROGRESS_BAR_OUTLINE_COLOR:uint = 0xFFCC00;						//progress bar outline
		public static var PROGRESS_BAR_OUTLINE_THICKNESS:Number = 1;						//progress bar thickness
		public static var PROGRESS_BAR_ALPHA:Number = 0.7;									//progress bar alpha transparency
		
		public static var PROGRESS_BAR_CURRENT_COLOR:uint = 0xFFCC00;						//"currently playing" bar color
		
		public static var PROGRESS_BAR_MOVING_COLOR:uint = 0xFFCC00;						//"jump to" bar color
		
		public static var PROGRESS_BAR_TIME_FONT:String = "Calibri";						//current time font face
		public static var PROGRESS_BAR_TIME_WIDTH:int = WIDTH;								//current time textbox width.  DO NOT ALTER.
		public static var PROGRESS_BAR_TIME_HEIGHT:int = 20;								//current time textbox height.
		public static var PROGRESS_BAR_TIME_SIZE:int = 12;									//current time font size
		public static var PROGRESS_BAR_TIME_COLOR:uint = 0xFFCC00;							//current time font color
		public static var PROGRESS_BAR_TIME_DEFAULT:String = "00:00";						//current time default caption
		public static var PROGRESS_BAR_TIME_ALIGN:String = TextFormatAlign.LEFT;			//current time font alignment
		
		
		/* Controls the menu settings */
		
		public static var MENU_HEADER_BOX_HEIGHT:int = 30;									//header background box height
		public static var MENU_HEADER_COLOR:uint = 0x333333;								//header background box color
		public static var MENU_HEADER_TITLE:String = "Song Title:";							//header menu font caption 1
		public static var MENU_HEADER_ARTIST:String = "Artist";								//header menu font caption 2
		public static var MENU_HEADER_LENGTH:String = "Length";								//header menu font caption 3
		public static var MENU_HEADER_ALBUM:String = "Album";								//header menu font caption 4
		
		public static var MENU_ITEM_HEIGHT:int = 20;										//menu item background height
		public static var MENU_ITEM_COLOR:uint = 0x111111;									//menu item background color
		public static var MENU_ITEM_PADDING:Number = 3;										//menu item caption padding
		public static var MENU_ITEM_FONT_COLOR:uint = 0xFFCC33;								//menu item font color
		
		public static var MENU_PROPORTION_H1:Number = 0.40;									//menu item proportion (header 1)
		public static var MENU_PROPORTION_H2:Number = 0;									//menu item proportion (header 2)
		public static var MENU_PROPORTION_H3:Number = 0.25;									//menu item proportion (header 3)
		public static var MENU_PROPORTION_H4:Number = 0.35;									//menu item proportion (header 4)
		
		public static var MENU_SELECTED_COLOR:uint = 0xCC0000;								//menu item (selected) color
		
		public static var MENU_OVER_COLOR:uint = 0xFFFFFF;									//menu item (over) color
		public static var MENU_OVER_ALPHA:Number = 0.3;										//menu item (over) transparency
		
		
		/* Controls the scrollbar */

		
		public static var SCROLLBAR_TRACK_COLOR:uint = 0x333333;							//scrollbar track color
		public static var SCROLLBAR_GRABBER_COLOR:uint = 0xFF6600;							//scrollbar grabber color
		public static var SCROLLBAR_GRABBER_PRESS_COLOR:uint = 0xFF0000;					//scrollbar grabber (press) color
		public static var SCROLLBAR_GRIP_COLOR:uint = 0xffffff;								//scrollbar grip color
		
		public static var SCROLLBAR_TRACK_THICKNESS:Number = 15;							//scrollbar track thickness
		public static var SCROLLBAR_GRABBER_THICKNESS:Number = 15;							//scrollbar grabber thickness
		public static var SCROLLBAR_EASE_AMOUNT:Number = 4;									//scrollbar ease amount
		
		public static var SCROLLBAR_SHINY:Boolean = true;									//scrollbar is shiny?
		
		
		
		
		/* Controls the visualizations-------------------------------------------------------- */
		
		/* Generic options */
		public static var DINGX_VISUALIZATION_TYPE:int = 1;									//type of visualization used.  a number from 0 to 2.
		
		/**
		 * Option 0 --------------------------------------------------------
		 * Combines a Type5 with a line spectrum rotating analyzer
		 */
		
		/* Generic options */
		public static var VISUAL_0_ROTATING_SPEED:Number = 0.1;								//rotating speed of container.
		
		/* For the Type5 visualization */
		public static var VISUAL_0_COLOR_MIN:uint = 0xFFFF0000;								//particle minimum color.  Alter one channel only.  Written in ARGB.
		public static var VISUAL_0_COLOR_MAX:uint = 0xFFFFEE00;								//particle maximum color.  Alter one channel only.  Written in ARGB.
		public static var VISUAL_0_COLOR_NO_OF_CYCLES:uint = 50;							//no. of colors to generate.  If less than no. of channels color cycles itself.
		
		public static var VISUAL_0_PARTICLES_MIN:int = 2;									//minimum no. of particles to generate.
		public static var VISUAL_0_PARTICLES_MAX:int = 6;									//maximum no. of particles to generate.
		public static var VISUAL_0_PARTICLES_LIFETIME:Number = 0.8;							//maximum lifetime of particles
		public static var VISUAL_0_PARTICLES_GRAVITY:int = 20;								//gravity per particle
		public static var VISUAL_0_PARTICLES_BLUR_X:Number = 2;								//blur X used on particle
		public static var VISUAL_0_PARTICLES_BLUR_Y:Number = 2;								//blur Y used on particle
		public static var VISUAL_0_PARTICLES_RADIUS:Number = 5;								//blur radius used on particle
		
		public static var VISUAL_0_OPTIMAL_FPS:int = 24;									//Optimal FPS to achieve
		public static var VISUAL_0_TIMER_UPDATE:int = 50;									//time, in ms, to update sound spectrum data.
		public static var VISUAL_0_AMPLITUDE:int = 150;										//amplitude exponent per particle.
		public static var VISUAL_0_PERFORM_FFT:Boolean = false;								//whether to perform a fast fourier transform on spectrum.
		
		/* for the line spectrum visualization */
		public static var VISUAL_0_LINE_THICKNESS:Number = 1;								//line spectrum line thickness
		public static var VISUAL_0_LINE_FFT:Boolean = false;								//whether to perform a fast fourier transform on line spectrum
		public static var VISUAL_0_LINE_AMPLITUDE:int = 150;								//line spectrum amplitude exponent
		public static var VISUAL_0_LINE_TIMER_UPDATE:int = 20;								//time, in ms, to update sound spectrum data.
		public static var VISUAL_0_LINE_COLOR:uint = 0xFFCC33;								//color of line
		public static var VISUAL_0_LINE_ALPHA:Number = 0.2;									//spectral line alpha transparency.
		
		/*-------------------------------------------------------------------------------------*/
		
		/**
		 * Option 1 --------------------------------------------------------
		 * a Type3 spectrum
		 */
		
		/* For the Type5 visualization */
		public static var VISUAL_1_COLOR_MIN:uint = 0xFFFF9900;								//minimum color of particles used
		public static var VISUAL_1_COLOR_MAX:uint = 0xFFFFFF00;								//maximum color of particles used
		public static var VISUAL_1_COLOR_NO_OF_CYCLES:uint = 20;							//no. of cycles for color range.  If less than no. if channels analyzed, colors repeat.
		
		public static var VISUAL_1_CHANNELS_NO:int = 20;									//no. of emitters for spectrum.  The more the merrier.
		public static var VISUAL_1_CHANNELS_BAR_H:int = 10;									//jet area height.  The larger the area, the more the acceleration imposed on particle.
		public static var VISUAL_1_CHANNELS_PARTICLES:int = 200;							//no. of particles
		public static var VISUAL_1_CHANNELS_LIFETIME:Number = 5;							//maximum lifetime per particle
		public static var VISUAL_1_CHANNELS_THRESHOLD:int = 75;								//threshold intensity used.  IMPORTANT FOR BEAT DETECTION.
		public static var VISUAL_1_CHANNELS_GRAVITY:int = 100;								//gravity used of particle
		public static var VISUAL_1_CHANNELS_EXPLOSION_EXPONENT:int = 15;					//explosion exponent used.
		public static var VISUAL_1_CHANNELS_FOUNTAIN_FORCE:int = -500;						//force of jet per emitter
		public static var VISUAL_1_CHANNELS_UPDATE_TIME:int = 50;							//time, in ms, to update sound spectrum data.
	
		
		/*-------------------------------------------------------------------------------------*/
		
		/**
		 * Option 2 --------------------------------------------------------
		 * a Type1 spectrum
		 */
		
		public static var VISUAL_2_COLOR_MIN:uint = 0xFFFF9900;								//minimum color of particles used
		public static var VISUAL_2_COLOR_MAX:uint = 0xFFFFFF00;								//maximum color of particles used
		public static var VISUAL_2_COLOR_NO_OF_CYCLES:int = 20;								//no. of cycles for color range.  If less than no. if channels analyzed, colors repeat.
		
		public static var VISUAL_2_CHANNELS_NO:int = 10;									//no. of emitters for spectrum.  The more the merrier.
		public static var VISUAL_2_CHANNELS_PARTICLES:int = 80;								//no. of particles
		public static var VISUAL_2_CHANNELS_EXPLOSION:Number = 1;							//explosion exponent used.
		public static var VISUAL_2_CHANNELS_THRESHOLD:int = 70;								//threshold intensity used.  IMPORTANT FOR BEAT DETECTION.
		public static var VISUAL_2_PARTICLE_RADIUS:Number = 2;								//radius of particle
		public static var VISUAL_2_PARTICLE_BLUR:Number = 2;								//particle blur radius
		public static var VISUAL_2_PARTICLE_LIFETIME:Number = 1.5;							//particle lifetime
	}
	
}
  

 

Download

Please download the package from my blog.

 

License

Dingle is distributed under the Apache 2.0 license.