// BASIC EXAMPLE
//
function main(sources) {
  const navigation  = isolate(Navigation, 'nav')(sources)
  const ctaForm     = isolate(CTAForm,    'ctaForm')(sources)

  visualize(navigation, { scope: 'nav' })
  visualize(navigation, { scope: 'ctaForm' })

  // ... rest of function
}

// EXAMPLE USING PREFIX
//
// Here we use the 'prefix' attribute of visualize with Component and Operation
// Component means a cyclejs component that sinks to DOM
// Operation means a cyclejs component that does _not_ sink to DOM,
//   used to isolate discrete stream based operations such as sinking to
//   a parallax driver on an animation driver.

// Convenience function for mounting & visualizing Components
function mountComponent(component, scope, sources) {
  const sinks = isolate(component, scope)(sources)
  visualize(sinks, { scope: scope, prefix: "Component" })
  return sinks
}

// Convenience function for mounting & visualizing Operations
function mountOperation(operation, scope, sources) {
  const sinks = component(sources)
  visualize(sinks, { scope: scope, prefix: "Operation" })
  return sinks
}

function main(sources) {
  const navigation  = mountComponent(Navigation, 'nav',     sources)
  const ctaForm     = mountComponent(CTAForm,    'ctaForm', sources)

  const parallaxBG  = mountOperation(ParallaxBackground,  'parallaxBG',  sources)
  const animateLogo = mountOperation(AnimateLogo, 'animateLogo', sources)
}