change web structure: separate components

14 files changed, 708 insertions, 0 deletions

diff --git a/server/sonar-web/src/main/js/components/workspace/main.js b/server/sonar-web/src/main/js/components/workspace/main.js
new file mode 100644
index 00000000000..8b4be12009a
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/main.js
@@ -0,0 +1,144 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  './models/item',
+  './models/items',
+  './views/items-view',
+  './views/viewer-view',
+  './views/rule-view'
+], function (Item, Items, ItemsView, ViewerView, RuleView) {
+
+  var $ = jQuery,
+
+      instance = null,
+
+      Workspace = function () {
+        if (instance != null) {
+          throw new Error('Cannot instantiate more than one Workspace, use Workspace.getInstance()');
+        }
+        this.initialize();
+      };
+
+  Workspace.prototype = {
+    initialize: function () {
+      var that = this;
+
+      this.items = new Items();
+      this.items.load();
+      this.items.on('change', function () {
+        that.save();
+      });
+
+      this.itemsView = new ItemsView({ collection: this.items });
+      this.itemsView.render().$el.appendTo(document.body);
+      this.itemsView.on('click', function (model) {
+        that.open(model);
+      });
+    },
+
+    save: function () {
+      this.items.save();
+    },
+
+    addComponent: function (model) {
+      if (!this.items.has(model)) {
+        this.items.add(model);
+      }
+      this.save();
+    },
+
+    open: function (options) {
+      var model = typeof options.toJSON === 'function' ? options : new Item(options);
+      if (!model.isValid()) {
+        throw new Error(model.validationError);
+      }
+      this.addComponent(model);
+      if (model.isComponent()) {
+        this.showComponentViewer(model);
+      }
+      if (model.isRule()) {
+        this.showRule(model);
+      }
+    },
+
+    openComponent: function (options) {
+      return this.open(_.extend(options, { type: 'component' }));
+    },
+
+    openRule: function (options) {
+      return this.open(_.extend(options, { type: 'rule' }));
+    },
+
+    showViewer: function (Viewer, model) {
+      var that = this;
+      if (this.viewerView != null) {
+        this.viewerView.model.trigger('hideViewer');
+        this.viewerView.close();
+      }
+      $('.source-viewer').addClass('with-workspace');
+      model.trigger('showViewer');
+      this.viewerView = new Viewer({ model: model });
+      this.viewerView
+          .on('viewerMinimize', function () {
+            model.trigger('hideViewer');
+            that.closeComponentViewer();
+          })
+          .on('viewerClose', function (m) {
+            that.closeComponentViewer();
+            m.destroy();
+          });
+      this.viewerView.render().$el.appendTo(document.body);
+    },
+
+    showComponentViewer: function (model) {
+      this.showViewer(ViewerView, model);
+    },
+
+    closeComponentViewer: function () {
+      if (this.viewerView != null) {
+        this.viewerView.close();
+        $('.with-workspace').removeClass('with-workspace');
+      }
+    },
+
+    showRule: function (model) {
+      this.showViewer(RuleView, model);
+      this.fetchRule(model);
+    },
+
+    fetchRule: function (model) {
+      var url = baseUrl + '/api/rules/show',
+          options = { key: model.get('key') };
+      return $.get(url, options).done(function (r) {
+        model.set(r.rule);
+      });
+    }
+  };
+
+  Workspace.getInstance = function () {
+    if (instance == null) {
+      instance = new Workspace();
+    }
+    return instance;
+  };
+
+  return Workspace.getInstance();
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/models/item.js b/server/sonar-web/src/main/js/components/workspace/models/item.js
new file mode 100644
index 00000000000..9bbe1db8110
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/models/item.js
@@ -0,0 +1,50 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define(function () {
+
+  return Backbone.Model.extend({
+
+    validate: function () {
+      if (!this.has('type')) {
+        return 'type is missing';
+      }
+      if (this.get('type') === 'component' && !this.has('uuid')) {
+        return 'uuid is missing';
+      }
+      if (this.get('type') === 'rule' && !this.has('key')) {
+        return 'key is missing';
+      }
+    },
+
+    isComponent: function () {
+      return this.get('type') === 'component';
+    },
+
+    isRule: function () {
+      return this.get('type') === 'rule';
+    },
+
+    destroy: function (options) {
+      this.stopListening();
+      this.trigger('destroy', this, this.collection, options);
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/models/items.js b/server/sonar-web/src/main/js/components/workspace/models/items.js
new file mode 100644
index 00000000000..dfed439bb52
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/models/items.js
@@ -0,0 +1,53 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define(['./item'], function (Item) {
+
+  var STORAGE_KEY = 'sonarqube-workspace';
+
+  return Backbone.Collection.extend({
+    model: Item,
+
+    initialize: function () {
+      this.on('remove', this.save);
+    },
+
+    save: function () {
+      var dump = JSON.stringify(this.toJSON());
+      window.localStorage.setItem(STORAGE_KEY, dump);
+    },
+
+    load: function () {
+      var dump = window.localStorage.getItem(STORAGE_KEY);
+      if (dump != null) {
+        try {
+          var parsed = JSON.parse(dump);
+          this.reset(parsed);
+        } catch (err) { }
+      }
+    },
+
+    has: function (model) {
+      var forComponent = model.isComponent() && this.findWhere({ uuid: model.get('uuid') }) != null,
+          forRule = model.isRule() && this.findWhere({ key: model.get('key') }) != null;
+      return forComponent || forRule;
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/templates/workspace-item.hbs b/server/sonar-web/src/main/js/components/workspace/templates/workspace-item.hbs
new file mode 100644
index 00000000000..a98380cb682
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/templates/workspace-item.hbs
@@ -0,0 +1,3 @@
+{{#if q}}{{qualifierIcon q}}&nbsp;{{/if}}{{#eq type 'rule'}}<i class="icon-workspace-doc"></i>&nbsp;{{/eq}}{{limitString name}}
+
+<button class="js-close button-clean" style="color: #fff;">&times;</button>
diff --git a/server/sonar-web/src/main/js/components/workspace/templates/workspace-items.hbs b/server/sonar-web/src/main/js/components/workspace/templates/workspace-items.hbs
new file mode 100644
index 00000000000..6fe99c04b19
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/templates/workspace-items.hbs
@@ -0,0 +1 @@
+<ul class="workspace-nav-list"></ul>
diff --git a/server/sonar-web/src/main/js/components/workspace/templates/workspace-rule.hbs b/server/sonar-web/src/main/js/components/workspace/templates/workspace-rule.hbs
new file mode 100644
index 00000000000..3f55d9e8d38
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/templates/workspace-rule.hbs
@@ -0,0 +1,65 @@
+<div class="workspace-viewer-header"></div>
+
+<div class="workspace-viewer-container">
+
+  {{#if severity}}
+    <ul class="coding-rules-detail-properties">
+      {{#unless isManual}}
+        <li class="coding-rules-detail-property"
+            data-toggle="tooltip" data-placement="bottom" title="Default rule severity">
+          {{severityIcon severity}}&nbsp;{{t "severity" severity}}
+        </li>
+      {{/unless}}
+
+      {{#notEq status 'READY'}}
+        <li class="coding-rules-detail-property"
+            data-toggle="tooltip" data-placement="bottom" title="Rule status">{{status}}</li>
+      {{/notEq}}
+
+      <li class="coding-rules-detail-property coding-rules-detail-tag-list {{#if canWrite}}coding-rules-detail-tags-change{{/if}}"
+          data-toggle="tooltip" data-placement="bottom" title="Rule tags">
+        <i class="icon-tags"></i>
+        <span>{{#if allTags}}{{join allTags ', '}}{{else}}{{t 'coding_rules.no_tags'}}{{/if}}</span>
+      </li>
+
+      <li class="coding-rules-detail-property">{{t 'coding_rules.available_since'}} {{d createdAt}}</li>
+
+      <li class="pull-right spacer-left">
+        <a class="icon-link" target="_blank" href="{{rulePermalink key}}"></a>
+      </li>
+
+      <li class="pull-right">
+        <span class="note">{{key}}</span>
+      </li>
+    </ul>
+
+    {{#if debtCharName}}
+      <ul class="coding-rules-detail-properties">
+        <li class="coding-rules-detail-property"
+            data-toggle="tooltip" data-placement="bottom" title="Rule characteristic">
+          {{debtCharName}}{{#if debtSubCharName}} > {{debtSubCharName}}{{/if}}
+        </li>
+
+        {{#if debtRemFnType}}
+          <li class="coding-rules-detail-property"
+              data-toggle="tooltip" data-placement="bottom" title="{{t 'coding_rules.remediation_function'}}">
+            {{t 'coding_rules.remediation_function' debtRemFnType}}:
+
+            {{#if debtRemFnOffset}}{{debtRemFnOffset}}{{/if}}
+            {{#if debtRemFnCoeff}}{{#if debtRemFnOffset}}+{{/if}}{{debtRemFnCoeff}}{{/if}}
+            {{#if effortToFixDescription}}{{effortToFixDescription}}{{/if}}
+          </li>
+        {{/if}}
+      </ul>
+    {{/if}}
+  {{/if}}
+
+  <div class="coding-rules-detail-description rule-desc markdown">{{{htmlDesc}}}</div>
+
+  {{#if htmlNote}}
+    <div id="coding-rules-detail-description-extra">
+      <div class="rule-desc markdown">{{{htmlNote}}}</div>
+    </div>
+  {{/if}}
+
+</div>
diff --git a/server/sonar-web/src/main/js/components/workspace/templates/workspace-viewer-header.hbs b/server/sonar-web/src/main/js/components/workspace/templates/workspace-viewer-header.hbs
new file mode 100644
index 00000000000..409dcd3a6cf
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/templates/workspace-viewer-header.hbs
@@ -0,0 +1,17 @@
+<h6 class="workspace-viewer-name">{{#if q}}{{qualifierIcon q}}&nbsp;{{/if}}{{#eq type 'rule'}}<i class="icon-workspace-doc"></i>&nbsp;{{/eq}}{{name}}</h6>
+
+<div class="workspace-viewer-resize js-resize"></div>
+
+<div class="workspace-viewer-actions">
+  <a href="#" class="js-minimize icon-minimize spacer-right"
+     title="{{t 'workspace.minimize'}}" data-placement="bottom" data-toggle="tooltip"></a>
+
+  <a href="#" class="js-full-screen icon-bigger-size spacer-right"
+     title="{{t 'workspace.full_window'}}" data-placement="bottom" data-toggle="tooltip"></a>
+
+  <a href="#" class="js-normal-size icon-smaller-size spacer-right"
+     title="{{t 'workspace.normal_size'}}" data-placement="bottom" data-toggle="tooltip"></a>
+
+  <a href="#" class="js-close icon-close"
+     title="{{t 'workspace.close'}}" data-placement="bottom" data-toggle="tooltip"></a>
+</div>
diff --git a/server/sonar-web/src/main/js/components/workspace/templates/workspace-viewer.hbs b/server/sonar-web/src/main/js/components/workspace/templates/workspace-viewer.hbs
new file mode 100644
index 00000000000..45515fbecb0
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/templates/workspace-viewer.hbs
@@ -0,0 +1,3 @@
+<div class="workspace-viewer-header"></div>
+
+<div class="workspace-viewer-container"></div>
diff --git a/server/sonar-web/src/main/js/components/workspace/views/base-viewer-view.js b/server/sonar-web/src/main/js/components/workspace/views/base-viewer-view.js
new file mode 100644
index 00000000000..761b9887184
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/views/base-viewer-view.js
@@ -0,0 +1,57 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  './viewer-header-view'
+], function (HeaderView) {
+
+  return Marionette.Layout.extend({
+    className: 'workspace-viewer',
+
+    modelEvents: {
+      'destroy': 'close'
+    },
+
+    regions: {
+      headerRegion: '.workspace-viewer-header',
+      viewerRegion: '.workspace-viewer-container'
+    },
+
+    onRender: function () {
+      this.showHeader();
+      this.$('.workspace-viewer-container').isolatedScroll();
+    },
+
+    onViewerMinimize: function () {
+      this.trigger('viewerMinimize');
+    },
+
+    onViewerClose: function () {
+      this.trigger('viewerClose', this.model);
+    },
+
+    showHeader: function () {
+      var headerView = new HeaderView({ model: this.model });
+      this.listenTo(headerView, 'viewerMinimize', this.onViewerMinimize);
+      this.listenTo(headerView, 'viewerClose', this.onViewerClose);
+      this.headerRegion.show(headerView);
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/views/item-view.js b/server/sonar-web/src/main/js/components/workspace/views/item-view.js
new file mode 100644
index 00000000000..17a67af8835
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/views/item-view.js
@@ -0,0 +1,60 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  '../templates'
+], function () {
+
+  return Marionette.ItemView.extend({
+    tagName: 'li',
+    className: 'workspace-nav-item',
+    template: Templates['workspace-item'],
+
+    modelEvents: {
+      'change': 'render',
+      'showViewer': 'onViewerShow',
+      'hideViewer': 'onViewerHide'
+    },
+
+    events: {
+      'click': 'onClick',
+      'click .js-close': 'onCloseClick'
+    },
+
+    onClick: function (e) {
+      e.preventDefault();
+      this.options.collectionView.trigger('click', this.model);
+    },
+
+    onCloseClick: function (e) {
+      e.preventDefault();
+      e.stopPropagation();
+      this.model.destroy();
+    },
+
+    onViewerShow: function () {
+      this.$el.addClass('hidden');
+    },
+
+    onViewerHide: function () {
+      this.$el.removeClass('hidden');
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/views/items-view.js b/server/sonar-web/src/main/js/components/workspace/views/items-view.js
new file mode 100644
index 00000000000..a83eeb0f3e8
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/views/items-view.js
@@ -0,0 +1,36 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  './item-view',
+  '../templates'
+], function (ItemView) {
+
+  return Marionette.CompositeView.extend({
+    className: 'workspace-nav',
+    template: Templates['workspace-items'],
+    itemViewContainer: '.workspace-nav-list',
+    itemView: ItemView,
+
+    itemViewOptions: function () {
+      return { collectionView: this };
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/views/rule-view.js b/server/sonar-web/src/main/js/components/workspace/views/rule-view.js
new file mode 100644
index 00000000000..4b4a498244b
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/views/rule-view.js
@@ -0,0 +1,49 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  './base-viewer-view',
+  '../templates'
+], function (BaseView) {
+
+  return BaseView.extend({
+    template: Templates['workspace-rule'],
+
+    modelEvents: {
+      'destroy': 'close',
+      'change': 'render'
+    },
+
+    onRender: function () {
+      BaseView.prototype.onRender.apply(this, arguments);
+      this.$('[data-toggle="tooltip"]').tooltip({ container: 'body' });
+    },
+
+    onClose: function () {
+      this.$('[data-toggle="tooltip"]').tooltip('destroy');
+    },
+
+    serializeData: function () {
+     return _.extend(Marionette.Layout.prototype.serializeData.apply(this, arguments), {
+       allTags: _.union(this.model.get('sysTags'), this.model.get('tags'))
+     });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/views/viewer-header-view.js b/server/sonar-web/src/main/js/components/workspace/views/viewer-header-view.js
new file mode 100644
index 00000000000..b0705fb724a
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/views/viewer-header-view.js
@@ -0,0 +1,114 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  '../templates'
+], function () {
+
+  var $ = jQuery;
+
+  return Marionette.ItemView.extend({
+    template: Templates['workspace-viewer-header'],
+
+    modelEvents: {
+      'change': 'render'
+    },
+
+    events: {
+      'mousedown .js-resize': 'onResizeClick',
+
+      'click .js-minimize': 'onMinimizeClick',
+      'click .js-full-screen': 'onFullScreenClick',
+      'click .js-normal-size': 'onNormalSizeClick',
+      'click .js-close': 'onCloseClick'
+    },
+
+    onRender: function () {
+      this.$('[data-toggle="tooltip"]').tooltip({ container: 'body' });
+      this.$('.js-normal-size').addClass('hidden');
+    },
+
+    onClose: function () {
+      this.$('[data-toggle="tooltip"]').tooltip('destroy');
+      $('.tooltip').remove();
+    },
+
+    onResizeClick: function (e) {
+      e.preventDefault();
+      this.startResizing(e);
+    },
+
+    onMinimizeClick: function (e) {
+      e.preventDefault();
+      this.trigger('viewerMinimize');
+    },
+
+    onFullScreenClick: function (e) {
+      e.preventDefault();
+      this.toFullScreen();
+    },
+
+    onNormalSizeClick: function (e) {
+      e.preventDefault();
+      this.toNormalSize();
+    },
+
+    onCloseClick: function (e) {
+      e.preventDefault();
+      this.trigger('viewerClose');
+    },
+
+    startResizing: function (e) {
+      this.initialResizePosition = e.clientY;
+      this.initialResizeHeight = $('.workspace-viewer-container').height();
+      var processResizing = _.bind(this.processResizing, this),
+          stopResizing = _.bind(this.stopResizing, this);
+      $('body')
+          .on('mousemove.workspace', processResizing)
+          .on('mouseup.workspace', stopResizing);
+    },
+
+    processResizing: function (e) {
+      var currentResizePosition = e.clientY,
+          resizeDelta = this.initialResizePosition - currentResizePosition,
+          height = this.initialResizeHeight + resizeDelta;
+      $('.workspace-viewer-container').height(height);
+    },
+
+    stopResizing: function () {
+      $('body')
+          .off('mousemove.workspace')
+          .off('mouseup.workspace');
+    },
+
+    toFullScreen: function () {
+      this.$('.js-normal-size').removeClass('hidden');
+      this.$('.js-full-screen').addClass('hidden');
+      this.initialResizeHeight = $('.workspace-viewer-container').height();
+      $('.workspace-viewer-container').height('9999px');
+    },
+
+    toNormalSize: function () {
+      this.$('.js-normal-size').addClass('hidden');
+      this.$('.js-full-screen').removeClass('hidden');
+      $('.workspace-viewer-container').height(this.initialResizeHeight);
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/workspace/views/viewer-view.js b/server/sonar-web/src/main/js/components/workspace/views/viewer-view.js
new file mode 100644
index 00000000000..0de74ce1519
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/workspace/views/viewer-view.js
@@ -0,0 +1,56 @@
+/*
+ * SonarQube, open source software quality management tool.
+ * Copyright (C) 2008-2014 SonarSource
+ * mailto:contact AT sonarsource DOT com
+ *
+ * SonarQube is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * SonarQube is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+define([
+  './base-viewer-view',
+  'components/source-viewer/main',
+  '../templates'
+], function (BaseView, SourceViewer) {
+
+  return BaseView.extend({
+    template: Templates['workspace-viewer'],
+
+    onRender: function () {
+      BaseView.prototype.onRender.apply(this, arguments);
+      this.showViewer();
+    },
+
+    showViewer: function () {
+      if (SourceViewer == null) {
+        SourceViewer = require('components/source-viewer/main');
+      }
+      var that = this,
+          viewer = new SourceViewer(),
+          options = this.model.toJSON();
+      viewer.open(this.model.get('uuid'), { workspace: true });
+      viewer.on('loaded', function () {
+        that.model.set({
+          name: viewer.model.get('name'),
+          q: viewer.model.get('q')
+        });
+        if (options.line != null) {
+          viewer.highlightLine(options.line);
+          viewer.scrollToLine(options.line);
+        }
+      });
+      this.viewerRegion.show(viewer);
+    }
+  });
+
+});