Changeset 8 for src/main/webapp


Ignore:
Timestamp:
01/28/20 10:20:01 (5 years ago)
Author:
bart
Message:

Update 28 jan 2020

Location:
src/main/webapp
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • src/main/webapp/newsession.xhtml

    r7 r8  
    1313
    1414        <br /> Protocol:
    15         <select>
    16                 <option value="SAOP">SAOP</option>
     15        <select id="selectedprotocol" onchange="selectProtocol()">
     16                <option value="SAOP">SAOP (stacked alternating offers)</option>
     17                <option value="SHAOP">SHAOP (stacked human alternating
     18                        offers)</option>
    1719        </select>
    1820
    … …  
    2123                max="10000" value="10" />
    2224        <select id="deadlinetype">
     25                <option value="ROUNDS">rounds</option>
    2326                <option value="TIME">seconds</option>
    24                 <option value="ROUNDS">rounds</option>
    2527        </select>
    2628
    … …  
    4345                        value="localhost:8080/partiesserver-1.1.0"
    4446                        pattern=".*:[0-9]+/partiesserver" size="30"
    45                         onchange="connectParties()"> </input> <br /> <br /> <b>Edit
    46                         next party</b> <br /> Party: <select id="partyselection">
    47                 </select> <br /> Profile: <select id="profileselection">
    48                 </select> <br /> Parameters: { <input type="text" id="parameters"
    49                         onchange="updateParameters()" value="" maxlength="100" /> }  <br /> <br />
     47                        onchange="connectParties()"> </input> <br /> <br /> <b>Party
     48                        settings</b> <br /> Party : <select id="partyselection">
     49                </select> <br /> Profile: <select id="profileselection"></select> Filter: <input
     50                        type="text" id="filter" value="" maxlength="40" /> <br />
     51                Parameters: { <input type="text" id="parameters"
     52                        onchange="updateParameters()" value="" maxlength="100" /> } <br />
     53                <br />
     54
     55                <div id="cobsetting">
     56                        <input type="checkbox" id="advancedCobSettings" onchange="advancedCobSet()" ></input>
     57                        Advanced COB settings<br/>
     58                        <div id="advancedsettings" style="display:none">
     59                                <b>COB party settings</b> <br /> Party : <select
     60                                        id="cobpartyselection">
     61                                </select> <br /> Profile: <select id="cobprofileselection"></select>
     62                                Filter: <input type="text" id="cobfilter" value=""
     63                                        maxlength="40" /> <br /> Parameters: { <input
     64                                        type="text" id="cobparameters" onchange="updateCobParameters()"
     65                                        value="" maxlength="100" /> } <br /> <br />
     66                        </div>
     67                </div>
    5068
    5169                <button onclick="addParty()">Add</button>
    … …  
    5371
    5472                <br /> <br /> <b>Selected Profiles, Parties for the session</b>
    55                 <table>
     73                <table id="selectedpartiestable" width="100%">
     74                        <colgroup>
     75                                <col />
     76                                <col />
     77                                <col />
     78                                <col />
     79                                <col />
     80                                <col />
     81                        </colgroup>
    5682                        <thead>
    57                                 <th align="left" width='40%'>Party</th>
    58                                 <th align="left" width='20%'>Parameters</th>
    59                                 <th align="left" width='40%'>Profile</th>
     83                                <tr>
     84                                        <th align="center">Party</th>
     85                                        <th align="center">Parameters</th>
     86                                        <th align="center">Profile</th>
     87
     88                                        <th align="center">COB Party</th>
     89                                        <th align="center">COB Parameters</th>
     90                                        <th align="center">COB Profile</th>
     91                                </tr>
    6092                        </thead>
    6193                        <tbody id="partiesList">
    62                                 <tr id="partiesList">
    63                                 </tr>
    64 
    6594                        </tbody>
    6695                </table>
    … …  
    84113
    85114<script type="application/javascript">
     115       
     116       
     117       
    86118       
    87119       
    … …  
    114146                */
    115147        var partyprofiles=[];
     148       
     149        var cobpartyprofiles=[];
    116150
    117151        /** from http://fitzgeraldnick.com/2010/08/10/settimeout-patterns.html */
    118152   
     153        function getAdvancedCobSettings() {
     154                return document.getElementById('advancedCobSettings').checked;
     155        }
     156       
     157        function advancedCobSet() {
     158            document.getElementById('advancedsettings').style.display=(getAdvancedCobSettings()?'':'none');
     159        }
     160       
    119161    function async (fn) {
    120162        setTimeout(fn, 1000);
    … …  
    131173    }
    132174
    133        
     175    /**
     176    Called when user changes the protocol */
     177    function selectProtocol() {
     178        var visible=getSelectedProtocol() == "SHAOP";
     179               
     180        document.getElementById("cobsetting").style.display=(visible ? 'block': 'none');
     181            var tbl = document.getElementById('selectedpartiestable');
     182            tbl.getElementsByTagName('col')[3].style.visibility=(visible?'':'collapse');
     183            tbl.getElementsByTagName('col')[4].style.visibility=(visible?'':'collapse');
     184            tbl.getElementsByTagName('col')[5].style.visibility=(visible?'':'collapse');
     185               
     186    }   
    134187       
    135188        /**
    … …  
    228281         */
    229282        function updateParties(parties) {
    230                 var combobox = document.getElementById("partyselection");
     283                 updatePartiesCombobox(parties, document.getElementById("partyselection"),['SAOP','SHAOP']);
     284                 updatePartiesCombobox(parties, document.getElementById("cobpartyselection"),['COB']);
     285        }
     286   
     287    /**
     288    @param parties a list of parties r(as received from the server)
     289    @param combobox a combobox element to put the party URLs in
     290    @param behaviours a list of behaviours for the parties. Only these are put in the combobox.
     291    */
     292    function updatePartiesCombobox(parties, combobox, behaviours) {
    231293                combobox.options.length=0;
    232         for (var party in parties) {
     294        for (var p in parties) {
     295                var party = parties[p];
     296                if (intersect(party.capabilities.behaviours, behaviours).length==0) 
     297                        continue;
    233298            var option = document.createElement('option');
    234             option.text = option.value = parties[party].uri;
     299            option.text = option.value = party.uri;
    235300            combobox.add(option, 0);
    236301        }
    237         }
    238    
     302
     303    }
     304
     305    /**
     306    @param a a list
     307    @param b another list
     308    @return intersection of a and b
     309    */
     310    function intersect(a, b) {
     311        var t;
     312        if (b.length > a.length) t = b, b = a, a = t; // indexOf to loop over shorter
     313        return a.filter(function (e) {
     314            return b.indexOf(e) > -1;
     315        });
     316    }
     317
    239318
    240319    /**
    … …  
    262341                var domain = domaincombobox.options[domaincombobox.selectedIndex].value;
    263342               
    264                 var profilecombo = document.getElementById("profileselection");
     343                updateProfileComboBox(document.getElementById("profileselection"), knowndomains[domain]);
     344                updateProfileComboBox(document.getElementById("cobprofileselection"), knowndomains[domain]);
     345        }
     346       
     347        function updateProfileComboBox(profilecombo, options) {
    265348                profilecombo.options.length=0;
    266                 for (var profile in knowndomains[domain]) {
     349                for (var profile in options) {
    267350            var option = document.createElement('option');
    268             option.text = option.value = knowndomains[domain][profile];
     351            option.text = option.value = options[profile];
    269352            profilecombo.add(option, 0);
    270353                }
     354
    271355        }
    272356       
    … …  
    275359        */
    276360        function addParty() {
     361                addNormalParty();
     362                addCobParty();
     363                updatePartyProfileTable(); // what, MVC?
     364        }
     365       
     366        function addNormalParty() {
    277367                var partycombo = document.getElementById("partyselection");
    278368                var profilecombo = document.getElementById("profileselection");
     369                var filteroptions = document.getElementById("filter").value;
    279370               
    280371                if (partycombo.options.length==0) {
    … …  
    286377                        return;
    287378                }
     379               
     380                if (filteroptions!="") {
     381                        filteroptions="?"+filteroptions;
     382                }
    288383                var newpartyprof = {};
    289                
    290                 newpartyprof["party"]={"partyref":partycombo.options[partycombo.selectedIndex].value,
     384                newpartyprof["party"]={"partyref":partycombo.options[partycombo.selectedIndex].value ,
    291385                                "parameters":parameters };
    292                 newpartyprof["profile"]=profilecombo.options[profilecombo.selectedIndex].value;
     386                newpartyprof["profile"]=profilecombo.options[profilecombo.selectedIndex].value +filteroptions;
    293387               
    294388                partyprofiles.push(newpartyprof)
    295                 updatePartyProfileTable(); // what, MVC?
    296         }
     389        }
     390       
     391       
     392        function addCobParty() {
     393                // we assume a sensible default has been loaded into the combo and set,
     394                // regardless it being invisible
     395                var partycombo = document.getElementById("cobpartyselection");
     396                if (partycombo.options.length==0) {
     397                        alert("Please set cpb partier server and select a party");
     398                        return;
     399                }
     400
     401                var newpartyprof = {};
     402                if (getAdvancedCobSettings()) {
     403                        var profilecombo = document.getElementById("cobprofileselection");
     404                        var filteroptions = document.getElementById("cobfilter").value;
     405
     406                        if (profilecombo.options.length==0) {
     407                                alert("Please set a cob profile");
     408                                return;
     409                        }
     410                        if (filteroptions!="") {
     411                                filteroptions="?"+filteroptions;
     412                        }
     413                        newpartyprof["party"]={"partyref":partycombo.options[partycombo.selectedIndex].value ,
     414                                        "parameters":parameters };
     415                        newpartyprof["profile"]=profilecombo.options[profilecombo.selectedIndex].value +filteroptions;
     416                } else {
     417                        var profilecombo = document.getElementById("profileselection");
     418                        newpartyprof["party"]={"partyref":partycombo.options[partycombo.selectedIndex].value ,
     419                                        "parameters":{} };
     420                        newpartyprof["profile"]=profilecombo.options[profilecombo.selectedIndex].value;
     421                }
     422                cobpartyprofiles.push(newpartyprof)
     423        }
     424
    297425       
    298426        /** updates the party and profiles table, to match the #partyprofiles list.             */
    … …  
    305433                        var cell2 = row.insertCell(-1);
    306434                        var cell3 = row.insertCell(-1);
     435                        var cell4 = row.insertCell(-1);
     436                        var cell5 = row.insertCell(-1);
     437                        var cell6 = row.insertCell(-1);
     438                       
    307439                        cell1.innerHTML = partyprofiles[pp]["party"]["partyref"];
    308440                        cell2.innerHTML = JSON.stringify(partyprofiles[pp]["party"]["parameters"]);
    309441                        cell3.innerHTML = partyprofiles[pp]["profile"];
     442                        cell4.innerHTML = cobpartyprofiles[pp]["party"]["partyref"];
     443                        cell5.innerHTML = JSON.stringify(cobpartyprofiles[pp]["party"]["parameters"]);
     444                        cell6.innerHTML = cobpartyprofiles[pp]["profile"];
    310445                }
    311446
    … …  
    372507        }
    373508       
     509        function getSelectedProtocol() {
     510                var protocolcombo = document.getElementById("selectedprotocol");
     511                return protocolcombo.options[protocolcombo.selectedIndex].value;
     512        }
    374513        /**
    375514        @return a json request package for the run server
    376515        */
    377516        function makeRequest() {
     517
     518                if (getSelectedProtocol()=="SHAOP") {
     519                        return makeShaopRequest();
     520                } else {
     521                        return makeSaopRequest();
     522                }
     523        }
     524       
     525        /**
     526        @return a SAOP request
     527        */
     528        function makeSaopRequest() {
    378529                var deadline={};
    379530                var value = document.getElementById("deadlinevalue").value;
    … …  
    386537                }
    387538               
    388                
    389539                return JSON.stringify({"SAOPSettings": { "participants": partyprofiles, "deadline":deadline }});
    390 
    391         }
    392        
     540        }
     541
     542        /**
     543        @return a SHAOP request
     544        */
     545        function makeShaopRequest() {
     546                var deadline={};
     547                var value = document.getElementById("deadlinevalue").value;
     548                var dtypecombo  = document.getElementById("deadlinetype");
     549                if (dtypecombo.options[dtypecombo.selectedIndex].value=="TIME") {
     550                        deadline["deadlinetime"] = { "durationms": 1000*value};
     551                } else {
     552                        // ROUNDS
     553                        deadline["deadlinerounds"] = {"rounds": value, "durationms":10000};
     554                }
     555               
     556                var parties=[];
     557                for (let i=0; i< partyprofiles.length; i++) {
     558                        var group={};
     559                        group['shaop'] = partyprofiles[i];
     560                        group['cob'] = cobpartyprofiles[i];
     561                       
     562                        parties.push(group);
     563                }
     564                return JSON.stringify({"SHAOPSettings": { "participants": parties, "deadline":deadline }});
     565        }
     566
    393567       
    394568        /**
    … …  
    396570        */
    397571        function init() {
     572                selectProtocol();
    398573                document.getElementById("partiesserverurl").value =window.location.hostname+":8080/partiesserver-1.1.0"
    399574                document.getElementById("profilesserverurl").value =window.location.hostname+":8080/profilesserver-1.1.0"
    … …  
    407582
    408583
     584
     585
     586
    409587</script>
    410588

  • src/main/webapp/newtournament.xhtml

    r7 r8  
    3030        <br />
    3131        <div id="box" class="box">
    32                 Session Protocol settings <br /> Session Protocol: <select>
     32                Session Protocol settings <br /> Session Protocol:
     33                <select id="protocolselection">
    3334                        <option value="SAOP">SAOP</option>
    34                 </select> <br /> Deadline: <input type="number" id="deadlinevalue"
     35                        <option value="SHAOP">SHAOP</option>
     36                </select>
     37               
     38                <br /> Deadline: <input type="number" id="deadlinevalue"
    3539                        name="deadline" min="1" max="10000" value="10" /> <select
    3640                        id="deadlinetype">
     41                        <option value="ROUNDS">rounds</option>
    3742                        <option value="TIME">seconds</option>
    38                         <option value="ROUNDS">rounds</option>
    3943                </select>
    4044        </div>
    … …  
    5256                Profile: <select id="profileselection">
    5357                        <!-- <option>Waiting for partiesserver</option> -->
    54                 </select> <br /> <br />
     58                </select>
     59                 Filter: <input type="text" id="filter" value="" maxlength="40" />
     60               
     61                <br /> <br />
    5562
    5663                <table id="profiles">
    … …  
    304311        function addProfile() {
    305312                var profilecombo = document.getElementById("profileselection");
    306                
     313
    307314                if (profilecombo.options.length==0) {
    308315                        alert("Please set domain/profile server and select a domain and a profile");
    309316                        return;
    310317                }
    311                 profiles.push(profilecombo.options[profilecombo.selectedIndex].value)
     318                var filteroptions = document.getElementById("filter").value;
     319                if (filteroptions!="") {
     320                        filteroptions="?"+filteroptions;
     321                }
     322
     323                profiles.push(profilecombo.options[profilecombo.selectedIndex].value + filteroptions)
    312324                updateProfileTable(); // what, MVC?
    313325        }
    … …  
    327339        /**
    328340        start the tournament as currently set on this page.
    329         We need to send a TournamentSettings object to the server, which typically looks like this
    330         but is protocol dependent (currently we do SAOP)
    331        
     341        We need to send a TournamentSettings object to the server, which typically looks like this with SAOP
     342        <code>
    332343        {"AllPermutationsSettings":{"parties":["party1","party2"],
    333344                "profiles":["profile1","profile2","profile3"],
    … …  
    335346                "partiesPerSession":2,
    336347                "sessionsettings":{"SAOPSettings":{"participants":[],"deadline":{"deadlinetime":{"durationms":10}}}}}}
    337        
     348        </code>
    338349        participants are already in the global partyprofiles dictionary
     350       
     351        With SHAOP, it looks like this
     352        <code>
     353        {
     354                "AllPermutationsSettings": {
     355                        "parties": [ { "partyref": "classpath:geniusweb.exampleparties.simpleshaop.ShaopParty", "parameters": { } },
     356                                { "partyref": "classpath:geniusweb.exampleparties.randomparty.RandomParty",     "parameters": { }}
     357                        ],
     358                        "reuseParties": false,
     359                        "profiles": [   "prof1?partial=10", "prof2?partial=15"],
     360                        "partiesPerSession": 2,
     361                        "sessionsettings": {    "SHAOPSettings": {
     362                                        "participants": [ ],
     363                                        "deadline": { "deadlinerounds": {       "rounds": 10, "durationms": 10000       } } } } } }
     364        </code>
    339365        */
    340366        function start() {
    … …  
    380406                        deadline["deadlinerounds"] = {"rounds": value, "durationms": 10000};
    381407                }
    382                
    383408                var reuseParties  = document.getElementById("reuseparties").checked;
    384                 var sessionSettings = {"SAOPSettings":{"participants":[],"deadline":deadline}};
     409               
     410                var protocolcombobox = document.getElementById("protocolselection");
     411                var protocol = protocolcombobox.options[protocolcombobox.selectedIndex].value;
     412                var header=protocol+"Settings";
     413       
     414                // create S(H)AOPSettings. [header] is a weird ECMA script workaround for javascript issue.
     415                var sessionSettings = { [header]:{"participants":[],"deadline":deadline}};
    385416                return JSON.stringify({"AllPermutationsSettings":{"parties":parties,"profiles":profiles,"reuseParties":reuseParties,"partiesPerSession":2,"sessionsettings":sessionSettings}});
    386417        }
    … …  
    390421        */
    391422        function init() {
    392                 document.getElementById("partiesserverurl").value =window.location.hostname+":8080/partiesserver-1.1.0"
    393                 document.getElementById("profilesserverurl").value =window.location.hostname+":8080/profilesserver-1.1.0"
     423                document.getElementById("partiesserverurl").value =window.location.hostname+":8080/partiesserver-1.1.0";
     424                document.getElementById("profilesserverurl").value =window.location.hostname+":8080/profilesserver-1.1.0";
    394425
    395426

  • src/main/webapp/style.css

    r1 r8  
    66table {
    77        border: 1px solid black;
    8         border-collapse: collapse;
    9         border: 1px solid black;
     8        #border-collapse: collapse;
    109}
    1110
Note: See TracChangeset for help on using the changeset viewer.