DIR : /home/kozerus/public_html/jkwii/js/jsdoit/selfdestuct/index.js

/home/kozerus/public_html/jkwii/js/jsdoit/selfdestuct

// forked from Event's "Button" http://jsdo.it/Event/jam_session3
(function($) {

this.SelfDestructionButton = new Class({
  
  Implements: [Options,Events],

  options: {
    insert: null,
    onReady:$empty,
    onStart:$empty
  },
  
  initialize: function(options) {
    this.setOptions(options);
    
    this.element = new Element("div",{'id':'selfDestruction'});
    this.stripe = new Element("div",{'class':'stripeBase'});
    this.cover = new Element("div",{'class':'cover','lang':'en','html':'<span class="ex"></span><strong class="caution">CAUTION</strong>'});
    
    if(Browser.Engine.webkit||Browser.Engine.trident){
      this.element.addClass("wingdings");
    }
    
    this.button = new Element("div",{'class':'button'});
    this.core = new Element("div",{"id":"core"});
  this.core.start = false;
    
    this.panel = new Element("div",{"id":"panel",'html':'<div class="text"><p class="title">SELF DESTRUCTION</p><p>Please leave the area within five seconds of pressing this button.</p></div>'});
    
    this.control = this.controller();
    
    this.cover.set("morph",{
    onComplete:function(){ 
      if(!this.element.hasClass('active') || this.cover.ready) return;
        this.cover.ready = true;
        this.fireEvent("ready",this.element);
        
    }.bind(this)
    });
    
    
    this.cover.addEvent('click',function(e){
      if(this.element.hasClass('active')) this.cover.morph({'top':-150});
    }.bind(this));
    
    this.core.addEvent('click',function(e){
    if(this.core.start) return;  
    this.core.start = true;            
      this.button.addClass("start");
      this.fireEvent('start',this.element);
    }.bind(this));
    
    
    this.core.inject(this.button);
    this.button.inject(this.stripe);
    this.cover.inject(this.element);
    this.stripe.inject(this.element);
    this.control.inject(this.panel);
    this.panel.inject(this.element);
    
    this.element.inject(this.options.insert||document.body);
    
  },
  
  controller: function() {
    var div = new Element("div",{'class':'controller'});
    var Switch = new Element("div",{"class":"switch"});
    var pin = new Element("div",{"class":"pin"});
    var lamp = new Element("div",{"class":"lamp"});
    var led = new Element("div",{"class":"led"});
    
    
    Switch.addEvent("click",function(){
      this.element.toggleClass('active');
      if(!this.element.hasClass('active')&&this.cover.ready){
        this.cover.morph({'top':45});
        this.button.removeClass("start");
        this.core.start = false;
        this.cover.ready = false;
      }
    }.bind(this));
    
    pin.inject(Switch);
    
    led.inject(lamp);
    
    div.grab(lamp).grab(Switch);
    return div;
  }
  
});
})(document.id);

window.addEvent("domready",function(){
    new SelfDestructionButton({
      onReady:function(){alert("Ready");},
      onStart:function(){alert("Start");}
    });
});
//


koh5_pano



Your browser does not support the HTML5 canvas element.


Drag mouse to navigate.

Navigation





17.Aug.2010, Martin Wengenmayer