NDT-DEV email list created

Revision: 1167
Author:   

Date:     Fri Nov 14 15:16:55 2014 UTC
Log:      Edited widget.html for better user experience

https://code.google.com/p/ndt/source/detail?r=1167

Modified:
 /trunk/HTML5-frontend/script.js
 /trunk/HTML5-frontend/set-active-client.sh
 /trunk/HTML5-frontend/style.css
 /trunk/HTML5-frontend/widget.html

=======================================
--- /trunk/HTML5-frontend/script.js     Tue Nov  4 15:27:14 2014 UTC
+++ /trunk/HTML5-frontend/script.js     Fri Nov 14 15:16:55 2014 UTC
@@ -56,6 +56,11 @@
 function startTest(evt) {
   evt.stopPropagation();
   evt.preventDefault();
+  if (!isPluginLoaded()) {
+    $('#warning').show();
+    return;
+  }
+  $('#warning').hide();
   document.getElementById('javaButton').disabled = true;
   document.getElementById('flashButton').disabled = true;
   showPage('test', resetGauges);
@@ -472,7 +477,6 @@

 // BACKEND METHODS
 function useJavaAsBackend() {
-  //document.getElementById('javaButton').toggleClass('active');
   var backendContainer = document.getElementById('backendContainer');
   while (backendContainer.firstChild) {
     backendContainer.removeChild(backendContainer.firstChild);
@@ -486,6 +490,8 @@
   app.width = '400';
   app.height = '400';
   document.getElementById('backendContainer').appendChild(app);
+  $('#flashButton').removeClass("active");
+  $('#javaButton').addClass("active");
 }

 function useFlashAsBackend() {
@@ -500,8 +506,10 @@
   embed.type = 'application/x-shockwave-flash';
   embed.src = 'FlashClt.swf';
   embed.width = '600';
-  embed.height = '400';
-  document.getElementById('backendContainer').appendChild(embed);
+  embed.height = '10';
+  document.getElementById('backendContainer').appendChild(embed);
+  $('#javaButton').removeClass("active");
+  $('#flashButton').addClass("active");
 }

 // UTILITIES
@@ -509,9 +517,20 @@
 function debug(message) {
   if (allowDebug && window.console) console.debug(message);
 }
+
+function isPluginLoaded() {
+  try {
+    testStatus();
+    return true;
+  } catch(e) {
+    return false;
+  }
+}

 function checkInstalledPlugins() {
   var hasFlash = false, hasJava = false;
+
+  $('#warning').hide();
   try {
     var activeXObject = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
     if(activeXObject) hasFlash = true;
@@ -520,7 +539,7 @@
   }

   if (!hasFlash) {
-    document.getElementById('flashButton').disabled = true
+    document.getElementById('flashButton').disabled = true;
   }

   if (deployJava.getJREs() == '') {
@@ -531,6 +550,8 @@

   if (hasJava) {
     useJavaAsBackend();
+  } else if (hasFlash) {
+    useFlashAsBackend();
   }
 }

=======================================
--- /trunk/HTML5-frontend/set-active-client.sh  Fri Mar 21 10:33:50 2014 UTC
+++ /trunk/HTML5-frontend/set-active-client.sh  Fri Nov 14 15:16:55 2014 UTC
@@ -6,8 +6,8 @@
 flash="flash"
 java="java"
 widget="widget.html"
-embed_tag="<embed id=\"NDT\" name=\"NDT\"  
type=\"application\/x-shockwave-flash\" src=\"FlashClt.swf\" width=\"600\"  
height=\"400\" \/>"
-applet_tag="<applet id=\"NDT\" name=\"NDT\"  
code=\"edu.internet2.ndt.Tcpbw100.class\" codebase=\"<?php print  
\$applet_url ?>\" archive=\"Tcpbw100.jar\" width=\"400\"  
height=\"400\"><\/applet>"
+embed_tag="<embed id=\"NDT\" name=\"NDT\"  
type=\"application\/x-shockwave-flash\" src=\"FlashClt.swf\" width=\"600\"  
height=\"10\" \/>"
+applet_tag="<applet id=\"NDT\" name=\"NDT\"  
code=\"edu.internet2.ndt.Tcpbw100.class\" codebase=\"<?php print  
\$applet_url ?>\" archive=\"Tcpbw100.jar\" width=\"400\"  
height=\"10\"><\/applet>"

 echo "This script allows you to change NDT client being used in $widget  
page."
 if test ! -f "$widget"; then
=======================================
--- /trunk/HTML5-frontend/style.css     Tue Nov  4 15:27:14 2014 UTC
+++ /trunk/HTML5-frontend/style.css     Fri Nov 14 15:16:55 2014 UTC
@@ -12,6 +12,7 @@
   padding: 0;
   border: 0;
   overflow: hidden;
+  height: 2000px;
 }
 a img {
   border: 0;
@@ -26,6 +27,15 @@
   text-transform: uppercase;
   font-size: 36px;
   font-family: "League Gothic", Impact, "Arial Narrow", sans-serif;
+  margin-bottom: 15px;
+}
+.header {
+  margin: 10px;
+}
+#warning {
+  font-size: 20px;
+  color: red;
+  margin: 10px;
 }
 .page {
   width: 640px;
@@ -98,8 +108,8 @@
   margin: 10px;
 }

-.backendButton .active {
-  background-color:blue;
+.active {
+  background-color:black;
 }

 .backendButton:disabled {
=======================================
--- /trunk/HTML5-frontend/widget.html   Tue Nov  4 15:27:14 2014 UTC
+++ /trunk/HTML5-frontend/widget.html   Fri Nov 14 15:16:55 2014 UTC
@@ -17,6 +17,19 @@
     </script>
 </head>
 <body class="initializing">
+<div class="header">
+    <p>You can choose which plugin (flash/java) you want to use by  
clicking on proper button below. <br />
+       Make sure that specific plugin is not blocked by your browser (if  
you use some kind of "flash block" extension <br />
+       then you may need to click on small bar at the bottom of this page  
to enable content).</p>
+</div>
+<div>
+  <button id="javaButton" class="backendButton button"  
onclick="useJavaAsBackend()" type="button">Use java</button>
+  <button id="flashButton" class="backendButton button"  
onclick="useFlashAsBackend()" type="button">Use flash</button>
+</div>
+<div id="warning">
+    <p>Selected plugin was not loaded properly. <br />
+       Make sure that you have proper plugin installed and it is not  
blocked by your browser.</p>
+</div>
 <div id="widget">
   <div id="welcome" class="page">
     <div class="info">
@@ -123,16 +136,11 @@
   </div>
 </div>

-<div>
-  <button id="javaButton" class="backendButton button"  
onclick="useJavaAsBackend()" type="button">Use java</button>
-  <button id="flashButton" class="backendButton button"  
onclick="useFlashAsBackend()" type="button">Use flash</button>
-</div>
-
 <div id="backendContainer">
   <!--Use embed tag to have flash client being background for JS UI or  
applet tag if you want to use java applet instead. -->
-  <embed id="NDT" name="NDT" type="application/x-shockwave-flash"  
src="FlashClt.swf" width="600" height="400" />
+  <embed id="NDT" name="NDT" type="application/x-shockwave-flash"  
src="FlashClt.swf" width="600" height="10" />

-  <!--<applet id="NDT" name="NDT" code="edu.internet2.ndt.Tcpbw100.class"  
codebase="<?php print $applet_url ?>" archive="Tcpbw100.jar"      
width="400" height="400"></applet>-->
+  <!--<applet id="NDT" name="NDT" code="edu.internet2.ndt.Tcpbw100.class"  
codebase="<?php print $applet_url ?>" archive="Tcpbw100.jar"      
width="400" height="10"></applet>-->
 </div>

 </body>