@pb33f/cowboy-components 0.5.4 → 0.5.6

package/dist/components/rodeo/rodeo-nav.d.ts

@@ -0,0 +1,6 @@
+import { LitElement } from "lit";
+export declare class RodeoNav extends LitElement {
+    static styles: import("lit").CSSResult[];
+    constructor();
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/rodeo/rodeo-nav.js

@@ -0,0 +1,31 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from "lit";
+import { customElement } from "lit/decorators.js";
+import listsCss from "../../css/lists.css";
+import rodeoNavCss from "./rodeo-nav.css";
+import linksCss from "../../css/links.css";
+let RodeoNav = class RodeoNav extends LitElement {
+    constructor() {
+        super();
+    }
+    render() {
+        return html `
+            <nav>
+                <ul>
+                    <li><a href="/">roundup</a></li>
+                    <li><a href="users/">patrons</a></li>
+                </ul>
+            </nav>
+        `;
+    }
+};
+RodeoNav.styles = [listsCss, rodeoNavCss, linksCss];
+RodeoNav = __decorate([
+    customElement('pb33f-rodeo-nav')
+], RodeoNav);
+export { RodeoNav };

package/dist/components/rodeo/rodeo.css.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/rodeo/rodeo.css.js

@@ -0,0 +1,17 @@
+import { css } from "lit";
+export default css `
+    
+    :host {
+        height: 100%
+    }
+    
+    main {
+        display: flex;
+        height: calc(100% - 80px);
+    }
+    
+    #outlet {
+        padding: 10px;
+    }
+
+`;

package/dist/components/rodeo/rodeo.d.ts

@@ -0,0 +1,10 @@
+import { LitElement } from "lit";
+import './rodeo-nav.js';
+import './roundup.ts';
+import './users.ts';
+export declare class Rodeo extends LitElement {
+    static styles: import("lit").CSSResult[];
+    constructor();
+    firstUpdated(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/rodeo/rodeo.js

@@ -0,0 +1,41 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from "lit";
+import { customElement } from "lit/decorators.js";
+import rodeoCss from "./rodeo.css";
+import listsCss from "../../css/lists.css";
+import { Router } from '@vaadin/router';
+import './rodeo-nav.js';
+import './roundup.ts';
+import './users.ts';
+let Rodeo = class Rodeo extends LitElement {
+    constructor() {
+        super();
+    }
+    firstUpdated() {
+        const router = new Router(this.shadowRoot?.getElementById('outlet'));
+        console.log('router', router);
+        router?.setRoutes([
+            { path: '/rodeo.html', component: 'pb33f-rodeo-home' },
+            { path: '/', component: 'pb33f-rodeo-home' },
+            { path: '/users', component: 'pb33f-rodeo-users' }
+        ]);
+    }
+    render() {
+        return html `
+            <main>
+                <pb33f-rodeo-nav></pb33f-rodeo-nav>
+                <div id="outlet"></div>
+            </main>
+        `;
+    }
+};
+Rodeo.styles = [rodeoCss, listsCss];
+Rodeo = __decorate([
+    customElement('pb33f-rodeo')
+], Rodeo);
+export { Rodeo };

package/dist/components/rodeo/roundup.d.ts

@@ -0,0 +1,4 @@
+import { LitElement } from "lit";
+export declare class RodeoHome extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/rodeo/roundup.js

@@ -0,0 +1,18 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from "lit";
+import { customElement } from "lit/decorators.js";
+let RodeoHome = class RodeoHome extends LitElement {
+    render() {
+        return html `
+        `;
+    }
+};
+RodeoHome = __decorate([
+    customElement('pb33f-rodeo-home')
+], RodeoHome);
+export { RodeoHome };

package/dist/components/rodeo/users.d.ts

@@ -0,0 +1,4 @@
+import { LitElement } from "lit";
+export declare class RodeoUsers extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/rodeo/users.js

@@ -0,0 +1,17 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from "lit";
+import { customElement } from "lit/decorators.js";
+let RodeoUsers = class RodeoUsers extends LitElement {
+    render() {
+        return html `USERS`;
+    }
+};
+RodeoUsers = __decorate([
+    customElement('pb33f-rodeo-users')
+], RodeoUsers);
+export { RodeoUsers };

package/dist/components/the-doctor/the-doctor.css.js

@@ -53,7 +53,7 @@ export default css `
 
     sl-split-panel {
         width: 100%;
-       // height: calc(100% - 65px);
+        height: 100%;
         --divider-width: 2px;
     }
 
@@ -188,6 +188,10 @@ export default css `
         width: 100%;
     }
 
+    .tab-group {
+        height: 100%
+    }
+    
     sl-tab-panel.tab-panel::part(base) {
         height: 100%;
         padding-top: 5px;

package/dist/components/the-doctor/the-doctor.d.ts

@@ -74,9 +74,11 @@ export declare class TheDoctor extends LitElement {
     splitPanelExplorer: SlSplitPanel;
     splitPanelRolodex: SlSplitPanel;
     splitPanelInspector: SlSplitPanel;
+    private randomTicker;
     private rulesetPulse;
     explorerVisible: boolean;
     minimapVisible: boolean;
+    minimapIconVisible: boolean;
     explorerBooted: boolean;
     activeURL: string;
     rolodexNeedsReset: boolean;
@@ -160,7 +162,9 @@ export declare class TheDoctor extends LitElement {
     readonly nodeLimit: number;
     private pendingLine;
     private rolodexDividerPosition;
+    private authController;
     constructor(doctorEndpoint?: string);
+    tickRandomly(): void;
     nukeWorkspaceHandler(): void;
     minimapToggled(): void;
     firstUpdated(): void;
@@ -224,6 +228,8 @@ export declare class TheDoctor extends LitElement {
     selectControlTab(event: CustomEvent): void;
     toggleSidebar(): void;
     toggleExplorer(): void;
+    hideMinimapIcon(): void;
+    showMinimapIcon(): void;
     closeExplorer(): void;
     render(): import("lit-html").TemplateResult<1>;
     fetchUrl(event: CustomEvent<ArchiveURLRequestedEvent>): void;

package/dist/components/the-doctor/the-doctor.js

@@ -54,6 +54,7 @@ import { NodeType } from "../../model/node_type";
 import tooltipCss from "../../css/tooltip.css";
 import { NukeWorkspaceComponent } from "./nuke-workspace";
 import { CreditTicker } from "../credit-ticker/credit-ticker";
+import { AuthService } from "../../services/auth-service";
 export const GraphBag = "pb33f-doctor-graph";
 export const PanelStateBag = "pb33f-doctor-panel-state";
 export const RolodexResponseBag = "pb33f-doctor-rolodex-response";
@@ -87,6 +88,7 @@ let TheDoctor = class TheDoctor extends LitElement {
         // rolodex divider state (because it may not exist)
         this.rolodexDividerPosition = 40;
         this._firstRun = true;
+        //this.authController = new AuthController(this)
         // bus it up
         this.bus = CreateBus();
         this.doctorServiceChannel = this.bus.createChannel(DoctorServiceChannel);
@@ -142,7 +144,9 @@ let TheDoctor = class TheDoctor extends LitElement {
         this.renderedNode = new RenderedNodeComponent();
         this.references = [];
         this.minimapVisible = true;
+        this.minimapIconVisible = true;
         this.nodeLimit = 150;
+        this.randomTicker = 0;
         // extract the doctor endpoint from session storage.
         const sessionEndpoint = sessionStorage.getItem(DoctorEndpoint);
         if (sessionEndpoint) {
@@ -229,6 +233,9 @@ let TheDoctor = class TheDoctor extends LitElement {
             }
         });
     }
+    tickRandomly() {
+        this.randomTicker = Math.floor(Math.random() * 9999999);
+    }
     nukeWorkspaceHandler() {
         this.bagManager.resetBags();
         ModelService.resetWorkspace().then(() => {
@@ -1044,6 +1051,7 @@ let TheDoctor = class TheDoctor extends LitElement {
                 }
                 // determine if the score went up or down and toast it!
                 this.problemsOverview.statistics = result;
+                this.tickRandomly(); // tick randomly to refresh docs iframe.
                 // TODO: re-evaluate these toasts, they get annoying, fucking fast.
                 // if (this.problemsOverview.statistics) {
                 //     const newScore = result.statistics.overallScore;
@@ -1256,6 +1264,7 @@ let TheDoctor = class TheDoctor extends LitElement {
         FeedbackService.doctorEndpoint = this.doctorEndpoint;
         RulesetService.doctorEndpoint = this.doctorEndpoint;
         ModelService.doctorEndpoint = this.doctorEndpoint;
+        AuthService.doctorEndpoint = this.doctorEndpoint;
         this.connectToBroker();
         this.graphBag = this.bagManager.getBag(GraphBag);
         this.docBag = this.bagManager.getBag(DoctorDocumentBag);
@@ -1991,6 +2000,7 @@ let TheDoctor = class TheDoctor extends LitElement {
         if (this.explorerVisible && this.activeNode) {
             this.explorer.moveToNode(this.activeNode);
         }
+        this.hideMinimapIcon();
         this.explorerBooted = true;
         // check if ths is safari and fire a warning toast!
         const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
@@ -2003,8 +2013,17 @@ let TheDoctor = class TheDoctor extends LitElement {
             });
         }
     }
+    hideMinimapIcon() {
+        console.log('hiding minimap icon');
+        this.minimapIconVisible = false;
+    }
+    showMinimapIcon() {
+        console.log('showing minimap icon');
+        this.minimapIconVisible = true;
+    }
     closeExplorer() {
         this.explorerVisible = false;
+        this.showMinimapIcon();
         setTimeout(() => {
             if (this.pendingLine > 0) {
                 this.editor.editor?.setPosition({ lineNumber: this.pendingLine, column: 1 });
@@ -2141,10 +2160,11 @@ let TheDoctor = class TheDoctor extends LitElement {
                                      class="divider-vert"></sl-icon>
                             <div class="editor" slot="start">
 
-                                <sl-tooltip class="minimap-tip" content="Toggle source mini-map" hoist>
+                                <sl-tooltip class="minimap-tip" content="Toggle source mini-map" hoist  style="${!this.minimapIconVisible ? 'display: none' : ''}">  
                                     <sl-icon-button @click="${this.minimapToggled}"
                                                     name="map"
-                                                    class="minimap-toggle ${this.minimapVisible ? 'active' : ''}"></sl-icon-button>
+                                                    class="minimap-toggle ${this.minimapVisible ? 'active' : ''}" 
+                                                    style="${!this.minimapIconVisible ? 'display: none' : ''}"></sl-icon-button>
                                 </sl-tooltip>
 
                                 ${this.detailsDrawer}
@@ -2163,6 +2183,11 @@ let TheDoctor = class TheDoctor extends LitElement {
                                         Ruleset ${rulesetPulsePill}
                                     </sl-tab>
 
+                                    <sl-tab slot="nav" panel="docs" class="tab" id="docs" @click="${this.hideMinimapIcon}">
+                                        API Docs
+                                    </sl-tab>
+                                    
+
                                     <sl-tab-panel name="spec" class="tab-panel">
                                         <div class="main-view">
                                             ${this.statusBar}
@@ -2186,7 +2211,6 @@ let TheDoctor = class TheDoctor extends LitElement {
                                                 </div>
                                             </div>
 
-
                                             <!-- EDITOR -->
                                             <slot name="spec-editor"></slot>
                                             <!-- EDITOR -->
@@ -2202,6 +2226,10 @@ let TheDoctor = class TheDoctor extends LitElement {
                                                   @mouseleave="${this.ungrabExplorer}">${this.explorer}
                                     </sl-tab-panel>
 
+                                    <sl-tab-panel name="docs" class="tab-panel" style="height: calc(100vh - 100px)">
+                                        <iframe src="${this.doctorEndpoint}/model/scalar-template?z=${this.randomTicker}" width="100%" height="100%" style="border: none"></iframe>
+                                    </sl-tab-panel>
+
                                 </sl-tab-group>
                             </div>
                             ${mainPanelView}
@@ -2210,14 +2238,6 @@ let TheDoctor = class TheDoctor extends LitElement {
                 </sl-split-panel>
 
             </div>`;
-        //
-        // docs   <iframe src="/docs.html" width="100%" height="100%"
-        //                                                 style="border: none"></iframe>
-        //    <sl-tab slot="nav" panel="docs" class="tab" id="docs">
-        //                                         Docs
-        //                                     </sl-tab>
-        // <sl-tab-panel name="docs" class="tab-panel">
-        //                                     </sl-tab-panel>
     }
     fetchUrl(event) {
         this.activeURL = event.detail.url;
@@ -2320,6 +2340,9 @@ __decorate([
 __decorate([
     query('#inspector-split-panel')
 ], TheDoctor.prototype, "splitPanelInspector", void 0);
+__decorate([
+    state()
+], TheDoctor.prototype, "randomTicker", void 0);
 __decorate([
     state()
 ], TheDoctor.prototype, "rulesetPulse", void 0);
@@ -2329,6 +2352,9 @@ __decorate([
 __decorate([
     state()
 ], TheDoctor.prototype, "minimapVisible", void 0);
+__decorate([
+    state()
+], TheDoctor.prototype, "minimapIconVisible", void 0);
 __decorate([
     state()
 ], TheDoctor.prototype, "activeURL", void 0);

package/dist/controllers/auth.d.ts

@@ -0,0 +1,14 @@
+import { ReactiveControllerHost } from 'lit';
+import { AuthenticationState } from "../model/auth";
+export declare class AuthController {
+    host: ReactiveControllerHost;
+    doctorEndpoint: string;
+    state: AuthenticationState | null;
+    authenticated: boolean;
+    urlCapture: string | null;
+    constructor(host: ReactiveControllerHost);
+    hostConnected(): void;
+    authGithub(): void;
+    logout(): void;
+    checkState(): Promise<AuthenticationState>;
+}

package/dist/controllers/auth.js

@@ -0,0 +1,46 @@
+import { AuthenticationGithubRequested, LogoutRequested } from "../events/doctor";
+import { AuthService } from "../services/auth-service";
+const PreAuthURL = "pb33f-preauth-url";
+export class AuthController {
+    constructor(host) {
+        this.host = host;
+        this.host.addController(this);
+        this.doctorEndpoint = 'https://doctor.pb33f.io';
+        const sessionEndpoint = sessionStorage.getItem("doctor-endpoint");
+        if (sessionEndpoint) {
+            this.doctorEndpoint = sessionEndpoint;
+        }
+        AuthService.doctorEndpoint = this.doctorEndpoint;
+    }
+    hostConnected() {
+        window.addEventListener(AuthenticationGithubRequested, this.authGithub.bind(this));
+        window.addEventListener(LogoutRequested, this.logout.bind(this));
+        // check for urlcapture
+        const urlState = sessionStorage.getItem(PreAuthURL);
+        debugger;
+        if (urlState) {
+            this.urlCapture = urlState;
+            sessionStorage.removeItem(PreAuthURL);
+        }
+        this.checkState().then((state) => {
+            this.authenticated = true;
+            this.state = state;
+            this.host.requestUpdate();
+            if (this.urlCapture) {
+                const c = this.urlCapture;
+                this.urlCapture = null;
+                window.location.href = c;
+            }
+        });
+    }
+    authGithub() {
+        sessionStorage.setItem(PreAuthURL, window.location.toString());
+        window.location.href = this.doctorEndpoint + '/auth/github/start';
+    }
+    logout() {
+        window.location.href = this.doctorEndpoint + '/auth/logout';
+    }
+    checkState() {
+        return AuthService.checkAuth();
+    }
+}

package/dist/cowboy-components.d.ts

@@ -15,6 +15,10 @@ import './components/attention-box/attention-box.js';
 import './components/render-operation-path/render-operation-path.js';
 import './components/render-json-path/render-json-path.js';
 import './components/footer/footer.js';
+import './components/electric-box/electric-box.js';
+import './components/auth/oauth-login.js';
+import './components/auth/login-button.js';
+import './components/logo-wall/logowall.js';
 import './components/problem-list/problem-list.js';
 import './components/problem-list/problem-item.js';
 import './components/the-doctor/the-doctor.js';

package/dist/cowboy-components.js

@@ -15,6 +15,10 @@ import './components/attention-box/attention-box.js';
 import './components/render-operation-path/render-operation-path.js';
 import './components/render-json-path/render-json-path.js';
 import './components/footer/footer.js';
+import './components/electric-box/electric-box.js';
+import './components/auth/oauth-login.js';
+import './components/auth/login-button.js';
+import './components/logo-wall/logowall.js';
 // problems
 import './components/problem-list/problem-list.js';
 import './components/problem-list/problem-item.js';