more work on share panel, #864

src/app/controllers/all.js

@@ -15,5 +15,6 @@ define([
   './opentsdbTargetCtrl',
   './annotationsEditorCtrl',
   './templateEditorCtrl',
+  './sharePanelCtrl',
   './jsonEditorCtrl',
 ], function () {});

src/app/controllers/sharePanelCtrl.js

@@ -0,0 +1,42 @@
+define([
+  'angular',
+  'lodash'
+],
+function (angular, _) {
+  'use strict';
+
+  var module = angular.module('grafana.controllers');
+
+  module.controller('SharePanelCtrl', function($scope, $location, $timeout, timeSrv, $element) {
+
+    $scope.init = function() {
+      $scope.editor = { index: 0 };
+
+      var currentUrl = $location.absUrl();
+      var panelId = $scope.panel.id;
+      var range = timeSrv.timeRange(false);
+      var from = range.from;
+      var to = range.to;
+      if (_.isDate(from)) {
+        from = from.getTime();
+      }
+      if (_.isDate(to)) {
+        to = to.getTime();
+      }
+
+      $scope.shareUrl = currentUrl + "?panelId=" + panelId + "&fullscreen";
+      $scope.shareUrl += "&from=" + from;
+      $scope.shareUrl += "&to=" + to;
+
+      $timeout(function() {
+        var input = $element.find('[data-share-panel-url]');
+        input.focus();
+        input.select();
+      });
+    };
+
+    $scope.init();
+
+  });
+
+});

src/app/controllers/submenuCtrl.js

@@ -1,9 +1,8 @@
 define([
   'angular',
-  'app',
   'lodash'
 ],
-function (angular, app, _) {
+function (angular, _) {
   'use strict';
 
   var module = angular.module('grafana.controllers');

src/app/partials/share-panel.html

@@ -7,7 +7,7 @@
 			</div>
 
 			<div ng-model="editor.index" bs-tabs style="text-transform:capitalize;">
-				<div ng-repeat="tab in ['Link', 'Embedd', 'Image']" data-title="{{tab}}">
+				<div ng-repeat="tab in ['Link', 'Embed', 'Image']" data-title="{{tab}}">
 				</div>
 			</div>
 
@@ -16,7 +16,18 @@
 
 	<div class="modal-body">
 		<div class="editor-row">
-			<input type="text" class="input input-xxlarge"></input>
+			<div class="editor-option">
+				<label class="small">Current time range</label>
+				<input type="checkbox"></input>
+			</div>
+			<div class="editor-option">
+				<label class="small">To fullscreen panel</label>
+				<input type="checkbox"></input>
+			</div>
+		</div>
+
+		<div class="editor-row" style="margin-top: 20px;">
+			<input type="text" data-share-panel-url ng-model="shareUrl" class="input input-fluid"></input>
 		</div>
 	</div>
 

src/css/less/grafana.less

@@ -53,8 +53,9 @@
 }
 
 .modal {
-  max-width: 1024px;
+  max-width: 800px;
   left: 0;
+
   right: 0;
   margin-left: auto;
   margin-right: auto;
@@ -528,3 +529,10 @@ select.grafana-target-segment-input {
 .grafana-tip {
   padding-left: 5px;
 }
+
+input[type=text].input-fluid {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 14px;
+}
+

src/css/less/overrides.less

@@ -562,12 +562,6 @@ div.flot-text {
   background-color: darken(@purple, 10%);
 }
 
-.annotation-editor-table {
-  td {
-    white-space: nowrap;
-  }
-}
-
 // Top menu
 .save-dashboard-dropdown {
   padding: 10px;