Your IP : 3.143.7.53
this.BX=this.BX||{};(function(t,e,s,i,n,o,a,r){"use strict";let c=t=>t,h,u;class g extends e.EventEmitter{constructor(t){super();this.cache=new n.Cache.MemoryCache;this.setOptions(t);this.setEventNamespace("BX.UI.SignUp.Tabs.Tab");this.subscribeFromOptions(t.events)}setOptions(t){this.cache.set("options",{...t})}getOptions(){return this.cache.get("options",{})}getIconNode(){return this.cache.remember("iconNode",(()=>n.Tag.render(h||(h=c`
<span style="background-image: url('${0}');"></span>
`),this.getOptions().icon)))}getHeaderLayout(){return this.cache.remember("headerLayout",(()=>n.Tag.render(u||(u=c`
<div
class="ui-sign-up-tabs-tab-header"
data-id="${0}"
onclick="${0}"
>
<div class="ui-sign-up-tabs-tab-header-icon">
${0}
</div>
<div class="ui-sign-up-tabs-tab-header-text">
<span>${0}</span>
</div>
</div>
`),n.Text.encode(this.getOptions().id),this.onHeaderClick.bind(this),this.getIconNode(),this.getOptions().header)))}onHeaderClick(t){t.preventDefault();this.emit("onHeaderClick")}getContent(){return this.getOptions().content}activate(){n.Dom.addClass(this.getHeaderLayout(),"ui-sign-up-tabs-tab-header-active");n.Dom.style(this.getIconNode(),{"background-image":`url('${this.getOptions().activeIcon}')`})}deactivate(){n.Dom.removeClass(this.getHeaderLayout(),"ui-sign-up-tabs-tab-header-active");n.Dom.style(this.getIconNode(),{"background-image":`url('${this.getOptions().icon}')`})}isActive(){return n.Dom.hasClass(this.getHeaderLayout(),"ui-sign-up-tabs-tab-header-active")}}let l=t=>t,d,p,m;class v extends e.EventEmitter{constructor(t={}){super();this.cache=new n.Cache.MemoryCache;this.setEventNamespace("BX.UI.SignUp.Tabs");this.subscribeFromOptions(t.events);this.setOptions(t);this.onTabHeaderClick=this.onTabHeaderClick.bind(this);const{defaultState:e}=this.getOptions();if(n.Type.isStringFilled(e)){const t=this.getTabs().find((t=>t.getOptions().id===e));if(t){this.setCurrentTab(t);t.activate()}else{const[t]=this.getTabs();this.setCurrentTab(t);t.activate()}}else{const[t]=this.getTabs();this.setCurrentTab(t);t.activate()}}getCurrentTab(){return this.cache.get("currentTab")}setCurrentTab(t){this.cache.set("currentTab",t)}setOptions(t){this.cache.set("options",{...t})}getOptions(){return this.cache.get("options",{})}getTabs(){return this.cache.remember("tabs",(()=>this.getOptions().tabs.map((t=>new g({...t,events:{onHeaderClick:this.onTabHeaderClick}})))))}onTabHeaderClick(t){const e=t.getTarget();this.setCurrentTab(e);this.getTabs().forEach((t=>{t.deactivate()}));e.activate();n.Dom.replace(this.getBodyLayout().firstElementChild,e.getContent().getLayout())}getHeaderLayout(){return this.cache.remember("headerLayout",(()=>n.Tag.render(d||(d=l`
<div class="ui-sign-up-tabs-header">
${0}
</div>
`),this.getTabs().map((t=>t.getHeaderLayout())))))}getBodyLayout(){return this.cache.remember("bodyLayout",(()=>n.Tag.render(p||(p=l`
<div class="ui-sign-up-tabs-body">
${0}
</div>
`),this.getCurrentTab().getContent().getLayout())))}getLayout(){return this.cache.remember("layout",(()=>n.Tag.render(m||(m=l`
<div class="ui-sign-up-tabs">
${0}
${0}
</div>
`),this.getHeaderLayout(),this.getBodyLayout())))}}let b=t=>t,C;class T extends e.EventEmitter{constructor(t){super();this.cache=new n.Cache.MemoryCache;this.setEventNamespace("BX.UI.SignUp.Footer");this.subscribeFromOptions(t.events);this.setOptions(t)}setOptions(t){this.cache.set("options",t)}getOptions(){return this.cache.get("options",{})}getSaveButton(){return this.cache.remember("saveButtons",(()=>new o.Button({text:n.Loc.getMessage("UI_SIGN_UP_SAVE_BUTTON_LABEL"),color:BX.UI.Button.Color.PRIMARY,round:true,noCaps:true,className:`ui-sign-up-special-${this.getOptions().mode}-btn`,onclick:()=>{this.emit("onSaveClick");const t=this.emitAsync("onSaveClickAsync");if(t){this.getSaveButton().setWaiting(true);t.then((()=>{this.getSaveButton().setWaiting(false)}))}}})))}getCancelButton(){return this.cache.remember("cancelButtons",(()=>new o.Button({text:n.Loc.getMessage("UI_SIGN_UP_CANCEL_BUTTON_LABEL"),color:o.ButtonColor.LIGHT_BORDER,round:true,noCaps:true,className:`ui-sign-up-special-${this.getOptions().mode}-btn`,onclick:()=>{this.emit("onCancelClick")}})))}getLayout(){return this.cache.remember("layout",(()=>{const t=n.Tag.render(C||(C=b`
<div class="ui-sign-up-footer">
${0}
</div>
`),this.getSaveButton().render());if(this.getOptions().mode==="desktop"){n.Dom.append(this.getCancelButton().render(),t)}return t}))}}let I=t=>t,y;var L=babelHelpers.classPrivateFieldLooseKey("loadImage");class B{constructor(t){this.cache=new n.Cache.MemoryCache;this.setOptions(t)}setOptions(t){this.cache.set("options",t)}getOptions(){return this.cache.get("options")}getDevicePixelRatio(){return window.devicePixelRatio}getLayout(){const t=this.cache.remember("layout",(()=>n.Tag.render(y||(y=I`
<canvas class="ui-sign-up-canvas"></canvas>
`))));const e=setTimeout((()=>{if(n.Type.isDomNode(t.parentElement)&&!this.cache.has("adjustCanvas")){const e={width:t.parentElement.clientWidth,height:t.parentElement.clientHeight};if(e.width>0&&e.height>0){void this.cache.remember("adjustCanvas",(()=>{const t=this.getLayout();const s=this.getDevicePixelRatio();t.width=e.width*s;t.height=e.height*s;n.Dom.style(t,{width:`${e.width}px`,height:`${e.height}px`});const i=this.getLayout().getContext("2d");const{context2d:o={}}=this.getOptions();if(n.Type.isPlainObject(o)){Object.assign(i,o)}i.scale(s,s)}))}}clearTimeout(e)}));return t}clear(){const t=this.getLayout();const e=t.getContext("2d");e.clearRect(0,0,t.width*2,t.height*2)}renderText(t,e=null){const s=String(t).trim();const i=this.getLayout();const o=i.getContext("2d");o.font="34px Comforter Brush";this.clear();const a=this.getDevicePixelRatio();const r=i.width-20;let c=n.Text.toNumber(o.font);while(c>1&&o.measureText(s).width*a>r){c-=1;o.font=`${c}px Comforter Brush`}const h=o.measureText(s).width*a;if(e!==null&&e!==""){o.fillStyle=e}o.fillText(s,(i.width-h)/(2*a),34)}renderImage(t){return babelHelpers.classPrivateFieldLooseBase(B,L)[L](t).then((t=>{const e=this.getLayout();const s=e.getContext("2d");const i=e.clientWidth/t.width;const n=e.clientHeight/t.height;const o=Math.min(i,n);const a=(e.clientWidth-t.width*o)/2;const r=(e.clientHeight-t.height*o)/2;this.clear();s.drawImage(t,0,0,t.width,t.height,a,r,t.width*o,t.height*o)}))}}function _(t){const e=new FileReader;return new Promise((s=>{e.readAsDataURL(t);n.Event.bindOnce(e,"loadend",(()=>{const t=new Image;t.src=e.result;n.Event.bindOnce(t,"load",(()=>{s(t)}))}))}))}Object.defineProperty(B,L,{value:_});class f extends e.EventEmitter{constructor(t={}){super();this.cache=new n.Cache.MemoryCache;this.setEventNamespace("BX.UI.SignUp.Content");this.subscribeFromOptions(t.events);this.setOptions(t)}getColor(){var t;return(t=this.getOptions().color)!=null?t:null}setOptions(t){this.cache.set("options",{...t})}getOptions(){return this.cache.get("options",{})}getLayout(){throw new Error("Must be implemented in a child class")}getCanvas(){throw new Error("Must be implemented in a child class")}}let w=t=>t,E,O,U;class x extends f{constructor(t){super(t);this.setEventNamespace("BX.UI.SignUp.Content.InitialsContent");this.subscribeFromOptions(t==null?void 0:t.events);this.onInput=this.onInput.bind(this);void this.forceLoadFonts()}forceLoadFonts(){const t=[...document.fonts];const e=t.filter((t=>String(t.family).includes("Comforter Brush")));return Promise.all(e.map((t=>t.load())))}getNameInput(){return this.cache.remember("nameInput",(()=>n.Tag.render(E||(E=w`
<input type="text" class="ui-ctl-element" oninput="${0}">
`),this.onInput)))}getInitialsInput(){return this.cache.remember("initialsInput",(()=>n.Tag.render(O||(O=w`
<input type="text" class="ui-ctl-element" oninput="${0}">
`),this.onInput)))}getTextValue(){const t=String(this.getNameInput().value);const e=String(this.getInitialsInput().value);return`${t} ${e}`}onInput(){this.getCanvas().renderText(this.getTextValue(),this.getColor());this.emit("onChange")}getCanvas(){return this.cache.remember("canvas",(()=>new B({context2d:{fillStyle:"#000000",font:"34px Comforter Brush"}})))}getLayout(){return this.cache.remember("layout",(()=>n.Tag.render(U||(U=w`
<div class="ui-sign-up-content">
<div class="ui-sign-up-initials-form">
<div class="ui-sign-up-initials-form-left">
<div class="ui-sign-up-initials-form-label">
${0}
</div>
<div class="ui-ctl ui-ctl-textbox ui-ctl-inline">
${0}
</div>
</div>
<div class="ui-sign-up-initials-form-right">
<div class="ui-sign-up-initials-form-label">
${0}
</div>
<div class="ui-ctl ui-ctl-textbox ui-ctl-inline">
${0}
</div>
</div>
</div>
<div class="ui-sign-up-initials-preview">
${0}
</div>
</div>
`),n.Loc.getMessage("UI_SIGN_UP_TAB_INITIALS_LAST_NAME_LABEL"),this.getNameInput(),n.Loc.getMessage("UI_SIGN_UP_TAB_INITIALS_INITIALS_LABEL"),this.getInitialsInput(),this.getCanvas().getLayout())))}}function S(t){if(!n.Type.isNil(window.TouchEvent)&&t instanceof window.TouchEvent){const e=t.target.getBoundingClientRect();const{touches:s,changedTouches:i}=t;const[n]=s.length>0?s:i;return{x:n.clientX-e.left,y:n.clientY-e.top}}return{x:t.offsetX,y:t.offsetY}}let M=t=>t,N,P;let D=false;n.Event.bind(window,"touchmove",(t=>{if(D){t.preventDefault()}}),{passive:false});class k extends f{constructor(t){super(t);this.setEventNamespace("BX.UI.SignUp.Content.TouchContent");this.subscribeFromOptions(t==null?void 0:t.events);const e=this.getCanvas().getLayout();n.Event.bind(e,"mousedown",this.onCanvasMouseDown.bind(this));n.Event.bind(document,"mouseup",this.onCanvasMouseUp.bind(this));n.Event.bind(e,"mousemove",this.onCanvasMouseMove.bind(this));n.Event.bind(e,"touchstart",this.onCanvasMouseDown.bind(this));n.Event.bind(e,"touchend",this.onCanvasMouseUp.bind(this));n.Event.bind(e,"touchmove",this.onCanvasMouseMove.bind(this))}setIsDrawing(t){this.cache.set("isDrawing",t)}getIsDrawing(){return this.cache.get("isDrawing",false)}setStartEvent(t){this.cache.set("startEvent",t)}getStartEvent(){return this.cache.get("startEvent")}onCanvasMouseDown(t){this.setIsDrawing(true);D=true;const e=this.getCanvas().getLayout().getContext("2d");e.beginPath();const s=S(t);e.moveTo(s.x,s.y);this.setStartEvent(t);this.emit("onChange")}onCanvasMouseUp(t){this.setIsDrawing(false);D=false;const e=this.getCanvas().getLayout();const s=e.getContext("2d");s.closePath();if(t.currentTarget===e){const e=this.getStartEvent();const i=S(e);const n=S(t);if(i.x===n.x&&i.y===n.y){s.lineTo(n.x,n.y);s.stroke()}}this.emit("onChange")}onCanvasMouseMove(t){if(this.getIsDrawing()){const e=this.getCanvas().getLayout().getContext("2d");const s=S(t);const i=this.getColor();if(i!==null&&i!==""){e.strokeStyle=i}e.lineTo(s.x,s.y);e.stroke()}this.emit("onChange")}onCanvasMouseOut(){this.setIsDrawing(false);D=false;const t=this.getCanvas().getLayout().getContext("2d");t.closePath();this.emit("onChange")}getCanvas(){return this.cache.remember("canvas",(()=>new B({context2d:{lineWidth:k.LineWidth,strokeStyle:"000000",lineJoin:"round",lineCap:"round"}})))}getClearButton(){return this.cache.remember("clearButton",(()=>n.Tag.render(N||(N=M`
<div class="ui-sign-up-touch-clear-button" onclick="${0}">
${0}
</div>
`),this.onClearClick.bind(this),n.Loc.getMessage("UI_SIGN_UP_TOUCH_CLEAR_BUTTON"))))}onClearClick(t){t.preventDefault();this.getCanvas().clear();this.emit("onChange")}getLayout(){return this.cache.remember("layout",(()=>{const t=t=>{t.preventDefault();t.stopPropagation()};return n.Tag.render(P||(P=M`
<div class="ui-sign-up-content" ontouchmove="${0}">
<div class="ui-sign-up-touch-form-label">
${0}
</div>
<div class="ui-sign-up-content-touch-preview">
${0}
${0}
</div>
</div>
`),t,(()=>{if(this.getOptions().mode==="mobile"){return n.Loc.getMessage("UI_SIGN_UP_TOUCH_LAYOUT_MOBILE_LABEL")}return n.Loc.getMessage("UI_SIGN_UP_TOUCH_LAYOUT_LABEL")})(),this.getClearButton(),this.getCanvas().getLayout())}))}}k.LineWidth=3;let $=t=>t,A,H,F,R,X;class G extends f{constructor(t){super(t);this.setEventNamespace("BX.UI.SignUp.Content.PhotoContent");this.subscribeFromOptions(t==null?void 0:t.events)}getTakePhotoButton(){return this.cache.remember("takePhotoButton",(()=>new o.Button({text:n.Loc.getMessage("UI_SIGN_UP_TAKE_SIGN_PHOTO"),color:o.ButtonColor.LIGHT_BORDER,round:true,noCaps:true,className:"ui-sign-up-special-mobile-btn"})))}getUploadPhoto(){return this.cache.remember("uploadPhoto",(()=>new o.Button({text:n.Loc.getMessage("UI_SIGN_UP_UPLOAD_SIGN_PHOTO"),color:o.ButtonColor.LIGHT_BORDER,round:true,noCaps:true,className:"ui-sign-up-special-mobile-btn",onclick:this.onUploadPhotoClick.bind(this)})))}getFileInput(){return this.cache.remember("fileInput",(()=>n.Tag.render(A||(A=$`
<input hidden type="file" onchange="${0}" accept="image/*">
`),this.onFileChange.bind(this))))}onUploadPhotoClick(){this.getFileInput().click()}onFileChange(t){const[e]=t.target.files;if(n.Type.isFile(e)){if(!n.Type.isStringFilled(e.type)||!e.type.startsWith("image")){r.MessageBox.alert(n.Loc.getMessage("UI_SIGN_UP_BAD_IMAGE_FORMAT_ALERT_MESSAGE"));return false}n.Dom.replace(this.getButtonsLayout(),this.getPreviewLayout());this.getCanvas().renderImage(e).then((()=>{this.emit("onChange")}))}}getButtonsLayout(){return this.cache.remember("buttonsLayout",(()=>n.Tag.render(H||(H=$`
<div class="ui-sign-up-content-photo-buttons">
<div class="ui-sign-up-content-photo-button-wrapper">
${0}
</div>
</div>
`),this.getUploadPhoto().render())))}getCanvas(){return this.cache.remember("canvas",(()=>new B({})))}getMoreButton(){return this.cache.remember("moreButton",(()=>n.Tag.render(F||(F=$`
<div
class="ui-sign-up-content-photo-more-button"
onclick="${0}"
></div>
`),this.onMoreButtonClick.bind(this))))}onMoreButtonClick(t){t.preventDefault();this.getMoreMenu().show()}getMoreMenu(){return this.cache.remember("moreMenu",(()=>a.PopupMenu.create({id:"moreMenu",bindElement:this.getMoreButton(),items:[{id:"upload",text:n.Loc.getMessage("UI_SIGN_UP_UPLOAD_NEW"),onclick:this.onUploadPhotoClick.bind(this)}]})))}getPreviewLayout(){return this.cache.remember("previewLayout",(()=>n.Tag.render(R||(R=$`
<div class="ui-sign-up-content-photo-preview">
${0}
${0}
</div>
`),this.getCanvas().getLayout(),this.getMoreButton())))}getLayout(){return this.cache.remember("layout",(()=>n.Tag.render(X||(X=$`
<div class="ui-sign-up-content">
${0}
${0}
</div>
`),this.getButtonsLayout(),this.getFileInput())))}}var j="/bitrix/js/ui/sign-up/dist/images/initials.svg";var W="/bitrix/js/ui/sign-up/dist/images/initials-active.svg";var V="/bitrix/js/ui/sign-up/dist/images/touch.svg";var Y="/bitrix/js/ui/sign-up/dist/images/touch-active.svg";var K="/bitrix/js/ui/sign-up/dist/images/photo.svg";var Q="/bitrix/js/ui/sign-up/dist/images/photo-active.svg";let J=t=>t,q;class z extends e.EventEmitter{constructor(t={}){super();this.cache=new n.Cache.MemoryCache;this.setEventNamespace("BX.UI.SignUp");this.subscribeFromOptions(t.events);this.setOptions(t);this.onChangeDebounced=n.Runtime.debounce(this.onChangeDebounced,200,this);if(!this.hasValue()){this.getFooter().getSaveButton().setDisabled(true)}}setOptions(t){this.cache.set("options",{mode:"desktop",...t})}getOptions(){return this.cache.get("options",{})}getFooter(){return this.cache.remember("footer",(()=>new T({mode:this.getOptions().mode,events:{onSaveClickAsync:()=>this.emitAsync("onSaveClickAsync"),onSaveClick:()=>{this.emit("onSaveClick")},onCancelClick:()=>{this.emit("onCancelClick")}}})))}getLayout(){return this.cache.remember("layout",(()=>n.Tag.render(q||(q=J`
<div class="ui-sign-up">
${0}
${0}
</div>
`),this.getTabs().getLayout(),this.getFooter().getLayout())))}renderTo(t){if(!n.Type.isDomNode(t)){throw new TypeError("Target is not a HTMLElement")}n.Dom.append(this.getLayout(),t)}getInitialsContent(){return this.cache.remember("initialsContent",(()=>new x({events:{onChange:this.onChangeDebounced},color:this.getOptions().signColor})))}getTouchContent(){return this.cache.remember("touchContent",(()=>new k({mode:this.getOptions().mode,events:{onChange:this.onChangeDebounced},color:this.getOptions().signColor})))}getPhotoContent(){return this.cache.remember("photoContent",(()=>new G({mode:this.getOptions().mode,events:{onChange:this.onChangeDebounced}})))}getTabs(){return this.cache.remember("tabs",(()=>new v({defaultState:this.getOptions().defaultState,tabs:[{id:"initials",header:n.Loc.getMessage("UI_SIGN_UP_TAB_INITIALS_TITLE"),icon:j,activeIcon:W,content:this.getInitialsContent()},{id:"touch",header:n.Loc.getMessage("UI_SIGN_UP_TAB_TOUCH_TITLE"),icon:V,activeIcon:Y,content:this.getTouchContent()},{id:"photo",header:n.Loc.getMessage("UI_SIGN_UP_TAB_PHOTO_TITLE"),icon:K,activeIcon:Q,content:this.getPhotoContent()}]})))}getCanvas(){return this.getTabs().getCurrentTab().getContent().getCanvas().getLayout()}onChangeDebounced(){this.getFooter().getSaveButton().setDisabled(!this.hasValue())}hasValue(){const t=this.getCanvas();const e=t.getContext("2d");const s=new Uint32Array(e.getImageData(0,0,t.width,t.height).data.buffer);let i=0;return s.some((t=>t!==0&&i++>z.MIN_PIXELS_REQUIRED))}async getValue(){const t=this.getTabs().getCurrentTab().getContent().getCanvas().getLayout();return await new Promise((e=>{t.toBlob(e,"image/png")}))}}z.MIN_PIXELS_REQUIRED=100;t.SignUp=z})(this.BX.UI=this.BX.UI||{},BX.Event,BX,BX,BX,BX.UI,BX.Main,BX.UI.Dialogs);
//# sourceMappingURL=sign-up.bundle.map.js