+
+
- export let data;
-
- let isLoaded = false;
- let displayIV = 'iv60';
-
- let rawData = [];
- let optionsData;
- let lowestIV;
- let highestIV;
- let lowestRV;
- let highestRV;
- let ivRank;
-
-function findLowestAndhighestIV(data, lastDateStr) {
- // Convert lastDateStr to Date object
- const lastDate = new Date(lastDateStr);
-
- // Set the first date to the beginning of the month of lastDate
- const firstDate = new Date(lastDate.getFullYear(), lastDate.getMonth(), 1);
-
- // Filter data to include only prices within the specified month period
- const filteredData = data.filter(item => {
- const currentDate = new Date(item?.date);
- return currentDate >= firstDate && currentDate <= lastDate;
- });
-
- // Extract prices from filtered data
- let impliedVol = filteredData?.map(item => parseFloat(item?.iv60));
- let realizedVol = filteredData?.map(item => parseFloat(item['60dorhv']));
-
-
- // Find the lowest and highest prices
- lowestIV = Math.min(...impliedVol)?.toFixed(0);
- highestIV = Math.max(...impliedVol)?.toFixed(0);
-
- lowestRV = Math.min(...realizedVol)?.toFixed(0);
- highestRV = Math.max(...realizedVol)?.toFixed(0);
-}
-
-
-function changeStatement(event)
-{
- displayIV = event.target.value;
- optionsData = getPlotOptions()
-}
-
- function getPlotOptions() {
- let dates = [];
- let priceList = [];
- let ivList = [];
- let realizedVolatility = [];
-
- // Iterate over the data and extract required information
- rawData?.forEach(item => {
-
- dates?.push(item?.date);
- priceList?.push(item?.stockpx);
- ivList?.push(item[displayIV])
- realizedVolatility?.push(item['60dorhv'])
-
- });
-
- // Find the lowest and highest prices
- findLowestAndhighestIV(rawData, rawData?.slice(-1)?.at(0)?.date)
-
- // Calculate IV Rank
- const lowestIV = Math.min(...ivList); // Find the lowest IV in the past
- const highestIV = Math.max(...ivList); // Find the highest IV in the past
- ivRank = ((ivList?.slice(-1) - lowestIV) / (highestIV - lowestIV) * 100).toFixed(2); // Compute IV Rank
-
-
-
- const option = {
- silent: true,
- tooltip: {
- trigger: 'axis',
- hideDelay: 100, // Set the delay in milliseconds
- },
- animation: false,
- grid: {
- left: '0%',
- right: '0%',
- bottom: '0%',
- top: '10%',
- containLabel: true
- },
- xAxis:
- {
- type: 'category',
- boundaryGap: false,
- data: dates,
- },
- yAxis: [
- {
- type: 'value',
- splitLine: {
- show: false, // Disable x-axis grid lines
- },
- axisLabel: {
- color: '#6E7079', // Change label color to white
- formatter: function (value, index) {
- // Display every second tick
- if (index % 2 === 0) {
- value = Math.max(value, 0);
- return '$'+value;
- } else {
- return ''; // Hide this tick
- }
- }
- },
- },
- {
- type: 'value',
- splitLine: {
- show: false, // Disable x-axis grid lines
- },
- position: 'right',
- axisLabel: {
- formatter: function (value, index) {
- if (index % 2 === 0) {
- return value?.toFixed(0)+'%'
- } else {
- return ''; // Hide this tick
- }
- }
- }
- },
- ],
- series: [
- {
- name: 'Price',
- data: priceList,
- type: 'line',
- itemStyle: {
- color: '#fff'
- },
- showSymbol: false
- },
- {
- name: 'IV',
- data: ivList,
- type: 'line',
- areaStyle: {opacity: 0.3},
- stack: 'ImpliedVolatility',
- yAxisIndex: 1,
- itemStyle: {
- color: '#F03500'
- },
- showSymbol: false,
-
- },
- {
- name: 'RV',
- data: realizedVolatility,
- type: 'line',
- areaStyle: {opacity: 0.3},
- stack: 'ImpliedVolatility',
- yAxisIndex: 1,
- itemStyle: {
- color: '#3B82F6'
- },
- showSymbol: false,
-
- },
- ]
- };
-
-
- return option;
- }
-
- const getImpliedVolatility = async (ticker) => {
- // Get cached data for the specific tickerID
- const cachedData = getCache(ticker, 'getImpliedVolatility');
- if (cachedData) {
- rawData = cachedData;
- } else {
-
- const postData = {'ticker': ticker, path: 'implied-volatility'};
- // make the POST request to the endpoint
- const response = await fetch('/api/ticker-data', {
- method: 'POST',
- headers: {
- "Content-Type": "application/json"
- },
- body: JSON.stringify(postData)
- });
-
- rawData = await response?.json();
- // Cache the data for this specific tickerID with a specific name 'getImpliedVolatility'
- setCache(ticker, rawData, 'getImpliedVolatility');
- }
-
- if(rawData?.length !== 0) {
- $impliedVolatilityComponent = true;
- } else {
- $impliedVolatilityComponent = false;
- }
- };
-
-
-
- $: {
- if($assetType === 'stock' ? $stockTicker : $etfTicker && typeof window !== 'undefined') {
- isLoaded=false;
- displayIV = 'iv60';
- const ticker = $assetType === 'stock' ? $stockTicker : $etfTicker
- const asyncFunctions = [
- getImpliedVolatility(ticker)
- ];
- Promise.all(asyncFunctions)
- .then((results) => {
- optionsData = getPlotOptions()
- })
- .catch((error) => {
- console.error('An error occurred:', error);
- });
- isLoaded = true;
-
- }
- }
-
-
- $: charNumber = $screenWidth < 640 ? 20 : 40;
-
-
-
-
-
-
-
-
-
- {#if data?.user?.tier === 'Pro'}
- {#if isLoaded}
-
+ {#if data?.user?.tier === "Pro"}
+ {#if isLoaded}
{#if rawData?.length !== 0}
-
-
+
-
-
-
-
-
-
- Based on the past 12 months of historical data, {$displayCompanyName} has an IV Rank of {ivRank}%, with the current implied volatility standing at {rawData?.slice(-1)?.at(0)?.iv60}%.
+ Based on the past 12 months of historical data, {$displayCompanyName}
+ has an IV Rank of {ivRank}%,
+ with the current implied volatility standing at
+ {rawData?.slice(-1)?.at(0)?.iv60}%.
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Price
-
-
-
-
-
-
- Implied Volatility
-
+
+
+
+
+
+
+ Implied Volatility
+
-
-
-
-
- Realized Volatility
-
+
-
-
-
+
+
+
+ Realized Volatility
+
-
- +
Latest Information -
- - -
+
+
+
-
+
-
-
-
{/if}
-
- {:else}
+ {:else}
| - Date - | -- {formatDateRange(rawData?.slice(-1)?.at(0)?.date)} - | -
| - IV Range - | -- {lowestIV+'%'+'-'+highestIV+'%'} - | -
| - RV Range - | -- {lowestRV+'%'+'-'+highestRV+'%'} - | -
| + Date + | ++ {formatDateRange(rawData?.slice(-1)?.at(0)?.date)} + | +
| + IV Range + | ++ {lowestIV + "%" + "-" + highestIV + "%"} + | +
| + RV Range + | ++ {lowestRV + "%" + "-" + highestRV + "%"} + | +
-
-
- {/if}
-
- {:else}
-
-
- Unlock content with Pro Subscription
- {/if}
-
-
-
-
-
-
-
-
\ No newline at end of file
+
diff --git a/src/lib/components/MobileCommentEditor.svelte b/src/lib/components/MobileCommentEditor.svelte
index e58c5c35..5cb3ec8f 100644
--- a/src/lib/components/MobileCommentEditor.svelte
+++ b/src/lib/components/MobileCommentEditor.svelte
@@ -254,7 +254,7 @@