ionic-framework/demos/component-docs/index.ts

import {App, ActionSheet, Animation} from 'ionic/ionic';
import {NgZone} from 'angular2/angular2';

function toTitleCase(str) {
  return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
}

@App({
  templateUrl: 'main.html'
})
class DemoApp {

  component: any;
  actionSheet: any;

  constructor(actionSheet: ActionSheet, zone: NgZone) {
    this.actionSheet = actionSheet;
    this.component = {
        title: 'Action Sheets',
    };
    window.onmessage = (e) => {
      zone.run(() => {
        if (e.data) {
          var data = JSON.parse(e.data);
          this.component.title = toTitleCase(data.hash.replace('-', ' '));
        }
      });
    };
    this.setupAnimations();
  }

  openMenu() {
    this.actionSheet.open({
      buttons: [
        { text: 'Share This' },
        { text: 'Move' }
      ],
      destructiveText: 'Delete',
      titleText: 'Modify your album',
      cancelText: 'Cancel',
      cancel: function() {
        console.log('Canceled');
      },
      destructiveButtonClicked: () => {
        console.log('Destructive clicked');
      },
      buttonClicked: function(index) {
        console.log('Button clicked', index);
        if(index == 1) { return false; }
        return true;
      }

    }).then(actionSheetRef => {
      this.actionSheetRef = actionSheetRef;
    });
  }

  setupAnimations() {
    this.animation = new Animation();
    this.animation
      .duration(2000)

    var ionitronSpin = new Animation(document.querySelector('#ionitron'));
    ionitronSpin
      .from('transform', 'rotate(0deg)')
      .to('transform', 'rotate(360deg)')

    this.animation.add(ionitronSpin);
  }

  play() {
    this.animation.play();
  }

  pause() {
    this.animation.pause();
  }


}