opendaylight/web/topology/src/main/resources/js/page.js

   1
   2 /*
   3  * Copyright (c) 2013 Cisco Systems, Inc. and others.  All rights reserved.
   4  *
   5  * This program and the accompanying materials are made available under the
   6  * terms of the Eclipse Public License v1.0 which accompanies this distribution,
   7  * and is available at http://www.eclipse.org/legal/epl-v10.html
   8  */
   9
  10 //PAGE topology
  11 one.f = {};
  12
  13 // specify dashlets and layouts
  14 one.f.dashlet = {
  15     flows : {
  16         id : 'dashletFlows',
  17         name : 'Flows'
  18     },
  19     widget : {
  20         id : 'dashletWidget',
  21         name : 'Acme Widgets'
  22     },
  23     status : {
  24         id : 'dashletStatus',
  25         name : 'Network Status'
  26     },
  27     foo : {
  28         id : 'dashletFoo',
  29         name : 'Foo'
  30     },
  31     bar : {
  32         id : 'dashletBar',
  33         name : 'Bar'
  34     }
  35 };
  36
  37 one.f.menu = {
  38     left : {
  39         top : [
  40             one.f.dashlet.flows,
  41             one.f.dashlet.bar
  42         ],
  43         bottom : [
  44             one.f.dashlet.foo
  45         ]
  46     },
  47     right : {
  48         top : [],
  49         bottom : [
  50             one.f.dashlet.widget,
  51             one.f.dashlet.status
  52         ]
  53     }
  54 };
  55
  56 /** INIT **/
  57 // populate nav tabs
  58 $(one.f.menu.left.top).each(function(index, value) {
  59     var $nav = $(".nav", "#left-top");
  60     one.main.page.dashlet($nav, value);
  61 });
  62
  63 $(one.f.menu.left.bottom).each(function(index, value) {
  64     var $nav = $(".nav", "#left-bottom");
  65     one.main.page.dashlet($nav, value);
  66 });
  67
  68 $(one.f.menu.right.bottom).each(function(index, value) {
  69     var $nav = $(".nav", "#right-bottom");
  70     one.main.page.dashlet($nav, value);
  71 });
  72
  73 one.f.populate = function($dashlet, header) {
  74     var $h4 = one.lib.dashlet.header(header);
  75     $dashlet.append($h4);
  76 };
  77
  78 // bind dashlet nav
  79 $('.dash .nav a', '#main').click(function() {
  80     // de/activation
  81     var $li = $(this).parent();
  82     var $ul = $li.parent();
  83     one.lib.nav.unfocus($ul);
  84     $li.addClass('active');
  85     // clear respective dashlet
  86     var $dashlet = $ul.parent().find('.dashlet');
  87     one.lib.dashlet.empty($dashlet);
  88     // callback based on menu
  89     var id = $(this).attr('id');
  90     var menu = one.f.dashlet;
  91     switch (id) {
  92         case menu.foo.id:
  93             one.f.populate($dashlet, "Foo");
  94             break;
  95         case menu.flows.id:
  96             one.f.populate($dashlet, "Flows");
  97             break;
  98         case menu.bar.id:
  99             one.f.populate($dashlet, "Bar");
 100             break;
 101         case menu.widget.id:
 102             one.f.populate($dashlet, "Widget");
 103             break;
 104         case menu.status.id:
 105             one.f.populate($dashlet, "Status");
 106             break;
 107     };
 108 });
 109
 110 // activate first tab on each dashlet
 111 $('.dash .nav').each(function(index, value) {
 112     $($(value).find('li')[0]).find('a').click();
 113 });