UNPKG

rhamt-vscode-extension

Version:

RHAMT VSCode extension

868 lines 62.3 kB
  <!-- <a id="scroll-to-top" role="button" aria-label="scroll to top" href="#">
    <span class="icon"></span>
  </a> -->
  <div class="monaco-shell">
      <div class="manaco-shell-content">
        <div style="position:absolute; right: 0px; left: 0px; top: 0px; bottom: 0px; ">
          <!-- height: 100%; width: 100%;-->
          <!--style="width: 1280px; height: 768px;"-->
          <div class="monaco-workbench-container" style="position: relative; height: 100%;">
            <div class="monaco-workbench mac" style="height:100%;">
              <!-- style="top: 0px; right: 0px; bottom: 0px; left: 0px; position: relative; width: 1280px; height: 768px;" -->
              <div class="part editor" style="position: relative; height: 100%;">
                <!-- style="width: 1038px; height: 724px; top: 22px; right: 0px; bottom: 22px; left: 242px; position: absolute;" -->
                <div class="content" style="height:100%;">
                  <!-- style="overflow: hidden; background-color: rgb(30, 30, 30); width: 1038px; height: 724px;" -->
                  <div class="editor-container" style="background-color: rgb(30, 30, 30); height: 100%;"> <!--background-color: #313131 #282c34 rgb(30, 30, 30); ;-->
                    <div class="editor-instance" style="height: 100%;">
                      <div class="extension-editor" style="height:100%;">
                        <div class="header recommended" style="padding: 20px 20px 5px;">
                          <img class="icon" draggable="false" style="height: 88px;" src="windup_test.png">
                          <div class="details" style="padding-left: 0px;">
                            <div class="title">
                              <span class="name clickable" title="Extension name">RHAMT</span>
                              <span class="identifier" title="Extension identifier">Red Hat Application Migration Toolkit</span>
                              <span class="preview" title="Preview" style="display: inherit;">Preview</span>
                              <!-- <span class="preview" title="Preview" style="display: inherit;">
                                <div class="debug-toolbar" style="background-color: rgb(51, 51, 51); box-shadow: rgb(0, 0, 0) 0px 5px 8px; border: none;">
                                  <div class="drag-area"></div>
                                  <div class="action-bar-container">
                                    <div class="monaco-action-bar animated">
                                      <ul class="actions-container" role="toolbar">
                                        <li class="action-item" role="presentation">
                                          <a class="action-label icon debug-action pause" role="button" title="Pause (F6)" tabindex="0"></a>
                                        </li>
                                        <li class="action-item disabled" role="presentation">
                                          <a class="action-label icon debug-action step-over disabled" role="button" aria-disabled="true" title="Step Over (F10)"></a>
                                        </li>
                                        <li class="action-item disabled" role="presentation">
                                          <a class="action-label icon debug-action step-into disabled" role="button" aria-disabled="true" title="Step Into (F11)"></a>
                                        </li>
                                        <li class="action-item disabled" role="presentation">
                                          <a class="action-label icon debug-action step-out disabled" role="button" aria-disabled="true" title="Step Out (⇧F11)"></a>
                                        </li>
                                        <li class="action-item" role="presentation">
                                          <a class="action-label icon debug-action restart" role="button" title="Reconnect (⇧⌘F5)" tabindex="0"></a>
                                        </li>
                                        <li class="action-item" role="presentation">
                                          <a class="action-label icon debug-action stop" role="button" title="Stop (⇧F5)" tabindex="0"></a>
                                        </li>
                                      </ul>
                                    </div>
                                  </div>
                                </div>
                              </span> -->
                              <span class="builtin" style="display: none;">Built-in</span>
                            </div>
                            <!-- <div class="subtitle">
                              <span class="publisher clickable" title="Publisher name">Red Hat</span>
                              <span class="install extension-install-count" title="Install count">
                                <span class="octicon octicon-cloud-download"></span>
                                <span class="count">158,295</span>
                              </span>
                              <span class="rating clickable extension-ratings" title="Rating">
                                <span class="full star"></span>
                                <span class="full star"></span>
                                <span class="full star"></span>
                                <span class="full star"></span>
                                <span class="half star"></span>
                              </span>
                              <span class="repository clickable" style="display: initial;">Repository</span>
                              <span class="license clickable" style="display: initial;">License</span>
                            </div> -->
                            <div class="description">Application Migration and Assessment</div>
                            <!-- <div class="actions">
                              <div class="monaco-action-bar">
                                <ul class="actions-container" role="toolbar">
                                  <li class="action-item disabled" role="presentation">
                                    <a class="action-label icon disable-status hide disabled" role="button">Disabled</a>
                                  </li>
                                  <li class="action-item disabled" role="presentation">
                                    <a class="action-label icon extension-action reload disabled" role="button">Reload</a>
                                  </li>
                                  <li class="action-item disabled" role="presentation">
                                    <a class="action-label icon extension-action prominent update disabled" role="button">Update</a>
                                  </li>
                                  <li class="action-item disabled" role="presentation">
                                    <a class="action-label icon extension-action prominent enable disabled" role="button">Enable</a>
                                  </li>
                                  <li class="action-item" role="presentation">
                                    <a class="action-label icon extension-action disable" role="button" tabindex="0">Disable</a>
                                  </li>
                                  <li class="action-item" role="presentation">
                                    <a class="action-label icon extension-action uninstall" role="button" tabindex="0">Uninstall</a>
                                  </li>
                                  <li class="action-item disabled" role="presentation">
                                    <a class="action-label icon malicious-status not-malicious disabled" role="button" title="This extension was reported to be problematic.">This extension was reported to be problematic.</a>
                                  </li>
                                </ul>
                              </div>
                            </div>
                            <div class="recommendation">
                              <div class="recommendation-text">This extension is recommended because you have Mongo installed.</div>
                              <div class="monaco-action-bar">
                                <ul class="actions-container" role="toolbar">
                                  <li class="action-item" role="presentation">
                                    <a class="action-label icon extension-action ignore" role="button" tabindex="0" title="Do not recommend this extension again">Ignore Recommendation</a>
                                  </li>
                                  <li class="action-item" role="presentation">
                                    <a class="action-label icon extension-action undo-ignore" role="button" tabindex="0" title="Undo">Undo</a>
                                  </li>
                                </ul>
                              </div>
                            </div> -->
                          </div>
                        </div>
                        <div class="body" style="height:100%">
                          <div class="navbar">
                            <div class="monaco-action-bar">
                              <ul class="actions-container" role="toolbar">
                                <li class="action-item disabled" role="presentation">
                                  <a class="action-label disabled" role="button" title="RHAMT run configuration details, these options are used by the rhamt analysis engine."
                                    tabindex="0">Analysis Configuration</a>
                                </li>
                                <li class="action-item" role="presentation">
                                  <a class="action-label" role="button" title="Extension update history, rendered from the extension's 'CHANGELOG.md' file"
                                    tabindex="0">Discovered Migration Issues</a>
                                </li>
                                <li class="action-item" role="presentation">
                                  <a class="action-label" role="button" title="Lists extensions this extension depends on" tabindex="0">Generated Report</a>
                                </li>
                                <li class="action-item" role="presentation">
                                  <a class="action-label" role="button" title="Lists extensions this extension depends on" tabindex="0">Dependencies Graph</a>
                                </li>
                              </ul>
                            </div>
                          </div>
                          <div class="content" style="height:100%; position: inherit;">
                            <!--<div>-->
                            <!--class="monaco-scrollable-element  mac" role="presentation" style="position: relative; overflow: hidden;"-->
                            <div class="wrapper">
  
                                <details>
                                    <summary style="user-select: none">Runtime Settings</summary> <!--background: #363636;-->
                                    <div class="advanced-container" style="background-color: hsla(0,0%,51%,.04); border-bottom: 1px solid #252525; border-top: 1px solid #353535; padding: 0; overflow: hidden">
                                      <!-- background-color: #313131;-->
                                      <div style=" padding: 8px 15px 8px 15px; font-size: 14px; color: #333333; border-bottom: 1px solid #232323; margin: 0; font-family: Arial, Helvetica, sans-serif; text-shadow: 0 1px #232323; ">
                                        <div style="font-size: 14px; color: #dddddd;">
                                          Localhost
                                        </div>
                                      </div>
                                      <div class="runtimeSettingsContainer">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            Output
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;" />
                                      </div>
                                      <!-- <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            Configuration Name:
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;" />
                                      </div>
                                      <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            RHAMT Installation:
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;" />
                                      </div>
                                      <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            port:
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);" />
                                      </div>
                                      <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            JAVA_HOME:
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);" />
                                      </div> -->
                                    </div>
                                  </details>
  
  
                                <div class="advanced-container" style="width: 50%; height: 200px; border-radius: 5px; background-color: hsla(0,0%,51%,.04); border-bottom: 1px solid #252525; border-top: 1px solid #353535; padding: 0; overflow: hidden; box-shadow: 0 0px 3px 0 #000000;">
                                    <!-- background-color: #313131;-->
                                    <div style="padding: 8px 0px 0px 0px; font-size: 14px; color: #333333; margin: 0; font-family: Arial, Helvetica, sans-serif; text-shadow: 0 1px #232323;">
                                      <div style="font-size: 14px; color: #dddddd; border-bottom: 1px solid hsla(0, 0%, 50%, .22); display: flex; align-items: stretch; padding: 0px; justify-content: flex-start">
                                        <div class="tableHeader">Input</div>
                                        <div class="tableCenter"></div>
                                        <div class="addInputButton"><div class="caption">Add</div></div>
                                      </div>
                                    </div>
                                    <table>
                                        <tr>
                                            <td><code>~/project/input1</code></td>
                                          </tr>
                                          <tr>
                                            <td><code>~/project/input1</code></td>
                                          </tr>
                                      </table>
                                    <!-- <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          rhamt-cli:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;">
                                        </input>
                                    </div>
                                    <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          port:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);">                                      </input>
                                    </div>
                                    <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          JAVA_HOME:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);">                                      </input>
                                    </div> -->
                                  </div>
                                  <div class="advanced-container" style="margin-top: 20px; width: 50%; height: 200px; border-radius: 5px; background-color: hsla(0,0%,51%,.04); border-bottom: 1px solid #252525; border-top: 1px solid #353535; padding: 0; overflow: hidden; box-shadow: 0 0px 3px 0 #000000;">
                                    <!-- background-color: #313131;-->
                                    <div style="padding: 8px 0px 0px 0px; font-size: 14px; color: #333333; margin: 0; font-family: Arial, Helvetica, sans-serif; text-shadow: 0 1px #232323;">
                                      <div style="font-size: 14px; color: #dddddd; border-bottom: 1px solid hsla(0, 0%, 50%, .22); display: flex; align-items: stretch; padding: 0px; justify-content: flex-start">
                                        <div class="tableHeader">Packages</div>
                                        <div class="tableCenter"></div>
                                        <div class="addInputButton"><div class="caption">Add</div></div>
                                      </div>
                                    </div>
                                    <table>
                                        <tr>
                                          <td><code>com.mycompany.foo</code></td>
                                        </tr>
                                        <tr>
                                          <td><code>com.mycompany.bar</code></td>
                                          </tr>
                                    </table>
                                  </div>
  
                              <!-- class="subcontent"></div> style="overflow: hidden; "-->
                              <details open>
                                <summary style="user-select: none">General</summary>
                                <table>
                                  <tr>
                                    <th style="width: 25%">Command</th>
                                    <th style="width: 50%">Description</th>
                                    <th style="width: 25%; text-align: center;"></th>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--input</code>
                                    </td>
                                    <td>Path to file or directory to be analyzed</td>
                                    <td>
                                      <div option="input" class="addButton"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--output</code>
                                    </td>
                                    <td>Directory to output the generated report</td>
                                    <td>
                                      <div option="output" class="addButton"></div>
                                    </td>
                                  </tr>
                                </table>
                              </details>
                              <details open>
                                <summary style="user-select: none">Migration Path</summary>
                                <table>
                                  <tr>
                                    <th style="width: 25%">Command</th>
                                    <th style="width: 50%">Description</th>
                                    <th style="width: 25%">Enabled</th>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--target eap:6</code>
                                    </td>
                                    <td>Anything to EAP 6</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--target eap:7</code>
                                    </td>
                                    <td>Anything to EAP 7</td>
                                    <td>✔︎</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source weblogic --target eap:6</code>
                                    </td>
                                    <td>WebLogic to EAP 6</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source weblogic --target eap:7</code>
                                    </td>
                                    <td>WebLogic to EAP 7</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source websphere --target eap:6</code>
                                    </td>
                                    <td>WebSphere to EAP 6</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source websphere --target eap:7</code>
                                    </td>
                                    <td>WebSphere to EAP 7</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source eap:4 --target eap:6</code>
                                    </td>
                                    <td>EAP 4 to EAP 6</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source eap:5 --target eap:6</code>
                                    </td>
                                    <td>EAP 5 to EAP 6</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source eap:5 --target eap:7</code>
                                    </td>
                                    <td>EAP 5 to EAP 7</td>
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source eap:6 --target eap:7</code>
                                    </td>
                                    <td>EAP 6 to EAP 7</td>
                                    <td>—</td>
                                  </tr>
                                </table>
                              </details>
                              <details open>
                                <summary style="user-select: none">Boolean Options</summary>
                                <table id="options">
                                  <tr>
                                    <th style="width: 25%">Command</th>
                                    <th style="width: 50%">Description</th>
                                    <th style="width: 25%">Enabled</th>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--sourceMode</code>
                                    </td>
                                    <td>Evaluate source files only</td>
                                    <!-- <td>✔︎</td> -->
                                    <!-- <td><code>true</code></td> -->
                                    <td>
                                      <div id="sourceMode" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--batchMode</code>
                                    </td>
                                    <td>Run in non-interactive mode</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="batchMode" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--debug</code>
                                    </td>
                                    <td>Run in debug mode</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="debug" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--discoverPackages</code>
                                    </td>
                                    <td>Display available packages in the input binary application</td>
                                    <!-- <td>—</td> -->
                                    <td>
                                      <div id="discoverPackages" class="booleanOption booleanOptionDisabled"></div>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--enableClassNotFoundAnalysis</code>
                                    </td>
                                    <td>Analyze Java files that are not available on the class path</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="enableClassNotFoundAnalysis" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--enableCompatibleFilesReport</code>
                                    </td>
                                    <td>Generate a Compatible Files report</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="enableCompatibleFilesReport" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--enableTattletale</code>
                                    </td>
                                    <td>Generate a Tattletale report for each application</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="enableTattletale" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--explodedApp</code>
                                    </td>
                                    <td>Input contains source files for a single application</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="explodedApp" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--exportCSV</code>
                                    </td>
                                    <td>Export report CSV file to
                                      <code>--output</code> directory</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="exportCSV" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--help</code>
                                    </td>
                                    <td>Display rhamt-cli help message</td>
                                    <!-- <td>—</td> -->
                                    <td>
                                      <div id="help" class="booleanOption booleanOptionDisabled"></div>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--keepWorkDirs</code>
                                    </td>
                                    <td>Do not delete temporary working files</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="keepWorkDirs" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--list</code>
                                    </td>
                                    <td>List installed add-ons</td>
                                    <!-- <td>—</td> -->
                                    <td>
                                      <div id="list" class="booleanOption booleanOptionDisabled"></div>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--listSourceTechnologies</code>
                                    </td>
                                    <td>List available source technologies</td>
                                    <!-- <td>—</td> -->
                                    <td>
                                      <div id="listSourceTechnologies" class="booleanOption booleanOptionDisabled"></div>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--listTags</code>
                                    </td>
                                    <td>List available tags</td>
                                    <!-- <td>—</td> -->
                                    <td>
                                      <div id="listTags" class="booleanOption booleanOptionDisabled"></div>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--listTargetTechnogies</code>
                                    </td>
                                    <td>List available target technologies</td>
                                    <!-- <td>—</td> -->
                                    <td>
                                      <div id="listTargetTechnogies" class="booleanOption booleanOptionDisabled"></div>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--mavenize</code>
                                    </td>
                                    <td>Create a Maven project directory structure</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="mavenize" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--online</code>
                                    </td>
                                    <td>Allow network access for features that require it</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="online" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--overwrite</code>
                                    </td>
                                    <td>Force delete the existing output directory specified by --output</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="overwrite" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--skipReports</code>
                                    </td>
                                    <td>Do not generate a report</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>
                                      <div id="skipReports" class="booleanOption booleanOptionEnabled"></div>
                                    </td>
                                  </tr>
                                  <tr>
                                      <td>
                                        <code>--version</code>
                                      </td>
                                      <td>Display rhamt version</td>
                                      <!-- <td>—</td> -->
                                      <td>
                                        <div id="version" class="booleanOption booleanOptionDisabled"></div>—</td>
                                    </tr>
                                </table>
                              </details>
                              <details open>
                                <summary style="user-select: none">Advanced</summary>
                                <table id="options">
                                  <tr>
                                    <th style="width: 25%">Command</th>
                                    <th style="width: 50%">Description</th>
                                    <!-- <th>Enabled</th> -->
                                    <th style="width: 25%"></th>
                                  </tr>
  
                                  <td>
                                    <code>--additionalClassPath</code>
                                  </td>
                                  <td>Additional locations to be added to the class path</td>
                                  <!-- <td>✔︎</td> -->
                                  <td>
                                    <div class="addButton"></div>
                                  </td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--addonDir</code>
                                    </td>
                                    <td>Custom addon directory</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--excludePackages</code>
                                    </td>
                                    <td>Packages to exclude from analysis</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--excludeTags</code>
                                    </td>
                                    <td>Tags to exclude. When specified, rules with these tags will not be processed.</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--immutableAddonDir</code>
                                    </td>
                                    <td>A custom read-only add-on repository</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--includeTags</code>
                                    </td>
                                    <td>Only use rules with specific tags</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--install</code>
                                    </td>
                                    <td>Add-ons to install</td>
                                    <!-- <td>—</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--mavenizeGroupId</code>
                                    </td>
                                    <td>The
                                      <code>groupId</code> for
                                      <code>pom's</code> generated by
                                      <code>--mavenize</code>
                                    </td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--packages</code>
                                    </td>
                                    <td>Packages to be evaluated</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--remove</code>
                                    </td>
                                    <td>Addons to remove</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--source</code>
                                    </td>
                                    <td>Source
                                      <code>technologies</code>,
                                      <code>servers</code>,
                                      <code>platforms</code>, or
                                      <code>frameworks</code> to migrate from</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--target</code>
                                    </td>
                                    <td>Target
                                      <code>technologies</code>,
                                      <code>servers</code>,
                                      <code>platforms</code>, or
                                      <code>frameworks</code> to migrate to</td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--userIgnorePath</code>
                                    </td>
                                    <td>User ignore file, in addition to
                                      <code>${user.home}/.rhamt/ignore/</code>
                                    </td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                  <tr>
                                    <td>
                                      <code>--userRulesDirectory</code>
                                    </td>
                                    <td>Custom rulesets location in addition to
                                      <code>RHAMT_HOME/rules/</code> and
                                      <code>${user.home}/.rhamt/rules/</code>
                                    </td>
                                    <!-- <td>✔︎</td> -->
                                    <td>—</td>
                                  </tr>
                                </table>
                              </details>
  
                              <details>
                                  <summary style="user-select: none">Runtime Settings</summary> <!--background: #363636;-->
                                  <div class="advanced-container" style="background-color: hsla(0,0%,51%,.04); border-bottom: 1px solid #252525; border-top: 1px solid #353535; padding: 0; overflow: hidden">
                                    <!-- background-color: #313131;-->
                                    <div style=" padding: 8px 15px 8px 15px; font-size: 14px; color: #333333; border-bottom: 1px solid #232323; margin: 0; font-family: Arial, Helvetica, sans-serif; text-shadow: 0 1px #232323; ">
                                      <div style="font-size: 14px; color: #dddddd;">
                                        Localhost
                                      </div>
                                    </div>
                                    <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          Configuration Name:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;">
                                        </input>
                                    </div>
                                    <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          rhamt-cli:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;">
                                        </input>
                                    </div>
                                    <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          port:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);">                                      </input>
                                    </div>
                                    <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                        <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                          JAVA_HOME:
                                        </div>
                                        <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);">                                      </input>
                                    </div>
                                  </div>
  
                                  <div class="advanced-container" style="background-color: hsla(0,0%,51%,.04); border-bottom: 1px solid #252525; border-top: 1px solid #353535; padding: 0; overflow: hidden; margin-top: 10px;">
                                      <!-- background-color: #313131;-->
                                      <div style=" padding: 8px 15px 8px 15px; font-size: 14px; color: #333333; border-bottom: 1px solid #232323; margin: 0; font-family: Arial, Helvetica, sans-serif; text-shadow: 0 1px #232323; ">
                                        <div style="font-size: 14px; color: #dddddd;">
                                          Docker
                                        </div>
                                      </div>
                                      <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            image:
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;">
                                          </input>
                                      </div>
                                      <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                          <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                            port:
                                          </div>
                                          <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);">                                      </input>
                                      </div>
                                    </div>
  
                                    <div class="advanced-container" style="background-color: hsla(0,0%,51%,.04); border-bottom: 1px solid #252525; border-top: 1px solid #353535; padding: 0; overflow: hidden; margin-top: 10px;">
                                        <!-- background-color: #313131;-->
                                        <div style="padding: 8px 15px 8px 15px; font-size: 14px; color: #333333; border-bottom: 1px solid #232323; margin: 0; font-family: Arial, Helvetica, sans-serif; text-shadow: 0 1px #232323; ">
                                          <div style="font-size: 14px; color: #dddddd;">
                                            RaaS
                                          </div>
                                        </div>
                                        <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                            <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                              Github:
                                            </div>
                                            <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; outline: none;">
                                            </input>
                                        </div>
                                        <div style="height: 40px; position: relative; display: block; color: #ddd; text-shadow: 0 1px #232323">
                                            <div style="max-width: 296px; position: absolute; width: 296px; min-height: 13px; left: 10px; top: 10px; bottom: 10px; font-size: 12px; color: #999999;font-size:12px; text-overflow: ellipsis; font-family: Tahoma, Arial; overflow: hidden; padding: 2px; white-space: nowrap;">
                                              Server:
                                            </div>
                                            <input type="text" style="position: absolute; width: 400px; right: 10px; top: 10px; bottom: 10px; left: 110px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #cccccc; outline: none; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.8);">                                      </input>
                                        </div>
                                      </div>
                                  <!-- <div style="height: 40px;">
                                   <div style="max-width: 296; position: relative; width: 296; min-height: 13px; left: 10px; top: 10px; bottom: 10px;">
                                      <input type="checkbox" style="display: inline">
                                      Run on Docker
                                    </div>
                                    <input type="text" style="position: inherit; display: inline-block; width: 192px; right: 10px; bottom: 10px; top: 7px; left: 310px;
                                    font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #202020; outline: none">
                                    </input>
                                  </div>
                                  <div style="height: 40px;">
                                    <div style="max-width: 296; position: relative; width: 296; min-height: 13px; left: 10px; top: 10px; bottom: 10px;">
                                      <input type="checkbox" style="display: inline">
                                      Run on RaaS 
                                    </div>
                                    <input type="text" style="position: relative; width: 192px; right: 10px; bottom: 10px; top: 7px; left: 310px;
                                    font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-indent: 1.5px; color: #202020; outline: none">
                                    </input>
                                </div> -->
                                </details>
                              <!-- </div> -->
                              <div role="presentation" aria-hidden="true" class="invisible scrollbar horizontal fade" style="position: absolute; width: 1028px; height: 10px; left: 0px; bottom: 0px;">
                                <div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px; will-change: transform; width: 410px;"></div>
                              </div>
                              <div role="presentation" aria-hidden="true" class="invisible scrollbar vertical fade" style="position: absolute; width: 10px; height: 485px; right: 0px; top: 0px;">
                                <div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px; will-change: transform; height: 123px;"></div>
                              </div>
                              <div class="shadow"></div>
                              <div class="shadow"></div>
                              <div class="shadow top-left-corner"></div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script>
      $(document).ready(function () {
  
        var port = '8080/';
  
        if(location.port.length !== 0) {
          port = location.port;
        }
  
        var configClient = new ConfigClient(window.location.host, configId);
  
        configClient.store.onReload = config => {
          console.log('configuration loaded!!!!');
          config.options.forEach(option => {
            if (typeof option.value === 'boolean') {
              console.log('boolean option!!!!');
              console.log('name: ' + option.name);
              console.log('value: ' + option.value);
              if (option.value && !$(`#${option.name}`).hasClass('checked')) {
                console.log('adding checked class for ' + option.name)
                $(`#${option.name}`).addClass('checked');
              }
              else if (!option.value && $(`#${option.name}`).hasClass('checked')) {
                console.log('removeing checked class for ' + option.name);
                $(`#${option.name}`).removeClass('checked');
              }
            }
          });
        };
  
        $('.addButton').click(function(e) {
          var option = $(this).attr('option');
          
        });
  
        $('.booleanOption, .booleanOptionEnabled').hover(function () {
          $(this).toggleClass('over');
        });
  
        $('.booleanOption, .booleanOptionEnabled').click(function () {
          const id = $(this).attr('id');
          const enabled = $(this).hasClass('checked');
          $(this).toggleClass('checked');
          configClient.setOption(id, !enabled);
        });
      });
    </script>