Skip to content

Commit

Permalink
Battery app updates
Browse files Browse the repository at this point in the history
  • Loading branch information
jjophi authored Oct 16, 2023
1 parent 8349403 commit 8f44ff3
Show file tree
Hide file tree
Showing 2 changed files with 97 additions and 23 deletions.
96 changes: 79 additions & 17 deletions battery-calcuator/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,33 @@

<div id="batteryApp" class="bc-wrapper" v-cloak>
<header class="bc-header">
<h2 class="page-title">Battery Capacity Requirement Calculator for SWIS - ADCP Edition</h2>
<button @click="showHelp = !showHelp">
<i class="fa fa-question-circle"></i>
</button>
<h2 class="page-title">
<span class="subtext">SWIS - ADCP Edition</span>
<span>Battery Capacity Requirement Calculator</span>
</h2>
<div class="bc-button-group" style="color: #000;">
<button @click="copyURL" title="Copy URL">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#9a9a9a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-copy"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
</button>
<button @click="showHelp = !showHelp" title="Help">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#9a9a9a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-help-circle"><circle cx="12" cy="12" r="10"></circle><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>
</button>
</div>

</header>
<div class="bc-body">
<section class="bc-help">
<div class="help-content" :class="{'active': showHelp}">
<h3>To use this calculator, follow these steps:</h3>
<h3>To use this program, follow these steps:</h3>
<ol>
<li>Specify distance between the topside and seabed modems (slant range) in meters (and select modem if required). Current acceptable range is 1 - 1500 meters.</li>
<li>Provide calculated filesize (in kilobytes) from the ADCP software.</li>
<li>Enter the number of times to transfer per day or week (minimum 1 per day or week, maximum 12 times a day of week)</li>
<li>Enter the expected idle duration for each transmission (minimum 10 minutes, maximum 60 minutes)</li>
<li>The program recommends the modem to be used, calculates data rate, transmission power, and durations.</li>
<li>NOTE: Maximum 12-hour total transmission duration.</li>
<li>Battery capacity: Estimated daily, weekly, and monthly battery capacity requirements.</li>
<li>SDistance: Enter the distance between the topside and seabed modem (slant range) in meters.</li>
<li>File Size: Provide the calculated file size (in kilobytes) obtained from the ADCP software.</li>
<li>Number of Transmissions: Specify the number of times you need to transfer per day/week/month.</li>
<li>Interpret Results: The program will recommend the modem, calculate the data rate, transmission power, and various durations based on the inputs.</li>
<li>Transmission Limits: The program imposes certain limits to optimize power consumption.</li>
<li>Battery Capacity: The program will present the estimated battery capacity requirements for your deployment on a daily, weekly, and monthly basis.</li>
</ol>
<p>Remember to use the tool as a guidance tool rather than a definitive source, and consider consulting experts and conducting additional analysis for accurate battery capacity estimations.</p>
</div>
</section>

Expand Down Expand Up @@ -100,7 +109,6 @@ <h3>To use this calculator, follow these steps:</h3>
</div>
</div>
</div>

<div class="bc-button-row ">
<div class="common-errors error" style="text-align: left;">[[ commonError ]]</div>
<button class="bc-btn" @click="calculateBattery" >Calculate</button>
Expand Down Expand Up @@ -296,7 +304,6 @@ <h5>Additional Info</h5>
recommended.value = null;
}
});

const revisedTransitTimes = computed(() => {
downloadTimes.value = 1;
return Number(donwloadFrequency.value);
Expand Down Expand Up @@ -377,7 +384,6 @@ <h5>Additional Info</h5>
const tx_duration = file_size * 1000 / data_rate;
resultValues.txduration = Math.round(tx_duration);


//find total seconds
let total_seconds = 24 * 60 * 60;
if(Number(donwloadFrequency.value) == 7) {
Expand All @@ -390,7 +396,6 @@ <h5>Additional Info</h5>
const rx_duration = setupVars.IDLE_TIME * 60; //Converting to seconds
resultValues.rxduration = rx_duration;


if(tx_duration > setupVars.MAX_TOTAL_TX_DURATION) {
commonError.value = errors.commonError01;
noErrors.value = false;
Expand Down Expand Up @@ -454,6 +459,7 @@ <h5>Additional Info</h5>
if(el) {
el.scrollIntoView({ behavior: "smooth" })
}
generateURL();
})
}

Expand All @@ -475,7 +481,7 @@ <h5>Additional Info</h5>
}
}

