Bumping version to 1.0.2

app/index.html

@@ -7,7 +7,7 @@
   <!-- Standard headers -->
   <meta name="description" content="A ship outfitting and comparison tool for Elite Dangerous">
   <meta name="mobile-web-app-capable" content="yes">
-  <meta name="viewport" content="width = device-width, initial-scale = 1.0">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
   <link rel="manifest" href="/images/logo/manifest.json">
   <link rel="icon" sizes="152x152 192x192" type="image/png" href="/images/logo/192x192.png">
   <link rel="shortcut icon" href="/images/logo/favicon.ico">

app/less/app.less

@@ -22,7 +22,9 @@
 
 html, body {
   height: 100%;
+  width: 100%;
   text-rendering: optimizeLegibility;
+  overflow-x: hidden;
 }
 
 body {
@@ -40,7 +42,9 @@ div, a, li {
 
 #main {
   margin: 0;
-  padding: 0.5em 0;
+  padding: 0.5em 0.5em;
+  width: 100%;
+  box-sizing: border-box;
   min-height: 90%;
   clear: both;
   text-align: center;

app/less/header.less

@@ -84,6 +84,19 @@ header {
     -webkit-overflow-scrolling: touch;
     max-height: 500px;
 
+    &::-webkit-scrollbar {
+      width: 0.5em;
+    }
+
+    &::-webkit-scrollbar-track {
+      background-color: transparent;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background-color: @warning-disabled;
+    }
+
+
     .smallTablet({
       max-height: 400px;
       left: 0;

app/less/outfit.less

@@ -59,7 +59,7 @@
   input {
     background: none;
     line-height: 1.3em;
-    width: 20em;
+    width: 15em;
     font-size: 0.9em;
     box-sizing: border-box;
     display: inline-block;
@@ -99,6 +99,12 @@
   text-overflow: ellipsis;
 }
 
+.optional-hide {
+  .largePhone({
+    display: none;
+  });
+}
+
 table.total {
   width: 100%;
 
@@ -115,6 +121,7 @@ table.total {
 
 .tabs {
   width: 100%;
+  box-sizing: border-box;
   margin-bottom: 1px;
 
   &, th {
@@ -160,6 +167,12 @@ table.total {
 
   .smallTablet({
     width: 50%;
+
+    .axis.x {
+      g.tick:nth-child(2n + 1) text {
+        display: none;
+      }
+    }
   });
 
   .largePhone({
@@ -183,14 +196,6 @@ table.total {
   &.third {
     width: 33%;
 
-    .smallTablet({
-      .axis.x {
-        g.tick:nth-child(2n + 1) text {
-          display: none;
-        }
-      }
-    });
-
     .largePhone({
       width: 100% !important;
     });

app/less/select.less

@@ -1,12 +1,25 @@
 select {
   .border-radius(0);
+  cursor: pointer;
   background: none;
   color: @primary-disabled;
-  border: 1px solid @primary-disabled;
-  outline: none;
   font-family: @fStandard;
   font-size: 1em;
   background-color: transparent;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  padding: 0.1em 0.5em;
+  outline:none;
+  border: 0;
+
+  &:focus {
+    outline:none;
+  }
+
+  &::-moz-focus-inner {
+    border: 0;
+  }
 }
 
 .select {
@@ -26,6 +39,19 @@ select {
   white-space: nowrap;
   text-align: center;
 
+  &::-webkit-scrollbar {
+    width: 0.5em;
+  }
+
+  &::-webkit-scrollbar-track {
+    background-color: transparent;
+    border-left: 1px solid @primary;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: @primary-disabled;
+  }
+
   .select-group {
     line-height: 1.5em;
     text-align: left;

app/views/page-outfit.html

@@ -33,14 +33,15 @@
           <th rowspan="2">DPS</th>
           <th rowspan="2">Armour</th>
           <th rowspan="2">Shields</th>
-          <th colspan="2">Mass</th>
+          <th colspan="3">Mass</th>
           <th rowspan="2">Cargo</th>
           <th rowspan="2">Fuel</th>
           <th colspan="3">Jump Range</th>
           <th colspan="3">Total Range</th>
         </tr>
         <tr>
-          <th class="lft">Unladen</th>
+          <th class="lft">Hull</th>
+          <th>Unladen</th>
           <th>Laden</th>
           <th class="lft">Max</th>
           <th>Full Tank</th>
@@ -59,6 +60,7 @@
           <td>{{fRound(ship.totalDps)}}</td>
           <td>{{ship.armourTotal}} <span ng-if="ship.armourAdded">({{ship.armour}} + {{ship.armourAdded}})</span></td>
           <td>{{fRound(ship.shieldStrength)}} <u>MJ</u> <span ng-if="ship.shieldMultiplier > 1 && ship.shieldStrength > 0">({{fRPct(ship.shieldMultiplier)}})</span></td>
+          <td>{{ship.mass}} <u>T</u></td>
           <td>{{fRound(ship.unladenMass)}} <u>T</u></td>
           <td>{{fRound(ship.ladenMass)}} <u>T</u></td>
           <td>{{fRound(ship.cargoCapacity)}} <u>T</u></td>
@@ -74,6 +76,26 @@
     </table>
   </div>
 
+  <div id="hardpoints" class="group">
+    <h1>HardPoints</h1>
+    <div class="slot" ng-repeat="h in ship.hardpoints | filter:{maxClass: '!0'}" ng-click="selectSlot($event, h)"  context-menu="select('h', h, $event, 'empty')"  ng-class="{selected: selectedSlot==h}">
+      <div slot-hardpoint class="details" hp="h" size="HPC[h.maxClass]" lbl="GMAP[h.c.grp]"></div>
+      <div class="select" ng-class="{hardpoint: h.maxClass > 0}" ng-if="selectedSlot==h" ng-click="select('h',h,$event)">
+        <div component-select s="h" groups="availCS.getHps(h.maxClass)"></div>
+      </div>
+    </div>
+  </div>
+
+  <div id="utility" class="group">
+    <h1>Utility Mounts</h1>
+    <div class="slot" ng-repeat="h in ship.hardpoints | filter:{maxClass: '0'}" ng-click="selectSlot($event, h)"  context-menu="select('h', h, $event, 'empty')"  ng-class="{selected: selectedSlot==h}">
+      <div slot-hardpoint class="details" hp="h" size="HPC[h.maxClass]" lbl="GMAP[h.c.grp]"></div>
+      <div class="select" ng-class="{hardpoint: h.maxClass > 0}" ng-if="selectedSlot==h" ng-click="select('h',h,$event)">
+        <div component-select s="h" groups="availCS.getHps(h.maxClass)"></div>
+      </div>
+    </div>
+  </div>
+
   <div id="standard" class="group">
     <h1>Standard</h1>
     <div class="slot" ng-click="selectSlot($event, ship.bulkheads)" ng-class="{selected: selectedSlot==ship.bulkheads}">
@@ -178,26 +200,6 @@
     </div>
   </div>
 
-  <div id="hardpoints" class="group">
-    <h1>HardPoints</h1>
-    <div class="slot" ng-repeat="h in ship.hardpoints | filter:{maxClass: '!0'}" ng-click="selectSlot($event, h)"  context-menu="select('h', h, $event, 'empty')"  ng-class="{selected: selectedSlot==h}">
-      <div slot-hardpoint class="details" hp="h" size="HPC[h.maxClass]" lbl="GMAP[h.c.grp]"></div>
-      <div class="select" ng-class="{hardpoint: h.maxClass > 0}" ng-if="selectedSlot==h" ng-click="select('h',h,$event)">
-        <div component-select s="h" groups="availCS.getHps(h.maxClass)"></div>
-      </div>
-    </div>
-  </div>
-
-  <div id="utility" class="group">
-    <h1>Utility Mounts</h1>
-    <div class="slot" ng-repeat="h in ship.hardpoints | filter:{maxClass: '0'}" ng-click="selectSlot($event, h)"  context-menu="select('h', h, $event, 'empty')"  ng-class="{selected: selectedSlot==h}">
-      <div slot-hardpoint class="details" hp="h" size="HPC[h.maxClass]" lbl="GMAP[h.c.grp]"></div>
-      <div class="select" ng-class="{hardpoint: h.maxClass > 0}" ng-if="selectedSlot==h" ng-click="select('h',h,$event)">
-        <div component-select s="h" groups="availCS.getHps(h.maxClass)"></div>
-      </div>
-    </div>
-  </div>
-
   <div class="group half" id="componentPriority">
     <table style="width:100%">
       <thead>
@@ -254,10 +256,8 @@
           <tr class="main">
             <th colspan="2" class="sortable le" ng-click="sortCost(cName)">
               Component
-              <div class="r">
-                <u ng-if="discounts.ship < 1">[Ship {{fRPct(1 - discounts.ship)}} off]</u>
-                <u ng-if="discounts.components < 1">[Components {{fRPct(1 - discounts.components)}} off]</u>
-              </div>
+              <u class="optional-hide" ng-if="discounts.ship < 1">[Ship {{fRPct(1 - discounts.ship)}} off]</u>
+              <u class="optional-hide" ng-if="discounts.components < 1">[Components {{fRPct(1 - discounts.components)}} off]</u>
             </th>
             <th class="sortable le" ng-click="sortCost('discountedCost')">Credits</th>
           </tr>
@@ -283,17 +283,14 @@
     </div>
 
     <div ng-if="costTab == 'retrofit'">
-      <div style="overflow-x: auto;-webkit-overflow-scrolling: touch;">
+      <div class="scroll-x">
         <table style="width:100%">
           <thead>
             <tr class="main">
               <th colspan="2" class="sortable le" ng-click="sortRetrofit('sellName')">Sell</th>
               <th colspan="2" class="sortable le" ng-click="sortRetrofit('buyName')">Buy</th>
               <th class="sortable le" ng-click="sortRetrofit('netCost')">
-                Net Cost
-                <div class="r">
-                  <u ng-if="discounts.components < 1">[{{fRPct(1 - discounts.components)}} off]</u>
-                </div>
+                Net Cost <u class="optional-hide" ng-if="discounts.components < 1">[{{fRPct(1 - discounts.components)}} off]</u>
               </th>
             </tr>
           </thead>
@@ -314,14 +311,16 @@
       <table class="total">
         <tr class="ri">
           <td class="lbl">Cost</td>
-          <td ng-class="retrofitTotal > 0 ? 'warning' : 'secondary-disabled'">{{fCrd(retrofitTotal)}} <u>CR</u></td>
+          <td colspan="2" ng-class="retrofitTotal > 0 ? 'warning' : 'secondary-disabled'">{{fCrd(retrofitTotal)}} <u>CR</u></td>
         </tr>
         <tr class="ri">
           <td class="lbl">Retrofitting from</td>
-          <td style="padding:0;">
-            <select style="width: 100%; border: none;" ng-model="$parent.retrofitBuild" ng-change="setRetrofitBase()" ng-options="name as name for (name, build) in allBuilds[ship.id]">
+          <td class="cen" style="border-right:none;width: 1em;"><u class="primary-disabled">&#9662;</u></td>
+          <td style="border-left:none;padding:0;">
+            <select style="width: 100%;padding: 0" ng-model="$parent.retrofitBuild" ng-change="setRetrofitBase()" ng-options="name as name for (name, build) in allBuilds[ship.id]">
               <option value="">Stock / Standard</option>
             </select>
+
           </td>
         </tr>
       </table>

bower.json

@@ -21,7 +21,7 @@
   "dependencies": {
     "d3": "~3.5.5",
     "ng-lodash": "~0.2.0",
-    "ui-router-extras": "~0.0.13",
+    "ui-router-extras": "0.0.13",
     "angular-ui-router": "^0.2.15",
     "d3-tip": "~0.6.7",
     "ng-sortable": "~1.2.1",

data/components/internal/internal_fuel_tank.json

@@ -1,52 +1,12 @@
 {
   "Fuel Tank": [
-    {
-      "id": "f1",
-      "grp": "ft",
-      "class": 1,
-      "rating": "C",
-      "cost": 1000,
-      "capacity": 2
-    },
-    {
-      "id": "f2",
-      "grp": "ft",
-      "class": 2,
-      "rating": "C",
-      "cost": 3750,
-      "capacity": 4
-    },
-    {
-      "id": "f3",
-      "grp": "ft",
-      "class": 3,
-      "rating": "C",
-      "cost": 7063,
-      "capacity": 8
-    },
-    {
-      "id": "f4",
-      "grp": "ft",
-      "class": 4,
-      "rating": "C",
-      "cost": 24734,
-      "capacity": 16
-    },
-    {
-      "id": "f5",
-      "grp": "ft",
-      "class": 5,
-      "rating": "C",
-      "cost": 97754,
-      "capacity": 32
-    },
-    {
-      "id": "f6",
-      "grp": "ft",
-      "class": 6,
-      "rating": "C",
-      "cost": 341577,
-      "capacity": 64
-    }
+    { "id": "f1", "grp": "ft", "class": 1, "rating": "C", "cost": 1000, "capacity": 2 },
+    { "id": "f2", "grp": "ft", "class": 2, "rating": "C", "cost": 3750, "capacity": 4 },
+    { "id": "f3", "grp": "ft", "class": 3, "rating": "C", "cost": 7063, "capacity": 8 },
+    { "id": "f4", "grp": "ft", "class": 4, "rating": "C", "cost": 24734, "capacity": 16 },
+    { "id": "f5", "grp": "ft", "class": 5, "rating": "C", "cost": 97754, "capacity": 32 },
+    { "id": "f6", "grp": "ft", "class": 6, "rating": "C", "cost": 341577, "capacity": 64 },
+    { "id": "f7", "grp": "ft", "class": 7, "rating": "C", "cost": 1780900, "capacity": 128 },
+    { "id": "f8", "grp": "ft", "class": 8, "rating": "C", "cost": 5428400, "capacity": 256 }
   ]
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "coriolis_shipyard",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "repository": {
     "type": "git",
     "url": "https://github.com/cmmcleod/coriolis"