ffrgb / meshviewer

define(['d3-interpolate', 'map', 'sidebar', 'tabs', 'container', 'legend',

  'linklist', 'nodelist', 'simplenodelist', 'infobox/main',

  'proportions', 'forcegraph', 'title', 'about', 'datadistributor',

  'filters/filtergui', 'filters/hostname', 'helper'],

function (d3Interpolate, Map, Sidebar, Tabs, Container, Legend, Linklist,

  Nodelist, SimpleNodelist, Infobox, Proportions, ForceGraph,

  Title, About, DataDistributor, FilterGUI, HostnameFilter, helper) {

  'use strict';

  return function (language) {

    var self = this;

    var content;

    var contentDiv;

    var linkScale = d3Interpolate.interpolate(config.map.tqFrom, config.map.tqTo);

    var sidebar;

    var buttons = document.createElement('div');

    buttons.classList.add('buttons');

    var fanout = new DataDistributor();

    var fanoutUnfiltered = new DataDistributor();

    fanoutUnfiltered.add(fanout);

    function removeContent() {

      if (!content) {

        return;

      }

      router.removeTarget(content);

      fanout.remove(content);

      content.destroy();

      content = null;

    }

    function addContent(K) {

      removeContent();

      content = new K(linkScale, sidebar, buttons);

      content.render(contentDiv);

      fanout.add(content);

      router.addTarget(content);

    }

    function mkView(K) {

      return function () {

        addContent(K);

      };

    }

    var loader = document.getElementsByClassName('loader')[0];

    loader.classList.add('hide');

    contentDiv = document.createElement('div');

    contentDiv.classList.add('content');

    document.body.appendChild(contentDiv);

    sidebar = new Sidebar(document.body);

    contentDiv.appendChild(buttons);

    var buttonToggle = document.createElement('button');

    buttonToggle.classList.add('ion-eye');

    buttonToggle.setAttribute('aria-label', _.t('button.switchView'));

    buttonToggle.onclick = function onclick() {

      var data;

      if (content.constructor === Map) {

        data = { view: 'graph', lat: undefined, lng: undefined, zoom: undefined };

      } else {

        data = { view: 'map' };

      }

      router.fullUrl(data, false, true);

    };

    buttons.appendChild(buttonToggle);

    if (config.fullscreen || config.fullscreenFrame && window.frameElement) {

      var buttonFullscreen = document.createElement('button');

      buttonFullscreen.classList.add('ion-full-enter');

      buttonFullscreen.setAttribute('aria-label', _.t('button.fullscreen'));

      buttonFullscreen.onclick = function onclick() {

        helper.fullscreen(buttonFullscreen);

      };

      buttons.appendChild(buttonFullscreen);

    }

    var title = new Title();

    var header = new Container('header');

    var infobox = new Infobox(sidebar, linkScale);

    var tabs = new Tabs();

    var overview = new Container();

    var legend = new Legend(language);

    var newnodeslist = new SimpleNodelist('new', 'firstseen', _.t('node.new'));

    var lostnodeslist = new SimpleNodelist('lost', 'lastseen',  _.t('node.missing'));

    var nodelist = new Nodelist();

    var linklist = new Linklist(linkScale);

    var statistics = new Proportions(fanout);

    var about = new About();

    fanoutUnfiltered.add(legend);

    fanoutUnfiltered.add(newnodeslist);

    fanoutUnfiltered.add(lostnodeslist);

    fanoutUnfiltered.add(infobox);

    fanout.add(nodelist);

    fanout.add(linklist);

    fanout.add(statistics);

    sidebar.add(header);

    header.add(legend);

    overview.add(newnodeslist);

    overview.add(lostnodeslist);

    var filterGUI = new FilterGUI(fanout);

    fanout.watchFilters(filterGUI);

    header.add(filterGUI);

    var hostnameFilter = new HostnameFilter();

    fanout.addFilter(hostnameFilter);

    sidebar.add(tabs);

    tabs.add('sidebar.actual', overview);

    tabs.add('node.nodes', nodelist);

    tabs.add('node.links', linklist);

    tabs.add('sidebar.stats', statistics);

    tabs.add('sidebar.about', about);

    router.addTarget(title);

    router.addTarget(infobox);

    router.addView('map', mkView(Map));

    router.addView('graph', mkView(ForceGraph));

    self.setData = fanoutUnfiltered.setData;

    return self;

  };

});