[Summary view] [Print] [Text view]

   1  (function($) {
   2  
   3      var csscls = PhpDebugBar.utils.makecsscls('phpdebugbar-widgets-');
   4  
   5      /**
   6       * Widget for the displaying sql queries
   7       *
   8       * Options:
   9       *  - data
  10       */
  11      var SQLQueriesWidget = PhpDebugBar.Widgets.SQLQueriesWidget = PhpDebugBar.Widget.extend({
  12  
  13          className: csscls('sqlqueries'),
  14  
  15          onFilterClick: function(el) {
  16              $(el).toggleClass(csscls('excluded'));
  17  
  18              var excludedLabels = [];
  19              this.$toolbar.find(csscls('.filter') + csscls('.excluded')).each(function() {
  20                  excludedLabels.push(this.rel);
  21              });
  22  
  23              this.$list.$el.find("li[connection=" + $(el).attr("rel") + "]").toggle();
  24  
  25              this.set('exclude', excludedLabels);
  26          },
  27          onCopyToClipboard: function (el) {
  28              var code = $(el).parent('li').find('code').get(0);
  29              var copy = function () {
  30                  try {
  31                      document.execCommand('copy');
  32                      alert('Query copied to the clipboard');
  33                  } catch (err) {
  34                      console.log('Oops, unable to copy');
  35                  }
  36              };
  37              var select = function (node) {
  38                  if (document.selection) {
  39                      var range = document.body.createTextRange();
  40                      range.moveToElementText(node);
  41                      range.select();
  42                  } else if (window.getSelection) {
  43                      var range = document.createRange();
  44                      range.selectNodeContents(node);
  45                      window.getSelection().removeAllRanges();
  46                      window.getSelection().addRange(range);
  47                  }
  48                  copy();
  49                  window.getSelection().removeAllRanges();
  50              };
  51              select(code);
  52          },
  53          render: function() {
  54              this.$status = $('<div />').addClass(csscls('status')).appendTo(this.$el);
  55  
  56              this.$toolbar = $('<div></div>').addClass(csscls('toolbar')).appendTo(this.$el);
  57  
  58              var filters = [], self = this;
  59  
  60              this.$list = new PhpDebugBar.Widgets.ListWidget({ itemRenderer: function(li, stmt) {
  61                  $('<code />').addClass(csscls('sql')).html(PhpDebugBar.Widgets.highlight(stmt.sql, 'sql')).appendTo(li);
  62                  if (stmt.duration_str) {
  63                      $('<span title="Duration" />').addClass(csscls('duration')).text(stmt.duration_str).appendTo(li);
  64                  }
  65                  if (stmt.memory_str) {
  66                      $('<span title="Memory usage" />').addClass(csscls('memory')).text(stmt.memory_str).appendTo(li);
  67                  }
  68                  if (typeof(stmt.row_count) != 'undefined') {
  69                      $('<span title="Row count" />').addClass(csscls('row-count')).text(stmt.row_count).appendTo(li);
  70                  }
  71                  if (typeof(stmt.stmt_id) != 'undefined' && stmt.stmt_id) {
  72                      $('<span title="Prepared statement ID" />').addClass(csscls('stmt-id')).text(stmt.stmt_id).appendTo(li);
  73                  }
  74                  if (stmt.connection) {
  75                      $('<span title="Connection" />').addClass(csscls('database')).text(stmt.connection).appendTo(li);
  76                      li.attr("connection",stmt.connection);
  77                      if ( $.inArray(stmt.connection, filters) == -1 ) {
  78                          filters.push(stmt.connection);
  79                          $('<a />')
  80                              .addClass(csscls('filter'))
  81                              .text(stmt.connection)
  82                              .attr('rel', stmt.connection)
  83                              .on('click', function() { self.onFilterClick(this); })
  84                              .appendTo(self.$toolbar);
  85                          if (filters.length>1) {
  86                              self.$toolbar.show();
  87                              self.$list.$el.css("margin-bottom","20px");
  88                          }
  89                      }
  90                  }
  91                  if (typeof(stmt.is_success) != 'undefined' && !stmt.is_success) {
  92                      li.addClass(csscls('error'));
  93                      li.append($('<span />').addClass(csscls('error')).text("[" + stmt.error_code + "] " + stmt.error_message));
  94                  }
  95                  $('<span title="Copy to clipboard" />')
  96                      .addClass(csscls('copy-clipboard'))
  97                      .css('cursor', 'pointer')
  98                      .on('click', function (event) {
  99                          self.onCopyToClipboard(this);
 100                          event.stopPropagation();
 101                      })
 102                      .appendTo(li);
 103                  if (stmt.params && !$.isEmptyObject(stmt.params)) {
 104                      var table = $('<table><tr><th colspan="2">Params</th></tr></table>').addClass(csscls('params')).appendTo(li);
 105                      for (var key in stmt.params) {
 106                          if (typeof stmt.params[key] !== 'function') {
 107                              table.append('<tr><td class="' + csscls('name') + '">' + key + '</td><td class="' + csscls('value') +
 108                                  '">' + stmt.params[key] + '</td></tr>');
 109                          }
 110                      }
 111                      li.css('cursor', 'pointer').click(function() {
 112                          if (table.is(':visible')) {
 113                              table.hide();
 114                          } else {
 115                              table.show();
 116                          }
 117                      });
 118                  }
 119              }});
 120              this.$list.$el.appendTo(this.$el);
 121  
 122              this.bindAttr('data', function(data) {
 123                  // the PDO collector maybe is empty
 124                  if (data.length <= 0) {
 125                      return false;
 126                  }
 127                  this.$list.set('data', data.statements);
 128                  this.$status.empty();
 129  
 130                  // Search for duplicate statements.
 131                  for (var sql = {}, unique = 0, duplicate = 0, i = 0; i < data.statements.length; i++) {
 132                      var stmt = data.statements[i].sql;
 133                      if (data.statements[i].params && !$.isEmptyObject(data.statements[i].params)) {
 134                          stmt += ' {' + $.param(data.statements[i].params, false) + '}';
 135                      }
 136                      sql[stmt] = sql[stmt] || { keys: [] };
 137                      sql[stmt].keys.push(i);
 138                  }
 139                  // Add classes to all duplicate SQL statements.
 140                  for (var stmt in sql) {
 141                      if (sql[stmt].keys.length > 1) {
 142                          duplicate += sql[stmt].keys.length;
 143                          for (var i = 0; i < sql[stmt].keys.length; i++) {
 144                              this.$list.$el.find('.' + csscls('list-item')).eq(sql[stmt].keys[i])
 145                                  .addClass(csscls('sql-duplicate'));
 146                          }
 147                      } else {
 148                          unique++;
 149                      }
 150                  }
 151  
 152                  var t = $('<span />').text(data.nb_statements + " statements were executed").appendTo(this.$status);
 153                  if (data.nb_failed_statements) {
 154                      t.append(", " + data.nb_failed_statements + " of which failed");
 155                  }
 156                  if (duplicate) {
 157                      t.append(", " + duplicate + " of which were duplicates");
 158                      t.append(", " + unique + " unique");
 159                  }
 160                  if (data.accumulated_duration_str) {
 161                      this.$status.append($('<span title="Accumulated duration" />').addClass(csscls('duration')).text(data.accumulated_duration_str));
 162                  }
 163                  if (data.memory_usage_str) {
 164                      this.$status.append($('<span title="Memory usage" />').addClass(csscls('memory')).text(data.memory_usage_str));
 165                  }
 166              });
 167          }
 168  
 169      });
 170  
 171  })(PhpDebugBar.$);