Skip to content

Commit

Permalink
Bugfixes 4.1.1 (#122)
Browse files Browse the repository at this point in the history
Fix edge case on Changes page and wording/formatting on About page
  • Loading branch information
paulkva authored May 26, 2024
1 parent 73e48f1 commit 27a8881
Show file tree
Hide file tree
Showing 4 changed files with 86 additions and 84 deletions.
4 changes: 2 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "supercharge.info",
"version": "4.1.0",
"version": "4.1.1",
"description": "map",
"scripts": {
"build": "echo use 'npm run prodbuild' or 'npm run devbuild'",
Expand Down
147 changes: 75 additions & 72 deletions src/main/primary_entry/html/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -548,86 +548,89 @@ <h3>About</h3>

<h3 class="margin-top">Supercharger Status</h3>
<div style="display: flex; flex-direction: row; justify-content: space-between;">
<ul class="about-page-list" style="flex: 5;">
<li title="Open">
<img src="images/red_dot.svg"/>
<b>Open</b> : It is possible to supercharge at the site at all times. <i>(Note that the host or other nearby facilities might not be open at all times.)</i>
</li>
<li title="Open - Limited Hours">
<img src="images/red_dot_limited.svg"/>
<b>Open - Limited Hours</b> : It is possible to supercharge at the site during limited times.
</li>
<li title="Expanding">
<img src="images/red_expand.svg"/>
<b>Expanding</b> : Site is at least partially open and is being updated or expanded.
</li>
<li title="Construction">
<img src="images/orange_triangle.svg"/>
<b>Construction</b> : Progress is visible at the site.
</li>
<li title="Permit">
<img src="images/blue_triangle.svg"/>
<b>Permit</b> : Tesla has submitted a permit/plan/application for a specific address.
</li>
<li title="Plan">
<img src="images/plan.svg"/>
<b>Plan</b> : Placeholder for expected or rumored site.
</li>
<li title="Voting">
<img src="images/vote.svg"/>
<b>Voting</b> : Recent winner of <a href="https://www.tesla.com/supercharger-voting" target="_blank">Supercharger Voting</a>.
</li>
<li title="Temporarily Closed">
<img src="images/gray_dot_x.svg"/>
<b>Temporarily Closed</b> : Site is temporarily closed. Charging not possible.
</li>
<li title="Permanently Closed">
<img src="images/black_dot_x.svg"/>
<b>Permanently Closed</b> : Site is permanently closed. Charging not possible.
</li>
<li title="Custom">
<img src="images/custom_pin.svg"/>
<b>Custom</b> : User added custom marker. Right-click map (or long-press on a touchscreen) to add at any location.
</li>
</ul>
<div class="notes" style="flex: 2; font-style: italic; font-size: 85%;">
<b>Additional FAQ + notes on status</b>
<hr/>
<img src="images/red_dot.svg"/> <b>Why does the site use <span style="color: red;">red</span> circles to indicate <span style="color: red;">Open</span> sites? The color red usually means "bad" or "stop" in other contexts.</b><br/>
The original decision to use red is lost to time, but a possible motivation was to match Tesla's stylized "T" logo or the color of the markers on Tesla's "Find Us" map.
<hr/>
<b>Why do some locations show ≤ before the power rating?</b><br/>
Individual locations with multiple stall types don't necessarily deliver the same maximum power at every stall. For example, some locations have a mix of V2 (150 kW) and V3 (250 kW) stalls. Check the Notes for each location for details.
<hr/>
<img src="images/black_dot_x.svg"/> <b>Permanently Closed sites are hidden by default on the map.</b><br/>
To see them, use the Select All button or click directly on the Permanently Closed option in the Status filter.
</div>
</div>

<h3>Plug icons</h3>
<div class="details">
<img src="/images/TPC.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-tesla-icon.html" target="_blank">Tesla</a>
<img src="/images/NACS.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-tesla-icon.html" target="_blank">NACS</a>
<img src="/images/CCS1.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-ccs1-icon.html" target="_blank">CCS1</a>
<img src="/images/CCS2.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-ccs2-icon.html" target="_blank">CCS2</a>
<img src="/images/TYPE2.svg"/> <a href="https://commons.wikimedia.org/wiki/File:Type_2_mennekes.svg" target="_blank">Type2</a>
<img src="/images/GBT.svg"/> <a href="https://commons.wikimedia.org/wiki/File:GBT_20234_%28DC_outline%29.svg" target="_blank">GB/T</a>
</div>
<div class="details">
<b style="color: #900;">Red</b> icons represent Tesla-only plugs.<br/>
<b style="color: #49f;">Blue</b> icons represent standards generally open to non-Tesla EVs.<br/>
<b>Black</b> icons represent standards that <i>might</i> be open to non-Tesla EVs. (Look for the <img title="other EVs OK" src="/images/car-electric.svg"/> "Other EVs OK" marker or use the "Open To" filter.)<br/>
<i>Plug icons used under <a href="https://creativecommons.org/licenses/by-sa/4.0/deed.en" target="_blank">CC BY-SA 4.0</a> license via Wikimedia Commons, or <a href="https://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache 2.0</a> license via iconarchive.com. (Click each name above for the source.)</i>
<div style="flex: 4;">
<ul class="about-page-list">
<li title="Open">
<img src="images/red_dot.svg"/>
<b>Open</b> : It is possible to supercharge at the site at all times. <i>(Note that the host or other nearby facilities might not be open at all times.)</i>
</li>
<li title="Open - Limited Hours">
<img src="images/red_dot_limited.svg"/>
<b>Open - Limited Hours</b> : It is possible to supercharge at the site during limited times.
</li>
<li title="Expanding">
<img src="images/red_expand.svg"/>
<b>Expanding</b> : Site is at least partially open and is being updated or expanded.
</li>
<li title="Construction">
<img src="images/orange_triangle.svg"/>
<b>Construction</b> : Progress is visible at the site.
</li>
<li title="Permit">
<img src="images/blue_triangle.svg"/>
<b>Permit</b> : Tesla has submitted a permit/plan/application for a specific address.
</li>
<li title="Plan">
<img src="images/plan.svg"/>
<b>Plan</b> : Placeholder for expected or rumored site.
</li>
<li title="Voting">
<img src="images/vote.svg"/>
<b>Voting</b> : Recent winner of <a href="https://www.tesla.com/supercharger-voting" target="_blank">Supercharger Voting</a>.
</li>
<li title="Temporarily Closed">
<img src="images/gray_dot_x.svg"/>
<b>Temporarily Closed</b> : Site is temporarily closed. Charging not possible.
</li>
<li title="Permanently Closed">
<img src="images/black_dot_x.svg"/>
<b>Permanently Closed</b> : Site is permanently closed. Charging not possible.
</li>
<li title="Custom">
<img src="images/custom_pin.svg"/>
<b>Custom</b> : User added custom marker. Right-click map (or long-press on a touchscreen) to add at any location.
</li>
</ul>
<h3>Plug icons</h3>
<div class="details">
<img src="/images/TPC.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-tesla-icon.html" target="_blank">Tesla</a>
<img src="/images/NACS.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-tesla-icon.html" target="_blank">NACS</a>
<img src="/images/CCS1.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-ccs1-icon.html" target="_blank">CCS1</a>
<img src="/images/CCS2.svg"/> <a href="https://www.iconarchive.com/show/material-icons-by-pictogrammers/ev-plug-ccs2-icon.html" target="_blank">CCS2</a>
<img src="/images/TYPE2.svg"/> <a href="https://commons.wikimedia.org/wiki/File:Type_2_mennekes.svg" target="_blank">Type2</a>
<img src="/images/GBT.svg"/> <a href="https://commons.wikimedia.org/wiki/File:GBT_20234_%28DC_outline%29.svg" target="_blank">GB/T</a>
</div>
<div class="details">
<b style="color: #900;">Red</b> icons represent Tesla-only plugs.<br/>
<b style="color: #49f;">Blue</b> icons represent standards generally open to non-Tesla EVs.<br/>
<b>Black</b> icons represent standards that <i>might</i> be open to non-Tesla EVs. (Look for the <img title="other EVs OK" src="/images/car-electric.svg"/> "Other EVs OK" marker or use the "Open To" filter.)<br/>
<i>Plug icons used under <a href="https://creativecommons.org/licenses/by-sa/4.0/deed.en" target="_blank">CC BY-SA 4.0</a> license via Wikimedia Commons, or <a href="https://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache 2.0</a> license via iconarchive.com. (Click each name above for the source.)</i>
</div>
</div>
<div style="flex: 2; font-style: italic; font-size: 85%;">
<div class="notes">
<b>Additional FAQ + notes on status</b>
<hr/>
<img src="images/red_dot.svg"/> <b>Why does the site use <span style="color: red;">red</span> circles to indicate <span style="color: red;">Open</span> sites? The color red usually means "bad" or "stop" in other contexts.</b><br/>
The original decision to use red is lost to time, but a possible motivation was to match Tesla's stylized "T" logo or the color of the markers on Tesla's "Find Us" map.
<hr/>
<b>Why do some locations show ≤ before the power rating?</b><br/>
Individual locations with multiple stall types don't necessarily deliver the same maximum power at every stall. For example, some locations have a mix of V2 (150 kW) and V3 (250 kW) stalls. Check the Notes for each location for details.
<hr/>
<img src="images/black_dot_x.svg"/> <b>Permanently Closed sites are hidden by default on the map.</b><br/>
To see them, use the Select All button or click directly on the "Permanently Closed" option in the Status filter.
</div>
</div>
</div>

<h3>Other icons on the Changes and Data pages</h3>
<ul class="about-page-list">
<li title="other EVs OK"><img src="/images/car-electric.svg"/> <b>Other EVs OK</b> : Site allows non-Tesla vehicles to charge - for example, locations with Magic Dock, NACS open to non-Tesla, and certain CCS locations in Europe.</li>
<li title="solar canopy"><img src="/images/solar-power-variant.svg"/> <img src="/images/no-solar.svg"/> <b>Solar canopy</b> : Whether the site is at least partially covered by a solar canopy.</li>
<li title="battery backup"><img src="/images/battery-charging.svg"/> <img src="/images/no-battery.svg"/> <b>Battery backup</b> : Whether the site includes battery backup power.</li>
<li title="accessible"><img src="/images/accessible.svg"/> <img src="/images/no-accessible.svg"/> <b>Accessible</b> : Whether the site includes designated accessible charging space(s).</li>
<li title="trailer-friendly"><img src="/images/trailer.svg"/> <img src="/images/no-trailer.svg"/> <b>Trailer-friendly</b> : Whether the site includes trailer-friendly charging space(s).</li>
<li title="Google Map"><img src="/images/gmap.svg"/> <b>Google Map</b> : Link to Google Maps based on the site's address (which might be slightly different than the GPS coordinates).</li>
<li title="Google Map"><img src="/images/gmap.svg"/> <b>Google Map</b> : Link to Google Maps based on the site's latitude and longitude (which might be slightly different than the the result of using the street address).</li>
<li title="Forum"><img src="/images/forum.svg"/> <b>Forum</b> : Link to the site's relevant thread on a discussion forum.</li>
<li title="tesla.com or tesla.cn"><img src="/images/red_dot_t.svg"/> <b>Tesla.com</b> or <b>Tesla.cn</b> : Link to Tesla's "Find Us" page for the site.</li>
<li title="PlugShare"><img src="https://developer.plugshare.com/logo.svg"/> <img src="https://developer.plugshare.com/logo.svg" class="faded"/> <b>PlugShare</b> : Link to the site (and its details, if available) on PlugShare.com.</li>
Expand Down
17 changes: 8 additions & 9 deletions src/main/primary_entry/script/site/Supercharger.js
Original file line number Diff line number Diff line change
Expand Up @@ -175,24 +175,23 @@ export default class Supercharger {
return `${prefix}${this.stallType && this.stallType.indexOf('+') < 0 ? '' : '≤ '}${this.powerKilowatt} kW`;
}

getStallPlugSummary(useImages, count) {
count = count ?? this.numStalls;
if (!this.stalls || !count || count === 0) return '';
getStallPlugSummary(useImages, countDisplay) {
countDisplay = countDisplay ?? this.numStalls;
if (!this.stalls || !countDisplay || countDisplay === 0) return '';

var summary = `<span class="details">${count} ${Strings.upperCaseInitial(this.stallType) ?? ''} `;
var summary = `<span class="details">${countDisplay} ${Strings.upperCaseInitial(this.stallType) ?? ''} `;
if (this.plugType) {
summary += useImages ? this.plugImg(this.plugType) : PLUG_DISPLAY[this.plugType];
} else {
summary += 'stalls';
}
// special cases for the most common multi-connector stalls (MagicDock and CCS2+TYPE2)
if (this.numStalls === this.plugs?.nacs && this.plugs?.nacs === this.plugs?.ccs1) {
summary = `<span class="details" title="MagicDock (NACS+CCS1)">${this.numStalls} ${Strings.upperCaseInitial(this.stallType)} ${useImages ? '<img src="/images/NACS.svg"/><img src="/images/CCS1.svg"/>' : 'MagicDock'}</span>`;
summary = `<span class="details" title="MagicDock (NACS+CCS1)">${countDisplay} ${Strings.upperCaseInitial(this.stallType)} ${useImages ? '<img src="/images/NACS.svg"/><img src="/images/CCS1.svg"/>' : 'MagicDock'}`;
} else if (this.numStalls === this.plugs?.ccs2 && this.plugs?.ccs2 === this.plugs?.type2) {
summary = `<span class="details" title="Dual-cable CCS2+TYPE2">${this.numStalls} ${Strings.upperCaseInitial(this.stallType)} ${useImages ? '<img src="/images/CCS2.svg"/><img src="/images/TYPE2.svg"/>' : 'CCS2+TYPE2'}</span>`;
} else {
summary += '</span>';
}
summary = `<span class="details" title="Dual-cable CCS2+TYPE2">${countDisplay} ${Strings.upperCaseInitial(this.stallType)} ${useImages ? '<img src="/images/CCS2.svg"/><img src="/images/TYPE2.svg"/>' : 'CCS2+TYPE2'}`;
}
summary += '</span>';

if (useImages) {
if (this.stalls.accessible === 0) summary += ' <img src="/images/no-accessible.svg" title="NOT Accessible"/>';
Expand Down

0 comments on commit 27a8881

Please sign in to comment.