templates/user.html.ep

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