Difference between revisions of "MediaWiki:Calculator"

From Observer GigaFlow Support | VIAVI Solutions Inc.
Jump to: navigation, search
(Blanked the page)
 
Line 1: Line 1:
<style> /* <source lang="css"> */
 
#troop-background {
 
  position: absolute;
 
  top: 0px;
 
  left: 0px;
 
  width: 100%;
 
  height: 100%;
 
  background: rgba(0,0,0,0.4);
 
  z-index: 10;
 
  display: none;
 
}
 
  
#troop-background.window-visible {
 
  display: block;
 
}
 
 
#troop-select {
 
  position: fixed;
 
  width: 250px;
 
  height: 100px;
 
  top: 300px;
 
  left: 300px;
 
  background: #eee;
 
  -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
 
  -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
 
  box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
 
  -moz-border-radius: 5px;
 
  -webkit-border-radius: 5px;
 
  border-radius: 5px;
 
  padding: 10px;
 
}
 
 
#troop-filter-selector {
 
  width: 140px;
 
}
 
 
#troop-filter-type {
 
  width: 100px;
 
}
 
 
#troop-filter {
 
  width: 104px;
 
}
 
 
#troop-filter,
 
#troop-select-none,
 
#troop-select-all {
 
  background-image: none;
 
  background-color: #003378;
 
  background: -moz-linear-gradient(top, #0049AB 35%, #003378 65%);
 
  background: -webkit-linear-gradient(top, #0049AB 35%, #003378 65%);
 
  background: -o-linear-gradient(top, #0049AB 35%, #003378 65%);
 
  background: -ms-linear-gradient(top, #0049AB 35%, #003378 65%);
 
  background: linear-gradient(to bottom, #0049AB 35%, #003378 65%);
 
  border: 1px solid #003378;
 
}
 
 
#troop-filter:hover,
 
#troop-select-none:hover,
 
#troop-select-all:hover {
 
  background: -moz-linear-gradient(top, #003A89 35%, #002960 65%);
 
  background: -webkit-linear-gradient(top, #003A89 35%, #002960 65%);
 
  background: -o-linear-gradient(top, #003A89 35%, #002960 65%);
 
  background: -ms-linear-gradient(top, #003A89 35%, #002960 65%);
 
  background: linear-gradient(to bottom, #003A89 35%, #002960 65%);
 
}
 
 
#troop-filter:active,
 
#troop-select-none:active,
 
#troop-select-all:active {
 
  background: -moz-linear-gradient(top, #003378 35%, #0049AB 65%);
 
  background: -webkit-linear-gradient(top, #003378 35%, #0049AB 65%);
 
  background: -o-linear-gradient(top, #003378 35%, #0049AB 65%);
 
  background: -ms-linear-gradient(top, #003378 35%, #0049AB 65%);
 
  background: linear-gradient(to bottom, #003378 35%, #0049AB 65%);
 
}
 
 
#troop-select-none,
 
#troop-select-all {
 
  width: 100px;
 
}
 
 
#troop-filter-cancel,
 
#filter-reset {
 
  background-image: none;
 
  background-color: #8A1F1F;
 
  background: -moz-linear-gradient(top, #C22727 35%, #8A1F1F 65%);
 
  background: -webkit-linear-gradient(top, #C22727 35%, #8A1F1F 65%);
 
  background: -o-linear-gradient(top, #C22727 35%, #8A1F1F 65%);
 
  background: -ms-linear-gradient(top, #C22727 35%, #8A1F1F 65%);
 
  background: linear-gradient(to bottom, #C22727 35%, #8A1F1F 65%);
 
  border: 1px solid #8A1F1F;
 
}
 
 
#troop-filter-cancel:hover,
 
#filter-reset:hover {
 
  background: -moz-linear-gradient(top, #9B1F1F 35%, #6E1919 65%);
 
  background: -webkit-linear-gradient(top, #9B1F1F 35%, #6E1919 65%);
 
  background: -o-linear-gradient(top, #9B1F1F 35%, #6E1919 65%);
 
  background: -ms-linear-gradient(top, #9B1F1F 35%, #6E1919 65%);
 
  background: linear-gradient(to bottom, #9B1F1F 35%, #6E1919 65%);
 
}
 
 
#troop-filter-cancel:active,
 
#filter-reset:active {
 
  background: -moz-linear-gradient(top, #8A1F1F 35%, #C22727 65%);
 
  background: -webkit-linear-gradient(top, #8A1F1F 35%, #C22727 65%);
 
  background: -o-linear-gradient(top, #8A1F1F 35%, #C22727 65%);
 
  background: -ms-linear-gradient(top, #8A1F1F 35%, #C22727 65%);
 
  background: linear-gradient(to bottom, #8A1F1F 35%, #C22727 65%);
 
}
 
 
#troop-filter-execute,
 
#filter-execute {
 
  background-image: none;
 
  background-color: #337800;
 
  background: -moz-linear-gradient(top, #49AB00 35%, #337800 65%);
 
  background: -webkit-linear-gradient(top, #49AB00 35%, #337800 65%);
 
  background: -o-linear-gradient(top, #49AB00 35%, #337800 65%);
 
  background: -ms-linear-gradient(top, #49AB00 35%, #337800 65%);
 
  background: linear-gradient(to bottom, #49AB00 35%, #337800 65%);
 
  border: 1px solid #337800;
 
}
 
 
#troop-filter-execute:hover,
 
#filter-execute:hover {
 
  background: -moz-linear-gradient(top, #3A8900 35%, #296000 65%);
 
  background: -webkit-linear-gradient(top, #3A8900 35%, #296000 65%);
 
  background: -o-linear-gradient(top, #3A8900 35%, #296000 65%);
 
  background: -ms-linear-gradient(top, #3A8900 35%, #296000 65%);
 
  background: linear-gradient(to bottom, #3A8900 35%, #296000 65%);
 
}
 
 
#troop-filter-execute:active,
 
#filter-execute:active {
 
  background: -moz-linear-gradient(top, #337800 35%, #49AB00 65%);
 
  background: -webkit-linear-gradient(top, #337800 35%, #49AB00 65%);
 
  background: -o-linear-gradient(top, #337800 35%, #49AB00 65%);
 
  background: -ms-linear-gradient(top, #337800 35%, #49AB00 65%);
 
  background: linear-gradient(to bottom, #337800 35%, #49AB00 65%);
 
}
 
/* </source> */ </style>
 
 
<table style="text-align: center; border-collapse: collapse;">
 
  <tr>
 
      <td valign="bottom" rowspan="3"><b>Filters:</b></td>
 
      <td colspan="2"><u>Town Hall</u></td>
 
      <td colspan="2"><u>Trophies</u></td>
 
  </tr>
 
  <tr>
 
      <td>Min</td>
 
      <td>Max</td>
 
      <td>Min</td>
 
      <td>Max</td>
 
      <td style="text-align: left;">
 
        <button type="button" id="troop-filter" onclick="troopFilterInitiate()">Troop Filter</button>
 
        <span id="troop-filter-type-text" title="Will show all attack strategies that include at least one of the selected troop types." style="font-weight: bold;">Includes</span>
 
        <span id="troop-filter-text" style="font-weight: bold;">All</span></td>
 
  </tr>
 
  <tr>
 
      <td><input type="number" id="min-town-hall" value="1" style="text-align: right; width: 50px;"></input></td>
 
      <td><input type="number" id="max-town-hall" style="text-align: right; width: 50px;"></input></td>
 
      <td><input type="number" id="min-trophies" value="0" style="text-align: right; width: 50px;"></input></td>
 
      <td><input type="number" id="max-trophies" style="text-align: right; width: 50px;"></input></td>
 
      <td style="text-align: left;">
 
        <button type="button" id="filter-execute" onclick="attackStrategyFilter()" style="font-weight: bold;">Go!</button>&nbsp;
 
        <button type="button" id="filter-reset" onclick="attackStrategyReset()" style="font-weight: bold;">Reset</button>
 
      </td>
 
  </tr>
 
</table>
 
 
<div id="troop-background">
 
  <div id="troop-select">
 
      <table width="100%" style="text-align: center;">
 
        <tr>
 
            <td style="text-align: right;">
 
              <select id="troop-filter-selector" size="4" multiple="multiple">
 
                  <option selected value="Barbarian">Barbarian</option>
 
                  <option selected value="Archer">Archer</option>
 
                  <option selected value="Goblin">Goblin</option>
 
                  <option selected value="Giant">Giant</option>
 
                  <option selected value="Wall Breaker">Wall Breaker</option>
 
                  <option selected value="Balloon">Balloon</option>
 
                  <option selected value="Wizard">Wizard</option>
 
                  <option selected value="Healer">Healer</option>
 
                  <option selected value="Dragon">Dragon</option>
 
                  <option selected value="P.E.K.K.A">P.E.K.K.A</option>
 
                  <option selected value="Minion">Minion</option>
 
                  <option selected value="Hog Rider">Hog Rider</option>
 
                  <option selected value="Valkyrie">Valkyrie</option>
 
                  <option selected value="Golem">Golem</option>
 
                  <option selected value="Witch">Witch</option>
 
                  <option selected value="Lava Hound">Lava Hound</option>
 
              </select>
 
            </td>
 
            <td valign="top" style="text-align: left;">
 
              <button type="button" id="troop-select-all" onclick="troopSelectAll()">All</button>
 
              <br/>
 
              <button type="button" id="troop-select-none" onclick="troopSelectNone()">None</button>
 
              <br/>
 
              <select id="troop-filter-type">
 
                  <option selected value="Includes">Includes</option>
 
                  <option value="Excludes">Excludes</option>
 
                  <option value="Only">Only</option>
 
              </select>
 
            </td>
 
        </tr>
 
        <tr>
 
            <td colspan="2">
 
              <button type="button" id="troop-filter-cancel" onclick="troopFilterCancel()">Cancel</button>
 
              <span width="2px"></span>
 
              <button type="button" id="troop-filter-execute" onclick="troopFilterExecute()">OK</button>
 
            </td>
 
        </tr>
 
      </table>
 
  </div>
 
</div>
 
 
<script>
 
 
window.onload = function() {
 
  importArticle({ type: "script", article: "MediaWiki:Common.js/AttackStrategies.js" });
 
};
 
</script>
 

Latest revision as of 11:11, 15 November 2018