From 45978db7e2c90f44c51c6d2d95baeb06d829f444 Mon Sep 17 00:00:00 2001
From: RKBoss6 <onkarka@northvilleschools.net>
Date: Mon, 21 Jul 2025 11:46:52 -0400
Subject: [PATCH 1/8] Fix storage get stats test, hide full storage pie if not
 compatible

---
 apps/storageanalyzer/custom.html | 107 ++++++++++++++++++++-----------
 1 file changed, 71 insertions(+), 36 deletions(-)

diff --git a/apps/storageanalyzer/custom.html b/apps/storageanalyzer/custom.html
index 56756d175..c7cd380e4 100644
--- a/apps/storageanalyzer/custom.html
+++ b/apps/storageanalyzer/custom.html
@@ -18,41 +18,68 @@
     <!-- Chart View -->
     <div id="storagePieChart" style="display: none; flex-direction: column; align-items: center;">
       <div id="piechart" style="width: 100%; max-width: 600px; height: 400px;"></div>
-      <div id="totalStoragePie" style="width: 100%; max-width: 600px; height: 300px;"></div>
+      <div id="totalStoragePie" style="width: 100%; max-width: 600px; height: 300px; margin-top: 2em;"></div>
     </div>
 
     <script>
       let globalApps = [];
       let storageStats = null;
