Update API Docs

2025-10-27 16:26:31 +01:00 · 2023-08-21 04:17:16 -04:00
parent d3730ac1a9
commit d5aea26960
44 changed files with 12895 additions and 1468 deletions
--- a/docs/frontend_api/widgets_basic_widget.js.html
+++ b/docs/frontend_api/widgets_basic_widget.js.html
@@ -0,0 +1,230 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Source: widgets/basic_widget.js</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Source: widgets/basic_widget.js</h1>
+
+    
+
+
+
+    
+    <section>
+        <article>
+            <pre class="prettyprint source linenums"><code>import Component from "../components/component.js";
+
+
+/**
+ * This is the base widget for all other widgets.
+ * 
+ * For information on using widgets, see the tutorial {@tutorial widget_basics}.
+ */
+class BasicWidget extends Component {
+    constructor() {
+        super();
+
+        this.attrs = {
+            style: ''
+        };
+        this.classes = [];
+
+        this.children = [];
+        this.childPositionCounter = 10;
+    }
+
+    child(...components) {
+        if (!components) {
+            return this;
+        }
+
+        super.child(...components);
+
+        for (const component of components) {
+            if (component.position === undefined) {
+                component.position = this.childPositionCounter;
+                this.childPositionCounter += 10;
+            }
+        }
+
+        this.children.sort((a, b) => a.position - b.position &lt; 0 ? -1 : 1);
+
+        return this;
+    }
+
+    id(id) {
+        this.attrs.id = id;
+        return this;
+    }
+
+    class(className) {
+        this.classes.push(className);
+        return this;
+    }
+
+    css(name, value) {
+        this.attrs.style += `${name}: ${value};`;
+        return this;
+    }
+
+    contentSized() {
+        this.css("contain", "none");
+
+        return this;
+    }
+
+    collapsible() {
+        this.css('min-height', '0');
+        this.css('min-width', '0');
+        return this;
+    }
+
+    filling() {
+        this.css('flex-grow', '1');
+        return this;
+    }
+
+    /**
+     * Accepts a string of CSS to add with the widget.
+     * @param {string} block 
+     * @returns {this} for chaining
+     */
+    cssBlock(block) {
+        this.cssEl = block;
+        return this;
+    }
+
+    render() {
+        this.doRender();
+
+        this.$widget.attr('data-component-id', this.componentId);
+        this.$widget.addClass('component')
+            .prop('component', this);
+
+        if (!this.isEnabled()) {
+            this.toggleInt(false);
+        }
+
+        if (this.cssEl) {
+            const css = this.cssEl.trim().startsWith('&lt;style>') ? this.cssEl : `&lt;style>${this.cssEl}&lt;/style>`;
+
+            this.$widget.append(css);
+        }
+
+        for (const key in this.attrs) {
+            if (key === 'style') {
+                if (this.attrs[key]) {
+                    let style = this.$widget.attr('style');
+                    style = style ? `${style}; ${this.attrs[key]}` : this.attrs[key];
+
+                    this.$widget.attr(key, style);
+                }
+            }
+            else {
+                this.$widget.attr(key, this.attrs[key]);
+            }
+        }
+
+        for (const className of this.classes) {
+            this.$widget.addClass(className);
+        }
+
+        return this.$widget;
+    }
+
+    isEnabled() {
+        return true;
+    }
+
+    /**
+     * Method used for rendering the widget.
+     * 
+     * Your class should override this method.
+     * @returns {JQuery&lt;HTMLElement>} Your widget.
+     */
+    doRender() {}
+
+    toggleInt(show) {
+        this.$widget.toggleClass('hidden-int', !show);
+    }
+
+    isHiddenInt() {
+        return this.$widget.hasClass('hidden-int');
+    }
+
+    toggleExt(show) {
+        this.$widget.toggleClass('hidden-ext', !show);
+    }
+
+    isHiddenExt() {
+        return this.$widget.hasClass('hidden-ext');
+    }
+
+    canBeShown() {
+        return !this.isHiddenInt() &amp;&amp; !this.isHiddenExt();
+    }
+
+    isVisible() {
+        return this.$widget.is(":visible");
+    }
+
+    getPosition() {
+        return this.position;
+    }
+
+    remove() {
+        if (this.$widget) {
+            this.$widget.remove();
+        }
+    }
+
+    getClosestNtxId() {
+        if (this.$widget) {
+            return this.$widget.closest("[data-ntx-id]").attr("data-ntx-id");
+        }
+        else {
+            return null;
+        }
+    }
+
+    cleanup() {}
+}
+
+export default BasicWidget;
+</code></pre>
+        </article>
+    </section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="BasicWidget.html">BasicWidget</a></li><li><a href="FAttachment.html">FAttachment</a></li><li><a href="FAttribute.html">FAttribute</a></li><li><a href="FBranch.html">FBranch</a></li><li><a href="FNote.html">FNote</a></li><li><a href="FrontendScriptApi.html">FrontendScriptApi</a></li><li><a href="NoteContextAwareWidget.html">NoteContextAwareWidget</a></li><li><a href="RightPanelWidget.html">RightPanelWidget</a></li></ul><h3>Global</h3><ul><li><a href="global.html#api">api</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.2</a>
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>