Przeglądaj źródła

Add message panel when hosted at kanaka.github.com.

Add a helpful popup/panel message for when noVNC is used at
kanaka.github.com (e.g. where novnc.com redirects).
Joel Martin 13 lat temu
rodzic
commit
0ce93900ae
3 zmienionych plików z 55 dodań i 2 usunięć
  1. 18 0
      include/base.css
  2. 19 1
      include/ui.js
  3. 18 1
      vnc.html

+ 18 - 0
include/base.css

@@ -153,6 +153,7 @@ html {
 }
 }
 
 
 #noVNC_controls {
 #noVNC_controls {
+  display:none;
   margin-top:77px;
   margin-top:77px;
   right:12px;
   right:12px;
   position:fixed;
   position:fixed;
@@ -161,6 +162,23 @@ html {
   right:15px;
   right:15px;
 }
 }
 
 
+#noVNC_description {
+  display:none;
+  position:fixed;
+
+  margin-top:77px;
+  right:20px;
+  left:20px;
+  padding:15px;
+  color:#000;
+  background:#eee; /* default background for browsers without gradient support */
+
+  border:2px solid #E0E0E0;
+  -webkit-border-radius:10px;
+  -moz-border-radius:10px;
+  border-radius:10px;
+}
+
 #noVNC_clipboard {
 #noVNC_clipboard {
   display:none;
   display:none;
   margin-top:77px;
   margin-top:77px;

+ 19 - 1
include/ui.js

@@ -14,7 +14,7 @@ var UI = {
 
 
 rfb_state : 'loaded',
 rfb_state : 'loaded',
 settingsOpen : false,
 settingsOpen : false,
-connSettingsOpen : true,
+connSettingsOpen : false,
 clipboardOpen: false,
 clipboardOpen: false,
 keyboardVisible: false,
 keyboardVisible: false,
 
 
@@ -102,6 +102,14 @@ load: function() {
         }
         }
     } );
     } );
 
 
+    // Show description by default when hosted at for kanaka.github.com
+    if (location.host === "kanaka.github.com") {
+        // Open the description dialog
+        $D('noVNC_description').style.display = "block";
+    } else {
+        // Open the connect panel on first load
+        UI.toggleConnectPanel();
+    }
 },
 },
 
 
 // Read form control compatible setting from cookie
 // Read form control compatible setting from cookie
@@ -189,6 +197,8 @@ forceSetting: function(name, val) {
 
 
 // Show the clipboard panel
 // Show the clipboard panel
 toggleClipboardPanel: function() {
 toggleClipboardPanel: function() {
+    // Close the description panel
+    $D('noVNC_description').style.display = "none";
     //Close settings if open
     //Close settings if open
     if (UI.settingsOpen === true) {
     if (UI.settingsOpen === true) {
         UI.settingsApply();
         UI.settingsApply();
@@ -212,6 +222,8 @@ toggleClipboardPanel: function() {
 
 
 // Show the connection settings panel/menu
 // Show the connection settings panel/menu
 toggleConnectPanel: function() {
 toggleConnectPanel: function() {
+    // Close the description panel
+    $D('noVNC_description').style.display = "none";
     //Close connection settings if open
     //Close connection settings if open
     if (UI.settingsOpen === true) {
     if (UI.settingsOpen === true) {
         UI.settingsApply();
         UI.settingsApply();
@@ -239,6 +251,8 @@ toggleConnectPanel: function() {
 //   On open, settings are refreshed from saved cookies.
 //   On open, settings are refreshed from saved cookies.
 //   On close, settings are applied
 //   On close, settings are applied
 toggleSettingsPanel: function() {
 toggleSettingsPanel: function() {
+    // Close the description panel
+    $D('noVNC_description').style.display = "none";
     if (UI.settingsOpen) {
     if (UI.settingsOpen) {
         UI.settingsApply();
         UI.settingsApply();
         UI.closeSettingsMenu();
         UI.closeSettingsMenu();
@@ -265,6 +279,8 @@ toggleSettingsPanel: function() {
 
 
 // Open menu
 // Open menu
 openSettingsMenu: function() {
 openSettingsMenu: function() {
+    // Close the description panel
+    $D('noVNC_description').style.display = "none";
     if (UI.clipboardOpen === true) {
     if (UI.clipboardOpen === true) {
         UI.toggleClipboardPanel();
         UI.toggleClipboardPanel();
     }
     }
@@ -415,10 +431,12 @@ updateVisualState: function() {
     if (connected) {
     if (connected) {
         UI.setViewClip();
         UI.setViewClip();
         UI.setMouseButton(1);
         UI.setMouseButton(1);
+        $D('clipboardButton').style.display = "inline";
         $D('showKeyboard').style.display = "inline";
         $D('showKeyboard').style.display = "inline";
         $D('sendCtrlAltDelButton').style.display = "inline";
         $D('sendCtrlAltDelButton').style.display = "inline";
     } else {
     } else {
         UI.setMouseButton();
         UI.setMouseButton();
+        $D('clipboardButton').style.display = "none";
         $D('showKeyboard').style.display = "none";
         $D('showKeyboard').style.display = "none";
         $D('sendCtrlAltDelButton').style.display = "none";
         $D('sendCtrlAltDelButton').style.display = "none";
     }
     }

+ 18 - 1
vnc.html

@@ -90,7 +90,7 @@
                 title="Settings"
                 title="Settings"
                 onclick="UI.toggleSettingsPanel();" />
                 onclick="UI.toggleSettingsPanel();" />
             <input type="image" src="images/connect.png"
             <input type="image" src="images/connect.png"
-                id="connectButton" class="noVNC_status_button_selected"
+                id="connectButton" class="noVNC_status_button"
                 title="Connect"
                 title="Connect"
                 onclick="UI.toggleConnectPanel()" />
                 onclick="UI.toggleConnectPanel()" />
             <input type="image" src="images/disconnect.png"
             <input type="image" src="images/disconnect.png"
@@ -99,6 +99,23 @@
                 onclick="UI.disconnect()" />
                 onclick="UI.disconnect()" />
         </div>
         </div>
 
 
+        <!-- Description Panel -->
+        <!-- Shown by default when hosted at for kanaka.github.com -->
+        <div id="noVNC_description" style="display:none;" class="">
+            noVNC is a browser based VNC client implemented using HTML5 Canvas
+            and WebSockets. You will either need a VNC server with WebSockets
+            support (such as <a href="http://libvncserver.sourceforge.net/">libvncserver</a>)
+            or you will need to use
+            <a href="https://github.com/kanaka/websockify">websockify</a>
+            to bridge between your browser and VNC server. See the noVNC
+            <a href="https://github.com/kanaka/noVNC">README</a>
+            and <a href="http://kanaka.github.com/noVNC">website</a>
+            for more information.
+            <br />
+            <input type="button" value="Close"
+                onclick="UI.toggleConnectPanel();">
+        </div>
+
         <!-- Clipboard Panel -->
         <!-- Clipboard Panel -->
         <div id="noVNC_clipboard" class="triangle-right top">
         <div id="noVNC_clipboard" class="triangle-right top">
             <textarea id="noVNC_clipboard_text" rows=5
             <textarea id="noVNC_clipboard_text" rows=5