BowelyzerGUI{

  var mainView, settingsView, channelContainerView,
  <channels,
  <indicators,
  //TODO: move to BowelyzerConfig
  fadeOutTime = 0.3,
  fadeOutSteps = 20,
  minWidth=1280,
  minHeight=720;

  *new{
    arg config;
    ^super.new.init(config)
  }

  init{
    arg config;
    postln("Launching GUI.");
    channels = Set.new(config.at(\inputs).size);
    indicators = Dictionary.new(config.at(\inputs).size);
    this.setupMainView(config);
    this.setupChannelViews(config);
  }

  //setup the main view, in which all other views reside
  setupMainView{
    arg config;
    var forwardView, hubView, synthServerView;
    mainView = PageLayout.new("Bowelyzer");
    mainView.asView.background = Color.fromHexString("#DBDBDB");
    settingsView = View(mainView.asView, Rect(0,0, mainView.bounds.width/config.at(\inputs).size, 60));
    settingsView.asView.background = Color.fromHexString("#99EF99");
    settingsView.layout = HLayout();
    settingsView.layout.spacing = 0;
    settingsView.layout.margins = [0,0,0,0];
    settingsView.maxSize_(450@60);
    //forward 
    forwardView = View(settingsView.asView);
    forwardView.asView.background = Color.grey;
    forwardView.layout = VLayout();
    forwardView.layout.spacing = 0;
    forwardView.layout.margins = [2,0,2,0];
    forwardView.maxSize_(150@60);
    StaticText(forwardView, Rect(0, 0, 150@20)).string_("forward").align_(\center);
    this.setupEZText(forwardView, "address", config.at(\forwardAddress));
    this.setupEZNumber(forwardView, "port", config.at(\forwardPort));
    //hub
    hubView = View(settingsView.asView);
    hubView.asView.background = Color.grey;
    hubView.layout = VLayout();
    hubView.layout.spacing = 0;
    hubView.layout.margins = [2,0,2,0];
    hubView.maxSize_(150@60);
    StaticText(hubView, Rect(0, 0, 150@20)).string_("hub").align_(\center);
    this.setupEZText(hubView, "address", config.at(\hubAddress));
    this.setupEZNumber(hubView, "port", config.at(\hubPort));
    //synthServer
    synthServerView = View(settingsView.asView);
    synthServerView.asView.background = Color.grey;
    synthServerView.layout = VLayout();
    synthServerView.layout.spacing = 0;
    synthServerView.layout.margins = [2,0,2,0];
    synthServerView.maxSize_(150@60);
    StaticText(synthServerView, Rect(0, 0, 150@20)).string_("synthServer").align_(\center);
    this.setupEZText(synthServerView, "address", config.at(\synthServerAddress));
    this.setupEZNumber(synthServerView, "port", config.at(\synthServerPort));

    //TODO: add headView for hub, forward and scsynth addresses, save and load setup
    //TODO: add Button to save/load setup
    //TODO: add EZText for addresses
    //TODO: add EZNumber for ports
    channelContainerView = View(mainView.asView, Rect(0, 0, mainView.bounds.width/config.at(\inputs).size, mainView.bounds.height));
    channelContainerView.asView.background = Color.fromHexString("#FEFEFE");
    channelContainerView.layout = HLayout();
    channelContainerView.layout.spacing = 0;
    channelContainerView.layout.margins = [0,0,0,0];
    channelContainerView.maxSize_((340*config.at(\inputs).size)@680);
    //TODO: add Button for adding new channel
  }

  //setup channel views
  setupChannelViews{
    arg config;
    var channelView, headView, controlMeterContainerView, meterView, controlsView, controlsFromConfig, levelIndicator;
    config.at(\inputs).keysValuesDo({|name, input|
      channelView = View(mainView.asView, Rect(0, 0, mainView.bounds.width/config.at(\inputs).size, mainView.bounds.height));
      channelView.asView.background = Color.fromHexString("#FEEFEF");
      channelView.name = name;
      channelView.layout = VLayout();
      channelView.layout.spacing = 0;
      channelView.layout.margins = [2,0,2,0];
      channelView.maxSize_(300@680);
      // adding name textfield of input
      headView = View(channelView.asView, Rect(0, 0, channelView.bounds.width/config.at(\inputs).size, 40));
      headView.asView.background = Color.fromHexString("#DDEFDD");
      headView.name = \inputs;
      headView.layout = HLayout();
      headView.layout.spacing = 0;
      headView.layout.margins = [2,0,0,0];
      headView.maxHeight_(26);
      this.setupEZText(headView, "name", name.asString);
      this.setupEZNumber(headView, "input", config.at(\inputs).at(name));

      //controlMeterContainerView = View(channelView.asView, Rect(0, 0, channelView.bounds.width/config.at(\inputs).size, channelView.bounds.height));
      controlMeterContainerView = View(channelView.asView);
      controlMeterContainerView.asView.background = Color.fromHexString("#DDDDEF");
      controlMeterContainerView.name = \meterAndControls;
      controlMeterContainerView.layout = HLayout();
      controlMeterContainerView.maxHeight_(channelView.bounds.height-headView.bounds.height);
      controlMeterContainerView.layout.spacing = 0;
      controlMeterContainerView.layout.margins = [0,0,0,0];

      meterView = View(controlMeterContainerView.asView, Rect(0,0, channelView.bounds.width*0.1, channelView.bounds.height));
      meterView.asView.background = Color.fromHexString("#EEEFEE");
      meterView.name = \meterView;
      meterView.layout = VLayout();
      meterView.maxWidth = 60;
      meterView.layout.spacing = 0;
      meterView.layout.margins = [0,0,0,0];

      //setup a toggle button for each channel
      this.setupPauseButton(meterView);

      // setup a small View as indicator for incoming/outgoing OSC messages for each input
      this.setupOSCIndicator(meterView);
      this.addOSCIndicatorFadeOutTask(name);

      // setup LevelIndicator for each input
      this.setupLevelIndicator(meterView);

      controlsView = View(controlMeterContainerView.asView, Rect(0,0, channelView.bounds.width*0.9, channelView.bounds.height));
      controlsView.asView.background = Color.fromHexString("#EEEFEE");
      controlsView.name = \controls;
      controlsView.layout = VLayout();
      controlsView.layout.spacing = 0;
      controlsView.layout.margins = [0,0,0,0];

      config.at(\controls).at(name).order.do({|control, i|
        var unit;
        var value = config.at(\controls).at(name).at(control), controlIs = BowelyzerConfig.controlContainedIn(control);
        switch(
          controlIs.asSymbol,
          \knob, {this.setupEZKnob(controlsView, control, value, \controls, name)},
          \slider, {this.setupEZSlider(controlsView, control, value)},
          \ranger, {this.setupEZRanger(controlsView, control, value, \controls, name)}
        );
      });

      channelContainerView.layout.add(channelView);
      channels.add(channelView);
    });
  }

  // setup a OSC indicator view (one on each channel)
  setupOSCIndicator{
    arg parent;
    ^View(parent, Rect(0,0,40,40))
    .name_(\OSCIndicator)
    .background_(Color.fromHexString("#EEEFEE"))
    .maxSize_(40@20)
    .visible_(true)
    ;
  }

  // setup tasks for changing the OSC indicator color (on receiving a message)
  addOSCIndicatorFadeOutTask{
    arg name;
    indicators.put(
      name.asSymbol,
      Task({
        channels.do({|channel|
          if(channel.name.asSymbol == name,{
            channel.children.do({|channelChild|
              if(channelChild.name.asSymbol == \meterAndControls,{
                channelChild.children.do({|meterAndControls|
                  if(meterAndControls.name.asSymbol == \meterView, {
                    meterAndControls.children.do({|meterView|
                      if(meterView.isKindOf(View) && meterView.name.asSymbol == \OSCIndicator, {
                        meterView.background_(Color.fromHexString("#99FF99"));
                        fadeOutSteps.do({|item,i|
                          meterView.background_(meterView.background.blend(Color.fromHexString("#EEEFEE"), (fadeOutTime/fadeOutSteps)));
                          (fadeOutTime/fadeOutSteps).wait;
                        });
                        meterView.background_(Color.fromHexString("#EEEFEE"));
                      });
                    });
                  });
                });
              });
            });
          });
        });
      })
    );
  }

  freeOSCIndicatorFadeOutTask{

  }

  setupLevelIndicator{
    arg parent;
    ^LevelIndicator(
      parent
    ).maxSize_(40@600)
    .style_(\led)
    .drawsPeak_(true);
  }

  setupPauseButton{
    arg parent;
    ^Button(parent, Rect(0,0,40,20))
    .states_([
      ["on", Color.black, Color.fromHexString("#99FF99")],
      ["off", Color.black, Color.fromHexString("#FF9999")]
    ])
    .action_({
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/toggle",
        name = controlUnit.parent.parent.parent.name.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlValue);
      })
    .maxSize_(40@20)
    ;
  }


  setupEZText{
    arg parent, control, value;
    ^EZText(
      parent: parent,
      bounds: 150@20,
      label: control,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.name.asString,
        name = controlUnit.view.parent.parent.name.asSymbol,
        controlName = controlUnit.labelView.string.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlName, controlValue);
      },
      labelWidth: 50,
      textWidth: 100,
      initVal:value.asString,
      layout: \horz,
      margin: nil
    )
    .view.maxHeight_(20);
  }

  setupEZNumber{
    arg parent, control, value;
    //TODO: make choosing of size and action/message generic
    ^EZNumber(
      parent: parent,
      bounds: 100@20,
      label: control,
      controlSpec: control.asSymbol,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.name.asString,
        name = controlUnit.view.parent.parent.name.asSymbol,
        controlName = controlUnit.labelView.string.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlName, controlValue);
      },
      initVal:value,
      //unitWidth:0,
      layout: \horz,
      margin: nil
    )
    //.view.maxSize_(100@20);
    .view.maxHeight_(20)
    ;
  }

  setupEZSlider{
    arg parent, control, value;
    ^EZSlider(
      parent: parent,
      bounds: 230@40,
      label: control,
      controlSpec: control.asSymbol,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.name.asString,
        name = controlUnit.view.parent.parent.parent.name.asSymbol,
        controlName = controlUnit.labelView.string.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlName, controlValue);
      },
      numberWidth: 70,
      layout: \line2,
      margin: nil
    );
  }

  setupEZRanger{
    arg parent, control, value;
    ^EZRanger(
      parent: parent,
      bounds: 300@16,
      label: control,
      controlSpec: control,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.name.asString,
        name = controlUnit.view.parent.parent.parent.name.asSymbol,
        controlName = controlUnit.labelView.string.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlName, controlValue);
      },
      labelWidth: 120,
      unitWidth:30
    );
  }

  setupEZKnob{
    arg parent, control, value, type, name;
    ^EZKnob(
      parent: parent,
      bounds: 300@16,
      label: control,
      controlSpec: \freq,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.name.asString,
        name = controlUnit.view.parent.parent.parent.name.asSymbol,
        controlName = controlUnit.labelView.string.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlName, controlValue);
      },
      labelWidth: 120,
      unitWidth:30
    );
  }
}