This algorithm returns the points that form an orthogonal path between two rectangles.
// Define shapes
const shapeA = {left: 50, top: 50, width: 100, height: 100};
const shapeB = {left: 200, top: 200, width: 50, height: 100};
// Available variables: | |
// - Machine | |
// - interpret | |
// - assign | |
// - send | |
// - sendParent | |
// - spawn | |
// - raise | |
// - actions |
// Available variables: | |
// - Machine | |
// - interpret | |
// - assign | |
// - send | |
// - sendParent | |
// - spawn | |
// - raise | |
// - actions |
Machine({ | |
id: 'editor', | |
type: 'parallel', | |
states: { | |
selection: { | |
initial: 'idle', | |
states: { | |
idle: { | |
on: { | |
SELECT: { |
// Available variables: | |
// - Machine | |
// - interpret | |
// - assign | |
// - send | |
// - sendParent | |
// - spawn | |
// - raise | |
// - actions |
This algorithm returns the points that form an orthogonal path between two rectangles.
// Define shapes
const shapeA = {left: 50, top: 50, width: 100, height: 100};
const shapeB = {left: 200, top: 200, width: 50, height: 100};
import Component from '@glimmer/component'; | |
import { action } from '@ember/object'; | |
export default class extends Component { | |
get context() { | |
return JSON.stringify(this.args.machine.machine.context) | |
} | |
@action | |
updateContext() { |
// Available variables: | |
// - Machine | |
// - interpret | |
// - assign | |
// - send | |
// - sendParent | |
// - spawn | |
// - raise | |
// - actions |
Machine({ | |
initial: 'pageA', | |
states: { | |
pageA: { | |
initial: 'unknown', | |
states: { | |
unknown: { | |
on: { | |
'': [ |
// Available variables: | |
// - Machine | |
// - interpret | |
// - assign | |
// - send | |
// - sendParent | |
// - spawn | |
// - raise | |
// - actions |