Difference between revisions of "MediaWiki:Calculator"

From Observer GigaFlow Support | VIAVI Solutions Inc.
Jump to: navigation, search
(Created page with "<style> - <source lang="css">: #troop-background { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-i...")
 
Line 220: Line 220:
  
 
window.onload = function() {
 
window.onload = function() {
   importArticle({ type: "script", article: "MediaWiki:Common.js/AttackStrategies.js" });
+
   importArticle({ type: "script", article: "MediaWiki:Common.js" });
 
};
 
};
 
</script>
 
</script>

Revision as of 11:07, 15 November 2018

<style> /* <source lang="css"> */

  1. troop-background {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  z-index: 10;
  display: none;

}

  1. troop-background.window-visible {
  display: block;

}

  1. 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;

}

  1. troop-filter-selector {
  width: 140px;

}

  1. troop-filter-type {
  width: 100px;

}

  1. troop-filter {
  width: 104px;

}

  1. troop-filter,
  2. troop-select-none,
  3. 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;

}

  1. troop-filter:hover,
  2. troop-select-none:hover,
  3. 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%);

}

  1. troop-filter:active,
  2. troop-select-none:active,
  3. 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%);

}

  1. troop-select-none,
  2. troop-select-all {
  width: 100px;

}

  1. troop-filter-cancel,
  2. 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;

}

  1. troop-filter-cancel:hover,
  2. 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%);

}

  1. troop-filter-cancel:active,
  2. 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%);

}

  1. troop-filter-execute,
  2. 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;

}

  1. troop-filter-execute:hover,
  2. 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%);

}

  1. troop-filter-execute:active,
  2. 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>

Filters: Town Hall Trophies
Min Max Min Max
        <button type="button" id="troop-filter" onclick="troopFilterInitiate()">Troop Filter</button>
        Includes
All
<input type="number" id="min-town-hall" value="1" style="text-align: right; width: 50px;"></input> <input type="number" id="max-town-hall" style="text-align: right; width: 50px;"></input> <input type="number" id="min-trophies" value="0" style="text-align: right; width: 50px;"></input> <input type="number" id="max-trophies" style="text-align: right; width: 50px;"></input>
        <button type="button" id="filter-execute" onclick="attackStrategyFilter()" style="font-weight: bold;">Go!</button> 
        <button type="button" id="filter-reset" onclick="attackStrategyReset()" style="font-weight: bold;">Reset</button>
              <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>
              <button type="button" id="troop-select-all" onclick="troopSelectAll()">All</button>
              
<button type="button" id="troop-select-none" onclick="troopSelectNone()">None</button>
<select id="troop-filter-type"> <option selected value="Includes">Includes</option> <option value="Excludes">Excludes</option> <option value="Only">Only</option> </select>
              <button type="button" id="troop-filter-cancel" onclick="troopFilterCancel()">Cancel</button>
              
              <button type="button" id="troop-filter-execute" onclick="troopFilterExecute()">OK</button>

<script>

window.onload = function() {

  importArticle({ type: "script", article: "MediaWiki:Common.js" });

}; </script>