Exemple #1
0
import Ember from 'ember';

import d3 from 'd3';
import GraphicSupport from 'linx/mixins/d3/graphic-support';
import { join } from 'ember-cli-d3/utils/d3';

import BubbleActions from 'linx/lib/bubble-actions';
import multiply from 'linx/lib/computed/multiply';
import DraggableMixin from 'linx/mixins/components/arrangement-visual/draggable';

export default Ember.Component.extend(
  BubbleActions('onClick'),
  GraphicSupport('startBeat', 'beatCount', 'pxPerBeat', 'height', 'row'),
  DraggableMixin, {

  // required params
  clip: null,
  height: 0,
  pxPerBeat: 0,

  // optional params
  row: 0,
  isDraggable: false,
  isResizable: false,
  startBeat: Ember.computed.reads('clip.startBeat'),
  beatCount: Ember.computed.reads('clip.beatCount'),
  widthPx: multiply('beatCount', 'pxPerBeat'),

  actions: {
    onResizeStart(d3Context, d, dBeats) {},
    onResizeRight(d3Context, d, dBeats) {},
Exemple #2
0
import Ember from 'ember';

// import Bezier from 'npm:bezier-js';

import BubbleActions from 'linx/lib/bubble-actions';
import RequireAttributes from 'linx/lib/require-attributes';

import LxCanvas from './lx-canvas';

export default LxCanvas.extend(
  BubbleActions(), RequireAttributes(), {

  actions: {},
  classNames: ['BezierCurve'],
  classNameBindings: [],

  // TODO: turn into model?
  curve: Ember.computed(function() {
    return new Bezier(150,40 , 80,30 , 105,150);
  }),

  draw: function() {
    let curve = this.get('curve');
    Ember.Logger.log('_drawCurve');
    this.drawCurve(curve);
    this.drawSkeleton(curve);
  }.observes('curve'),

  empty: Ember.K,

  drawCurve(curve, offset = { x: 0, y: 0 }) {