patocallaghan

ab-test.svg
academy.svg
account.svg
active.svg
activity.svg
add-column-left.svg
add-column-right.svg
add-macro.svg
add-participant.svg
add-row-above.svg

patocallaghan

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';

export default class extends Component {
  @tracked isOpen = false;

  @action
  togglePanel() {
    this.isOpen = !this.isOpen;

patocallaghan

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';

export default class extends Component {
  @tracked random = this.getRandom();

  constructor() {
    super(...arguments);
    console.log('INIT: Alpha Page Component');

patocallaghan

import Controller from '@ember/controller';
import { action } from '@ember/object';

export default Controller.extend({
  init() {
    this._super(...arguments);
    console.log('INIT: Alpha Controller');
    this.set('random', this.getRandom());
  },
  

patocallaghan

import Controller from '@ember/controller';

export default Controller.extend({
  init() {
    this._super(...arguments);
    console.log('INIT: Alpha Controller');
  }
});

patocallaghan

import Component from '@glimmer/component';
import { action } from '@ember/object';

export default class HtmlDemo extends Component {
  @action
  updateFirstName(event) {
    // This will throw an error because this.args is not mutable
    this.args.firstName = event.target.value;
	}
}

patocallaghan

import Component from '@ember/component';

export default Component.extend({
  actions: {
    updateLastName(event) {
      this.set('lastName', event.target.value);
    }
  }
});

patocallaghan

$blue: #0000ff;
.parent {
    .child {
        background: $blue;
    }
}

patocallaghan

$blue: #0000ff;
.parent {
    .child {
        background: $blue;
    }
}

patocallaghan

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  appName = 'Ember Twiddle';
}