{"size": 12095, "ext": "js", "max_stars_repo_path": "build/es6/node_modules/@lrnwebcomponents/haxcms-elements/lib/core/themes/haxcms-legacy-player.js", "max_stars_repo_name": "ChristianMurphy/HAXcms", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "build/es6/node_modules/@lrnwebcomponents/haxcms-elements/lib/core/themes/haxcms-legacy-player.js", "max_issues_repo_name": "ChristianMurphy/HAXcms", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "build/es6/node_modules/@lrnwebcomponents/haxcms-elements/lib/core/themes/haxcms-legacy-player.js", "max_forks_repo_name": "ChristianMurphy/HAXcms", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 44.4669117647, "max_line_length": 2604, "alphanum_fraction": 0.5786688714}
import{html,PolymerElement}from"../../../../../@polymer/polymer/polymer-element.js";import{Router}from"../../../../../@vaadin/router/dist/vaadin-router.js";import{dom}from"../../../../../@polymer/polymer/lib/legacy/polymer.dom.js";import{microTask}from"../../../../../@polymer/polymer/lib/utils/async.js";import{pathFromUrl}from"../../../../../@polymer/polymer/lib/utils/resolve-url.js";import{afterNextRender}from"../../../../../@polymer/polymer/lib/utils/render-status.js";import{encapScript,findTagsInHTML,wipeSlot}from"../../../../hax-body/lib/haxutils.js";import"../../../../../@polymer/app-layout/app-header/app-header.js";import"../../../../../@polymer/app-layout/app-toolbar/app-toolbar.js";import"../../../../../@polymer/app-layout/app-drawer/app-drawer.js";import"../../../../../@polymer/app-layout/app-drawer-layout/app-drawer-layout.js";import"../../../../../@polymer/app-layout/app-header-layout/app-header-layout.js";import"../../../../../@polymer/iron-ajax/iron-ajax.js";import"../../../../simple-colors/simple-colors.js";import"../../../../hax-body/lib/hax-shared-styles.js";import"../../../../map-menu/map-menu.js";class HAXCMSLegacyPlayer extends PolymerElement{static get tag(){return"haxcms-legacy-player"}static get properties(){return{file:{type:String,observer:"_fileChanged"},activeItemContent:{type:String,notify:!0,observer:"_activeItemContentChanged"},activeItemLocation:{type:String,computed:"computeActiveItemLocation(activeItem)",observer:"_activeItemLocationChanged"},activeItem:{type:Object},manifest:{type:Object},routerManifest:{type:Object,computed:"computeRouterManifest(manifest)",observer:"_updateRouter"}}}_activeItemLocationChanged(newValue){if(newValue){this.$.activecontent.generateRequest()}}_fileChanged(newValue){if(typeof newValue!==typeof void 0){this.$.manifest.generateRequest()}}static get template(){return html`
      <style include="simple-colors hax-shared-styles">
        :host {
          display: block;
          font-family: libre baskerville;
          position: relative;
          overflow: hidden;
          --outline-player-min-height: 100vh;
          --app-drawer-width: 300px;
          --outline-player-dark: #222222;
          --outline-player-light: #f8f8f8;
          background-color: var(--outline-player-light);
        }

        :host([closed]) {
          --app-drawer-width: 0px;
        }

        h1 {
          font-size: 48px;
          line-height: 16px;
        }

        h2 {
          font-size: 32px;
        }

        h3 {
          font-size: 28px;
        }

        p {
          line-height: 26px;
          min-height: 26px;
        }

        a,
        a:visited,
        a:active {
          color: #000;
        }

        a:hover {
          color: #2196f3;
        }

        ul li {
          padding-bottom: 24px;
          line-height: 1.5;
          color: #424242;
          max-width: 448px;
        }

        ul li:last-child {
          padding-bottom: 16px;
        }

        app-drawer-layout {
          min-height: 100vh;
          min-height: -moz-available; /* WebKit-based browsers will ignore this. */
          min-height: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
          min-height: fill-available;
          /* if the user has set a specific value then override the defaults */
          min-height: var(--outline-player-min-height);
        }

        .outline-title {
          font-size: 24px;
          font-weight: normal;
          line-height: 32px;
          vertical-align: middle;
          padding: 16px;
          height: 32px;
          margin: 0;
          text-align: center;
          text-overflow: ellipsis;
          overflow: hidden;
          word-break: break-word;
          border-bottom: 1px solid #eeeeee;
          position: sticky;
        }

        site-menu {
          padding: 8px;
        }

        outline-player-navigation {
          --outline-player-dark: var(--outline-player-dark);
        }

        div[main-title] {
          margin-left: 16px;
          font-size: 20px;
          line-height: 20px;
          overflow-wrap: break-word;
          text-overflow: ellipsis;
          display: inline-block;
          word-break: break-word;
        }

        paper-progress {
          display: block;
          width: 100%;
          --paper-progress-active-color: rgba(255, 255, 255, 0.5);
          --paper-progress-container-color: transparent;
        }

        app-header {
          color: var(--outline-player-dark);
          /* Enable outline to be placed anywhere in the dom */
          /* This will override the app-header-layout forcing fixed mode */
          /*position: absolute !important;
        left: 0 !important;*/
          --app-header-background-rear-layer: {
            /* app-header-layout will force fixed */
            background-color: var(--outline-player-light);
          }
        }

        app-toolbar {
          border-bottom: none;
          background-color: #ffffff;
          box-shadow: 0 0 6px -3px var(--outline-player-dark);
        }
        app-drawer {
          box-shadow: 0 0 6px -3px var(--outline-player-dark);
          overflow: hidden;
          --app-drawer-scrim-background: rgba(80, 80, 80, 0.8);
          --app-drawer-content-container: {
            overflow: hidden;
            background-color: var(--outline-player-light);
          }
        }
        app-drawer-layout[narrow] app-toolbar {
          position: fixed !important;
          left: 0;
          right: 0;
        }
        app-drawer-layout[narrow] #contentcontainer {
          padding-top: 64px;
        }
        #content {
          justify-content: center;
          padding: 8px 8px 8px 8px;
        }

        #content > * {
          display: flex;
          flex-direction: column;
          align-items: center;
        }

        /* Required for HAX */
        :host([edit-mode]) #slot {
          display: none !important;
        }
        :host([edit-mode]) #content {
          padding: 32px 8px 8px 8px;
        }
        #contentcontainer {
          max-width: 840px;
          margin: 0 auto;
          padding: 0 16px 16px 16px;
          flex: 1 1 auto;
          order: 1;
          display: flex;
        }
        #contentcontainer > * {
          flex: 1 1 auto;
          display: flex;
          flex-direction: column;
          width: 100%;
        }
        #contentcontainer h-a-x {
          margin: 0;
        }
        site-menu {
          height: calc(100vh - 64px);
          color: #000000;
          padding: 0;
          background-color: #ffffff;
          --site-menu-active-color: rgba(0, 0, 0, 0.1);
          --site-menu-scrolltrack-bg-color: rgba(0, 0, 0, 0.3);
          --site-menu-bg-shadow: rgba(0, 0, 0, 0.3);
          --site-menu-bg-color: #fafafa;
          --site-menu: {
            padding: 0;
            background-color: #ffffff;
            color: #000000;
          }
          --site-menu-container: {
            padding: 0;
            background-color: #ffffff;
            color: #000000;
          }
          --site-menu-item-active-item: {
            color: #000000;
          }
        }
        site-menu-button {
          --site-menu-button-button: {
            border-radius: 50%;
            background-color: rgba(0, 0, 0, 0.1);
            height: 40px;
            width: 40px;
          }
          --site-menu-button-button-hover: {
            background-color: rgba(0, 0, 0, 0.2);
          }
        }
      </style>
      <iron-ajax
        id="manifest"
        url="[[outlineLocation]][[file]]"
        handle-as="json"
        debounce-duration="250"
        last-response="{{manifest}}"
      ></iron-ajax>
      <iron-ajax
        id="activecontent"
        url="[[outlineLocation]][[activeItemLocation]]"
        handle-as="text"
        loading="{{loading}}"
        debounce-duration="250"
        last-response="{{activeItemContent}}"
      ></iron-ajax>
      <!-- Begin Layout -->
      <app-drawer-layout narrow="{{narrow}}">
        <app-drawer id="drawer" swipe-open slot="drawer" opened="{{opened}}">
          <h2 class="outline-title">[[manifest.title]]</h2>
          <map-menu
            id="menu"
            selected="[[activeItem.id]]"
            manifest="[[routerManifest]]"
            active-indicator
            auto-scroll
          ></map-menu>
        </app-drawer>
        <app-header-layout>
          <app-header slot="header" reveals>
            <app-toolbar>
              <paper-icon-button
                icon="menu"
                on-click="_toggleMenu"
              ></paper-icon-button>
              <div main-title>
                [[activeItem.title]]
                <div id="slotTitle"><slot name="title"></slot></div>
              </div>
              <site-menu-button
                type="prev"
                position="bottom"
                label="Prev"
                raised
              ></site-menu-button>
              <site-menu-button
                type="next"
                position="bottom"
                label="Next"
                raised
              ></site-menu-button>
              <site-print-button></site-print-button>
            </app-toolbar>
          </app-header>
          <div id="content">
            <div id="contentcontainer">
              <div id="slot"><slot></slot></div>
            </div>
          </div>
        </app-header-layout>
      </app-drawer-layout>
    `}constructor(){super();let options={};if(this.baseURI){options.baseUrl=this.baseURI}this.router=new Router(this,options);window.addEventListener("vaadin-router-location-changed",this._routerLocationChanged.bind(this))}_activeItemContentChanged(newValue){if(newValue){var html=newValue;if(null!==html){wipeSlot(this,"*");html=encapScript(newValue);microTask.run(()=>{setTimeout(()=>{let frag=document.createRange().createContextualFragment(html);dom(this).appendChild(frag);new CustomEvent("json-outline-schema-active-body-changed",{bubbles:!0,composed:!0,cancelable:!1,detail:{html}})},5)});if(this.manifest.metadata.dynamicElementLoader){let tagsFound=findTagsInHTML(html);const basePath=pathFromUrl(decodeURIComponent(import.meta.url));for(var i in tagsFound){const tagName=tagsFound[i];if(this.manifest.metadata.dynamicElementLoader[tagName]&&!window.customElements.get(tagName)){import(`${basePath}../../../../../${this.manifest.metadata.dynamicElementLoader[tagName]}`).then(()=>{}).catch(error=>{console.log(error)})}}}}}}connectedCallback(){super.connectedCallback();afterNextRender(this,function(){if(document.getElementById("haxcmsoutdatedfallbacksuperold")){document.getElementById("haxcmsoutdatedfallback").removeChild(document.getElementById("haxcmsoutdatedfallbacksuperold"))}})}disconnectedCallback(){window.removeEventListener("vaadin-router-location-changed",this._routerLocationChanged.bind(this));super.disconnectedCallback()}computeActiveItemLocation(activeItem){return"pages/"+activeItem.location+"/index.html"}computeRouterManifest(manifest){document.body.dispatchEvent(new CustomEvent("json-outline-schema-changed",{bubbles:!0,detail:manifest}));if(manifest&&"undefined"!==typeof manifest.items){const manifestItems=manifest.items.map(i=>{let location=i.location.replace("pages/","").replace("/index.html","");return Object.assign({},i,{location:location})});return Object.assign({},manifest,{items:manifestItems})}}_updateRouter(routerManifest){if(!routerManifest||"undefined"===typeof routerManifest.items)return;const routerItems=routerManifest.items.map(i=>{return{path:i.location,name:i.id,component:`fake-${i.id}-e`}});this.router.setRoutes([...routerItems,{path:"/",component:"fake-home-e",name:"home"},{path:"/(.*)",component:"fake-404-e",name:"404"}])}_routerLocationChanged(e){setTimeout(()=>{if(this.routerManifest.items.find){var tmpItem=this.routerManifest.items.find(i=>i.location==e.detail.location.route.path);if(tmpItem){this.set("activeItem",tmpItem)}}},100)}}window.customElements.define(HAXCMSLegacyPlayer.tag,HAXCMSLegacyPlayer);export{HAXCMSLegacyPlayer};