BotanJS/botanjs/src/Astro/Blog/Components/Bubble.js
2015-08-14 21:06:23 +08:00

134 lines
3.0 KiB
JavaScript

(function(){
var ns = __namespace( "Astro.Blog.Components" );
/** @type {System.Cycle} */
var Cycle = __import( "System.Cycle" );
/** @type {System.utils.EventKey} */
var EventKey = __import( "System.utils.EventKey" );
/** @type {Dandelion} */
var Dand = __import( "Dandelion" );
/** @type {Dandelion.IDOMElement} */
var IDOMElement = __import( "Dandelion.IDOMElement" );
var Bubble = function () {
this.stage = null;
this.bubble = null;
//// default is somewhat purple
this.bgColor = "#662D91";
this.blowInner = function ()
{
var b_style = this.bubble.style
, s_style = this.stage.style;
b_style.margin = "10px 10px";
b_style.width = "150px";
b_style.height = "150px";
s_style.width = "170px";
s_style.height = "170px";
s_style.bottom = "20px";
s_style.right = "20px";
};
this.blowOuter = function ()
{
var b_style = this.bubble.style
, s_style = this.stage.style;
b_style.margin = "100px 100px";
s_style.width = "200px";
s_style.height = "200px";
s_style.bottom = "10px";
s_style.right = "10px";
Cycle.delay( this.blowInner.bind(this), 250 );
};
this.Void = function ()
{
this.stage.style.display = "none";
};
// Set Bindings
this.init = this.init.bind(this);
this.blurp = this.blurp.bind(this);
this.pop = this.pop.bind(this);
this.setColor = this.setColor.bind(this);
};
var wrapc = function( aClass, elem )
{
return Dand.wrapc( "comp " + aClass, elem );
};
Bubble.prototype.init = function ()
{
this.stage = wrapc( "bubble" );
this.bubble = wrapc( "innerBubble" );
var b_style = this.bubble.style
, s_style = this.stage.style;
b_style.margin = "85px 85px";
b_style.width = "0px";
b_style.height = "0px";
b_style.background = this.bgColor;
b_style.overflow = "hidden";
this.bubble.appendChild(
this.message = wrapc( "bInner flsf" )
);
this.stage.appendChild(this.bubble);
s_style.display = "none";
s_style.width = "10px";
s_style.height = "10px";
s_style.bottom = "85px";
s_style.right = "85px";
// onClick handle to prevent persistent bubble
IDOMElement( this.stage ).addEventListener( new EventKey( "Click", this.blurp ) );
return this.stage;
};
Bubble.prototype.setColor = function (color)
{
this.bubble.style.background = color;
};
Bubble.prototype.blurp = function ()
{
var b_style = this.bubble.style
, s_style = this.stage.style;
b_style.margin = "0 0";
b_style.width = "0px";
b_style.height = "0px";
b_style.overflow = "hidden";
s_style.position = "fixed";
s_style.width = "10px";
s_style.height = "10px";
s_style.bottom = "85px";
s_style.right = "85px";
Cycle.delay( this.Void.bind(this), 250 );
};
Bubble.prototype.pop = function (message)
{
this.message.innerHTML = message;
this.stage.style.display = "block";
Cycle.delay( this.blowOuter.bind(this), 100 );
};
ns[ NS_EXPORT ]( EX_CLASS, "Bubble", Bubble );
})();