#121 More UI issues:

* source as link instead of button
* fix source link when url has a hash
* new query uses the new layout
* rename url /src => /source...
* when deleting a visualization update the hash
* don't submit title/description if it hasn't changed
* mobile: fix description field wrapping

rd_ui/app/scripts/app.js

@@ -43,9 +43,14 @@ angular.module('redash', [
             reloadOnSearch: false
         });
         $routeProvider.when('/queries/new', {
-            templateUrl: '/views/queryfiddle.html',
-            controller: 'QueryFiddleCtrl',
-            reloadOnSearch: false
+            templateUrl: '/views/queryview.html',
+            controller: 'QueryViewCtrl',
+            reloadOnSearch: false,
+            resolve: {
+                'viewSource': function isViewSource() {
+                    return true;
+                }
+            }
         });
         // TODO
         // we should have 2 controllers: queryViewCtrl and queryEditCtrl
@@ -62,7 +67,7 @@ angular.module('redash', [
             controller: 'QueryFiddleCtrl',
             reloadOnSearch: false
         });
-        $routeProvider.when('/queries/:queryId/src', {
+        $routeProvider.when('/queries/:queryId/source', {
             templateUrl: '/views/queryview.html',
             controller: 'QueryViewCtrl',
             reloadOnSearch: false,

rd_ui/app/scripts/controllers/query_view.js

@@ -3,7 +3,7 @@
 
   var QueryViewCtrl = function($scope, $window, $route, $http, $location, growl, notifications, Query, Visualization) {
     var DEFAULT_TAB = 'table';
-    var pristineHash = null;
+    var pristineHash = "";
     var leavingPageText = "You will lose your changes if you leave";
     var route = $route.current;
 
@@ -27,7 +27,7 @@
 
     function updateSourceHref() {
       $scope.sourceHref = $scope.isSourceVisible ?
-        $location.url().replace('src', '') : $location.path() + '/src#' + $location.hash();
+        $location.url().replace('source', '') : $location.path() + '/source#' + $location.hash();
     };
 
     Mousetrap.bindGlobal("meta+s", function(e) {
@@ -219,6 +219,7 @@
         user: currentUser
       });
       $scope.lockButton(false);
+      $scope.isOwner = $scope.canEdit = true;
     }
 
     $scope.$watch('query.name', function() {
@@ -248,6 +249,7 @@
         Visualization.delete(vis);
         if ($scope.selectedTab == vis.id) {
           $scope.selectedTab = DEFAULT_TAB;
+          $location.hash($scope.selectedTab);
         }
         $scope.query.visualizations =
           $scope.query.visualizations.filter(function(v) {

rd_ui/app/scripts/directives.js

@@ -238,9 +238,7 @@
 
                 // ng-click handler to activate edit-in-place
                 $scope.edit = function () {
-                    if ($scope.ignoreBlanks) {
-                        $scope.oldValue = $scope.value;
-                    }
+                    $scope.oldValue = $scope.value;
 
                     $scope.editing = true;
 
@@ -261,7 +259,9 @@
                         $scope.editing = false;
                         element.removeClass('active');
 
-                        $scope.done && $scope.done();
+                        if ($scope.value !== $scope.oldValue) {
+                            $scope.done && $scope.done();
+                        }
                     }
                 }
 

rd_ui/app/styles/redash.css

@@ -27,7 +27,7 @@ a.navbar-brand {
 }
 
 .edit-in-place span {
-    white-space: pre;
+    white-space: pre-line;
 }
 .edit-in-place span.editable {
     cursor: pointer;

rd_ui/app/views/queryview.html

@@ -2,22 +2,28 @@
 <div class="container">
     <div class="row">
         <div class="col-lg-12">
-            <h2>
-                <edit-in-place editable="isOwner" done="saveQuery" ignore-blanks='true' value="query.name"></edit-in-place>
+            <div class="row">
+                <div class="col-lg-10">
+                    <h2>
+                        <edit-in-place editable="isOwner" done="saveQuery" ignore-blanks='true' value="query.name"></edit-in-place>
+                    </h2>
+                    <p>
+                        <em>
+                            <edit-in-place editable="isOwner" done="saveQuery" editor="textarea" placeholder="No description" ignore-blanks='false' value="query.description"></edit-in-place>
+                        </em>
+                    </p>
+                </div>
+                <div class="col-lg-2">
+                    <a ng-href="{{sourceHref}}" ng-click="toggleSource()" class="hidden-xs pull-right">
+                        <span ng-show="isSourceVisible">Hide Source</span>
+                        <span ng-show="!isSourceVisible">View Source</span>
+                    </a>
+                </div>
+            </div>
 
-                <span class="pull-right">
-                    <a ng-href="{{sourceHref}}" ng-click="toggleSource()" class="btn btn-default" ng-class="{active: isSourceVisible}">Source</a>
-                </span>
-            </h2>
-            <em>
-                <edit-in-place editable="isOwner" done="saveQuery" editor="textarea" placeholder="No description" ignore-blanks='false' value="query.description"></edit-in-place>
-            </em>
 
 
             <div class="visible-xs">
-                <p>
-                    <em>{{ query.description }}</em>
-                </p>
                 <p>
                     <span class="text-muted">Last update </span>
                     <strong am-time-ago="queryResult.query_result.retrieved_at"></strong>
@@ -32,6 +38,12 @@
                     <span class="text-muted">Rows </span>
                     <strong>{{queryResult.getData().length}}</strong>
                 </p>
+                <p>
+                    <a ng-href="{{sourceHref}}" ng-click="toggleSource()">
+                        <span ng-show="isSourceVisible">Hide Source</span>
+                        <span ng-show="!isSourceVisible">View Source</span>
+                    </a>
+                </p>
             </div>
         </div>
     </div>