HTML Setup: Use JQuery dialog for help popup.

As nice as ours was.... This one is *actually* nice ;)

Also adds some missing widgets that jquery's CSS expected, such as the close image for the dialog.  Kinda sexy.

mythtv/html/css/setup.css

@@ -123,61 +123,6 @@
     }
     /********************************************************/
 
-    #helpWindow {
-        display: none;
-        position: absolute;
-        background-color: #FFFFFF;
-        top: 10px;
-        right: 10px;
-        height: 200px;
-        width: 300px;
-        z-index: 999;
-        padding: 5px 5px 5px 5px;
-        border-width: 6px;
-        border-color: #0000FF;
-        border-style: double;
-    }
-
-    #helpContent {
-        height:             140;
-        overflow:           auto;
-    }
-
-    .Header {
-        font-size:          22px;
-        font-family:        sans-serif;
-        font-weight:        bold;
-        color:              blue;
-        width:              100%;
-        text-align:         center;
-    }
-
-    .Footer {
-        font-size:          12px;
-        font-family:        sans-serif;
-        font-weight:        bold;
-        color:              black;
-        width:              100%;
-        text-align:         center;
-        position:           relative;
-        bottom:             0px;
-    }
-
-    div.helpLink {
-        font-size:          10px;
-        font-family:        sans-serif;
-        font-weight:        bold;
-        color:              blue;
-        float:              left;
-    }
-
-    a.helpLink {
-        font-size:          10px;
-        font-family:        sans-serif;
-        font-weight:        bold;
-        color:              blue;
-    }
-
     #fileBrowser-bg
     {
         position: fixed;

mythtv/html/html.pro

@@ -10,7 +10,7 @@ win32:QMAKE_COPY_DIR = sh ./cpsimple
 
 html.path = $${PREFIX}/share/mythtv/html/
 html.files = index.html overview.html menu.qsp
-html.files += css images js misc setup samples
+html.files += css css/images images js misc setup samples
 
 INSTALLS += html
 

mythtv/html/index.html

@@ -63,20 +63,7 @@
     </div>
 </div>
 
-<div id='helpWindow'>
-    <div id='helpHeader' class='Header'>
-        Help
-    </div>
-    <div id='helpTitle' class='Title'>
-    </div>
-    <div id='helpContent'>
-    </div>
-    <div id='helpCloseButton' class='CloseButton'>
-        <a href='javascript:hideHelpWindow()'>Close [X]</a>
-    </div>
-    <div id='helpFooter' class='Footer'>
-        (This window is movable if it is in the way)
-    </div>
+<div id='helpWindow' title='Help'>
 </div>
 
 <div id='fileBrowser-bg'>

mythtv/html/setup/js/setup.js

@@ -16,6 +16,7 @@ function setupPageName(path) {
 }
 
 function showHelpWindow() {
+    $("#helpWindow").dialog();
     $("#helpWindow").show();
     $("#helpWindow").draggable();
 }
@@ -25,8 +26,8 @@ function hideHelpWindow() {
 }
 
 function showHelp(title, content) {
-    $("#helpTitle").html(title);
-    $("#helpContent").html(content);
+    $("#helpWindow").attr('title', title);
+    $("#helpWindow").html(content);
     showHelpWindow();
 }