commit 15501aa7a7cb9a51e08cc629b59d1d166a9ecf4a Author: Stipe Varnica Date: Mon Apr 22 09:38:34 2024 +0200 First commit diff --git a/TEMPEST/tempest-devel b/TEMPEST/tempest-devel new file mode 160000 index 0000000..8da3234 --- /dev/null +++ b/TEMPEST/tempest-devel @@ -0,0 +1 @@ +Subproject commit 8da32343531799e827816124932063a28e9c885b diff --git a/index.html b/index.html new file mode 100644 index 0000000..9e86c49 --- /dev/null +++ b/index.html @@ -0,0 +1,224 @@ + + + + + + Internship + + + + + + +
+
+
+ +
+ +
+
+

Input 2

+ +
+
+ +
+
+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+
+
+
+
+
+
+ +
+ + +
+ +
+
+
+
+ + + + + diff --git a/index.js b/index.js new file mode 100644 index 0000000..bfe0cc2 --- /dev/null +++ b/index.js @@ -0,0 +1,85 @@ +var outputs = []; +var simulator = []; +var graph = []; +function run() { + var input1 = document.getElementById("firstInput").value; + var input2 = document.getElementById("secondInput").value; + + if (!input1 || !input2) { + Toastify({ + text: "Input field cannot be empty!", + duration: 3000, + close: true, + gravity: "top", + }).showToast(); + } else { + outputFunction(input1, input2); + simulatorFunction(input1, input2); + graphFunction(input1, input2); + + updateTextarea(getActiveTabContent()); + + var input1 = (document.getElementById("firstInput").value = ""); + var input2 = (document.getElementById("secondInput").value = ""); + + // Query for only the checked checkboxes and put the result in an array + + //Printing values one by one + // let checked = document.querySelectorAll("input[type='checkbox']:checked"); + // console.clear(); + // checked.forEach(function (cb) { + // console.log(cb.value); + // }); + + //Saving values in array + let checked = document.querySelectorAll("input[type='checkbox']:checked"); + console.clear(); + let checkedValues = Array.from(checked).map((cb) => cb.value); + console.log(checkedValues); + } +} + +//Functions +function simulatorFunction(input1, input2) { + var result = input1 + input2; + simulator.push(result); +} + +function outputFunction(input1, input2) { + var result = input1 + " " + input2; + outputs.push(result); +} +function graphFunction(input1, input2) { + var result = input1 + "-" + input2; + graph.push(result); +} + +function getActiveTabContent() { + var activeTabId = document.querySelector(".rightNav.active").id; + switch (activeTabId) { + case "output": + return outputs; + case "simulator": + return simulator; + case "graph": + return graph; + default: + return []; + } +} + +function updateTextarea(data) { + scrollableOutput.innerHTML = data.join("\r\n"); +} + +// Add click event listeners to tab links +document.querySelectorAll(".rightNav").forEach((navLink) => { + navLink.addEventListener("click", function (event) { + event.preventDefault(); + document.querySelectorAll(".rightNav").forEach((navLink) => { + navLink.classList.remove("active"); + }); + this.classList.add("active"); + updateTextarea(getActiveTabContent()); + }); +}); diff --git a/node_modules/.package-lock.json b/node_modules/.package-lock.json new file mode 100644 index 0000000..49393a0 --- /dev/null +++ b/node_modules/.package-lock.json @@ -0,0 +1,40 @@ +{ + "name": "Internship", + "lockfileVersion": 3, + "requires": true, + "packages": { + "node_modules/@popperjs/core": { + "version": "2.11.8", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", + "peer": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, + "node_modules/bootstrap": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz", + "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ], + "peerDependencies": { + "@popperjs/core": "^2.11.8" + } + }, + "node_modules/toastify-js": { + "version": "1.12.0", + "resolved": "https://registry.npmjs.org/toastify-js/-/toastify-js-1.12.0.tgz", + "integrity": "sha512-HeMHCO9yLPvP9k0apGSdPUWrUbLnxUKNFzgUoZp1PHCLploIX/4DSQ7V8H25ef+h4iO9n0he7ImfcndnN6nDrQ==" + } + } +} diff --git a/node_modules/@popperjs/core/LICENSE.md b/node_modules/@popperjs/core/LICENSE.md new file mode 100644 index 0000000..0370c45 --- /dev/null +++ b/node_modules/@popperjs/core/LICENSE.md @@ -0,0 +1,20 @@ +The MIT License (MIT) + +Copyright (c) 2019 Federico Zivolo + +Permission is hereby granted, free of charge, to any person obtaining a copy of +this software and associated documentation files (the "Software"), to deal in +the Software without restriction, including without limitation the rights to +use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of +the Software, and to permit persons to whom the Software is furnished to do so, +subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS +FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR +COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER +IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN +CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/node_modules/@popperjs/core/README.md b/node_modules/@popperjs/core/README.md new file mode 100644 index 0000000..53be7b9 --- /dev/null +++ b/node_modules/@popperjs/core/README.md @@ -0,0 +1,376 @@ + +

+ Popper +

+ +
+

Tooltip & Popover Positioning Engine

+
+ +

+ + npm version + + + npm downloads per month (popper.js + @popperjs/core) + + + Rolling Versions + +

+ +
+ + +**Positioning tooltips and popovers is difficult. Popper is here to help!** + +Given an element, such as a button, and a tooltip element describing it, Popper +will automatically put the tooltip in the right place near the button. + +It will position _any_ UI element that "pops out" from the flow of your document +and floats near a target element. The most common example is a tooltip, but it +also includes popovers, drop-downs, and more. All of these can be generically +described as a "popper" element. + +## Demo + +[![Popper visualized](https://i.imgur.com/F7qWsmV.jpg)](https://popper.js.org) + +## Docs + +- [v2.x (latest)](https://popper.js.org/docs/v2/) +- [v1.x](https://popper.js.org/docs/v1/) + +We've created a +[Migration Guide](https://popper.js.org/docs/v2/migration-guide/) to help you +migrate from Popper 1 to Popper 2. + +To contribute to the Popper website and documentation, please visit the +[dedicated repository](https://github.com/popperjs/website). + +## Why not use pure CSS? + +- **Clipping and overflow issues**: Pure CSS poppers will not be prevented from + overflowing clipping boundaries, such as the viewport. It will get partially + cut off or overflows if it's near the edge since there is no dynamic + positioning logic. When using Popper, your popper will always be positioned in + the right place without needing manual adjustments. +- **No flipping**: CSS poppers will not flip to a different placement to fit + better in view if necessary. While you can manually adjust for the main axis + overflow, this feature cannot be achieved via CSS alone. Popper automatically + flips the tooltip to make it fit in view as best as possible for the user. +- **No virtual positioning**: CSS poppers cannot follow the mouse cursor or be + used as a context menu. Popper allows you to position your tooltip relative to + any coordinates you desire. +- **Slower development cycle**: When pure CSS is used to position popper + elements, the lack of dynamic positioning means they must be carefully placed + to consider overflow on all screen sizes. In reusable component libraries, + this means a developer can't just add the component anywhere on the page, + because these issues need to be considered and adjusted for every time. With + Popper, you can place your elements anywhere and they will be positioned + correctly, without needing to consider different screen sizes, layouts, etc. + This massively speeds up development time because this work is automatically + offloaded to Popper. +- **Lack of extensibility**: CSS poppers cannot be easily extended to fit any + arbitrary use case you may need to adjust for. Popper is built with + extensibility in mind. + +## Why Popper? + +With the CSS drawbacks out of the way, we now move on to Popper in the +JavaScript space itself. + +Naive JavaScript tooltip implementations usually have the following problems: + +- **Scrolling containers**: They don't ensure the tooltip stays with the + reference element while scrolling when inside any number of scrolling + containers. +- **DOM context**: They often require the tooltip move outside of its original + DOM context because they don't handle `offsetParent` contexts. +- **Compatibility**: Popper handles an incredible number of edge cases regarding + different browsers and environments (mobile viewports, RTL, scrollbars enabled + or disabled, etc.). Popper is a popular and well-maintained library, so you + can be confident positioning will work for your users on any device. +- **Configurability**: They often lack advanced configurability to suit any + possible use case. +- **Size**: They are usually relatively large in size, or require an ancient + jQuery dependency. +- **Performance**: They often have runtime performance issues and update the + tooltip position too slowly. + +**Popper solves all of these key problems in an elegant, performant manner.** It +is a lightweight ~3 kB library that aims to provide a reliable and extensible +positioning engine you can use to ensure all your popper elements are positioned +in the right place. + +When you start writing your own popper implementation, you'll quickly run into +all of the problems mentioned above. These widgets are incredibly common in our +UIs; we've done the hard work figuring this out so you don't need to spend hours +fixing and handling numerous edge cases that we already ran into while building +the library! + +Popper is used in popular libraries like Bootstrap, Foundation, Material UI, and +more. It's likely you've already used popper elements on the web positioned by +Popper at some point in the past few years. + +Since we write UIs using powerful abstraction libraries such as React or Angular +nowadays, you'll also be glad to know Popper can fully integrate with them and +be a good citizen together with your other components. Check out `react-popper` +for the official Popper wrapper for React. + +## Installation + +### 1. Package Manager + +```bash +# With npm +npm i @popperjs/core + +# With Yarn +yarn add @popperjs/core +``` + +### 2. CDN + +```html + + + + + +``` + +### 3. Direct Download? + +Managing dependencies by "directly downloading" them and placing them into your +source code is not recommended for a variety of reasons, including missing out +on feat/fix updates easily. Please use a versioning management system like a CDN +or npm/Yarn. + +## Usage + +The most straightforward way to get started is to import Popper from the `unpkg` +CDN, which includes all of its features. You can call the `Popper.createPopper` +constructor to create new popper instances. + +Here is a complete example: + +```html + +Popper example + + + + + + + + +``` + +Visit the [tutorial](https://popper.js.org/docs/v2/tutorial/) for an example of +how to build your own tooltip from scratch using Popper. + +### Module bundlers + +You can import the `createPopper` constructor from the fully-featured file: + +```js +import { createPopper } from '@popperjs/core'; + +const button = document.querySelector('#button'); +const tooltip = document.querySelector('#tooltip'); + +// Pass the button, the tooltip, and some options, and Popper will do the +// magic positioning for you: +createPopper(button, tooltip, { + placement: 'right', +}); +``` + +All the modifiers listed in the docs menu will be enabled and "just work", so +you don't need to think about setting Popper up. The size of Popper including +all of its features is about 5 kB minzipped, but it may grow a bit in the +future. + +#### Popper Lite (tree-shaking) + +If bundle size is important, you'll want to take advantage of tree-shaking. The +library is built in a modular way to allow to import only the parts you really +need. + +```js +import { createPopperLite as createPopper } from '@popperjs/core'; +``` + +The Lite version includes the most necessary modifiers that will compute the +offsets of the popper, compute and add the positioning styles, and add event +listeners. This is close in bundle size to pure CSS tooltip libraries, and +behaves somewhat similarly. + +However, this does not include the features that makes Popper truly useful. + +The two most useful modifiers not included in Lite are `preventOverflow` and +`flip`: + +```js +import { + createPopperLite as createPopper, + preventOverflow, + flip, +} from '@popperjs/core'; + +const button = document.querySelector('#button'); +const tooltip = document.querySelector('#tooltip'); + +createPopper(button, tooltip, { + modifiers: [preventOverflow, flip], +}); +``` + +As you make more poppers, you may be finding yourself needing other modifiers +provided by the library. + +See [tree-shaking](https://popper.js.org/docs/v2/performance/#tree-shaking) for more +information. + +## Distribution targets + +Popper is distributed in 3 different versions, in 3 different file formats. + +The 3 file formats are: + +- `esm` (works with `import` syntax — **recommended**) +- `umd` (works with ` +``` + +> Files are delivered via the CDN service provided by [jsdeliver](https://www.jsdelivr.com/) + +## Documentation + +```javascript +Toastify({ + text: "This is a toast", + duration: 3000, + destination: "https://github.com/apvarun/toastify-js", + newWindow: true, + close: true, + gravity: "top", // `top` or `bottom` + position: "left", // `left`, `center` or `right` + stopOnFocus: true, // Prevents dismissing of toast on hover + style: { + background: "linear-gradient(to right, #00b09b, #96c93d)", + }, + onClick: function(){} // Callback after click +}).showToast(); +``` + +> Toast messages will be centered on devices with screen width less than 360px. + +* See the [changelog](https://github.com/apvarun/toastify-js/blob/master/CHANGELOG.md) + +### Add own custom classes + +If you want to use custom classes on the toast for customizing (like info or warning for example), you can do that as follows: + +```javascript +Toastify({ + text: "This is a toast", + className: "info", + style: { + background: "linear-gradient(to right, #00b09b, #96c93d)", + } +}).showToast(); +``` + +Multiple classes also can be assigned as a string, with spaces between class names. + +### Add some offset + +If you want to add offset to the toast, you can do that as follows: + +```javascript +Toastify({ + text: "This is a toast with offset", + offset: { + x: 50, // horizontal axis - can be a number or a string indicating unity. eg: '2em' + y: 10 // vertical axis - can be a number or a string indicating unity. eg: '2em' + }, +}).showToast(); +``` + +Toast will be pushed 50px from right in x axis and 10px from top in y axis. + +**Note:** + +If `position` is equals to `left`, it will be pushed from left. +If `gravity` is equals to `bottom`, it will be pushed from bottom. + +## API + +| Option Key | type | Usage | Defaults | +|-----------------|----------------------|----------------------------------------------------------------------------|-------------| +| text | string | Message to be displayed in the toast | "Hi there!" | +| node | ELEMENT_NODE | Provide a node to be mounted inside the toast. `node` takes higher precedence over `text` | | +| duration | number | Duration for which the toast should be displayed.
-1 for permanent toast | 3000 | +| selector | string \| ELEMENT_NODE | ShadowRoot | CSS Selector or Element Node on which the toast should be added | body | +| destination | URL string | URL to which the browser should be navigated on click of the toast | | +| newWindow | boolean | Decides whether the `destination` should be opened in a new window or not | false | +| close | boolean | To show the close icon or not | false | +| gravity | "top" or "bottom" | To show the toast from top or bottom | "top" | +| position | "left" or "right" | To show the toast on left or right | "right" | +| backgroundColor | CSS background value | To be deprecated, use `style.background` option instead. Sets the background color of the toast | | +| avatar | URL string | Image/icon to be shown before text | | +| className | string | Ability to provide custom class name for further customization | | +| stopOnFocus | boolean | To stop timer when hovered over the toast (Only if duration is set) | true | +| callback | Function | Invoked when the toast is dismissed | | +| onClick | Function | Invoked when the toast is clicked | | +| offset | Object | Ability to add some offset to axis | | +| escapeMarkup | boolean | Toggle the default behavior of escaping HTML markup | true | +| style | object | Use the HTML DOM Style properties to add any style directly to toast | | +| ariaLive | string | Announce the toast to screen readers, see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions for options | "polite" | +| oldestFirst | boolean | Set the order in which toasts are stacked in page | true | + +> Deprecated properties: `backgroundColor` - use `style.background` option instead + +## Browsers support + +| ![][ie]
IE / Edge | ![][firefox]
Firefox | ![][chrome]
Chrome | ![][safari]
Safari | ![][opera]
Opera | +| ---------------------- | ------------------------- | ----------------------- | ----------------------- | --------------------- | +| IE10, IE11, Edge | last 10 versions | last 10 versions | last 10 versions | last 10 versions | + +## Contributors + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + AStoker +
+ AStoker + + 		+ + caiomoura1994 +
+ caiomoura1994 + + 		+ + rndevfx +
+ rndevfx + + 		+ + 1ess +
+ 1ess + + 		+ + d4rn0k +
+ d4rn0k + + 		+ + danielkaiser80 +
+ danielkaiser80 + +
+ + skjnldsv +
+ skjnldsv + + 		+ + chasedeanda +
+ chasedeanda + + 		+ + chrisgraham +
+ chrisgraham + + 		+ + Wachiwi +
+ Wachiwi + + 		+ + FeixuRuins +
+ FeixuRuins + + 		+ + gavinhungry +
+ gavinhungry + +
+ + haydster7 +
+ haydster7 + + 		+ + joaquinwojcik +
+ joaquinwojcik + + 		+ + juliushaertl +
+ juliushaertl + + 		+ + mort3za +
+ mort3za + + 		+ + Sandip124 +
+ Sandip124 + + 		+ + Tadaz +
+ Tadaz + +
+ + t12ung +
+ t12ung + + 		+ + victorfeijo +
+ victorfeijo + + 		+ + fiatjaf +
+ fiatjaf + + 		+ + prousseau-korem +
+ prousseau-korem + +
+ + + + +## License + +MIT © [Varun A P](https://github.com/apvarun) + +Buy Me A Coffee + +[ie]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/edge.png +[firefox]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/firefox.png +[chrome]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/chrome.png +[safari]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/safari.png +[opera]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/opera.png + diff --git a/node_modules/toastify-js/example/pattern.png b/node_modules/toastify-js/example/pattern.png new file mode 100644 index 0000000..310e886 Binary files /dev/null and b/node_modules/toastify-js/example/pattern.png differ diff --git a/node_modules/toastify-js/example/script.css b/node_modules/toastify-js/example/script.css new file mode 100644 index 0000000..8de04f5 --- /dev/null +++ b/node_modules/toastify-js/example/script.css @@ -0,0 +1,95 @@ +* { + box-sizing: border-box; +} + +html, body { + height: 100%; +} + +body { + font-family: Helvetica, Arial, sans-serif; + background-size: 100%; + margin: 0; + padding: 0; + color: #424242; +} + +.container { + overflow: hidden; + display: flex; + height: 100%; + justify-content: center; + flex-direction: column; + align-items: center; + background-color: whitesmoke; + background-image: url("./pattern.png"); +} + +.hidden { + display: none; +} + +.docs { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + background-color: white; + border: 1px solid #e3e3e3; + padding: 20px 20px; + width: 60%; + border-radius: 4px; +} + +.docs h2 { + margin-top: 0px; +} + +code p { + margin: 2px; +} + +.pad-left { + padding-left: 20px; +} + +.buttons { + margin: 20px; + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +.button { + overflow: hidden; + margin: 10px; + padding: 12px 12px; + cursor: pointer; + -webkit-transition: all 200ms ease-in-out; + transition: all 200ms ease-in-out; + text-align: center; + white-space: nowrap; + text-decoration: none; + text-transform: none; + text-transform: capitalize; + border-radius: 4px; + font-size: 13px; + font-weight: 500; + line-height: 1.3; + min-width: 100px; + display: inline-block; + box-shadow: 0 5px 20px rgba(22, 22, 22, 0.15); + color: #5477f5; + background-color: Snow; + border: 1px solid #5477f5; +} + +.button:hover { + color: #FFFFFF; + background: linear-gradient(135deg, #73a5ff, #5477f5); + border: 1px solid transparent; +} + +.repo { + margin: 10px; +} \ No newline at end of file diff --git a/node_modules/toastify-js/example/script.js b/node_modules/toastify-js/example/script.js new file mode 100644 index 0000000..8d290ff --- /dev/null +++ b/node_modules/toastify-js/example/script.js @@ -0,0 +1,72 @@ +var bgColors = [ + "linear-gradient(to right, #00b09b, #96c93d)", + "linear-gradient(to right, #ff5f6d, #ffc371)", + ], + i = 0; + +Toastify({ + text: "Hi", + duration: 4500, + destination: "https://github.com/apvarun/toastify-js", + newWindow: true, + gravity: "top", + position: 'left', +}).showToast(); + +setTimeout(function() { + Toastify({ + text: "Simple JavaScript Toasts", + gravity: "top", + position: 'center', + style: { + background: '#0f3443' + } + }).showToast(); +}, 1000); + +// Options for the toast +var options = { + text: "Happy toasting!", + duration: 2500, + callback: function() { + console.log("Toast hidden"); + Toastify.reposition(); + }, + close: true, + style: { + background: "linear-gradient(to right, #00b09b, #96c93d)", + } +}; + +// Initializing the toast +var myToast = Toastify(options); + +// Toast after delay +setTimeout(function() { + myToast.showToast(); +}, 4500); + +setTimeout(function() { + Toastify({ + text: "Highly customizable", + gravity: "bottom", + position: 'left', + close: true, + style: { + background: "linear-gradient(to right, #ff5f6d, #ffc371)", + } + }).showToast(); +}, 3000); + +// Displaying toast on manual action `Try` +document.getElementById("new-toast").addEventListener("click", function() { + Toastify({ + text: "I am a toast", + duration: 3000, + close: i % 3 ? true : false, + style: { + background: bgColors[i % 2], + } + }).showToast(); + i++; +}); diff --git a/node_modules/toastify-js/index.html b/node_modules/toastify-js/index.html new file mode 100644 index 0000000..9d58b9b --- /dev/null +++ b/node_modules/toastify-js/index.html @@ -0,0 +1,59 @@ + + + + + + + + Toastify JS - Pure JavaScript Toast Notificaton Library + + + + + + + + +
+
+

Toastify JS

+
+

Better notification messages

+
+ Try + Docs + Tweet +
+
+

Usage

+ +

Toastify({

+

text: "This is a toast",

+

duration: 3000

+

}).showToast();

+ +
+
+ +
+
+ + + + + + + + \ No newline at end of file diff --git a/node_modules/toastify-js/package.json b/node_modules/toastify-js/package.json new file mode 100644 index 0000000..52dcf26 --- /dev/null +++ b/node_modules/toastify-js/package.json @@ -0,0 +1,22 @@ +{ + "name": "toastify-js", + "version": "1.12.0", + "description": "Toastify is a lightweight, vanilla JS toast notification library.", + "main": "./src/toastify.js", + "repository": { + "type": "git", + "url": "git+https://github.com/apvarun/toastify-js.git" + }, + "keywords": [ + "toastify", + "javascript", + "notifications", + "toast" + ], + "author": "Varun A P", + "license": "MIT", + "bugs": { + "url": "https://github.com/apvarun/toastify-js/issues" + }, + "homepage": "https://github.com/apvarun/toastify-js#readme" +} diff --git a/node_modules/toastify-js/src/toastify-es.js b/node_modules/toastify-js/src/toastify-es.js new file mode 100644 index 0000000..784cf59 --- /dev/null +++ b/node_modules/toastify-js/src/toastify-es.js @@ -0,0 +1,466 @@ +/*! + * Toastify js 1.12.0 + * https://github.com/apvarun/toastify-js + * @license MIT licensed + * + * Copyright (C) 2018 Varun A P + */ + +/** + * Options used for Toastify + * @typedef {Object} ToastifyConfigurationObject + * @property {string} text - Message to be displayed in the toast + * @property {Element} node - Provide a node to be mounted inside the toast. node takes higher precedence over text + * @property {number} duration - Duration for which the toast should be displayed. -1 for permanent toast + * @property {string|Element} selector - CSS ID Selector on which the toast should be added + * @property {url} destination - URL to which the browser should be navigated on click of the toast + * @property {boolean} newWindow - Decides whether the destination should be opened in a new window or not + * @property {boolean} close - To show the close icon or not + * @property {string} gravity - To show the toast from top or bottom + * @property {string} position - To show the toast on left or right + * @property {string} backgroundColor - Deprecated: Sets the background color of the toast + * @property {url} avatar - Image/icon to be shown before text + * @property {string} className - Ability to provide custom class name for further customization + * @property {boolean} stopOnFocus - To stop timer when hovered over the toast (Only if duration is set) + * @property {Function} callback - Invoked when the toast is dismissed + * @property {Function} onClick - Invoked when the toast is clicked + * @property {Object} offset - Ability to add some offset to axis + * @property {boolean} escapeMarkup - Toggle the default behavior of escaping HTML markup + * @property {string} ariaLive - Use the HTML DOM style property to add styles to toast + * @property {Object} style - Use the HTML DOM style property to add styles to toast + */ + + +class Toastify { + + defaults = { + oldestFirst: true, + text: "Toastify is awesome!", + node: undefined, + duration: 3000, + selector: undefined, + callback: function() {}, + destination: undefined, + newWindow: false, + close: false, + gravity: "toastify-top", + positionLeft: false, + position: "", + backgroundColor: "", + avatar: "", + className: "", + stopOnFocus: true, + onClick: function() {}, + offset: { x: 0, y: 0 }, + escapeMarkup: true, + ariaLive: "polite", + style: { background: "" }, + }; + + constructor(options) { + /** + * The version of Toastify + * @type {string} + * @public + */ + this.version = "1.12.0"; + + /** + * The configuration object to configure Toastify + * @type {ToastifyConfigurationObject} + * @public + */ + this.options = {}; + + /** + * The element that is the Toast + * @type {Element} + * @public + */ + this.toastElement = null; + + /** + * The root element that contains all the toasts + * @type {Element} + * @private + */ + this._rootElement = document.body; + + this._init(options); + } + + /** + * Display the toast + * @public + */ + showToast() { + // Creating the DOM object for the toast + this.toastElement = this._buildToast(); + + // Getting the root element to with the toast needs to be added + if (typeof this.options.selector === "string") { + this._rootElement = document.getElementById(this.options.selector); + } else if (this.options.selector instanceof HTMLElement || this.options.selector instanceof ShadowRoot) { + this._rootElement = this.options.selector; + } else { + this._rootElement = document.body; + } + + // Validating if root element is present in DOM + if (!this._rootElement) { + throw "Root element is not defined"; + } + + // Adding the DOM element + this._rootElement.insertBefore(this.toastElement, this._rootElement.firstChild); + + // Repositioning the toasts in case multiple toasts are present + this._reposition(); + + if (this.options.duration > 0) { + this.toastElement.timeOutValue = window.setTimeout( + () => { + // Remove the toast from DOM + this._removeElement(this.toastElement); + }, + this.options.duration + ); // Binding `this` for function invocation + } + + // Supporting function chaining + return this; + } + + /** + * Hide the toast + * @public + */ + hideToast() { + if (this.toastElement.timeOutValue) { + clearTimeout(this.toastElement.timeOutValue); + } + this._removeElement(this.toastElement); + } + + /** + * Init the Toastify class + * @param {ToastifyConfigurationObject} options - The configuration object to configure Toastify + * @param {string} [options.text=Hi there!] - Message to be displayed in the toast + * @param {Element} [options.node] - Provide a node to be mounted inside the toast. node takes higher precedence over text + * @param {number} [options.duration=3000] - Duration for which the toast should be displayed. -1 for permanent toast + * @param {string} [options.selector] - CSS Selector on which the toast should be added + * @param {url} [options.destination] - URL to which the browser should be navigated on click of the toast + * @param {boolean} [options.newWindow=false] - Decides whether the destination should be opened in a new window or not + * @param {boolean} [options.close=false] - To show the close icon or not + * @param {string} [options.gravity=toastify-top] - To show the toast from top or bottom + * @param {string} [options.position=right] - To show the toast on left or right + * @param {string} [options.backgroundColor] - Sets the background color of the toast (To be deprecated) + * @param {url} [options.avatar] - Image/icon to be shown before text + * @param {string} [options.className] - Ability to provide custom class name for further customization + * @param {boolean} [options.stopOnFocus] - To stop timer when hovered over the toast (Only if duration is set) + * @param {Function} [options.callback] - Invoked when the toast is dismissed + * @param {Function} [options.onClick] - Invoked when the toast is clicked + * @param {Object} [options.offset] - Ability to add some offset to axis + * @param {boolean} [options.escapeMarkup=true] - Toggle the default behavior of escaping HTML markup + * @param {string} [options.ariaLive] - Announce the toast to screen readers + * @param {Object} [options.style] - Use the HTML DOM style property to add styles to toast + * @private + */ + _init(options) { + + // Setting defaults + this.options = Object.assign(this.defaults, options); + + if (this.options.backgroundColor) { + // This is being deprecated in favor of using the style HTML DOM property + console.warn('DEPRECATION NOTICE: "backgroundColor" is being deprecated. Please use the "style.background" property.'); + } + + this.toastElement = null; + + this.options.gravity = options.gravity === "bottom" ? "toastify-bottom" : "toastify-top"; // toast position - top or bottom + this.options.stopOnFocus = options.stopOnFocus === undefined ? true : options.stopOnFocus; // stop timeout on focus + if(options.backgroundColor) { + this.options.style.background = options.backgroundColor; + } + } + + /** + * Build the Toastify element + * @returns {Element} + * @private + */ + _buildToast() { + // Validating if the options are defined + if (!this.options) { + throw "Toastify is not initialized"; + } + + // Creating the DOM object + let divElement = document.createElement("div"); + divElement.className = `toastify on ${this.options.className}`; + + // Positioning toast to left or right or center (default right) + divElement.className += ` toastify-${this.options.position}`; + + // Assigning gravity of element + divElement.className += ` ${this.options.gravity}`; + + // Loop through our style object and apply styles to divElement + for (const property in this.options.style) { + divElement.style[property] = this.options.style[property]; + } + + // Announce the toast to screen readers + if (this.options.ariaLive) { + divElement.setAttribute('aria-live', this.options.ariaLive) + } + + // Adding the toast message/node + if (this.options.node && this.options.node.nodeType === Node.ELEMENT_NODE) { + // If we have a valid node, we insert it + divElement.appendChild(this.options.node) + } else { + if (this.options.escapeMarkup) { + divElement.innerText = this.options.text; + } else { + divElement.innerHTML = this.options.text; + } + + if (this.options.avatar !== "") { + let avatarElement = document.createElement("img"); + avatarElement.src = this.options.avatar; + + avatarElement.className = "toastify-avatar"; + + if (this.options.position == "left") { + // Adding close icon on the left of content + divElement.appendChild(avatarElement); + } else { + // Adding close icon on the right of content + divElement.insertAdjacentElement("afterbegin", avatarElement); + } + } + } + + // Adding a close icon to the toast + if (this.options.close === true) { + // Create a span for close element + let closeElement = document.createElement("button"); + closeElement.type = "button"; + closeElement.setAttribute("aria-label", "Close"); + closeElement.className = "toast-close"; + closeElement.innerHTML = "✖"; + + // Triggering the removal of toast from DOM on close click + closeElement.addEventListener( + "click", + (event) => { + event.stopPropagation(); + this._removeElement(this.toastElement); + window.clearTimeout(this.toastElement.timeOutValue); + } + ); + + //Calculating screen width + const width = window.innerWidth > 0 ? window.innerWidth : screen.width; + + // Adding the close icon to the toast element + // Display on the right if screen width is less than or equal to 360px + if ((this.options.position == "left") && width > 360) { + // Adding close icon on the left of content + divElement.insertAdjacentElement("afterbegin", closeElement); + } else { + // Adding close icon on the right of content + divElement.appendChild(closeElement); + } + } + + // Clear timeout while toast is focused + if (this.options.stopOnFocus && this.options.duration > 0) { + // stop countdown + divElement.addEventListener( + "mouseover", + (event) => { + window.clearTimeout(divElement.timeOutValue); + } + ) + // add back the timeout + divElement.addEventListener( + "mouseleave", + () => { + divElement.timeOutValue = window.setTimeout( + () => { + // Remove the toast from DOM + this._removeElement(divElement); + }, + this.options.duration + ) + } + ) + } + + // Adding an on-click destination path + if (typeof this.options.destination !== "undefined") { + divElement.addEventListener( + "click", + (event) => { + event.stopPropagation(); + if (this.options.newWindow === true) { + window.open(this.options.destination, "_blank"); + } else { + window.location = this.options.destination; + } + } + ); + } + + if (typeof this.options.onClick === "function" && typeof this.options.destination === "undefined") { + divElement.addEventListener( + "click", + (event) => { + event.stopPropagation(); + this.options.onClick(); + } + ); + } + + // Adding offset + if (typeof this.options.offset === "object") { + + const x = this._getAxisOffsetAValue("x", this.options); + const y = this._getAxisOffsetAValue("y", this.options); + + const xOffset = this.options.position == "left" ? x : `-${x}`; + const yOffset = this.options.gravity == "toastify-top" ? y : `-${y}`; + + divElement.style.transform = `translate(${xOffset},${yOffset})`; + + } + + // Returning the generated element + return divElement; + } + + /** + * Remove the toast from the DOM + * @param {Element} toastElement + */ + _removeElement(toastElement) { + // Hiding the element + toastElement.className = toastElement.className.replace(" on", ""); + + // Removing the element from DOM after transition end + window.setTimeout( + () => { + // remove options node if any + if (this.options.node && this.options.node.parentNode) { + this.options.node.parentNode.removeChild(this.options.node); + } + + // Remove the element from the DOM, only when the parent node was not removed before. + if (toastElement.parentNode) { + toastElement.parentNode.removeChild(toastElement); + } + + // Calling the callback function + this.options.callback.call(toastElement); + + // Repositioning the toasts again + this._reposition(); + }, + 400 + ); // Binding `this` for function invocation + } + + /** + * Position the toast on the DOM + * @private + */ + _reposition() { + + // Top margins with gravity + let topLeftOffsetSize = { + top: 15, + bottom: 15, + }; + let topRightOffsetSize = { + top: 15, + bottom: 15, + }; + let offsetSize = { + top: 15, + bottom: 15, + }; + + // Get all toast messages that have been added to the container (selector) + let allToasts = this._rootElement.querySelectorAll(".toastify"); + + let classUsed; + + // Modifying the position of each toast element + for (let i = 0; i < allToasts.length; i++) { + // Getting the applied gravity + if (allToasts[i].classList.contains("toastify-top") === true) { + classUsed = "toastify-top"; + } else { + classUsed = "toastify-bottom"; + } + + let height = allToasts[i].offsetHeight; + classUsed = classUsed.substr(9, classUsed.length - 1) + // Spacing between toasts + let offset = 15; + + let width = window.innerWidth > 0 ? window.innerWidth : screen.width; + + // Show toast in center if screen with less than or equal to 360px + if (width <= 360) { + // Setting the position + allToasts[i].style[classUsed] = `${offsetSize[classUsed]}px`; + + offsetSize[classUsed] += height + offset; + } else { + if (allToasts[i].classList.contains("toastify-left") === true) { + // Setting the position + allToasts[i].style[classUsed] = `${topLeftOffsetSize[classUsed]}px`; + + topLeftOffsetSize[classUsed] += height + offset; + } else { + // Setting the position + allToasts[i].style[classUsed] = `${topRightOffsetSize[classUsed]}px`; + + topRightOffsetSize[classUsed] += height + offset; + } + } + } + } + + /** + * Helper function to get offset + * @param {string} axis - 'x' or 'y' + * @param {ToastifyConfigurationObject} options - The options object containing the offset object + */ + _getAxisOffsetAValue(axis, options) { + + if (options.offset[axis]) { + if (isNaN(options.offset[axis])) { + return options.offset[axis]; + } else { + return `${options.offset[axis]}px`; + } + } + + return '0px'; + + } + + } + + + // Returning the Toastify function to be assigned to the window object/module + function StartToastifyInstance(options) { + return new Toastify(options); + } + + export default StartToastifyInstance; diff --git a/node_modules/toastify-js/src/toastify.css b/node_modules/toastify-js/src/toastify.css new file mode 100644 index 0000000..ccd65c8 --- /dev/null +++ b/node_modules/toastify-js/src/toastify.css @@ -0,0 +1,85 @@ +/*! + * Toastify js 1.12.0 + * https://github.com/apvarun/toastify-js + * @license MIT licensed + * + * Copyright (C) 2018 Varun A P + */ + +.toastify { + padding: 12px 20px; + color: #ffffff; + display: inline-block; + box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3); + background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5); + background: linear-gradient(135deg, #73a5ff, #5477f5); + position: fixed; + opacity: 0; + transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); + border-radius: 2px; + cursor: pointer; + text-decoration: none; + max-width: calc(50% - 20px); + z-index: 2147483647; +} + +.toastify.on { + opacity: 1; +} + +.toast-close { + background: transparent; + border: 0; + color: white; + cursor: pointer; + font-family: inherit; + font-size: 1em; + opacity: 0.4; + padding: 0 5px; +} + +.toastify-right { + right: 15px; +} + +.toastify-left { + left: 15px; +} + +.toastify-top { + top: -150px; +} + +.toastify-bottom { + bottom: -150px; +} + +.toastify-rounded { + border-radius: 25px; +} + +.toastify-avatar { + width: 1.5em; + height: 1.5em; + margin: -7px 5px; + border-radius: 2px; +} + +.toastify-center { + margin-left: auto; + margin-right: auto; + left: 0; + right: 0; + max-width: fit-content; + max-width: -moz-fit-content; +} + +@media only screen and (max-width: 360px) { + .toastify-right, .toastify-left { + margin-left: auto; + margin-right: auto; + left: 0; + right: 0; + max-width: fit-content; + } +} diff --git a/node_modules/toastify-js/src/toastify.js b/node_modules/toastify-js/src/toastify.js new file mode 100644 index 0000000..5d9659c --- /dev/null +++ b/node_modules/toastify-js/src/toastify.js @@ -0,0 +1,445 @@ +/*! + * Toastify js 1.12.0 + * https://github.com/apvarun/toastify-js + * @license MIT licensed + * + * Copyright (C) 2018 Varun A P + */ +(function(root, factory) { + if (typeof module === "object" && module.exports) { + module.exports = factory(); + } else { + root.Toastify = factory(); + } +})(this, function(global) { + // Object initialization + var Toastify = function(options) { + // Returning a new init object + return new Toastify.lib.init(options); + }, + // Library version + version = "1.12.0"; + + // Set the default global options + Toastify.defaults = { + oldestFirst: true, + text: "Toastify is awesome!", + node: undefined, + duration: 3000, + selector: undefined, + callback: function () { + }, + destination: undefined, + newWindow: false, + close: false, + gravity: "toastify-top", + positionLeft: false, + position: '', + backgroundColor: '', + avatar: "", + className: "", + stopOnFocus: true, + onClick: function () { + }, + offset: {x: 0, y: 0}, + escapeMarkup: true, + ariaLive: 'polite', + style: {background: ''} + }; + + // Defining the prototype of the object + Toastify.lib = Toastify.prototype = { + toastify: version, + + constructor: Toastify, + + // Initializing the object with required parameters + init: function(options) { + // Verifying and validating the input object + if (!options) { + options = {}; + } + + // Creating the options object + this.options = {}; + + this.toastElement = null; + + // Validating the options + this.options.text = options.text || Toastify.defaults.text; // Display message + this.options.node = options.node || Toastify.defaults.node; // Display content as node + this.options.duration = options.duration === 0 ? 0 : options.duration || Toastify.defaults.duration; // Display duration + this.options.selector = options.selector || Toastify.defaults.selector; // Parent selector + this.options.callback = options.callback || Toastify.defaults.callback; // Callback after display + this.options.destination = options.destination || Toastify.defaults.destination; // On-click destination + this.options.newWindow = options.newWindow || Toastify.defaults.newWindow; // Open destination in new window + this.options.close = options.close || Toastify.defaults.close; // Show toast close icon + this.options.gravity = options.gravity === "bottom" ? "toastify-bottom" : Toastify.defaults.gravity; // toast position - top or bottom + this.options.positionLeft = options.positionLeft || Toastify.defaults.positionLeft; // toast position - left or right + this.options.position = options.position || Toastify.defaults.position; // toast position - left or right + this.options.backgroundColor = options.backgroundColor || Toastify.defaults.backgroundColor; // toast background color + this.options.avatar = options.avatar || Toastify.defaults.avatar; // img element src - url or a path + this.options.className = options.className || Toastify.defaults.className; // additional class names for the toast + this.options.stopOnFocus = options.stopOnFocus === undefined ? Toastify.defaults.stopOnFocus : options.stopOnFocus; // stop timeout on focus + this.options.onClick = options.onClick || Toastify.defaults.onClick; // Callback after click + this.options.offset = options.offset || Toastify.defaults.offset; // toast offset + this.options.escapeMarkup = options.escapeMarkup !== undefined ? options.escapeMarkup : Toastify.defaults.escapeMarkup; + this.options.ariaLive = options.ariaLive || Toastify.defaults.ariaLive; + this.options.style = options.style || Toastify.defaults.style; + if(options.backgroundColor) { + this.options.style.background = options.backgroundColor; + } + + // Returning the current object for chaining functions + return this; + }, + + // Building the DOM element + buildToast: function() { + // Validating if the options are defined + if (!this.options) { + throw "Toastify is not initialized"; + } + + // Creating the DOM object + var divElement = document.createElement("div"); + divElement.className = "toastify on " + this.options.className; + + // Positioning toast to left or right or center + if (!!this.options.position) { + divElement.className += " toastify-" + this.options.position; + } else { + // To be depreciated in further versions + if (this.options.positionLeft === true) { + divElement.className += " toastify-left"; + console.warn('Property `positionLeft` will be depreciated in further versions. Please use `position` instead.') + } else { + // Default position + divElement.className += " toastify-right"; + } + } + + // Assigning gravity of element + divElement.className += " " + this.options.gravity; + + if (this.options.backgroundColor) { + // This is being deprecated in favor of using the style HTML DOM property + console.warn('DEPRECATION NOTICE: "backgroundColor" is being deprecated. Please use the "style.background" property.'); + } + + // Loop through our style object and apply styles to divElement + for (var property in this.options.style) { + divElement.style[property] = this.options.style[property]; + } + + // Announce the toast to screen readers + if (this.options.ariaLive) { + divElement.setAttribute('aria-live', this.options.ariaLive) + } + + // Adding the toast message/node + if (this.options.node && this.options.node.nodeType === Node.ELEMENT_NODE) { + // If we have a valid node, we insert it + divElement.appendChild(this.options.node) + } else { + if (this.options.escapeMarkup) { + divElement.innerText = this.options.text; + } else { + divElement.innerHTML = this.options.text; + } + + if (this.options.avatar !== "") { + var avatarElement = document.createElement("img"); + avatarElement.src = this.options.avatar; + + avatarElement.className = "toastify-avatar"; + + if (this.options.position == "left" || this.options.positionLeft === true) { + // Adding close icon on the left of content + divElement.appendChild(avatarElement); + } else { + // Adding close icon on the right of content + divElement.insertAdjacentElement("afterbegin", avatarElement); + } + } + } + + // Adding a close icon to the toast + if (this.options.close === true) { + // Create a span for close element + var closeElement = document.createElement("button"); + closeElement.type = "button"; + closeElement.setAttribute("aria-label", "Close"); + closeElement.className = "toast-close"; + closeElement.innerHTML = "✖"; + + // Triggering the removal of toast from DOM on close click + closeElement.addEventListener( + "click", + function(event) { + event.stopPropagation(); + this.removeElement(this.toastElement); + window.clearTimeout(this.toastElement.timeOutValue); + }.bind(this) + ); + + //Calculating screen width + var width = window.innerWidth > 0 ? window.innerWidth : screen.width; + + // Adding the close icon to the toast element + // Display on the right if screen width is less than or equal to 360px + if ((this.options.position == "left" || this.options.positionLeft === true) && width > 360) { + // Adding close icon on the left of content + divElement.insertAdjacentElement("afterbegin", closeElement); + } else { + // Adding close icon on the right of content + divElement.appendChild(closeElement); + } + } + + // Clear timeout while toast is focused + if (this.options.stopOnFocus && this.options.duration > 0) { + var self = this; + // stop countdown + divElement.addEventListener( + "mouseover", + function(event) { + window.clearTimeout(divElement.timeOutValue); + } + ) + // add back the timeout + divElement.addEventListener( + "mouseleave", + function() { + divElement.timeOutValue = window.setTimeout( + function() { + // Remove the toast from DOM + self.removeElement(divElement); + }, + self.options.duration + ) + } + ) + } + + // Adding an on-click destination path + if (typeof this.options.destination !== "undefined") { + divElement.addEventListener( + "click", + function(event) { + event.stopPropagation(); + if (this.options.newWindow === true) { + window.open(this.options.destination, "_blank"); + } else { + window.location = this.options.destination; + } + }.bind(this) + ); + } + + if (typeof this.options.onClick === "function" && typeof this.options.destination === "undefined") { + divElement.addEventListener( + "click", + function(event) { + event.stopPropagation(); + this.options.onClick(); + }.bind(this) + ); + } + + // Adding offset + if(typeof this.options.offset === "object") { + + var x = getAxisOffsetAValue("x", this.options); + var y = getAxisOffsetAValue("y", this.options); + + var xOffset = this.options.position == "left" ? x : "-" + x; + var yOffset = this.options.gravity == "toastify-top" ? y : "-" + y; + + divElement.style.transform = "translate(" + xOffset + "," + yOffset + ")"; + + } + + // Returning the generated element + return divElement; + }, + + // Displaying the toast + showToast: function() { + // Creating the DOM object for the toast + this.toastElement = this.buildToast(); + + // Getting the root element to with the toast needs to be added + var rootElement; + if (typeof this.options.selector === "string") { + rootElement = document.getElementById(this.options.selector); + } else if (this.options.selector instanceof HTMLElement || (typeof ShadowRoot !== 'undefined' && this.options.selector instanceof ShadowRoot)) { + rootElement = this.options.selector; + } else { + rootElement = document.body; + } + + // Validating if root element is present in DOM + if (!rootElement) { + throw "Root element is not defined"; + } + + // Adding the DOM element + var elementToInsert = Toastify.defaults.oldestFirst ? rootElement.firstChild : rootElement.lastChild; + rootElement.insertBefore(this.toastElement, elementToInsert); + + // Repositioning the toasts in case multiple toasts are present + Toastify.reposition(); + + if (this.options.duration > 0) { + this.toastElement.timeOutValue = window.setTimeout( + function() { + // Remove the toast from DOM + this.removeElement(this.toastElement); + }.bind(this), + this.options.duration + ); // Binding `this` for function invocation + } + + // Supporting function chaining + return this; + }, + + hideToast: function() { + if (this.toastElement.timeOutValue) { + clearTimeout(this.toastElement.timeOutValue); + } + this.removeElement(this.toastElement); + }, + + // Removing the element from the DOM + removeElement: function(toastElement) { + // Hiding the element + // toastElement.classList.remove("on"); + toastElement.className = toastElement.className.replace(" on", ""); + + // Removing the element from DOM after transition end + window.setTimeout( + function() { + // remove options node if any + if (this.options.node && this.options.node.parentNode) { + this.options.node.parentNode.removeChild(this.options.node); + } + + // Remove the element from the DOM, only when the parent node was not removed before. + if (toastElement.parentNode) { + toastElement.parentNode.removeChild(toastElement); + } + + // Calling the callback function + this.options.callback.call(toastElement); + + // Repositioning the toasts again + Toastify.reposition(); + }.bind(this), + 400 + ); // Binding `this` for function invocation + }, + }; + + // Positioning the toasts on the DOM + Toastify.reposition = function() { + + // Top margins with gravity + var topLeftOffsetSize = { + top: 15, + bottom: 15, + }; + var topRightOffsetSize = { + top: 15, + bottom: 15, + }; + var offsetSize = { + top: 15, + bottom: 15, + }; + + // Get all toast messages on the DOM + var allToasts = document.getElementsByClassName("toastify"); + + var classUsed; + + // Modifying the position of each toast element + for (var i = 0; i < allToasts.length; i++) { + // Getting the applied gravity + if (containsClass(allToasts[i], "toastify-top") === true) { + classUsed = "toastify-top"; + } else { + classUsed = "toastify-bottom"; + } + + var height = allToasts[i].offsetHeight; + classUsed = classUsed.substr(9, classUsed.length-1) + // Spacing between toasts + var offset = 15; + + var width = window.innerWidth > 0 ? window.innerWidth : screen.width; + + // Show toast in center if screen with less than or equal to 360px + if (width <= 360) { + // Setting the position + allToasts[i].style[classUsed] = offsetSize[classUsed] + "px"; + + offsetSize[classUsed] += height + offset; + } else { + if (containsClass(allToasts[i], "toastify-left") === true) { + // Setting the position + allToasts[i].style[classUsed] = topLeftOffsetSize[classUsed] + "px"; + + topLeftOffsetSize[classUsed] += height + offset; + } else { + // Setting the position + allToasts[i].style[classUsed] = topRightOffsetSize[classUsed] + "px"; + + topRightOffsetSize[classUsed] += height + offset; + } + } + } + + // Supporting function chaining + return this; + }; + + // Helper function to get offset. + function getAxisOffsetAValue(axis, options) { + + if(options.offset[axis]) { + if(isNaN(options.offset[axis])) { + return options.offset[axis]; + } + else { + return options.offset[axis] + 'px'; + } + } + + return '0px'; + + } + + function containsClass(elem, yourClass) { + if (!elem || typeof yourClass !== "string") { + return false; + } else if ( + elem.className && + elem.className + .trim() + .split(/\s+/gi) + .indexOf(yourClass) > -1 + ) { + return true; + } else { + return false; + } + } + + // Setting up the prototype for the init object + Toastify.lib.init.prototype = Toastify.lib; + + // Returning the Toastify function to be assigned to the window object/module + return Toastify; +}); diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..022c911 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,46 @@ +{ + "name": "Internship", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "dependencies": { + "bootstrap": "^5.3.3", + "toastify-js": "^1.12.0" + } + }, + "node_modules/@popperjs/core": { + "version": "2.11.8", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", + "peer": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, + "node_modules/bootstrap": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz", + "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ], + "peerDependencies": { + "@popperjs/core": "^2.11.8" + } + }, + "node_modules/toastify-js": { + "version": "1.12.0", + "resolved": "https://registry.npmjs.org/toastify-js/-/toastify-js-1.12.0.tgz", + "integrity": "sha512-HeMHCO9yLPvP9k0apGSdPUWrUbLnxUKNFzgUoZp1PHCLploIX/4DSQ7V8H25ef+h4iO9n0he7ImfcndnN6nDrQ==" + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..17f938a --- /dev/null +++ b/package.json @@ -0,0 +1,6 @@ +{ + "dependencies": { + "bootstrap": "^5.3.3", + "toastify-js": "^1.12.0" + } +}