templates/user.html.ep

   1 % layout 'angular';
   2
   3   <script>
   4     function CRM($xhr) {
   5       var self = this;
   6
   7       this.fetch = function() {
   8         self.clear();
   9         if ( ! self.args ) return;
  10         self.url = '/g/' + self.function_name + '/' + self.args + '?callback=JSON_CALLBACK';
  11         $xhr('JSON', self.url, function(code, response) {
  12           self.code = code;
  13           self.response = response;
  14         });
  15       };
  16
  17       this.clear = function() {
  18         self.url = null;
  19         self.code = null;
  20         self.response = null;
  21         self.selected_username = null;
  22         self.gnuplot_sql = null;
  23         self.ldap = null;
  24       };
  25
  26         this.columns = [
  27                 'USERNAME',
  28                 'BROJ',
  29                 'USLUGA',
  30                 'IP_MANAGEMENT',
  31                 'IP_VOICE',
  32                 'KOLOKACIJA',
  33                 'OPT82'
  34         ];
  35
  36       this.keys = function(h) {
  37              if ( angular.isArray(h) ) h = h[0];
  38              var keys = [];
  39              for(i in h) if (h.hasOwnProperty(i))
  40              {
  41                keys.push(i);
  42              }
  43              return keys;
  44       };
  45
  46         this.select = function(crm) {
  47                 console.log( 'crm = ',crm );
  48                 self.selected_username = crm.USERNAME;
  49                 self.gnuplot_sql = null;
  50                 $xhr('JSON'
  51                         , '/g/LDAP_search/' + self.selected_username + '?callback=JSON_CALLBACK'
  52                         , function(code, response) {
  53                                 console.debug( code, response );
  54                                 self.ldap = response;
  55                                 self.gnuplot_sql = '/gnuplot?hide=1;with=points;sql=select timestamp,snrtx,attntx,pwrtx,pwrrx,attnrx,snrrx from adsl where username = \'' + response[0].cn + '\' order by timestamp desc limit 100';
  56                         }
  57                 );
  58         };
  59
  60     }
  61
  62     CRM.$inject = ['$xhr'];
  63   </script>
  64
  65 <style type="text/css">
  66 #columns {
  67         position: fixed;
  68         top: 0;
  69         right: 0;
  70         z-index: 10;
  71         background: #eee;
  72 }
  73
  74 #columns > span {
  75         float: right;
  76 }
  77
  78 #columns ul {
  79         display: none;
  80 }
  81
  82 #columns:hover ul {
  83         display: block;
  84 }
  85
  86 table {
  87         border-collapse:collapse;
  88 }
  89
  90 th {
  91         border-bottom: 2px solid gray;
  92 }
  93
  94 th, td {
  95         border-left: 1em solid white;
  96         border-right: 1em solid white;
  97 }
  98
  99 .zebra {
 100         background: #eee;
 101 }
 102
 103 </style>
 104
 105   <div ng:controller="CRM">
 106    <form ng:submit="fetch()">
 107     <input type="hidden" name="function_name" value="CRM_search"      size="20"/>
 108     <label for="args">username:
 109     <input type="text" name="args"     placeholder="test" size="10"/>
 110     </label>
 111     <input type="submit" ng:click="fetch()" value="search">
 112     <input type="reset"  ng:click="clear()" value="clear">
 113
 114     <b ng:show="url && ! code">loading {{url}}</b>
 115     <b ng:show="response">{{response.length}} results for <tt>{{args}}</tt></b>
 116    </form>
 117
 118 <div id="columns" ng:show="response">
 119 <span>Add columns</span>
 120 <ul>
 121 <li ng:repeat="c in keys(response)" ng:show="columns.indexOf(c) < 0" ng:click="columns.push(c)">{{c}}
 122 </ul>
 123 </div>
 124
 125     <table ng:show="response">
 126     <tr>
 127         <th ng:repeat="c in columns" ng:click="columns.$remove(c)">{{c}}</th>
 128     </tr>
 129     <tr ng:repeat="u in response" ng:click="select(u)" ng:class-even="'zebra'">
 130         <td ng:repeat="c in columns" ng:show="! selected_username || selected_username == u.USERNAME">{{u[c]}}</td>
 131     </tr>
 132     </table>
 133
 134     <input type=button value="Show ALL results, not just {{selected_username}}" ng:click="selected_username=''" ng:show="selected_username">
 135
 136   <div ng:show="selected_username">
 137
 138     <tt>{{selected_username}}</tt>
 139
 140     <ul ng:show="ldap">
 141     <li ng:repeat="c in keys(ldap)"><tt>{{c}}</tt> {{ldap[0][c]}}</li>
 142     </ul>
 143
 144     <ng:include src="gnuplot_sql" ng:show="gnuplot_sql">
 145
 146   </div>
 147
 148     <input type=checkbox name=debug value=1>
 149     <pre ng:show=debug>
 150 url={{url}}
 151 code={{code}}
 152 response={{response}}
 153 username={{username}}
 154     </pre>
 155   </div>