BowelyzerGUI{

  var mainView, <settingsView, <channelContainerView, lowerView, <configFilePathView,
  <channels,
  <indicators,
  fadeOutTime = 0.3,
  fadeOutSteps = 20,
  minWidth=1280,
  minHeight=720,
  <channelViewHeight = 700,
  <channelViewWidth = 300,
  channelViewSize,
  controlMeterContainerViewHeight = 700,
  controlMeterContainerViewWidth = 300,
  controlMeterContainerViewSize,
  <buttonHeight = 20,
  <buttonWidth = 48,
  settingsSubViewMargins = #[2,2,2,2],
  settingsSubViewSize,
  settingsViewSize,
  configViewSize,
  meterViewWidth = 54,
  meterViewHeight = 700,
  headViewHeight = 30,
  headViewWidth = 300,
  controlsViewWidth = 246,
  controlsViewHeight = 700,
//  controlGroups = #["general", "amplitude", "pitch", "hf"],
//  controlGroupGeneral = #[\sendReplyFreq, \freqRange, ],
  sliderWidth = 238,
  sliderHeight = 40
  ;

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

  init{
    arg config;
    postln("Launching GUI.");
    settingsViewSize = 496@64;
    settingsSubViewSize = 144@64;
    configViewSize = 64@64;
    controlMeterContainerViewSize = controlMeterContainerViewWidth@controlMeterContainerViewHeight;
    channelViewSize = channelViewWidth@channelViewHeight;
    channels = Set.new(config.config.at(\inputs).size);
    indicators = Dictionary.new(config.config.at(\inputs).size);
    this.setupMainView(config.config, config.configFilePath);
    this.setupChannelViews(config.config);
  }

  //setup the main view, in which all other views reside
  setupMainView{
    arg config, configFilePath, buttonView;
    var channelScrollView, layout;
    mainView = PageLayout.new("Bowelyzer");
    mainView.asView.background = Color.fromHexString("#DBDBDB");
    layout = mainView.asView.addFlowLayout(0@0, 0@0);
    mainView.onClose_({
      |view|
      //TODO: close everything depending on choice
      view.close;
    });

    //settings
    settingsView = View(mainView.asView, Rect(0, 0, mainView.bounds.width, settingsViewSize.y));
    settingsView.layout = HLayout();
    settingsView.layout.spacing = 4;
    settingsView.layout.margins = [0,0,0,0];
    settingsView.name = "settingsView";

    this.setupConfigView;
    this.setupConfigFilePathView(configFilePath);
    this.setupSettingsSpacer;
    this.setupSynthServerView(config);
    this.setupHubView(config);
    this.setupForwardView(config);

    // go to next line in layout
    layout.nextLine;

    lowerView = View(mainView.asView, Rect(0 , 0, mainView.bounds.width, mainView.bounds.height-settingsView.bounds.height));
    lowerView.layout = HLayout();
    lowerView.layout.spacing = 0;
    lowerView.layout.margins = [0,0,0,0];
    buttonView = View(bounds: Rect(0, 0, buttonWidth+8, mainView.bounds.height-settingsView.bounds.height));
    buttonView.layout = VLayout();
    buttonView.layout.spacing = 4;
    buttonView.layout.margins = [4,4,4,4];
    buttonView.name = "buttonView";
    buttonView.layout.insert(this.setupChannelAddButton, 0);
    buttonView.layout.insert(this.setupGlobalToggleButton, 1);
    buttonView.layout.insert(nil, 2);
    lowerView.layout.insert(buttonView, 0);

    // scrollview for channels
    channelScrollView = ScrollView(bounds: Rect(0 , 0, mainView.bounds.width-buttonWidth, mainView.bounds.height-settingsView.bounds.height))
    .autohidesScrollers_(false)
    .hasBorder_(true);
    // container for channelViews
    channelContainerView = View(parent: channelScrollView, bounds: Rect(0, 0, (channelViewWidth*config.at(\inputs).size), channelViewHeight));
    channelContainerView.asView.background = Color.fromHexString("#FEFEFE");
    channelContainerView.layout = HLayout();
    channelContainerView.layout.spacing = 0;
    channelContainerView.layout.margins = [0,0,0,0];
    channelContainerView.name = "channelContainerView";
    lowerView.layout.insert(channelScrollView, 1);
  }

  // setup View for displaying current configuration file
  setupConfigFilePathView{
    arg configFilePath;
    var listView;
    {
      listView = View();
      listView.minSize_((settingsSubViewSize.x*2)@settingsSubViewSize.y);
      listView.addFlowLayout(0@0, 0@0);
      listView.name = "configFilePath";
      configFilePathView = EZListView.new(
        listView,
        bounds: (settingsSubViewSize.x*2)@settingsSubViewSize.y,
        label: "Current configuration:"
      );
      if(configFilePath.notNil && (configFilePath != ""), {
        configFilePathView.addItem(configFilePath, {|unit| this.sendLoadMessage(unit.item)});
      });
      settingsView.layout.insert(listView, 1);
    }.defer;
  }


  // insert a new config file path at the top of the list and set it to current
  setCurrentConfigFilePath{
    arg configFile;
    {
      configFilePathView.insertItem(0, configFile, {|unit| this.sendLoadMessage(unit.item)});
      configFilePathView.value(0);
    }.defer;
  }

  // setup the config View with Buttons to save and load configurations
  setupConfigView{
    {
    var configView = View();
    configView.layout = VLayout();
    configView.layout.spacing = 4;
    configView.layout.margins = [4,4,4,4];
    configView.name = "config";
    configView.maxSize_(configViewSize);
    configView.layout.insert(this.setupSaveButton, 0);
    configView.layout.insert(this.setupSaveAsButton, 1);
    configView.layout.insert(this.setupLoadButton, 2);
    configView.layout.insert(nil, 2);
    settingsView.layout.insert(configView, 0);
    }.defer;
  }

  // setup View for synthServer address and port
  setupSynthServerView{
    arg config;
    var synthServerView;
    {
      synthServerView = View(bounds: Rect(0, 0, settingsSubViewSize.x, settingsSubViewSize.y));
      synthServerView.layout = VLayout();
      synthServerView.layout.spacing = 0;
      synthServerView.layout.margins = settingsSubViewMargins;
      synthServerView.name = "synthServer";
      synthServerView.minSize_(settingsSubViewSize);
      StaticText(synthServerView, Rect(0, 0, 140@buttonHeight)).string_("synthServer").align_(\center);
      this.setupEZText(synthServerView, "address", config.at(\synthServerAddress));
      this.setupEZNumber(synthServerView, "port", config.at(\synthServerPort)).children.do({|item|
        if(item.isKindOf(StaticText),{
          item.align_(\left);
        });
        if(item.isKindOf(NumberBox),{
          item.align_(\right);
        });
      });
      settingsView.layout.insert(synthServerView, 3);
    }.defer;
  }

  // setup View for hub address and port
  setupHubView{
    arg config;
    var hubView;
    {
      hubView = View(bounds: Rect(0, 0, settingsSubViewSize.x, settingsSubViewSize.y));
      hubView.layout = VLayout();
      hubView.layout.spacing = 0;
      hubView.layout.margins = settingsSubViewMargins;
      hubView.name = "hub";
      hubView.minSize_(settingsSubViewSize);
      StaticText(hubView, Rect(0, 0, 140@buttonHeight)).string_("hub").align_(\center);
      this.setupEZText(hubView, "address", config.at(\hubAddress));
      this.setupEZNumber(hubView, "port", config.at(\hubPort)).children.do({|item|
        if(item.isKindOf(StaticText),{
          item.align_(\left);
        });
        if(item.isKindOf(NumberBox),{
          item.align_(\right);
        });
      });
      settingsView.layout.insert(hubView, 4);
    }.defer;
  }

  // setup View for forward address and port
  setupForwardView{
    arg config;
    var forwardView;
    {
      forwardView = View(bounds: Rect(0, 0, settingsSubViewSize.x, settingsSubViewSize.y));
      forwardView.layout = VLayout();
      forwardView.layout.spacing = 0;
      forwardView.layout.margins = settingsSubViewMargins;
      forwardView.name = "forward";
      forwardView.minSize_(settingsSubViewSize);
      StaticText(forwardView, Rect(0, 0, 140@buttonHeight)).string_("forward").align_(\center);
      this.setupEZText(forwardView, "address", config.at(\forwardAddress));
      this.setupEZNumber(forwardView, "port", config.at(\forwardPort)).children.do({|item|
        if(item.isKindOf(StaticText),{
          item.align_(\left);
        });
        if(item.isKindOf(NumberBox),{
          item.align_(\right);
        });
      });
      settingsView.layout.insert(forwardView, 5);
    }.defer;
 }

  setupSettingsSpacer{
    settingsView.layout.insert(nil, 5);
  }

  // remove Views for addresses and ports
  removeSettingsView{
    arg name;
    {
      settingsView.children.do({|setting, i|
        if(setting.isKindOf(View) && (setting.name == name.asString), {
          setting.remove;
        });
      });
    }.defer;
  }

  // setup channel views
  setupChannelViews{
    arg config;
    config.at(\inputs).keysValuesDo({|name, input|
      this.setupChannelView(name, config);
    });
  }

  // set the View name of a given channel to a given String
  setChannelName{
    arg name, update;
    {
      name = name.asString;
      update = update.asString;
      channels.do({|channel|
        if(channel.name == name, {
          channel.name = update;
        });
      });
    }.defer;
  }

  // set the TextField of a channel to a given String
  setChannelText{
    arg name, update;
    {
      name = name.asString;
      update = update.asString;
      channels.do({|channel|
        if(channel.name == name, {
          channel.children.do({|channelChild|
            if(channelChild.name == "inputs", {
              channelChild.children.do({|headView|
                if(headView.name == "name", {
                  headView.children.do({|nameView|
                    if(nameView.isKindOf(TextField), {
                      nameView.string_("\""++update++"\"");
                    });
                  });
                });
              });
            });
          });
        });
      });
    }.defer;
  }

  // setup a single channel View by name
  setupChannelView{
    arg name, config;
    var channelView, headView, controlMeterContainerView, meterView, controlsView, controlsSelectorView, levelIndicator;
    {
      channelContainerView.maxSize_((channelViewWidth*config.at(\inputs).size)@channelViewHeight);
      channelContainerView.asView.bounds_(Rect(0, 0, (channelViewWidth*config.at(\inputs).size)+buttonWidth, channelViewHeight));

      channelView = View(channelContainerView.asView, Rect(0, 0, channelViewWidth, channelViewHeight));
      channelView.asView.background = Color.fromHexString("#FEEFEF");
      channelView.name = name.asString;
      channelView.layout = VLayout();
      channelView.layout.spacing = 0;
      channelView.layout.margins = [2,0,2,0];
      channelView.maxSize_(channelViewWidth@channelViewHeight);
      channelView.deleteOnClose_(true);

      // adding name textfield of input
      headView = View(channelView.asView, Rect(0, 0, headViewWidth, headViewHeight));
      headView.asView.background = Color.fromHexString("#DDEFDD");
      headView.name = "inputs";
      headView.layout = HLayout();
      headView.layout.spacing = 4;
      headView.layout.margins = [4,0,4,0];
      headView.maxHeight_(headViewHeight);

      controlMeterContainerView = View(channelView.asView, Rect(0, 0, controlMeterContainerViewWidth, controlMeterContainerViewHeight));
      controlMeterContainerView.asView.background = Color.fromHexString("#DDDDEF");
      controlMeterContainerView.asView.background = Color.red;
      controlMeterContainerView.name = "meterAndControls";
      controlMeterContainerView.layout = HLayout();
      controlMeterContainerView.layout.spacing = 0;
      controlMeterContainerView.layout.margins = [0,0,0,0];

      meterView = View(controlMeterContainerView.asView, Rect(0,0, meterViewWidth, meterViewHeight));
      meterView.asView.background = Color.fromHexString("#EEEFEE");
      meterView.name = "meterView";
      meterView.layout = VLayout();
      meterView.maxWidth = meterViewWidth;
      meterView.layout.spacing = 0;
      meterView.layout.margins = [2,0,2,0];

      // add a View for the controls of a channel
      controlsView = View(controlMeterContainerView.asView, Rect(0,0, controlsViewWidth, controlsViewHeight));
      controlsView.asView.background = Color.fromHexString("#EEEFEE");
      controlsView.name = "controls";
      controlsView.layout = VLayout();
      controlsView.layout.spacing = 0;
      controlsView.layout.margins = [4,0,4,0];
      // add a View for selecting subsets of the channel's controls
      controlsSelectorView = View(controlsView.asView, Rect(0, 0, controlsViewWidth, 40));
      controlsSelectorView.minSize_(controlsViewWidth@40);
      controlsSelectorView.addFlowLayout(4@4, 2@2);
      controlsSelectorView.name = "controlsSelector";
      // add all controls to their parents
      Routine{
        0.01.wait;
        this.setupEZText(headView, "name", name.asString);
        0.01.wait;
        this.setupEZPopUpMenu(headView, "input", Server.default.options.numInputBusChannels, config.at(\inputs).at(name));
        0.01.wait;
        this.setupChannelCloseButton(headView, name);
        0.01.wait;
        //setup a toggle button for each channel
        this.setupPauseButton(meterView, config.at(\controls).at(name).at(\active));
        0.01.wait;
        // setup a small View as indicator for incoming/outgoing OSC messages for each input
        this.setupOSCIndicator(meterView);
        this.addOSCIndicatorFadeOutTask(name);
        0.01.wait;
        // setup LevelIndicator for each input
        this.setupLevelIndicator(meterView);
        0.01.wait;
        // add Buttons for each subset of controls
        BowelyzerConfig.controlGroupsGUI.do({|group|
          this.setupControlsGroupButton(group, controlsSelectorView);
        });
        0.01.wait;
        // add controls in groups
        BowelyzerConfig.controlGroupsGUI.do({|group|
          this.setupControlsGroup(group, name, config, controlsView);
          0.005.wait;
        });
        0.01.wait;
        // show only the general controls
        this.showControlsByType(BowelyzerConfig.controlGroupsGUI[0], controlsSelectorView.children, controlsView);
      }.play(AppClock);

      // add channelView to the container and the global Dictionary for better access
      channelContainerView.layout.add(channelView);
      channels.add(channelView);
    }.defer;
  }

  // setup a Button for a control group by name
  setupControlsGroupButton{
    arg group, parent;
    Button(parent: parent, bounds: Rect(0, 0, (8*group.asString.size), buttonHeight))
    .states_([
      [group.asString, Color.black, Color.fromHexString("#99FF99")]
    ])
    .action_({
        arg controlUnit;
        this.showControlsByType(controlUnit.string, controlUnit.parent.children, controlUnit.parent.parent);
      })
    .name_(group.asString++"Button")
    ;
  }

  // setup a View for a control group by name
  setupControlsGroup{
    arg group, name, config, parent;
    var controlsSubView = View(
      parent: parent
    );
    controlsSubView.name = group.asString++"Controls";
    controlsSubView.layout = VLayout();
    controlsSubView.layout.spacing = 4;
    controlsSubView.layout.margins = [0,0,0,0];
    controlsSubView.maxWidth_(controlsViewWidth-8);

    if(group != \general, {
      config.at(\controls).at(name).order.do({|controlName, i|
        var value = config.at(\controls).at(name).at(controlName),
        type = BowelyzerConfig.controlContainedIn(controlName);
        if(controlName.asString.beginsWith(group.asString), {
          this.setupControlFromConfig(controlsSubView, type, controlName, value);
        });
      });
    },{
      this.setupCheckBox(controlsSubView, \onlyForwardOnNewPitch);
      config.at(\controls).at(name).order.do({|controlName, i|
        var value = config.at(\controls).at(name).at(controlName),
        type = BowelyzerConfig.controlContainedIn(controlName);
        if(BowelyzerConfig.generalControlGroupGUI.includes(controlName), {
          this.setupControlFromConfig(controlsSubView, type, controlName, value);
        });
      });
    });
    controlsSubView.maxSize_((controlsViewWidth-8)@(controlsSubView.children.size*(sliderHeight+4)));
    controlsSubView.minSize_((controlsViewWidth-8)@(controlsSubView.children.size*(sliderHeight+4)));
  }

  // setup a CheckBox on whether to only forward OSC messages, if a new pitch was detected
  setupCheckBox{
    arg parent, control;
    var unit = CheckBox.new(parent: parent, bounds: sliderWidth@buttonHeight);
    if(control == \onlyForwardOnNewPitch, {
      unit.string_("Only forward on new pitch");
      unit.action_({|unit|
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++unit.parent.parent.name.asString,
        name = unit.parent.parent.parent.parent.name.asString;
        address.sendMsg(type, name, control, unit.value);
      });
    });
  }

  //setup a control from configuration (adhering to its type)
  setupControlFromConfig{
    arg parent, type, name, value;
    switch(
      type.asSymbol,
      \knob, {this.setupEZKnob(parent, name, value)},
      \slider, {this.setupEZSlider(parent, name, value)},
      \ranger, {this.setupEZRanger(parent, name, value)}
    );
  }

  // show only the controls of a certain type
  showControlsByType{
    arg name, buttons, controls;
    {
      buttons.do({|button|
        if(button.isKindOf(Button) && (button.name != (name++"Button")), {
          button.states_([[button.string, Color.black, Color.fromHexString("#EEEFEE")]]);
        },{
          button.states_([[button.string, Color.black, Color.fromHexString("#99FF99")]]);
        });
      });
      // unset visibility for all other controlSubViews but this one
      controls.children.do({|control|
        if(control.isKindOf(View) && (control.name == (name++"Controls")), {
          control.visible_(true);
        },{
          if(control.name != "controlsSelector", {
            control.visible_(false);
          });
        });
      });
      controls.layout.insert(nil, -1);
    }.defer;
  }

  // remove a channelView by name, resizing the enclosing channelContainerView to current amount of channels
  removeChannelView{
    arg name, channelSize;
    {
      channels.do({|channel,i|
        if(channel.name == name.asString, {
          channel.remove;
          channels.remove(channel);
        });
      });
      // resize the channelContainerView according to new amount of channels
      channelContainerView.maxSize_((channelViewWidth*channelSize)@channelViewHeight);
    }.defer;
  }

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

  // ping an OSC indicator by name, restarting its fadeout Task
  pingOSCIndicator{
    arg name;
    {
      if(indicators.includesKey(name),{
        indicators.at(name).stop;
        indicators.at(name).reset;
        indicators.at(name).start(AppClock);
      });
    }.defer;
  }

  // setup tasks for changing the OSC indicator color (on receiving a message)
  addOSCIndicatorFadeOutTask{
    arg name;
    {
      name = name.asString;
      indicators.put(
        name.asSymbol,
        Task({
          channels.do({|channel|
            if(channel.name == name,{
              channel.children.do({|channelChild|
                if(channelChild.name == "meterAndControls",{
                  channelChild.children.do({|meterAndControls|
                    if(meterAndControls.name == "meterView", {
                      meterAndControls.children.do({|meterView|
                        if(meterView.isKindOf(View) && meterView.name == "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"));
                        });
                      });
                    });
                  });
                });
              });
            });
          });
        })
      );
    }.defer;
  }

  // free an OSCIndicatorFadeOutTask by name
  freeOSCIndicatorFadeOutTask{
    arg name;
    {
      if(indicators.includesKey(name.asSymbol), {
        indicators.at(name).stop;
        indicators.removeAt(name);
      });
    }.defer;
  }

  // setup a new LevelIndicator
  setupLevelIndicator{
    arg parent;
    ^LevelIndicator(
      parent
    ).maxSize_(buttonWidth@600)
    .drawsPeak_(true);
  }

  // create a load button, that launches a FileDialog on press
  setupLoadButton{
    ^Button(bounds: Rect(0, 0, buttonWidth, buttonHeight))
    .states_([
      ["load", Color.black, Color.fromHexString("#99FF99")]
    ])
    .action_({
        arg controlUnit;
        FileDialog.new(
          okFunc: {|path| this.sendLoadMessage(path)},
          cancelFunc: {},
          fileMode: 1,
          acceptMode: 0,
          stripResult: true
        );
      })
    .maxSize_(buttonWidth@buttonHeight)
    ;
  }

  // send a message via OSC to load a configuration file by name
  sendLoadMessage{
    arg path;
    var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
    postln("Sending: [/load, "++path++"]");
    address.sendMsg("/load", path.asString);
  }

  // create a save button, that launches a FileDialog on press
  setupSaveButton{
    ^Button(bounds: Rect(0, 0, buttonWidth, buttonHeight))
    .states_([
      ["save", Color.black, Color.fromHexString("#99FF99")]
    ])
    .action_({
      arg controlUnit;
      var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
      type = "/save";
      postln("Sending: ["++type++"]");
      address.sendMsg(type);
    })
    .maxSize_(buttonWidth@buttonHeight)
    ;
  }

  // open a FileDialog to send a path via OSC to save config to that file
  saveAsAction{
    arg controlUnit;
    var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
    type = "/saveas";
    {
      FileDialog.new(
        okFunc: {|path|
          postln("Sending: ["++type++", "++path++"]");
          address.sendMsg(type, path.asString);
        },
        cancelFunc: {},
        fileMode: 0,
        acceptMode: 1,
        stripResult: true
      );
    }.defer;
  }

  // create a save button, that launches a FileDialog on press
  setupSaveAsButton{
    ^Button(bounds: Rect(0, 0, buttonWidth, buttonHeight))
    .states_([
      ["save as", Color.black, Color.fromHexString("#99FF99")],
    ])
    .action_({this.saveAsAction})
    .maxSize_(buttonWidth@buttonHeight)
    ;
  }

  // setup a button to pause the Synth for a channel
  setupPauseButton{
    arg parent, state;
    var buttonState = 0;
    if(state.not, {buttonState = 1});
    ^Button(parent, Rect(0, 0, buttonWidth, buttonHeight))
    .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_(buttonWidth@buttonHeight)
    .value_(buttonState)
    ;
  }

  // setup a button to free (close) a channel
  setupChannelCloseButton{
    arg parent, name;
    ^Button(parent, Rect(0, 0, buttonHeight, buttonHeight))
    .states_([
      ["X", Color.black, Color.fromHexString("#FF9999")]
    ])
    .action_({
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/free";
        postln("Sending: ["++type++", "++name++"]");
        address.sendMsg(type, name);
      })
    .maxSize_(buttonHeight@buttonHeight)
    .name_("close")
    ;
  }

  // setup a button to add a channel
  setupChannelAddButton{
    ^Button(bounds: Rect(0, 0, buttonWidth, buttonWidth))
    .states_([
      ["+", Color.black, Color.fromHexString("#99FF99")]
    ])
    .action_({
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/add";
        postln("Sending: ["++type++"]");
        address.sendMsg(type);
      })
    .minSize_(buttonWidth@buttonWidth)
    .maxSize_(buttonWidth@buttonWidth)
    .name_("add")
    ;
  }

  // setup a button to mute (toggle) all channels simultaneously
  setupGlobalToggleButton{
    ^Button(bounds: Rect(0, 0, buttonWidth, buttonWidth))
    .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_all",
        controlValue = controlUnit.value;
        postln("Sending: [ "++type++", "++controlValue++" ]");
        address.sendMsg(type, controlValue);
      })
    .minSize_(buttonWidth@buttonWidth)
    .maxSize_(buttonWidth@buttonWidth)
    .name_("toggle_all")
    ;
  }

  // set the state of the global toggle Button
  setCurrentGlobalToggleState{
    arg state;
    {
      lowerView.children.do({|lowerChild|
        if(lowerChild.isKindOf(View) && (lowerChild.name == "buttonView"), {
          lowerChild.children.do({|button|
            if(button.isKindOf(Button) && (button.name == "toggle_all"), {
              if(state, {
                button.value_(0);
              },{
                button.value_(1);
              });
            });
          });
        });
      });
    }.defer;
  }

  // set the state of toggle Button of a named channel
  setCurrentToggleState{
    arg name, state;
    {
      name = name.asString;
      channels.do({|channel|
        if(channel.isKindOf(View) && (channel.name == name), {
          channel.children.do({|channelChild|
            if(channelChild.isKindOf(View) && (channelChild.name == "meterAndControls"), {
              channelChild.children.do({|meterAndControls|
                if(meterAndControls.isKindOf(View) && (meterAndControls.name == "meterView"),{
                  meterAndControls.children.do({|meterView|
                    if(meterView.isKindOf(Button), {
                      if(state,{
                        meterView.value_(0);
                      },{
                        meterView.value_(1);
                      });
                    });
                  });
                });
              });
            });
          });
        });
      });
    }.defer;
  }

  // setup a StaticText and a TextField
  setupEZText{
    arg parent, control, value;
    var bounds = 144@buttonHeight,
    labelWidth= 48,
    textWidth = 96,
    unit;
    // resize, depending on surrounding
    if(control == "address",{
      bounds = 140@buttonHeight;
      labelWidth = 60;
      textWidth = 80;
    });
    if(control == "name", {
      bounds = 140@buttonHeight;
      labelWidth = 34;
      textWidth = 106;
    });
    unit = EZText(
      parent: parent,
      bounds: bounds,
      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;
        if((type == "/synthServer") || (type == "/hub") || (type == "/forward"), {
          type = (type++"Address").replace("/","").asSymbol;
          name = "/"++controlName;
          postln("Sending: "++"["++name++", "++type++", "++controlValue++"]");
          address.sendMsg(name, type, controlValue);
        },{
          postln("Sending: "++"["++type++", "++name++", "++controlName++", "++controlValue++"]");
          address.sendMsg(type, name, controlName, controlValue);
        });
      },
      labelWidth: labelWidth,
      textWidth: textWidth,
      initVal:value.asString,
      layout: \horz,
      margin: nil
    );
    unit.view.maxHeight_(buttonHeight);
    unit.view.name_(control);
    unit.view.children.do({|item|
      if(item.isKindOf(StaticText),{item.align_(\left)});
      if(item.isKindOf(TextField),{item.align_(\right)});
    });
  }

  // setup a StaticText and a NumberBox
  setupEZPopUpMenu{
    arg parent, control, inputs, value;
    var bounds = 120@buttonHeight,
    labelWidth = 34,
    menu = EZPopUpMenu.new(
      parentView: parent,
      bounds: bounds,
      label: control,
      initVal:value,
      labelWidth: labelWidth,
      labelHeight: buttonHeight
    ),
    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;
      postln("Sending: "++"["++type++", "++name++", "++controlName++", "++controlValue++"]");
      address.sendMsg(type, name, controlName, controlValue);
    };

    // create state for each input
    inputs.do({|i|
      menu.addItem(i.asSymbol, action);
    });
    // set bounds properly
    menu.view.bounds_(bounds);
    // set alignment and bounds for StaticText
    menu.view.children.do({|item|
      if(item.isKindOf(StaticText),{
        item.align_(\left);
        item.bounds_(labelWidth@buttonHeight);
      });
    });
    ^menu
    .value_(value)
    .view.maxSize_(bounds).bounds_(bounds)
    .asView.name_(control)
    ;
  }

  // setup a StaticText and a NumberBox
  setupEZNumber{
    arg parent, control, value;
    var bounds = 144@buttonHeight,
    labelWidth = 48,
    numberWidth = 96;
    // resize, depending on surrounding
    if(control == "port",{
      bounds = 140@buttonHeight;
      labelWidth = 70;
      numberWidth = 70;
    });
    // TODO: move special settings for children to this function
    ^EZNumber(
      parent: parent,
      bounds: bounds,
      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;
        if((type == "/synthServer") || (type == "/hub") || (type == "/forward"), {
          type = (type++"Port").replace("/", "").asSymbol;
          name = "/"++controlName;
          postln("Sending: "++"["++name++", "++type++", "++controlValue++"]");
          address.sendMsg(name, type, controlValue);
        },{
          postln("Sending: "++"["++type++", "++name++", "++controlName++", "++controlValue++"]");
          address.sendMsg(type, name, controlName, controlValue);
        });
      },
      initVal:value,
      labelWidth: labelWidth,
      numberWidth: numberWidth,
      layout: \horz,
      margin: nil
    )
    .view.maxHeight_(buttonHeight)
    .asView.name_(control)
    ;
  }

  // setup a Slider, a StaticText and a NumberBox for a Synth setting
  setupEZSlider{
    arg parent, control, value;
    var unit;
    unit = EZSlider(
      parent: parent,
      bounds: sliderWidth@sliderHeight,
      label: control,
      controlSpec: control.asSymbol,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.parent.name.asString,
        name = controlUnit.view.parent.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
    );
    unit.view.children.do({|item|
      if(item.isKindOf(NumberBox), {
        item.align_(\right);
      });
      if(item.isKindOf(Slider), {
        item.orientation_(\horizontal);
        item.minWidth_(sliderWidth);
        item.maxHeight_(20);
        item.minHeight_(20);
      });
    });
  }

  // setup a ranger
  setupEZRanger{
    arg parent, control, value;
    var unit;
    unit = EZRanger(
      parent: parent,
      bounds: sliderWidth@sliderHeight,
      label: control,
      initVal: value,
      controlSpec: control.asSymbol,
      action: {
        arg controlUnit;
        var address = NetAddr.new("127.0.0.1", NetAddr.langPort),
        type = "/"++controlUnit.view.parent.parent.name.asString,
        name = controlUnit.view.parent.parent.parent.parent.name.asSymbol,
        controlName = controlUnit.labelView.string.asSymbol,
        controlValue = controlUnit.value;
        address.sendMsg(type, name, controlName, controlValue[0], controlValue[1]);
      },
      layout: \line2,
      numberWidth: 60,
      unitWidth:30
    );
    unit.view.children.do({|item|
      if(item.isKindOf(NumberBox), {
        item.align_(\right);
      });
      if(item.isKindOf(RangeSlider), {
        item.orientation_(\horizontal);
      });
    });
  }

  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
    )
    ;
  }

  // set LevelIndicator values for given channel
  setLevel{
    arg name, level, peak;
    {
      channels.do({|channel|
        if(channel.name == name.asString,{
          channel.children.do({|channelChild|
            if(channelChild.name == "meterAndControls", {
              channelChild.children.do({|meterAndControls|
                if(meterAndControls.name == "meterView", {
                  meterAndControls.children.do({|meterView|
                    if(meterView.isKindOf(LevelIndicator), {
                      meterView.value = level;
                      meterView.peakLevel = peak;
                    });
                  });
                });
              });
            });
          });
        });
      });
    }.defer;
  }

}