+      let isBangle2 = false;
 
       function onInit(device) {
+        isBangle2 = device?.HWVERSION === 2;
+
         Util.showModal("Reading Storage...");
-        Puck.eval(`(()=>{
-          let getApps = () => require("Storage").list(/\\.info$/).map(appInfoName => {
-            let appInfo = require("Storage").readJSON(appInfoName,1)||{};
-            var fileSize = 0, dataSize = 0;
-            appInfo.files.split(",").forEach(f => fileSize += require("Storage").read(f).length);
-            var data = (appInfo.data||"").split(";");
-            function wildcardToRegexp(wc) {
-              return new RegExp("^"+wc.replaceAll(".","\\\\.").replaceAll("?",".*")+"$");
+
+        const evalCode = `(()=>{
+          const Storage = require("Storage");
+          let apps = Storage.list(/\\.info$/).map(infoFile => {
+            let info = Storage.readJSON(infoFile, 1) || {};
+            let codeSize = 0, dataSize = 0;
+            if (info.files && info.files.length) {
+              info.files.split(",").forEach(f => {
+                let fileData = Storage.read(f);
+                if (fileData) codeSize += fileData.length;
+              });
+            }
+            let data = (info.data||"").split(";");
+            function wcToRegExp(wc) {
+              return new RegExp("^"+wc.replaceAll(".", "\\\\.").replaceAll("?", ".*")+"$");
             }
             if (data[0]) data[0].split(",").forEach(wc => {
-              require("Storage").list(wildcardToRegexp(wc), {sf:false}).forEach(f => {
-                dataSize += require("Storage").read(f).length
+              Storage.list(wcToRegExp(wc), {sf:false}).forEach(f => {
+                let d = Storage.read(f);
+                if (d) dataSize += d.length;
               });
             });
             if (data[1]) data[1].split(",").forEach(wc => {
-              require("Storage").list(wildcardToRegexp(wc), {sf:true}).forEach(f => {
-                dataSize += require("Storage").open(f,"r").getLength();
+              Storage.list(wcToRegExp(wc), {sf:true}).forEach(f => {
+                let openFile = Storage.open(f, "r");
+                if (openFile) dataSize += openFile.getLength();
               });
             });
-            return [appInfo.id, fileSize, dataSize];
+            return [info.id || infoFile.replace(".info",""), codeSize, dataSize];
           });
-          return [getApps(), require(\"Storage\").getStats()]; })()`, function(result) {
+          ${
+            isBangle2 
+              ? "let stats = Storage.getStats(); return [apps, stats];"
+              : "return [apps, null];"
+          }
+        })()`;
+
+        Puck.eval(evalCode, function(result) {
           Util.hideModal();
+
           globalApps = result[0].sort((a,b) => (b[1]+b[2]) - (a[1]+a[2]));
           storageStats = result[1];
 
+          if (!isBangle2) {
+            // Hide total storage pie for Bangle.js 1
+            document.getElementById('totalStoragePie').style.display = 'none';
+          } else {
+            document.getElementById('totalStoragePie').style.display = 'block';
+          }
+
           if (globalApps.length === 0) {
             document.getElementById("storageTable").innerHTML = "<p>No apps found</p>";
             return;
@@ -68,9 +95,9 @@
             <thead>
               <tr>
                 <th>App</th>
-                <th>Code (kb)</th>
-                <th>Data (kb)</th>
-                <th>Total (kb)</th>
+                <th>Code (KB)</th>
+                <th>Data (KB)</th>
+                <th>Total (KB)</th>
               </tr>
             </thead>
             <tbody>
@@ -88,33 +115,33 @@
       function drawChart() {
         if (globalApps.length === 0) return;
 
-        // App-specific chart
-        const chartData = [
+        // Draw pie chart for apps
+        const appChartData = [
           ['App', 'Total Size (KB)']
         ].concat(globalApps.map(app => [app[0], (app[1] + app[2])/1000]));
 
-        const data = google.visualization.arrayToDataTable(chartData);
-
-        const options = {
+        const dataApps = google.visualization.arrayToDataTable(appChartData);
+        const appChartOptions = {
           title: 'App Storage Breakdown',
           chartArea: { width: '90%', height: '80%' },
           legend: { position: 'bottom' }
         };
 
-        const chart = new google.visualization.PieChart(document.getElementById('piechart'));
-        chart.draw(data, options);
+        const appChart = new google.visualization.PieChart(document.getElementById('piechart'));
+        appChart.draw(dataApps, appChartOptions);
 
-        // Total storage chart
-        if (storageStats) {
+        // Draw total storage pie only on Bangle.js 2
+        if (isBangle2 && storageStats) {
           const usedKB = storageStats.usedBytes / 1000;
           const freeKB = storageStats.freeBytes / 1000;
-          const totalData = google.visualization.arrayToDataTable([
+
+          const totalChartData = google.visualization.arrayToDataTable([
             ['Type', 'KB'],
             ['Used', usedKB],
             ['Free', freeKB]
           ]);
 
-          const totalOptions = {
+          const totalChartOptions = {
             title: 'Total Storage Usage',
             pieHole: 0.4,
             chartArea: { width: '90%', height: '80%' },
@@ -122,29 +149,37 @@
           };
 
           const totalChart = new google.visualization.PieChart(document.getElementById('totalStoragePie'));
-          totalChart.draw(totalData, totalOptions);
+          totalChart.draw(totalChartData, totalChartOptions);
         }
       }
 
+      // Load Google Charts
       google.charts.load('current', {'packages':['corechart']});
-      
+      google.charts.setOnLoadCallback(() => {
+        drawTable(); // Start with table view
+      });
 
-      document.getElementById("pieChartButton").addEventListener("click", function () {
+      // Buttons event listeners
+      document.getElementById("pieChartButton").addEventListener("click", () => {
         document.getElementById("storageTable").style.display = "none";
         document.getElementById("storagePieChart").style.display = "flex";
         drawChart();
-        this.classList.add("btn-primary");
+
+        document.getElementById("pieChartButton").classList.add("btn-primary");
         document.getElementById("tableButton").classList.remove("btn-primary");
       });
 
-      document.getElementById("tableButton").addEventListener("click", function () {
+      document.getElementById("tableButton").addEventListener("click", () => {
         document.getElementById("storageTable").style.display = "block";
         document.getElementById("storagePieChart").style.display = "none";
         drawTable();
-        this.classList.add("btn-primary");
+
+        document.getElementById("tableButton").classList.add("btn-primary");
         document.getElementById("pieChartButton").classList.remove("btn-primary");
       });
-      
+
+      // Register entrypoint for app loader
+      window.onInit = onInit;
     </script>
   </body>
 </html>

From 5b135b1d6c64da61002f740db751e4bfcb6363c8 Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 12:05:18 -0400
Subject: [PATCH 2/8] test for working storagepie

---
 apps/storageanalyzer/custom.html | 161 +++++++++++++------------------
 1 file changed, 68 insertions(+), 93 deletions(-)

diff --git a/apps/storageanalyzer/custom.html b/apps/storageanalyzer/custom.html
index c7cd380e4..8812e93d7 100644
--- a/apps/storageanalyzer/custom.html
+++ b/apps/storageanalyzer/custom.html
@@ -9,76 +9,56 @@
     <!-- Toggle Buttons -->
     <div class="btn-group" style="margin: 1em; display: flex; justify-content: center;">
       <button id="tableButton" class="btn btn-primary">View Table</button>
-      <button id="pieChartButton" class="btn">View Pie Chart</button>
+      <button id="pieChartButton" class="btn">View Pie Charts</button>
     </div>
 
     <!-- Table View -->
     <div id="storageTable"></div>
 
-    <!-- Chart View -->
-    <div id="storagePieChart" style="display: none; flex-direction: column; align-items: center;">
+    <!-- Charts View -->
+    <div id="storagePieCharts" style="display: none; flex-direction: column; align-items: center; gap: 1.5em;">
+      <!-- App Breakdown Chart -->
       <div id="piechart" style="width: 100%; max-width: 600px; height: 400px;"></div>
-      <div id="totalStoragePie" style="width: 100%; max-width: 600px; height: 300px; margin-top: 2em;"></div>
+      <!-- Total Storage Chart -->
+      <div id="totalStoragePie" style="width: 100%; max-width: 600px; height: 300px;"></div>
     </div>
 
     <script>
       let globalApps = [];
       let storageStats = null;
-      let isBangle2 = false;
+      let hasGetStats = true;
 
       function onInit(device) {
-        isBangle2 = device?.HWVERSION === 2;
-
         Util.showModal("Reading Storage...");
 
-        const evalCode = `(()=>{
+        // Fetch app list and stats from the watch
+        Puck.eval(`(()=>{
           const Storage = require("Storage");
-          let apps = Storage.list(/\\.info$/).map(infoFile => {
-            let info = Storage.readJSON(infoFile, 1) || {};
-            let codeSize = 0, dataSize = 0;
-            if (info.files && info.files.length) {
-              info.files.split(",").forEach(f => {
-                let fileData = Storage.read(f);
-                if (fileData) codeSize += fileData.length;
-              });
-            }
-            let data = (info.data||"").split(";");
-            function wcToRegExp(wc) {
-              return new RegExp("^"+wc.replaceAll(".", "\\\\.").replaceAll("?", ".*")+"$");
-            }
-            if (data[0]) data[0].split(",").forEach(wc => {
-              Storage.list(wcToRegExp(wc), {sf:false}).forEach(f => {
-                let d = Storage.read(f);
-                if (d) dataSize += d.length;
-              });
+          const getApps = () => Storage.list(/\\.info$/).map(n => {
+            const app = Storage.readJSON(n,1)||{};
+            let fileSize=0, dataSize=0;
+            if (app.files) app.files.split(",").forEach(f=>{
+              const d = Storage.read(f); if (d) fileSize += d.length;
             });
-            if (data[1]) data[1].split(",").forEach(wc => {
-              Storage.list(wcToRegExp(wc), {sf:true}).forEach(f => {
-                let openFile = Storage.open(f, "r");
-                if (openFile) dataSize += openFile.getLength();
-              });
+            const parts = (app.data||"").split(";");
+            function toRegExp(wc) { return new RegExp("^"+wc.replace(/[.+?^${}()|[\\]\\\\]/g,"\\\\$&").replace(/\\*/g,".*")+"$"); }
+            if (parts[0]) parts[0].split(",").forEach(wc=>{
+              Storage.list(toRegExp(wc), {sf:false}).forEach(f=>{const d=Storage.read(f); if (d) dataSize += d.length;});
             });
-            return [info.id || infoFile.replace(".info",""), codeSize, dataSize];
+            if (parts[1]) parts[1].split(",").forEach(wc=>{
+              Storage.list(toRegExp(wc), {sf:true}).forEach(f=>{ try{ dataSize += Storage.open(f,"r").getLength(); }catch(e){} });
+            });
+            return [app.id||"Unknown", fileSize, dataSize];
           });
-          ${
-            isBangle2 
-              ? "let stats = Storage.getStats(); return [apps, stats];"
-              : "return [apps, null];"
-          }
-        })()`;
 
-        Puck.eval(evalCode, function(result) {
+          let stats;
+          try { stats = Storage.getStats(); } catch(e) { stats = null; }
+          return [getApps(), stats];
+        })()`, function(result) {
           Util.hideModal();
-
-          globalApps = result[0].sort((a,b) => (b[1]+b[2]) - (a[1]+a[2]));
+          globalApps = result[0].sort((a,b)=>(b[1]+b[2])-(a[1]+a[2]));
           storageStats = result[1];
-
-          if (!isBangle2) {
-            // Hide total storage pie for Bangle.js 1
-            document.getElementById('totalStoragePie').style.display = 'none';
-          } else {
-            document.getElementById('totalStoragePie').style.display = 'block';
-          }
+          hasGetStats = !!storageStats;
 
           if (globalApps.length === 0) {
             document.getElementById("storageTable").innerHTML = "<p>No apps found</p>";
@@ -112,73 +92,68 @@
           </table>`;
       }
 
-      function drawChart() {
+      function drawCharts() {
         if (globalApps.length === 0) return;
 
-        // Draw pie chart for apps
-        const appChartData = [
-          ['App', 'Total Size (KB)']
-        ].concat(globalApps.map(app => [app[0], (app[1] + app[2])/1000]));
+        // Chart 1: App Breakdown
+        const appData = google.visualization.arrayToDataTable([
+          ['App', 'Total Size (KB)'],
+          ...globalApps.map(a => [a[0], (a[1]+a[2])/1000])
+        ]);
 
-        const dataApps = google.visualization.arrayToDataTable(appChartData);
-        const appChartOptions = {
+        const appChart = new google.visualization.PieChart(document.getElementById('piechart'));
+        appChart.draw(appData, {
           title: 'App Storage Breakdown',
           chartArea: { width: '90%', height: '80%' },
           legend: { position: 'bottom' }
-        };
+        });
 
-        const appChart = new google.visualization.PieChart(document.getElementById('piechart'));
-        appChart.draw(dataApps, appChartOptions);
-
-        // Draw total storage pie only on Bangle.js 2
-        if (isBangle2 && storageStats) {
-          const usedKB = storageStats.usedBytes / 1000;
-          const freeKB = storageStats.freeBytes / 1000;
-
-          const totalChartData = google.visualization.arrayToDataTable([
-            ['Type', 'KB'],
-            ['Used', usedKB],
-            ['Free', freeKB]
-          ]);
-
-          const totalChartOptions = {
-            title: 'Total Storage Usage',
-            pieHole: 0.4,
-            chartArea: { width: '90%', height: '80%' },
-            legend: { position: 'bottom' }
-          };
-
-          const totalChart = new google.visualization.PieChart(document.getElementById('totalStoragePie'));
-          totalChart.draw(totalChartData, totalChartOptions);
+        // Chart 2: Total Storage (only if stats available, i.e., Bangle.js 2)
+        const totalDiv = document.getElementById('totalStoragePie');
+        if (!hasGetStats) {
+          totalDiv.style.display = "none"; // hide for Bangle.js 1
+          return;
         }
+
+        const used = (storageStats.fileBytes||0)/1000;
+        const free = (storageStats.freeBytes||0)/1000;
+        const trash = (storageStats.garbageBytes||0)/1000;
+
+        const totalData = google.visualization.arrayToDataTable([
+          ['Type', 'KB'],
+          ['Used', used],
+          ['Free', free],
+          ['Trash', trash]
+        ]);
+
+        const totalChart = new google.visualization.PieChart(totalDiv);
+        totalChart.draw(totalData, {
+          title: 'Total Storage Usage',
+          pieHole: 0.4,
+          chartArea: { width: '90%', height: '80%' },
+          legend: { position: 'bottom' }
+        });
       }
 
       // Load Google Charts
       google.charts.load('current', {'packages':['corechart']});
-      google.charts.setOnLoadCallback(() => {
-        drawTable(); // Start with table view
-      });
 
-      // Buttons event listeners
-      document.getElementById("pieChartButton").addEventListener("click", () => {
+      document.getElementById("pieChartButton").addEventListener("click", function() {
         document.getElementById("storageTable").style.display = "none";
-        document.getElementById("storagePieChart").style.display = "flex";
-        drawChart();
-
-        document.getElementById("pieChartButton").classList.add("btn-primary");
+        document.getElementById("storagePieCharts").style.display = "flex";
+        google.charts.setOnLoadCallback(drawCharts);
+        this.classList.add("btn-primary");
         document.getElementById("tableButton").classList.remove("btn-primary");
       });
 
-      document.getElementById("tableButton").addEventListener("click", () => {
+      document.getElementById("tableButton").addEventListener("click", function() {
         document.getElementById("storageTable").style.display = "block";
-        document.getElementById("storagePieChart").style.display = "none";
+        document.getElementById("storagePieCharts").style.display = "none";
         drawTable();
-
-        document.getElementById("tableButton").classList.add("btn-primary");
+        this.classList.add("btn-primary");
         document.getElementById("pieChartButton").classList.remove("btn-primary");
       });
 
-      // Register entrypoint for app loader
       window.onInit = onInit;
     </script>
   </body>

From 816ce67598c5d978ae5340be357a55390c937b8c Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 13:27:18 -0400
Subject: [PATCH 3/8] Fix for proper displaying of total storage pie chart

---
 apps/storageanalyzer/custom.html | 140 +++++++++++++++----------------
 1 file changed, 66 insertions(+), 74 deletions(-)

diff --git a/apps/storageanalyzer/custom.html b/apps/storageanalyzer/custom.html
index 8812e93d7..2fedfce50 100644
--- a/apps/storageanalyzer/custom.html
+++ b/apps/storageanalyzer/custom.html
@@ -9,56 +9,49 @@
     <!-- Toggle Buttons -->
     <div class="btn-group" style="margin: 1em; display: flex; justify-content: center;">
       <button id="tableButton" class="btn btn-primary">View Table</button>
-      <button id="pieChartButton" class="btn">View Pie Charts</button>
+      <button id="pieChartButton" class="btn">View Pie Chart</button>
     </div>
 
     <!-- Table View -->
     <div id="storageTable"></div>
 
-    <!-- Charts View -->
-    <div id="storagePieCharts" style="display: none; flex-direction: column; align-items: center; gap: 1.5em;">
-      <!-- App Breakdown Chart -->
+    <!-- Chart View -->
+    <div id="storagePieChart" style="display: none; flex-direction: column; align-items: center;">
       <div id="piechart" style="width: 100%; max-width: 600px; height: 400px;"></div>
-      <!-- Total Storage Chart -->
       <div id="totalStoragePie" style="width: 100%; max-width: 600px; height: 300px;"></div>
     </div>
 
     <script>
       let globalApps = [];
       let storageStats = null;
-      let hasGetStats = true;
-
+      
       function onInit(device) {
         Util.showModal("Reading Storage...");
-
-        // Fetch app list and stats from the watch
         Puck.eval(`(()=>{
-          const Storage = require("Storage");
-          const getApps = () => Storage.list(/\\.info$/).map(n => {
-            const app = Storage.readJSON(n,1)||{};
-            let fileSize=0, dataSize=0;
-            if (app.files) app.files.split(",").forEach(f=>{
-              const d = Storage.read(f); if (d) fileSize += d.length;
+          let getApps = () => require("Storage").list(/\\.info$/).map(appInfoName => {
+            let appInfo = require("Storage").readJSON(appInfoName,1)||{};
+            var fileSize = 0, dataSize = 0;
+            appInfo.files.split(",").forEach(f => fileSize += require("Storage").read(f).length);
+            var data = (appInfo.data||"").split(";");
+            function wildcardToRegexp(wc) {
+              return new RegExp("^"+wc.replaceAll(".","\\\\.").replaceAll("?",".*")+"$");
+            }
+            if (data[0]) data[0].split(",").forEach(wc => {
+              require("Storage").list(wildcardToRegexp(wc), {sf:false}).forEach(f => {
+                dataSize += require("Storage").read(f).length
+              });
             });
-            const parts = (app.data||"").split(";");
-            function toRegExp(wc) { return new RegExp("^"+wc.replace(/[.+?^${}()|[\\]\\\\]/g,"\\\\$&").replace(/\\*/g,".*")+"$"); }
-            if (parts[0]) parts[0].split(",").forEach(wc=>{
-              Storage.list(toRegExp(wc), {sf:false}).forEach(f=>{const d=Storage.read(f); if (d) dataSize += d.length;});
+            if (data[1]) data[1].split(",").forEach(wc => {
+              require("Storage").list(wildcardToRegexp(wc), {sf:true}).forEach(f => {
+                dataSize += require("Storage").open(f,"r").getLength();
+              });
             });
-            if (parts[1]) parts[1].split(",").forEach(wc=>{
-              Storage.list(toRegExp(wc), {sf:true}).forEach(f=>{ try{ dataSize += Storage.open(f,"r").getLength(); }catch(e){} });
-            });
-            return [app.id||"Unknown", fileSize, dataSize];
+            return [appInfo.id, fileSize, dataSize];
           });
-
-          let stats;
-          try { stats = Storage.getStats(); } catch(e) { stats = null; }
-          return [getApps(), stats];
-        })()`, function(result) {
+          return [getApps(), require(\"Storage\").getStats()]; })()`, function(result) {
           Util.hideModal();
-          globalApps = result[0].sort((a,b)=>(b[1]+b[2])-(a[1]+a[2]));
+          globalApps = result[0].sort((a,b) => (b[1]+b[2]) - (a[1]+a[2]));
           storageStats = result[1];
-          hasGetStats = !!storageStats;
 
           if (globalApps.length === 0) {
             document.getElementById("storageTable").innerHTML = "<p>No apps found</p>";
@@ -75,9 +68,9 @@
             <thead>
               <tr>
                 <th>App</th>
-                <th>Code (KB)</th>
-                <th>Data (KB)</th>
-                <th>Total (KB)</th>
+                <th>Code (kb)</th>
+                <th>Data (kb)</th>
+                <th>Total (kb)</th>
               </tr>
             </thead>
             <tbody>
@@ -92,69 +85,68 @@
           </table>`;
       }
 
-      function drawCharts() {
+      function drawChart() {
         if (globalApps.length === 0) return;
 
-        // Chart 1: App Breakdown
-        const appData = google.visualization.arrayToDataTable([
-          ['App', 'Total Size (KB)'],
-          ...globalApps.map(a => [a[0], (a[1]+a[2])/1000])
-        ]);
+        // App-specific chart
+        const chartData = [
+          ['App', 'Total Size (KB)']
+        ].concat(globalApps.map(app => [app[0], (app[1] + app[2])/1000]));
 
-        const appChart = new google.visualization.PieChart(document.getElementById('piechart'));
-        appChart.draw(appData, {
+        const data = google.visualization.arrayToDataTable(chartData);
+
+        const options = {
           title: 'App Storage Breakdown',
           chartArea: { width: '90%', height: '80%' },
           legend: { position: 'bottom' }
-        });
+        };
 
-        // Chart 2: Total Storage (only if stats available, i.e., Bangle.js 2)
-        const totalDiv = document.getElementById('totalStoragePie');
-        if (!hasGetStats) {
-          totalDiv.style.display = "none"; // hide for Bangle.js 1
-          return;
+        const chart = new google.visualization.PieChart(document.getElementById('piechart'));
+        chart.draw(data, options);
+
+        // Total storage chart
+        if (storageStats) {
+          const usedKB = storageStats.fileBytes / 1000;
+          const freeKB = storageStats.freeBytes / 1000;
+          const trashKB =  storageStats.trashBytes / 1000;
+          const totalData = google.visualization.arrayToDataTable([
+            ['Type', 'KB'],
+            ['Used', usedKB],
+            ['Free', freeKB],
+            ['Trash', trashKB],
+          ]);
+
+          const totalOptions = {
+            title: 'Total Storage Usage',
+            
+            chartArea: { width: '90%', height: '80%' },
+            legend: { position: 'bottom' }
+          };
+
+          const totalChart = new google.visualization.PieChart(document.getElementById('totalStoragePie'));
+          totalChart.draw(totalData, totalOptions);
         }
-
-        const used = (storageStats.fileBytes||0)/1000;
-        const free = (storageStats.freeBytes||0)/1000;
-        const trash = (storageStats.garbageBytes||0)/1000;
-
-        const totalData = google.visualization.arrayToDataTable([
-          ['Type', 'KB'],
-          ['Used', used],
-          ['Free', free],
-          ['Trash', trash]
-        ]);
-
-        const totalChart = new google.visualization.PieChart(totalDiv);
-        totalChart.draw(totalData, {
-          title: 'Total Storage Usage',
-          pieHole: 0.4,
-          chartArea: { width: '90%', height: '80%' },
-          legend: { position: 'bottom' }
-        });
       }
 
-      // Load Google Charts
       google.charts.load('current', {'packages':['corechart']});
+      
 
-      document.getElementById("pieChartButton").addEventListener("click", function() {
+      document.getElementById("pieChartButton").addEventListener("click", function () {
         document.getElementById("storageTable").style.display = "none";
-        document.getElementById("storagePieCharts").style.display = "flex";
-        google.charts.setOnLoadCallback(drawCharts);
+        document.getElementById("storagePieChart").style.display = "flex";
+        drawChart();
         this.classList.add("btn-primary");
         document.getElementById("tableButton").classList.remove("btn-primary");
       });
 
-      document.getElementById("tableButton").addEventListener("click", function() {
+      document.getElementById("tableButton").addEventListener("click", function () {
         document.getElementById("storageTable").style.display = "block";
-        document.getElementById("storagePieCharts").style.display = "none";
+        document.getElementById("storagePieChart").style.display = "none";
         drawTable();
         this.classList.add("btn-primary");
         document.getElementById("pieChartButton").classList.remove("btn-primary");
       });
-
-      window.onInit = onInit;
+      
     </script>
   </body>
 </html>

From 3732c027b4f627cb51c45d56aed193c115f47574 Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 14:22:50 -0400
Subject: [PATCH 4/8] Add rounding to 1 decimal place for ease of viewing

---
 apps/storageanalyzer/custom.html | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/apps/storageanalyzer/custom.html b/apps/storageanalyzer/custom.html
index 2fedfce50..4f87f6fe5 100644
--- a/apps/storageanalyzer/custom.html
+++ b/apps/storageanalyzer/custom.html
@@ -61,7 +61,9 @@
           drawTable();
         });
       }
-
+      function roundDecimal(num){
+        return Math.round(num * 10) / 10;
+      }
       function drawTable() {
         document.getElementById("storageTable").innerHTML = `
           <table class="table table-striped">
@@ -77,7 +79,7 @@
               ${globalApps.map(app => `
                 <tr>
                   <td>${app[0]}</td>
-                  <td>${(app[1]/1000).toFixed(1)}</td>
+                  <td>${(app[1]/1000).toFixed(1}</td>
                   <td>${(app[2]/1000).toFixed(1)}</td>
                   <td>${((app[1]+app[2])/1000).toFixed(1)}</td>
                 </tr>`).join("")}
@@ -91,7 +93,7 @@
         // App-specific chart
         const chartData = [
           ['App', 'Total Size (KB)']
-        ].concat(globalApps.map(app => [app[0], (app[1] + app[2])/1000]));
+        ].concat(globalApps.map(app => [app[0], roundDecimal((app[1] + app[2])/1000)]));
 
         const data = google.visualization.arrayToDataTable(chartData);
 
@@ -106,9 +108,9 @@
 
         // Total storage chart
         if (storageStats) {
-          const usedKB = storageStats.fileBytes / 1000;
-          const freeKB = storageStats.freeBytes / 1000;
-          const trashKB =  storageStats.trashBytes / 1000;
+          const usedKB = roundDecimal(storageStats.fileBytes / 1000);
+          const freeKB = roundDecimal(storageStats.freeBytes / 1000);
+          const trashKB =  roundDecimal(storageStats.trashBytes / 1000);
           const totalData = google.visualization.arrayToDataTable([
             ['Type', 'KB'],
             ['Used', usedKB],

From 9e8c5e86713bda4193c6dde3dc21bdc94f0c0a05 Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 14:31:32 -0400
Subject: [PATCH 5/8] Update metadata.json

---
 apps/storageanalyzer/metadata.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/storageanalyzer/metadata.json b/apps/storageanalyzer/metadata.json
index 4d10398f5..902f93b06 100644
--- a/apps/storageanalyzer/metadata.json
+++ b/apps/storageanalyzer/metadata.json
@@ -1,7 +1,7 @@
 {
   "id": "storageanalyzer",
   "name": "Storage Analyzer",
-  "version": "0.02",
+  "version": "0.03",
   "description": "Analyzes Bangle.js storage and shows which apps are using storage space",
   "icon": "icon.png",
   "type": "RAM",

From f564a9fb2bdc966771bb66f4cbb74900002c7bdd Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 14:32:58 -0400
Subject: [PATCH 6/8] Update ChangeLog

---
 apps/storageanalyzer/ChangeLog | 1 +
 1 file changed, 1 insertion(+)

diff --git a/apps/storageanalyzer/ChangeLog b/apps/storageanalyzer/ChangeLog
index 78e64ee17..d2dcee110 100644
--- a/apps/storageanalyzer/ChangeLog
+++ b/apps/storageanalyzer/ChangeLog
@@ -1,2 +1,3 @@
 0.01: New App!
 0.02: Added pie chart for visualization, tweaked UI.
+0.03: Fixed bug with total storage pie chart.

From 0f19a9c12913cc0f445cab2ee7e8a1ca809fca3e Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 16:02:15 -0400
Subject: [PATCH 7/8] Fix syntax error

---
 apps/storageanalyzer/custom.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/storageanalyzer/custom.html b/apps/storageanalyzer/custom.html
index 4f87f6fe5..357da299d 100644
--- a/apps/storageanalyzer/custom.html
+++ b/apps/storageanalyzer/custom.html
@@ -79,7 +79,7 @@
               ${globalApps.map(app => `
                 <tr>
                   <td>${app[0]}</td>
-                  <td>${(app[1]/1000).toFixed(1}</td>
+                  <td>${(app[1]/1000).toFixed(1)}</td>
                   <td>${(app[2]/1000).toFixed(1)}</td>
                   <td>${((app[1]+app[2])/1000).toFixed(1)}</td>
                 </tr>`).join("")}

From 43fd2cb5dd6abcc3f2a0a4ed1ee9a1882f34409d Mon Sep 17 00:00:00 2001
From: RKBoss6 <178680496+RKBoss6@users.noreply.github.com>
Date: Tue, 22 Jul 2025 17:16:53 -0400
Subject: [PATCH 8/8] Add units for pie chart

---
 apps/storageanalyzer/custom.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/storageanalyzer/custom.html b/apps/storageanalyzer/custom.html
index 357da299d..2adefd29a 100644
--- a/apps/storageanalyzer/custom.html
+++ b/apps/storageanalyzer/custom.html
@@ -98,7 +98,7 @@
         const data = google.visualization.arrayToDataTable(chartData);
 
         const options = {
-          title: 'App Storage Breakdown',
+          title: 'App Storage Breakdown (KBs)',
           chartArea: { width: '90%', height: '80%' },
           legend: { position: 'bottom' }
         };
@@ -119,7 +119,7 @@
           ]);
 
           const totalOptions = {
-            title: 'Total Storage Usage',
+            title: 'Total Storage Usage (KBs)',
             
             chartArea: { width: '90%', height: '80%' },
             legend: { position: 'bottom' }