text: define(["exports","require","../../../lit-element/lit-element.js","../../simple-colors/simple-colors.js","../../utils/utils.js","../../simple-picker/simple-picker.js"],function(_exports,_require,_litElement,_simpleColors,_utils,_simplePicker){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0});_exports.HaxUploadField=void 0;_require=babelHelpers.interopRequireWildcard(_require);function _templateObject2_89880d30679e11eaa25e79cdef13391f(){var data=babelHelpers.taggedTemplateLiteral(["\n      <fieldset id=\"fieldset\">\n        <legend id=\"legend\" ?hidden=\"","\">","</legend>\n        <div>\n          <simple-picker\n            id=\"picker\"\n            aria-label=\"Source...\"\n            required\n            value=\"","\"\n            @value-changed=\"","\"\n            .options=\"","\"\n          >\n          </simple-picker>\n          <paper-input\n            id=\"url\"\n            ?hidden=\"","\"\n            value=\"","\"\n            @value-changed=\"","\"\n            label=\"URL\"\n            type=\"url\"\n            auto-validate=\"\"\n          ></paper-input>\n          <vaadin-upload\n            capture\n            form-data-name=\"file-upload\"\n            ?hidden=\"","\"\n            id=\"fileupload\"\n            @upload-before=\"","\"\n            @upload-response=\"","\"\n          ></vaadin-upload>\n          <div id=\"camerahole\" ?hidden=\"","\"></div>\n          <div id=\"voicerecorder\" ?hidden=\"","\"></div>\n        </div>\n      </fieldset>\n    "]);_templateObject2_89880d30679e11eaa25e79cdef13391f=function _templateObject2_89880d30679e11eaa25e79cdef13391f(){return data};return data}function _templateObject_89880d30679e11eaa25e79cdef13391f(){var data=babelHelpers.taggedTemplateLiteral(["\n        :host {\n          display: block;\n          visibility: visible;\n          transition: 0.3s all ease;\n          box-sizing: border-box;\n          pointer-events: all;\n          overflow: visible;\n          --simple-camera-snap-width: 300px;\n          --simple-camera-snap-height: calc(300px * 9 / 16);\n          --simple-camera-snap-color: var(--eco-json-form-color, #222);\n          --simple-camera-snap-background: var(--eco-json-form-bg, white);\n          --simple-camera-snap-border-radius: 2px;\n          --lumo-font-family: var(\n            --eco-json-form-font-family,\n            var(--paper-font-caption_-_font-family, unset)\n          );\n          --lumo-base-color: var(\n            --eco-json-form-bg,\n            var(--primary-background-color, #fff)\n          );\n          --lumo-primary-contrast-color: var(\n            --eco-json-form-bg,\n            var(--primary-background-color, #fff)\n          );\n          --lumo-primary-color: var(\n            --eco-json-form-active-color,\n            var(--primary-color, #000)\n          );\n          --lumo-primary-text-color: var(\n            --eco-json-form-color,\n            var(--primary-text-color, #222)\n          );\n          --lumo-body-text-color: var(\n            --eco-json-form-color,\n            var(--primary-text-color, #222)\n          );\n          --lumo-header-text-color: var(\n            --eco-json-form-color,\n            var(--primary-text-color, #222)\n          );\n          --lumo-secondary-text-color: var(\n            --eco-json-form-faded-color,\n            var(--secondary-text-color, #888)\n          );\n          --lumo-disabled-text-color: var(\n            --eco-json-form-faded-color,\n            var(--secondary-text-color, #888)\n          );\n          background-color: var(\n            --eco-json-form-bg,\n            var(--primary-background-color, #fff)\n          );\n        }\n        :host #legend {\n          transition: all 0.5s;\n          color: var(\n            --eco-json-form-faded-color,\n            var(--secondary-text-color, #888)\n          );\n        }\n        :host(:focus-within) #legend {\n          color: var(--eco-json-form-active-color, var(--primary-color, #000));\n        }\n        :host #fieldset {\n          border-radius: 2px;\n          transition: all 0.5s;\n          border: 1px solid\n            var(--eco-json-form-faded-color, var(--secondary-text-color, #888));\n        }\n        :host #fieldset > div {\n          display: flex;\n          align-items: center;\n          justify-content: space-between;\n        }\n        :host #fieldset > div > *:not(#picker) {\n          flex: 1 1 auto;\n        }\n        #picker {\n          margin-bottom: 0;\n          margin-right: 5px;\n        }\n        vaadin-upload {\n          padding: 0;\n          margin: 0;\n        }\n        simple-camera-snap {\n          position: relative;\n          --simple-camera-snap-button-container-position: absolute;\n          --simple-camera-snap-button-container-bottom: 2px;\n          --simple-camera-snap-button-container-z-index: 5;\n          --simple-camera-snap-button-border-radius: 100%;\n          --simple-camera-snap-button-opacity: 0.7;\n        }\n      "]);_templateObject_89880d30679e11eaa25e79cdef13391f=function _templateObject_89880d30679e11eaa25e79cdef13391f(){return data};return data}var HaxUploadField=/*#__PURE__*/function(_winEventsElement){babelHelpers.inherits(HaxUploadField,_winEventsElement);babelHelpers.createClass(HaxUploadField,null,[{key:"styles",/**
     * LitElement life cycle - styles addition
     */get:function get(){return[].concat(babelHelpers.toConsumableArray(babelHelpers.get(babelHelpers.getPrototypeOf(HaxUploadField),"styles",this)),[(0,_litElement.css)(_templateObject_89880d30679e11eaa25e79cdef13391f())])}/**
     * HTMLElement life cycle
     */}]);function HaxUploadField(){var _this;babelHelpers.classCallCheck(this,HaxUploadField);_this=babelHelpers.possibleConstructorReturn(this,babelHelpers.getPrototypeOf(HaxUploadField).call(this));_this.__winEvents={"hax-app-picker-selection":"_haxAppPickerSelection"};_this.label=null;_this.noCamera=!1;// @todo leave this off until we can do more testing
  // the wiring is all there but the UI pattern is not
  _this.noVoiceRecord=!0;new Promise(function(res,rej){return _require.default(["../../../@polymer/paper-input/paper-input.js"],res,rej)});new Promise(function(res,rej){return _require.default(["../../../@polymer/paper-icon-button/paper-icon-button.js"],res,rej)});new Promise(function(res,rej){return _require.default(["../../../@vaadin/vaadin-upload/vaadin-upload.js"],res,rej)});new Promise(function(res,rej){return _require.default(["../../simple-picker/lib/simple-picker-option.js"],res,rej)});return _this}/**
     * LitElement life cycle - render callback
     */babelHelpers.createClass(HaxUploadField,[{key:"render",value:function render(){return(0,_litElement.html)(_templateObject2_89880d30679e11eaa25e79cdef13391f(),!this.label,this.label,this.option,this.optionChanged,this.options,"url"!==this.option,this.value,this.valueChanged,"fileupload"!==this.option,this._fileAboutToUpload,this._fileUploadResponse,"selfie"!==this.option,"audio"!==this.option)}},{key:"optionChanged",value:function optionChanged(e){this.option=e.detail.value}},{key:"valueChanged",value:function valueChanged(e){this.value=e.detail.value}/**
     * LitElement life cycle - properties changed callback
     */},{key:"updated",value:function updated(changedProperties){var _this2=this;if(babelHelpers.get(babelHelpers.getPrototypeOf(HaxUploadField.prototype),"updated",this)){babelHelpers.get(babelHelpers.getPrototypeOf(HaxUploadField.prototype),"updated",this).call(this,changedProperties)}changedProperties.forEach(function(oldValue,propName){// notify
  if("value"==propName){_this2.dispatchEvent(new CustomEvent("value-changed",{detail:{value:_this2[propName]}}))}})}/**
     * LitElement / popular convention
     */},{key:"_fileAboutToUpload",/**
     * Respond to uploading a file
     */value:function _fileAboutToUpload(e){if(!this.__allowUpload){// cancel the event so we can jump in
  e.preventDefault();e.stopPropagation();// look for a match as to what gizmo types it supports
  var values={source:e.detail.file.name,type:e.detail.file.type},type=window.HaxStore.guessGizmoType(values),targets=window.HaxStore.getHaxAppStoreTargets(type);// we have no clue what this is.. let's try and guess..
  // make sure we have targets
  if(1===targets.length){this._haxAppPickerSelection({detail:targets[0]})}else if(0!==targets.length){window.HaxStore.instance.haxAppPicker.presentOptions(targets,type,"Where would you like to upload this "+type+"?","app")}else{window.HaxStore.toast("Sorry, you don't have a storage location that can handle "+type+" uploads!",5e3)}}else{this.__allowUpload=!1}}/**
     * Respond to successful file upload, now inject url into url field and
     * do a gizmo guess from there!
     */},{key:"_fileUploadResponse",value:function _fileUploadResponse(e){// convert response to object
  var response=JSON.parse(e.detail.xhr.response),map=this.__appUsed.connection.operations.add.resultMap,data={},item={};// access the app that did the upload
  // look for the items element to draw our data from at its root
  if(babelHelpers.typeof(this._resolveObjectPath(map.item,response))!==("undefined"===typeof void 0?"undefined":babelHelpers.typeof(void 0))){data=this._resolveObjectPath(map.item,response)}item.type=map.defaultGizmoType;// pull in prop matches
  for(var prop in map.gizmo){item[prop]=this._resolveObjectPath(map.gizmo[prop],data)}// another sanity check, if we don't have a url but have a source bind that too
  if(babelHelpers.typeof(item.url)===("undefined"===typeof void 0?"undefined":babelHelpers.typeof(void 0))&&babelHelpers.typeof(item.source)!==("undefined"===typeof void 0?"undefined":babelHelpers.typeof(void 0))){item.url=item.source}// gizmo type is also supported in the mapping element itself
  // Think an asset management backend as opposed to a specific
  // type of asset like video. If the item coming across can
  // effectively check what kind of gizmo is required for it
  // to work then we need to support that asset declaring the
  // gizmo type needed
  if(babelHelpers.typeof(map.gizmo.type)!==("undefined"===typeof void 0?"undefined":babelHelpers.typeof(void 0))){item.type=this._resolveObjectPath(map.gizmo.type,data)}// set the value of the url which will update our URL and notify
  this.shadowRoot.querySelector("#url").value=item.url}/**
     * Event for an app being selected from a picker
     * This happens when multiple upload targets support the given type
     */},{key:"_haxAppPickerSelection",value:function _haxAppPickerSelection(e){// details for where to upload the file
  var connection=e.detail.connection;this.__appUsed=e.detail;this.shadowRoot.querySelector("#fileupload").method=connection.operations.add.method;var requestEndPoint=connection.protocol+"://"+connection.url;// ensure we build a url correctly
  if("/"!=requestEndPoint.substr(requestEndPoint.length-1)){requestEndPoint+="/"}// support local end point modification
  if(babelHelpers.typeof(connection.operations.add.endPoint)!==("undefined"===typeof void 0?"undefined":babelHelpers.typeof(void 0))){requestEndPoint+=connection.operations.add.endPoint}// implementation specific tweaks to talk to things like HAXcms and other CMSs
  // that have per load token based authentication
  if(null!=window.HaxStore.instance.connectionRewrites.appendUploadEndPoint){requestEndPoint+="?"+window.HaxStore.instance.connectionRewrites.appendUploadEndPoint}if(null!=window.HaxStore.instance.connectionRewrites.appendJwt){requestEndPoint+="&"+window.HaxStore.instance.connectionRewrites.appendJwt+"="+localStorage.getItem(window.HaxStore.instance.connectionRewrites.appendJwt)}this.shadowRoot.querySelector("#fileupload").headers=connection.headers;this.shadowRoot.querySelector("#fileupload").target=requestEndPoint;// invoke file uploading...
  this.__allowUpload=!0;this.shadowRoot.querySelector("#fileupload").uploadFiles()}/**
     * Set the input options as far as url, upload, or webcam input
     */},{key:"_setInputOptions",value:function _setInputOptions(){// hide the button if this environment can't support it anyway
  var options=[[{alt:"URL",icon:"icons:link",value:"url"}],[{alt:"Upload",icon:"icons:file-upload",value:"fileupload"}]];if(!navigator.mediaDevices||this.noCamera){this.shadowRoot.querySelector("#camerahole").style.display="none"}else{options.push([{alt:"Camera",icon:"image:photo-camera",value:"selfie"}])}if(!navigator.mediaDevices||this.noVoiceRecord){this.shadowRoot.querySelector("#voicerecorder").style.display="none"}else{/*options.push([
          {
            alt: "Audio",
            icon: "hardware:keyboard-voice",
            value: "audio"
          }
        ]);*/}return options}/**
     * LitElement
     */},{key:"firstUpdated",value:function firstUpdated(changedProperties){var _this3=this;if(babelHelpers.get(babelHelpers.getPrototypeOf(HaxUploadField.prototype),"firstUpdated",this)){babelHelpers.get(babelHelpers.getPrototypeOf(HaxUploadField.prototype),"firstUpdated",this).call(this,changedProperties)}// test on load for if we have a media device
  this.options=babelHelpers.toConsumableArray(this._setInputOptions());// default to URL if we have a value of any kind
  if(this.value){this.option="url"}else{this.option="fileupload"}this.shadowRoot.querySelector("#picker").addEventListener("change",function(e){if(e&&e.detail&&"selfie"===e.detail.value)_this3._takeSelfie(e);if(e&&e.detail&&"audio"===e.detail.value)_this3._voiceRecorder(e)})}/**
     * We got a new photo
     */},{key:"__newPhotoShowedUp",value:function __newPhotoShowedUp(e){var file=new File([e.detail.raw],"headshot"+e.timeStamp+".jpg");this.shadowRoot.querySelector("#fileupload")._addFile(file)}/**
     * We got a new photo
     */},{key:"__newAudioShowedUp",value:function __newAudioShowedUp(e){var file=new File([e.detail.value],"voice-memo"+e.timeStamp+".mp3");this.shadowRoot.querySelector("#fileupload")._addFile(file)}/**
     * Invoke the camera to set itself up
     */},{key:"_takeSelfie",value:function _takeSelfie(e){if(!this.camera){new Promise(function(res,rej){return _require.default(["../../simple-login/lib/simple-camera-snap.js"],res,rej)});this.camera=document.createElement("simple-camera-snap");this.camera.autoplay=!0;this.camera.addEventListener("simple-camera-snap-image",this.__newPhotoShowedUp.bind(this));this.shadowRoot.querySelector("#camerahole").appendChild(this.camera)}}},{key:"_voiceRecorder",value:function _voiceRecorder(e){if(!this.voice){new Promise(function(res,rej){return _require.default(["../../voice-recorder/voice-recorder.js"],res,rej)});this.voice=document.createElement("voice-recorder");this.voice.addEventListener("voice-recorder-recording",this.__newAudioShowedUp.bind(this));this.shadowRoot.querySelector("#voicerecorder").appendChild(this.voice)}}/**
     * Helper to take a multi-dimensional object and convert
     * it's reference into the real value. This allows for variable input defined
     * in a string to actually hit the deeper part of an object structure.
     */},{key:"_resolveObjectPath",value:function _resolveObjectPath(path,obj){return path.split(".").reduce(function(prev,curr){return prev?prev[curr]:null},obj||self)}}],[{key:"properties",get:function get(){return{label:{type:String},value:{type:String},option:{type:String},options:{type:Array},/**
         * Used when we want to ensure there is not a web cam option like video upload.
         */noCamera:{type:Boolean,attribute:"no-camera"},/**
         * No Voice Recording
         */noVoiceRecord:{type:Boolean,attribute:"no-voice-record"}}}}]);return HaxUploadField}((0,_utils.winEventsElement)(_simpleColors.SimpleColors));_exports.HaxUploadField=HaxUploadField;window.customElements.define("hax-upload-field",HaxUploadField)});