const txpower = (range, fc) => {
const txpower = (range, fc) => {
if(range < 1) return none;

if (fc == setupVars.MF ) {
Expand Down Expand Up @@ -505,6 +511,61 @@ <h5>Additional Info</h5>
return `${inputInSeconds} <span>seconds</span> (${inputInHours} <span>hrs</span>)`;
}

const generateURL = () => {
const newParams = new URLSearchParams();
newParams.set('range', distanceInput.value );
newParams.set('speed', recommended.value);
newParams.set('size', filesizeInput.value);
newParams.set('freq', donwloadFrequency.value);
newParams.set('times', downloadTimes.value);

const newUrl = `${window.location.pathname}?${newParams.toString()}`;
window.history.pushState({}, '', newUrl);
}

const copyURL = () => {
let tempEl = document.createElement('input');
let elText = window.location.href;
document.body.appendChild(tempEl);
tempEl.value = elText;
tempEl.select();
document.execCommand('copy');
document.body.removeChild(tempEl);
}

onMounted(() => {
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
let range, speed, filesize, frequency, times;

range = urlParams.get('range');
speed = urlParams.get('speed');
filesize = urlParams.get('size');
frequency = urlParams.get('freq');
times = urlParams.get('times');

if(range && speed && filesize && frequency && times ) {
distanceInput.value = range;
recommended.value = speed;
filesizeInput.value = filesize;

if(frequency == 4 || frequency == 7 || frequency == 15) {
donwloadFrequency.value = frequency;
}else{
donwloadFrequency.value = 4;
}

if(times > 15) {
times = 1;
}

nextTick(() => {
downloadTimes.value = times;
calculateBattery();
})
}
})

return {
showHelp,
rangeError,
Expand All @@ -522,6 +583,7 @@ <h5>Additional Info</h5>
updatedOutputText,
revisedTransitTimes,
downloadTimesColor,
copyURL,
};
}

Expand Down
24 changes: 18 additions & 6 deletions css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -4148,23 +4148,31 @@ p.small-title {
padding: 100px 1.6rem 1.6rem;
}
.bc-header {
display: flex;
justify-content: center;
align-content: center;
gap: 10px;
position: relative;
padding: 3.4rem 0 2rem;
}
.bc-header .page-title {
margin: 0;
padding: 0;
}
.bc-header .page-title .subtext{
display: block;
font-size: 1.8rem;
color: #e6782f;
}

.bc-button-group {
position: absolute;
bottom: 0;
right: 0;
}
.bc-header button {
background: transparent;
border: none;
width: auto;
height: auto;
padding: 0;
margin: 0;
margin: 4px;
}
.bc-header .fa {
color: #545454;
Expand Down Expand Up @@ -4219,14 +4227,15 @@ p.small-title {
color: #808080;
}
.bc-wrapper .bc-button-row {
padding: 1.6rem 0.8rem;
padding: 1.5rem 0.8rem 0.6rem;
text-align: center;
}
.bc-wrapper .bc-btn {
color: #fff;
font-size: 18px;
font-weight: 500;
padding: 16px 52px;
margin: 0;
cursor: pointer;
border: none;
text-transform: uppercase;
Expand Down Expand Up @@ -4359,6 +4368,9 @@ input[type="range"]::-webkit-slider-thumb {
padding: 1.6rem;
font-size: 16px;
}
.bc-wrapper .common-errors:empty {
display: none;
}
.output-section {
scroll-margin-top: 100px;
}
Expand Down

0 comments on commit 8f44ff3

Please sign in to comment.