Scientific calc added

Rakesh9100 · May 12, 2024 · ee5e841 · ee5e841
1 parent 22c3c46
commit ee5e841
Show file tree

Hide file tree

Showing 18 changed files with 1,568 additions and 1 deletion.
diff --git a/.DS_Store b/.DS_Store
diff --git a/Calculators/.DS_Store b/Calculators/.DS_Store
diff --git a/Calculators/All-in-one Scientific cal/Image 12-05-24 at 7.11 PM.jpg b/Calculators/All-in-one Scientific cal/Image 12-05-24 at 7.11 PM.jpg
diff --git a/Calculators/All-in-one Scientific cal/README.md b/Calculators/All-in-one Scientific cal/README.md
@@ -0,0 +1,15 @@
+# <p align="center">Scientific Calculator</p>
+
+## Description :-
+
+This is an Scientific Calculator that calculates the log,trignometric,exponential and many more values.
+
+## Tech Stacks :-
+
+- HTML
+- CSS
+- JavaScript
+
+## Screenshots :-
+
+![image](CalcDiverse/Calculators/All-in-one Scientific cal/Image 12-05-24 at 7.11 PM.jpg)
diff --git a/Calculators/All-in-one Scientific cal/img/calc-icon.png b/Calculators/All-in-one Scientific cal/img/calc-icon.png
diff --git a/Calculators/All-in-one Scientific cal/img/favicon.ico b/Calculators/All-in-one Scientific cal/img/favicon.ico
diff --git a/Calculators/All-in-one Scientific cal/img/meta-image.png b/Calculators/All-in-one Scientific cal/img/meta-image.png
diff --git a/Calculators/All-in-one Scientific cal/index.html b/Calculators/All-in-one Scientific cal/index.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="en">
+<!-- scientific calculator v4.7.5 -->
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Scientific Calculator</title>
+
+    <!-- favicon -->
+    <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
+
+    <!-- css styles -->
+    <link rel="stylesheet" href="style/style.css">
+
+    <!-- link with js files -->
+    <script src="script/script.js" defer></script>
+    <script src="script/app.js" defer></script>
+
+    <!-- Primary Meta Tags -->
+    <title>Scientific Calculator</title>
+    <meta name="title" content="Scientific Calculator">
+    <meta name="description" content="A standard calculator made by Deepak">
+
+
+</head>
+
+<body>
+    <div class="container">
+        <div class="topBar">
+            <a href="https://github.com/DeepakGulati31" target="_blank">
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                    <path
+                        d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
+                </svg>
+            </a>
+            <a href="https://deepak-portfolio-blush.vercel.app/" class="signature" target="_blank">Calculator made by Deepak</a>
+            <a href="https://twitter.com/deepak_o_o_" target="_blank">
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                    <path
+                        d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z" />
+                </svg>
+            </a>
+        </div>
+        <div class="calculator">
+            <div class="input-area">
+                <div id="topDisplay-container">
+                    <div id="topDisplay"></div>
+                </div>
+                <input type="text" id="display" readonly value="0">
+                <div id="exponential-container">
+                    ×10<sup id="exponential"></sup>
+                </div>
+            </div>
+            <div class="button-container">
+                <div class="trigonometry">
+                    <span id="trigonometric-mode"></span>
+                    <span id="trigono-toggle">
+                        <span>Trigonometry &darr;</span>
+                        <span id="trigonometric-container">
+                            <span class="operationButton trigono-operator" data-button-symbol="trigo(Math.sin,">sin(
+                            </span>
+                            <span class="operationButton trigono-operator" data-button-symbol="trigo(Math.cos,">cos(
+                            </span>
+                            <span class="operationButton trigono-operator" data-button-symbol="trigo(Math.tan,">tan(
+                            </span>
+                            <span class="operationButton trigono-operator" data-button-symbol="1/trigo(Math.sin,">cosec(
+                            </span>
+                            <span class="operationButton trigono-operator" data-button-symbol="1/trigo(Math.cos,">sec(
+                            </span>
+                            <span class="operationButton trigono-operator" data-button-symbol="1/trigo(Math.tan,">cot(
+                            </span>
+                            <span class="operationButton trigono-operator" data-button-symbol="trigo(Math.asin,">
+                                sin<sup>-1</sup>(</span>
+                            <span class="operationButton trigono-operator" data-button-symbol="trigo(Math.acos,">
+                                cos<sup>-1</sup>(</span>
+                            <span class="operationButton trigono-operator" data-button-symbol="trigo(Math.atan,">
+                                tan<sup>-1</sup>(</span>
+                        </span>
+                    </span>
+                </div>
+                <div class="button-area">
+                    <span class="button" id="visibility-toggler">⇄</span>
+                    <span class="button-pair">
+                        <span class="button bracketButton paired-button">(</span>
+                        <span class="button bracketButton paired-button">)</span>
+                    </span>
+                    <span class="button" id="del">DEL</span>
+                    <span class="button" id="ac">AC</span>
+                    <span class="button operationButton" data-button-symbol="Math.PI">π</span>
+                    <span id="sqrtBut" class="button toggle-visibility visible" data-button-symbol="√(">√</span>
+                    <span id="cubeRootButton" class="button toggle-visibility" data-button-symbol="³√(">³√</span>
+                    <span id="logButton" class="button operationButton" data-button-symbol="Math.log10(">log
+                        (</span>
+                    <span id="lnButton" class="button operationButton" data-button-symbol="Math.log(">ln (</span>
+                    <span class="button" id="powerButton" data-button-symbol="^(">x<sup>□</sup></span>
+                    <span class="button" id="squareBut">x<sup>2</sup></span>
+                    <span class="button" id="power-1">x<sup>-1</sup></span>
+                    <span class="button operationButton" data-button-symbol="/">÷</span>
+                    <span class="button numberButton input-button">7</span>
+                    <span class="button numberButton input-button">8</span>
+                    <span class="button numberButton input-button">9</span>
+                    <span class="button operationButton" data-button-symbol="*">×</span>
+                    <span class="button numberButton input-button">4</span>
+                    <span class="button numberButton input-button">5</span>
+                    <span class="button numberButton input-button">6</span>
+                    <span class="button operationButton" data-button-symbol="-">−</span>
+                    <span class="button numberButton input-button">1</span>
+                    <span class="button numberButton input-button">2</span>
+                    <span class="button numberButton input-button">3</span>
+                    <span class="button operationButton" data-button-symbol="+">+</span>
+                    <span class="button numberButton input-button">0</span>
+                    <span id="dot" class="button numberButton">.</span>
+                    <span class="button" id="ansButton">ANS</span>
+                    <span class="button" id="equalBut">=</span>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
diff --git a/Calculators/All-in-one Scientific cal/index.js b/Calculators/All-in-one Scientific cal/index.js
@@ -0,0 +1,50 @@
+// service worker file
+const staticCacheName = 'calculator-v4.7.5';
+const assets = [
+    '/scientific-calculator/',
+    '/scientific-calculator/index.html',
+    '/scientific-calculator/style/style.css',
+    '/scientific-calculator/script/script.js',
+    '/scientific-calculator/script/app.js',
+    '/scientific-calculator/img/favicon.ico',
+    // fonts links
+    '/scientific-calculator/style/fonts/charm.woff2',
+    '/scientific-calculator/style/fonts/pt-sans.woff2',
+    '/scientific-calculator/style/fonts/tangerine.woff2'
+];
+
+// install service worker
+self.addEventListener('install', event => {
+    // console.log('service worker has been installed');
+    // pre-caching assets
+    event.waitUntil(
+        caches.open(staticCacheName).then(cache => {
+            // console.log('caching shell assets');
+            cache.addAll(assets)
+        })
+    );
+});
+
+// activate event
+self.addEventListener('activate', event => {
+    // console.log('service worker has been activated');
+    // delete previous caches
+    event.waitUntil(
+        caches.keys().then(keys => {
+            return Promise.all(keys
+                .filter(key => key !== staticCacheName)
+                .map(key => caches.delete(key))
+            )
+        })
+    );
+});
+
+// fetch event
+self.addEventListener('fetch', event => {
+    // console.log('fetch event', event);
+    event.respondWith(
+        caches.match(event.request).then(cacheResponse => {
+            return cacheResponse || fetch(event.request);
+        })
+    );
+})