Announcement

Collapse
No announcement yet.

Creating Forms in Bridge

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Creating Forms in Bridge

    Good Morning/Afternoon

    I am really interested in creating a standard UI library that matches System.Windows.Forms.

    Included in the creating System.Windows.Forms, Would be System.Drawing and System.Data

    The usual libraries for Small/Medium Business Applications

    I will be creating a Github Repository that will be open to anyone that wishes to develop on. (Email samuel@intelogy.com.au)

    I would really like anyone to join me in creating Forms.

    How I imagine the project working with Forms - Two projects - One Bridge and the Second one non Bridge (UI) - then use linked files in the bridge project.

    Github Repository: https://github.com/samuelGrahame/Forms





    Last edited by samuelgrahame; 2017-06-29 @ 11:59 PM.

  • #2
    I started this a little bit. Feel free to grab any of my code.

    I was doing it from the perspective of the forms running on the server and rendering on the client with Bridge.net and Qooxdoo.

    https://github.com/Terricide/ReVisio...ite_bridge.net

    Also take a look at WiseJ for a pretty cool WinForms on the web which is the reason why I haven't finished the project.

    Comment


    • #3
      That is really cool, What i was after was complete code running on the client (Browser) - having a server was optional - etc for data. Thank you I will have a look, I did start - https://github.com/samuelGrahame/ExpressCraft - Was targeted towards https://www.devexpress.com/

      I will have a look at wiseJ

      Comment


      • #4
        terricide hey i checked how wiseJ - I wouldn't worry about them, This is the html for a form with two tables and a splitter and a menu bar with 3 buttons - 10000 rows with 0 to 10k - only shows visible but still.

        HTML Code:
        <html style="overflow: hidden; margin: 0px; padding: 0px; height: 100%; width: 100%;">
           <head>
              <title>Hello World!</title>
              <meta charset="utf-8">
              <script src="wisej.wx"></script>
              <style type="text/css">
                 body {
                 font-family: Arial;
                 color: #3c3c3c;
                 }
                 li {
                 padding-top: 5px;
                 padding-bottom: 5px;
                 }
              </style>
              <link rel="stylesheet" type="text/css" href="resource.wx/wisej.css?v=1.3.74.0">
              <script type="text/javascript" src="resource.wx/Wisej.Web/qx.js?v=1.3.74.0"></script>
              <style type="text/css"></style>
              <style type="text/css"></style>
              <style type="text/css"></style>
              <script type="text/javascript" src="resource.wx/wisej.js?v=1.3.74.0"></script>
              <style type="text/css"></style>
              <style type="text/css"></style>
           </head>
           <body style="overflow: hidden; margin: 0px; padding: 0px; height: 100%; width: 100%;">
              <div style="width: 896px; padding:20px">
                 <h1>Hello World Starting Sample</h1>
                 <p>This small application is a small variation of the traditional Hello World! sample designed just to get you started with Wisej Web.</p>
                 <p>It's simple but it shows at least seven features:</p>
                 <ul>
                    <li>Content in the root html page; it's what you are reading now</li>
                    <li>Dynamic population of combobox items in&nbsp; the Load event</li>
                    <li>Controls anchoring: resize the window, the controls are actually not anchored and will always be centered in the window.</li>
                    <li>Non-modal AlertBox; also known as a "toast"</li>
                    <li>Seamless event routing: button1_Click</li>
                    <li>Modal workflow when closing the only window</li>
                    <li>Event handling through override: OnFormClosing</li>
                 </ul>
              </div>
              <!-- Visual Studio Browser Link -->
              <script type="application/json" id="__browserLink_initializationData">
                 {"appName":"Chrome","requestId":"a9d688e357fe479ea0ba481e03cb76fb"}
              </script>
              <script type="text/javascript" src="http://localhost:58527/0004f8c067a943bbb90c450f869c1392/browserLink" async="async"></script>
              <!-- End Browser Link -->
              <div tabindex="1" qxselectable="off" style="position: absolute; overflow: visible; touch-action: none; z-index: 10; box-sizing: border-box; outline: none; user-select: none; backface-visibility: hidden; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 1365px; height: 974px;">
                 <div qxselectable="off" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 100000000; position: absolute; user-select: none; cursor: default; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; color: rgb(63, 63, 63); left: -1000px; top: -1000px; width: 20px; height: 20px; -webkit-user-drag: none; background-position: 0px 0px; background-image: url(&quot;data:image/gif;base64,R0lGODlhFAAUAIEBAAAAAP///////////yH/C05FVFNDQVBFMi4wAwEBAAAh+QQBAAACACwAAAAAFAAUAAAIbwAFCBwoIIDBgwQTDjQIoKFDgwoXOpz4MGKAiQcvViSoEQDEhR0DSMSoMKRAjSYToiz4MOVIjytZNhTJcWZMmR5rwpypM+dJmzx70kTp8idQnjdfxixqdCPOjyeZdoTJ0GlPikEtTrUZUWVGmgkDAgA7&quot;); background-repeat: no-repeat;"></div>
                 <div qxselectable="off" name="frmMain" class="qx-window-active-maximized" style="overflow: hidden; touch-action: none; z-index: 100000; box-sizing: border-box; position: absolute; outline: none; user-select: none; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: default; left: 0px; top: 0px; width: 1365px; height: 974px;">
                    <div qxselectable="off" class="qx-window-captionbar-active" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: move; color: rgb(255, 255, 255); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; padding: 0px 0px 0px 10px; left: 0px; top: 0px; width: 1365px; height: 38px;">
                       <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: pointer; color: rgb(255, 255, 255); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 1259px; top: 0px; width: 32px; height: 38px; opacity: 0.7;" class="qx-window-minimize-button-hovered">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; left: 0px; top: 7px; width: 32px; height: 24px; -webkit-user-drag: none; background-position: center center; background-image: url(&quot;data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC40LCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCAyMTYgMTQ2IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMTYgMTQ2IiB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iY29sb3I6IHdoaXRlOyBmaWxsOiB3aGl0ZTsiPgo8cGF0aCBkPSJNMTYzLjA3Niw1OS42MzljLTEuNTIxLTEuNTIxLTMuMzY4LTIuMjgxLTUuNTQxLTIuMjgxSDU4LjQ2NGMtMi4xNzIsMC00LjAxOSwwLjc2LTUuNTQsMi4yODFzLTIuMjgxLDMuMzY3LTIuMjgxLDUuNTQgIHYxNS42NDRjMCwyLjE3MywwLjc2LDQuMDE5LDIuMjgxLDUuNTM5YzEuNTIxLDEuNTIxLDMuMzY4LDIuMjgxLDUuNTQsMi4yODFoOTkuMDcxYzIuMTczLDAsNC4wMi0wLjc2LDUuNTQxLTIuMjgxICBjMS41Mi0xLjUyLDIuMjgxLTMuMzY2LDIuMjgxLTUuNTM5VjY1LjE3OUMxNjUuMzU3LDYzLjAwNiwxNjQuNTk4LDYxLjE1OSwxNjMuMDc2LDU5LjYzOXoiLz4KPC9zdmc+&quot;); background-repeat: no-repeat;"></div>
                       </div>
                       <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: pointer; color: rgb(255, 255, 255); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 569px; top: 0px; width: 32px; height: 38px; display: none;" class="qx-window-maximize-button-hovered">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; left: 0px; top: 7px; width: 32px; height: 24px; -webkit-user-drag: none; background-position: center center; background-image: url(&quot;data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC40LCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCAyMTYgMTQ2IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMTYgMTQ2IiB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iY29sb3I6IHdoaXRlOyBmaWxsOiB3aGl0ZTsiPgo8cGF0aCBkPSJNMTYzLjA3Niw1OS42MzljLTEuNTIxLTEuNTIxLTMuMzY4LTIuMjgxLTUuNTQxLTIuMjgxaC0zMy44OTNWMjMuNDY0YzAtMi4xNzItMC43NjEtNC4wMTktMi4yODEtNS41NCAgYy0xLjUyMS0xLjUyLTMuMzY3LTIuMjgxLTUuNTQxLTIuMjgxaC0xNS42NDJjLTIuMTcyLDAtNC4wMTksMC43Ni01LjU0LDIuMjgxcy0yLjI4MSwzLjM2OC0yLjI4MSw1LjU0djMzLjg5NEg1OC40NjQgIGMtMi4xNzIsMC00LjAxOSwwLjc2LTUuNTQsMi4yODFzLTIuMjgxLDMuMzY3LTIuMjgxLDUuNTR2MTUuNjQ0YzAsMi4xNzMsMC43Niw0LjAxOSwyLjI4MSw1LjUzOSAgYzEuNTIxLDEuNTIxLDMuMzY4LDIuMjgxLDUuNTQsMi4yODFoMzMuODkzdjMzLjg5NWMwLDIuMTcyLDAuNzYsNC4wMiwyLjI4MSw1LjU0czMuMzY4LDIuMjgsNS41NCwyLjI4aDE1LjY0MyAgYzIuMTc0LDAsNC4wMi0wLjc2LDUuNTQxLTIuMjhjMS41MjEtMS41MjEsMi4yODEtMy4zNjgsMi4yODEtNS41NFY4OC42NDNoMzMuODkzYzIuMTczLDAsNC4wMi0wLjc2LDUuNTQxLTIuMjgxICBjMS41Mi0xLjUyLDIuMjgxLTMuMzY2LDIuMjgxLTUuNTM5VjY1LjE3OUMxNjUuMzU3LDYzLjAwNiwxNjQuNTk4LDYxLjE1OSwxNjMuMDc2LDU5LjYzOXoiLz4KPC9zdmc+&quot;); background-repeat: no-repeat;"></div>
                       </div>
                       <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: pointer; color: rgb(255, 255, 255); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; opacity: 0.7; left: 1333px; top: 0px; width: 32px; height: 38px;">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; left: 0px; top: 7px; width: 32px; height: 24px; -webkit-user-drag: none; background-position: center center; background-image: url(&quot;data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC40LCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCAyMTYgMTQ2IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMTYgMTQ2IiB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iY29sb3I6IHdoaXRlOyBmaWxsOiB3aGl0ZTsiPgo8cGF0aCBkPSJNMTYyLjE4LDQxLjU5MmMtNS41OTUtOS41ODYtMTMuMTg1LTE3LjE3Ni0yMi43NzEtMjIuNzcxYy05LjU4OC01LjU5NS0yMC4wNTUtOC4zOTItMzEuNDA4LTguMzkyICBjLTExLjM1MiwwLTIxLjgyMiwyLjc5Ny0zMS40MDgsOC4zOTJjLTkuNTg3LDUuNTk0LTE3LjE3NywxMy4xODQtMjIuNzcyLDIyLjc3MUM0OC4yMjUsNTEuMTc5LDQ1LjQyOCw2MS42NDksNDUuNDI4LDczICBjMCwxMS4zNTIsMi43OTgsMjEuODIsOC4zOTIsMzEuNDA4YzUuNTk1LDkuNTg1LDEzLjE4NSwxNy4xNzYsMjIuNzcyLDIyLjc3MWM5LjU4Nyw1LjU5NSwyMC4wNTYsOC4zOTIsMzEuNDA4LDguMzkyICBjMTEuMzUyLDAsMjEuODIyLTIuNzk3LDMxLjQwOC04LjM5MmM5LjU4Ni01LjU5NCwxNy4xNzYtMTMuMTg1LDIyLjc3MS0yMi43NzFjNS41OTQtOS41ODcsOC4zOTEtMjAuMDU3LDguMzkxLTMxLjQwOCAgQzE3MC41Nyw2MS42NDgsMTY3Ljc3Myw1MS4xNzgsMTYyLjE4LDQxLjU5MnogTTEzNy40OTMsODcuNzQ2YzEuMDMyLDEuMDMxLDEuNTQ5LDIuMjU1LDEuNTQ5LDMuNjY3ICBjMCwxLjQ2Ni0wLjUxNywyLjcxNi0xLjU0OSwzLjc0N2wtNy4zMzIsNy4zMzNjLTEuMDMyLDEuMDMyLTIuMjgxLDEuNTQ4LTMuNzQ4LDEuNTQ4Yy0xLjQxMiwwLTIuNjM2LTAuNTE2LTMuNjY2LTEuNTQ4TDEwOCw4Ny43NDYgIGwtMTQuNzQ3LDE0Ljc0N2MtMS4wMzIsMS4wMzItMi4yNTQsMS41NDgtMy42NjYsMS41NDhjLTEuNDY3LDAtMi43MTYtMC41MTYtMy43NDgtMS41NDhsLTcuMzMzLTcuMzMzICBjLTEuMDMyLTEuMDMxLTEuNTQ4LTIuMjgxLTEuNTQ4LTMuNzQ3YzAtMS40MTIsMC41MTYtMi42MzYsMS41NDgtMy42NjdMOTMuMjUzLDczTDc4LjUwNiw1OC4yNTMgIGMtMS4wMzItMS4wMzEtMS41NDgtMi4yNTQtMS41NDgtMy42NjZjMC0xLjQ2NywwLjUxNi0yLjcxNiwxLjU0OC0zLjc0OGw3LjMzMy03LjMzMmMxLjAzMi0xLjAzMiwyLjI4MS0xLjU0OCwzLjc0OC0xLjU0OCAgYzEuNDEyLDAsMi42MzQsMC41MTYsMy42NjYsMS41NDhMMTA4LDU4LjI1M2wxNC43NDctMTQuNzQ2YzEuMDMtMS4wMzIsMi4yNTQtMS41NDgsMy42NjYtMS41NDhjMS40NjcsMCwyLjcxNiwwLjUxNiwzLjc0OCwxLjU0OCAgbDcuMzMyLDcuMzMyYzEuMDMyLDEuMDMyLDEuNTQ5LDIuMjgxLDEuNTQ5LDMuNzQ4YzAsMS40MTItMC41MTcsMi42MzUtMS41NDksMy42NjZMMTIyLjc0Nyw3M0wxMzcuNDkzLDg3Ljc0NnoiLz4KPC9zdmc+&quot;); background-repeat: no-repeat;"></div>
                       </div>
                       <div qxselectable="off" class="qx-window-title-active" style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; cursor: move; user-select: none; color: rgb(255, 255, 255); font-family: helvetica, arial, verdana, sans-serif; font-size: 16px; font-weight: normal; text-align: left; left: 10px; top: 10px; width: 517px; height: 18px; display: none;"></div>
                       <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; color: rgb(255, 255, 255); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; opacity: 0.7; left: 1296px; top: 0px; width: 32px; height: 38px;">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; left: 0px; top: 7px; width: 32px; height: 24px; -webkit-user-drag: none; background-position: center center; background-image: url(&quot;data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC40LCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCAyMTYgMTQ2IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMTYgMTQ2IiB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iY29sb3I6IHdoaXRlOyBmaWxsOiB3aGl0ZTsiPgo8Zz4KCTxwYXRoIGQ9Ik0xNjkuNTE0LDIzLjQ2NGMwLTAuNzA2LTAuMjcyLTEuMzMtMC44MTYtMS44NzRsLTkuMjg4LTkuMjg4Yy0wLjU0My0wLjU0NC0xLjE2Ny0wLjgxNS0xLjg3My0wLjgxNSAgIGMtMC43MDcsMC0xLjMzMSwwLjI3Mi0xLjg3NCwwLjgxNWwtMjcuMDUxLDI3LjA0OWwtMTEuNzMtMTEuNzMyYy0xLjAzMS0xLjAzMi0yLjI1NS0xLjU0OC0zLjY2Ny0xLjU0OHMtMi42MzQsMC41MTYtMy42NjYsMS41NDggICBjLTEuMDMyLDEuMDMyLTEuNTQ4LDIuMjU0LTEuNTQ4LDMuNjY2djM2LjVjMCwxLjQxMywwLjUxNiwyLjYzNSwxLjU0OCwzLjY2N2MxLjAzMiwxLjAzMiwyLjI1NCwxLjU0OCwzLjY2NiwxLjU0OGgzNi41ICAgYzEuNDEyLDAsMi42MzYtMC41MTYsMy42NjctMS41NDhjMS4wMzItMS4wMzIsMS41NDktMi4yNTQsMS41NDktMy42NjdjMC0xLjQxMi0wLjUxNy0yLjYzNC0xLjU0OS0zLjY2NmwtMTEuNzMyLTExLjczMiAgIGwyNy4wNTEtMjcuMDQ5QzE2OS4yNDIsMjQuNzk1LDE2OS41MTQsMjQuMTcsMTY5LjUxNCwyMy40NjR6Ii8+Cgk8cGF0aCBkPSJNMTAyLjc4Niw3My4wMDFoLTM2LjVjLTEuNDEyLDAtMi42MzQsMC41MTYtMy42NjYsMS41NDljLTEuMDMyLDEuMDMxLTEuNTQ4LDIuMjU0LTEuNTQ4LDMuNjY2czAuNTE2LDIuNjM0LDEuNTQ4LDMuNjY2ICAgbDExLjczMiwxMS43MzFsLTI3LjA0OSwyNy4wNWMtMC41NDQsMC41NDMtMC44MTUsMS4xNjgtMC44MTUsMS44NzNjMCwwLjcwNywwLjI3MSwxLjMzMiwwLjgxNSwxLjg3NWw5LjI4Nyw5LjI4NiAgIGMwLjU0NCwwLjU0MywxLjE2OCwwLjgxNCwxLjg3NCwwLjgxNHMxLjMzMS0wLjI3MSwxLjg3NC0wLjgxNGwyNy4wNDktMjcuMDQ5bDExLjczMiwxMS43MzJjMS4wMzIsMS4wMzEsMi4yNTQsMS41NDgsMy42NjYsMS41NDggICBjMS40MTMsMCwyLjYzNS0wLjUxNywzLjY2Ny0xLjU0OGMxLjAzMi0xLjAzMSwxLjU0OC0yLjI1NCwxLjU0OC0zLjY2NnYtMzYuNWMwLTEuNDEyLTAuNTE2LTIuNjM1LTEuNTQ3LTMuNjY1ICAgQzEwNS40MjEsNzMuNTE3LDEwNC4xOTksNzMuMDAxLDEwMi43ODYsNzMuMDAxeiIvPgo8L2c+Cjwvc3ZnPg==&quot;); background-repeat: no-repeat;"></div>
                       </div>
                    </div>
                    <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: white; left: 0px; top: 66px; width: 1365px; height: 908px;">
                       <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 1365px; height: 908px;">
                          <div qxselectable="off" class="qx-widget" style="overflow: visible; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; padding: 0px; left: 0px; top: 0px; width: 1365px; height: 908px;">
                             <div qxselectable="off" name="splitContainer1" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: default; left: 0px; top: 0px; width: 1365px; height: 908px;">
                                <div qxselectable="off" class="qx-splitpane-splitter-horizontal" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 451px; top: 0px; width: 6px; height: 908px;">
                                   <div qxselectable="off" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 3px; top: 454px; width: 0px; height: 0px;"></div>
                                </div>
                                <div style="position: absolute; z-index: 11; height: 100%; cursor: col-resize; width: 18px; left: 445px;"></div>
                                <div qxselectable="off" name="Panel1" class="qx-panel-borderNone" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; background-color: white; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 451px; height: 908px;">
                                   <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 451px; height: 908px;">
                                      <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 451px; height: 908px;">
                                         <div qxselectable="off" class="qx-widget" style="overflow: visible; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; padding: 0px; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 451px; height: 908px;">
                                            <div qxselectable="off" tabindex="1" name="dataGridView1" class="qx-table" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; padding: 0px; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: white; left: 0px; top: 0px; width: 451px; height: 908px;">
                                               <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 449px; height: 906px;">
                                                  <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 906px;">
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 32px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 32px;">
                                                           <div qxselectable="off" class="qx-table-scroller-header" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: rgb(51, 122, 183); padding-right: 16px; left: 0px; top: 0px; width: 56px; height: 32px;">
                                                              <div qxselectable="off" class="qx-table-header-cell" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 31px;"></div>
                                                           </div>
                                                        </div>
                                                     </div>
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 32px; width: 40px; height: 874px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 874px;">
                                                           <div style="width: 100%;overflow: hidden;">
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:39">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:38">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:37">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:36">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:35">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:34">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:33">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:32">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:31">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:30">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:29">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:28">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:27">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:26">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:25">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:24">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:23">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:22">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:21">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:20">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:19">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:18">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:17">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:16">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:15">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:14">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:13">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-even-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:12">
                                                                 <div role="cell" class="qx-cell qx-table-row-header-odd-borderBoth" style="left:0px;width:40px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle"></div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                           </div>
                                                        </div>
                                                     </div>
                                                  </div>
                                                  <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 40px; top: 0px; width: 409px; height: 906px;">
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 409px; height: 32px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 392px; height: 32px;">
                                                           <div qxselectable="off" class="qx-table-scroller-header" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: rgb(51, 122, 183); padding-right: 16px; left: 0px; top: 0px; width: 392px; height: 32px;">
                                                              <div qxselectable="off" class="qx-table-header-cell" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 100px; height: 31px;">
                                                                 <div qxselectable="off" qxanonymous="true" class="qx-textlabel" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; cursor: default; user-select: none; text-align: center; white-space: nowrap; text-overflow: ellipsis; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 5px; top: 5px; width: 89px; height: 21px; padding: 3px 0px 0px;">Number</div>
                                                              </div>
                                                           </div>
                                                        </div>
                                                        <div qxselectable="off" class="qx-table-column-button" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: pointer; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; padding-left: 0px; left: 392px; top: 0px; width: 17px; height: 32px;">
                                                           <div qxselectable="off" qxanonymous="true" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; left: 0px; top: 6px; width: 16px; height: 20px; -webkit-user-drag: none; background-position: center center; background-image: url(&quot;data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNzkyIDE3OTIiIHN0eWxlPSJjb2xvcjogd2hpdGU7IGZpbGw6IHdoaXRlOyI+PHBhdGggZD0iTTEwODggMTI0OHYxOTJxMCA0MC0yOCA2OHQtNjggMjhoLTE5MnEtNDAgMC02OC0yOHQtMjgtNjh2LTE5MnEwLTQwIDI4LTY4dDY4LTI4aDE5MnE0MCAwIDY4IDI4dDI4IDY4em0wLTUxMnYxOTJxMCA0MC0yOCA2OHQtNjggMjhoLTE5MnEtNDAgMC02OC0yOHQtMjgtNjh2LTE5MnEwLTQwIDI4LTY4dDY4LTI4aDE5MnE0MCAwIDY4IDI4dDI4IDY4em0wLTUxMnYxOTJxMCA0MC0yOCA2OHQtNjggMjhoLTE5MnEtNDAgMC02OC0yOHQtMjgtNjh2LTE5MnEwLTQwIDI4LTY4dDY4LTI4aDE5MnE0MCAwIDY4IDI4dDI4IDY4eiIvPjwvc3ZnPg==&quot;); background-repeat: no-repeat;"></div>
                                                        </div>
                                                     </div>
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 32px; width: 393px; height: 874px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 393px; height: 874px;">
                                                           <div style="width: 100%;overflow: hidden;">
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:39">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9962</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:38">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9963</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:37">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9964</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:36">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9965</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:35">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9966</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:34">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9967</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:33">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9968</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:32">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9969</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:31">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9970</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:30">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9971</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:29">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9972</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:28">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9973</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:27">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9974</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:26">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9975</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:25">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9976</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:24">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9977</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:23">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9978</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:22">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9979</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:21">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9980</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:20">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9981</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:19">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9982</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:18">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9983</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:17">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9984</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:16">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9985</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:15">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9986</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:14">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9987</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-even-borderBoth" style="height:32px;z-index:13">
                                                                 <div role="cell" class="qx-cell qx-table-cell-even-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9988</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                              <div role="row" class="qx-row qx-table-row-odd-borderBoth" style="height:32px;z-index:12">
                                                                 <div role="cell" class="qx-cell qx-table-cell-odd-borderBoth" style="left:0px;width:100px;z-index:10000">
                                                                    <div role="content" class="qx-table-cell-content" style="">
                                                                       <div class="qx-table-cell-content-middle">9989</div>
                                                                    </div>
                                                                 </div>
                                                              </div>
                                                           </div>
                                                        </div>
                                                        <div qxselectable="off" qxkeepactive="on" class="qx-table-scroller-focus-indicator" style="overflow: hidden; touch-action: none; z-index: 1000; box-sizing: border-box; position: absolute; user-select: none; pointer-events: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: -91296px; width: 100px; height: 31px; display: none;"></div>
                                                     </div>
                                                     <div qxselectable="off" qxkeepfocus="on" qxkeepactive="on" class="qx-scrollbar" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 393px; top: 32px; width: 16px; height: 874px;">
                                                        <div qxselectable="off" class="qx-scrollbar-button-begin" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; opacity: 0.4; left: 0px; top: 0px; width: 16px; height: 16px;"></div>
                                                        <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 16px; width: 16px; height: 842px;">
                                                           <div qxselectable="off" class="qx-scrollbar-slider-knob-vertical" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: pointer; left: 1px; top: 831px; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; width: 14px; height: 10px;"></div>
                                                        </div>
                                                        <div qxselectable="off" class="qx-scrollbar-button-end" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; opacity: 0.4; left: 0px; top: 858px; width: 16px; height: 16px;"></div>
                                                     </div>
                                                  </div>
                                               </div>
                                               <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 906px; width: 449px; height: 0px;"></div>
                                               <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 1000; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: rgba(189, 191, 191, 0.64); left: 0px; top: 448px; width: 635px; height: 3px; display: none;"></div>
                                            </div>
                                         </div>
                                      </div>
                                   </div>
                                </div>
                                <div qxselectable="off" name="Panel2" class="qx-panel-borderNone" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; background-color: white; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 457px; top: 0px; width: 908px; height: 908px;">
                                   <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 908px; height: 908px;">
                                      <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 908px; height: 908px;">
                                         <div qxselectable="off" class="qx-widget" style="overflow: visible; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; padding: 0px; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 908px; height: 908px;">
                                            <div qxselectable="off" tabindex="2" name="dataGridView2" class="qx-table" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; padding: 0px; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: white; left: 0px; top: 0px; width: 908px; height: 908px;">
                                               <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 906px; height: 906px;">
                                                  <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 906px;">
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 32px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 32px;">
                                                           <div qxselectable="off" class="qx-table-scroller-header" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: rgb(51, 122, 183); padding-right: 16px; left: 0px; top: 0px; width: 56px; height: 32px;">
                                                              <div qxselectable="off" class="qx-table-header-cell" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 31px;"></div>
                                                           </div>
                                                        </div>
                                                     </div>
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 32px; width: 40px; height: 874px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 40px; height: 874px;"></div>
                                                     </div>
                                                  </div>
                                                  <div qxselectable="off" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 40px; top: 0px; width: 866px; height: 906px;">
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 866px; height: 32px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 849px; height: 32px;">
                                                           <div qxselectable="off" class="qx-table-scroller-header" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; background-color: rgb(51, 122, 183); padding-right: 16px; left: 0px; top: 0px; width: 849px; height: 32px;"></div>
                                                        </div>
                                                        <div qxselectable="off" class="qx-table-column-button" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; outline: none; user-select: none; cursor: pointer; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; padding-left: 0px; left: 849px; top: 0px; width: 17px; height: 32px;">
                                                           <div qxselectable="off" qxanonymous="true" style="overflow: hidden; box-sizing: border-box; touch-action: none; z-index: 10; position: absolute; user-select: none; color: white; font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; cursor: pointer; left: 0px; top: 6px; width: 16px; height: 20px; -webkit-user-drag: none; background-position: center center; background-image: url(&quot;data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNzkyIDE3OTIiIHN0eWxlPSJjb2xvcjogd2hpdGU7IGZpbGw6IHdoaXRlOyI+PHBhdGggZD0iTTEwODggMTI0OHYxOTJxMCA0MC0yOCA2OHQtNjggMjhoLTE5MnEtNDAgMC02OC0yOHQtMjgtNjh2LTE5MnEwLTQwIDI4LTY4dDY4LTI4aDE5MnE0MCAwIDY4IDI4dDI4IDY4em0wLTUxMnYxOTJxMCA0MC0yOCA2OHQtNjggMjhoLTE5MnEtNDAgMC02OC0yOHQtMjgtNjh2LTE5MnEwLTQwIDI4LTY4dDY4LTI4aDE5MnE0MCAwIDY4IDI4dDI4IDY4em0wLTUxMnYxOTJxMCA0MC0yOCA2OHQtNjggMjhoLTE5MnEtNDAgMC02OC0yOHQtMjgtNjh2LTE5MnEwLTQwIDI4LTY4dDY4LTI4aDE5MnE0MCAwIDY4IDI4dDI4IDY4eiIvPjwvc3ZnPg==&quot;); background-repeat: no-repeat;"></div>
                                                        </div>
                                                     </div>
                                                     <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 32px; width: 866px; height: 874px;">
                                                        <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 0px; width: 866px; height: 874px;"></div>
                                                     </div>
                                                  </div>
                                               </div>
                                               <div qxselectable="off" class="qx-widget" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; color: rgb(63, 63, 63); font-family: helvetica, arial, verdana, sans-serif; font-size: 13px; left: 0px; top: 906px; width: 906px; height: 0px;"></div>
                                            </div>
                                         </div>
                                      </div>
                                   </div>
                                </div>
                             </div>
                          </div>
                       </div>
                    </div>
                    <div qxselectable="off" class="qx-mainmenu-menubar" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; color: rgb(43, 43, 43); font-family: arial, verdana, sans-serif; font-size: 13px; cursor: default; background-color: rgb(239, 239, 239); left: 0px; top: 38px; width: 1365px; height: 28px;">
                       <div qxselectable="off" class="qx-menubar-item" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; font-family: arial, verdana, sans-serif; font-size: 13px; padding: 0px 12px; left: 0px; top: 0px; width: 46px; height: 27px;">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; cursor: default; user-select: none; font-family: arial, verdana, sans-serif; font-size: 13px; left: 12px; top: 6px; width: 22px; height: 15px;">File</div>
                       </div>
                       <div qxselectable="off" class="qx-menubar-item" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; font-family: arial, verdana, sans-serif; font-size: 13px; padding: 0px 12px; left: 46px; top: 0px; width: 47px; height: 27px;">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; cursor: default; user-select: none; font-family: arial, verdana, sans-serif; font-size: 13px; left: 12px; top: 6px; width: 23px; height: 15px;">Edit</div>
                       </div>
                       <div qxselectable="off" class="qx-menubar-item" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; user-select: none; cursor: default; font-family: arial, verdana, sans-serif; font-size: 13px; padding: 0px 12px; left: 93px; top: 0px; width: 58px; height: 27px;">
                          <div qxselectable="off" qxanonymous="true" style="overflow: hidden; touch-action: none; z-index: 10; box-sizing: border-box; position: absolute; cursor: default; user-select: none; font-family: arial, verdana, sans-serif; font-size: 13px; left: 12px; top: 6px; width: 34px; height: 15px;">Close</div>
                       </div>
                    </div>
                 </div>
              </div>
              <div style="height: auto; width: 22px; top: -1000px; left: -1000px; visibility: hidden; position: absolute; overflow: visible; display: block; white-space: normal; font-family: arial, verdana, sans-serif; font-size: 13px;">File</div>
              <div style="height: auto; width: auto; top: -1000px; left: -1000px; visibility: hidden; position: absolute; overflow: visible; display: block; white-space: nowrap; font-family: helvetica, arial, verdana, sans-serif; font-size: 16px; font-weight: normal;">A</div>
           </body>
        </html>
        Also when installing wisej - i had to manually add all controls via browser. there seems to be out of the box glitches - two solution's share the same app id. - from there demos. my hello world got taken over by the desktop demo
        Last edited by samuelgrahame; 2017-06-30 @ 05:10 AM.

        Comment


        • #5
          samuelgrahame Hi, wisej doesn't generate any html, the actual page source is about 20 lines. Everything is rendered directly into the DOM using a fast dom technique where all changes are cached and flushed at once. For example, you change the size of an element 100 times using javascript, the dom is uodated 100 times, with reflows etc. with wisej (or other fastdom libraries) only the last change is applied to the dom.

          In regards to the html you see when using dev tools under elements, it's the serialization of the dom. It's not the HTML that we generate.

          if you want to see what wisej generates look at the network tab, you'll find an app.wx request. Look at the content or the websocket frames. All we send to the browser are json differential packets containing the definition of the wisgets {className, height, width}...

          Also, we are going to release a free extension with source code that integrates Bridge.NET with Wisej components. Developers will be able to bind to client side events and execute C# code on the client.

          Best,
          Luca

          Comment


          • #6
            Hey, Which library do you use for rendering the html.. when you have the free extension-source code - would you have a github rep :)

            Comment


            • #7
              "For example, you change the size of an element 100 times using javascript, the dom is uodated 100 times, with reflows etc. with wisej (or other fastdom libraries) only the last change is applied to the dom."

              Yeah this is good for mobiles etc, To be honest I like smooth resize events.

              (Forms/Windows should not resize like they did in 1990's) - also when maximizing a form - it should allow you to move the form/window via a drag - which snaps it back into normal view.



              Comment


              • #8
                fastdom or shadowdom like techniques don't reduce the "smoothness", they enhance it. When you change the dom in a rapid sequence you see only the result, but the multiple changes may make your browser be sluggish.

                That's why flushing changes in an animation frame (or asynchronously) improves the browser performance.

                Comment


                • #9
                  I am more talking about, your windows/forms - delayed resizing.

                  Comment


                  • #10
                    That's a setting. Can be live or framed.

                    Comment


                    • #11
                      itg just wondering if you would like to create your extension for bridge public, that way people who are interested in creating a win forms library can do so from your base (etc)

                      I am sorry if i offended your product WiseJs - I just didn't want terricide to give up on his project.

                      I noticed you guys do not have a ribbon control - if there is anyway i can help :)

                      I have created a ribbon control - but the style is more office 2016 colorful - based on DevExpress' RibbonControl:

                      Example below - which is using bridge

                      Click image for larger version

Name:	bmL.png
Views:	1
Size:	32.8 KB
ID:	4554

                      Comment


                      • #12
                        No worries! No offense taken at all. The Wisej extension to use Bridge.NET will be an open source project like all our extensions, you can find the projects with source code at wisej.com/extensions.

                        The RibbonBar is a work in progress. While we can easily integrate most (or any) third party javascript widgets of any complexity (DevExpress, Telerik, Syncfusion, etc.) the built-in widgets/controls need more care/work to integrate events, properties, localized descriptions, design time editors, collection editors, etc. However, also the RibbonBar control will be available with the source code.

                        Comment


                        • #13
                          Thank you :)

                          Comment

                          Working...
                          X