%PDF- %PDF-
Direktori : /proc/self/root/home/bitrix/www/bitrix/js/landing/ui/field/ |
Current File : //proc/self/root/home/bitrix/www/bitrix/js/landing/ui/field/image_field.min.js |
(function(){"use strict";BX.namespace("BX.Landing.UI.Field");var i=BX.Landing.Utils.isPlainObject;var t=BX.Landing.Utils.isNumber;var e=BX.Landing.Utils.isArray;var n=BX.Landing.Utils.isEmpty;var s=BX.Landing.Utils.isString;var a=BX.Landing.Utils.decodeDataValue;var r=BX.Landing.Utils.clone;var o=BX.Landing.Utils.create;var d=BX.Landing.Utils.fireCustomEvent;var l=BX.Landing.Utils.changeExtension;var h=BX.Landing.Utils.getFileName;var u=BX.Landing.Utils.getFileExtension;BX.Landing.UI.Field.Image=function(t){BX.Landing.UI.Field.Text.apply(this,arguments);this.dimensions=typeof t.dimensions==="object"?t.dimensions:null;this.uploadParams=typeof t.uploadParams==="object"?t.uploadParams:{};this.onValueChangeHandler=t.onValueChange?t.onValueChange:function(){};this.layout.classList.add("landing-ui-field-image");this.type=this.content.type||"image";this.input.innerText=this.content.src;this.input.hidden=true;this.input2x=this.createInput();this.input2x.innerText=this.content.src2x;this.input2x.hidden=true;this.disableAltField=typeof t.disableAltField==="boolean"?t.disableAltField:false;this.fileInput=c(this.selector);this.fileInput.addEventListener("change",this.onFileInputChange.bind(this));this.linkInput=p();this.linkInput.onInputHandler=this.onLinkInput.bind(this);this.dropzone=g(this.selector);this.dropzone.hidden=true;this.dropzone.insertBefore(this.fileInput,this.dropzone.firstElementChild);this.dropzone.addEventListener("dragover",this.onDragOver.bind(this));this.dropzone.addEventListener("dragleave",this.onDragLeave.bind(this));this.dropzone.addEventListener("drop",this.onDrop.bind(this));this.clearButton=m();this.clearButton.on("click",this.onClearClick.bind(this));this.preview=f();this.preview.appendChild(this.clearButton.layout);this.preview.style.backgroundImage="url("+this.input.innerText.trim()+")";this.preview.addEventListener("dragenter",this.onImageDragEnter.bind(this));this.loader=new BX.Loader({target:this.preview});this.icon=L();this.image=I();this.image.appendChild(this.preview);this.image.appendChild(this.icon);this.image.dataset.fileid=this.content.id;this.image.dataset.fileid2x=this.content.id2x;this.hiddenImage=o("img",{props:{className:"landing-ui-field-image-hidden"}});if(i(this.content)&&"src"in this.content){this.hiddenImage.src=this.content.src}this.altField=v();this.altField.setValue(this.content.alt);this.left=B();this.left.appendChild(this.dropzone);this.left.appendChild(this.image);this.left.appendChild(this.hiddenImage);if(this.description){this.left.appendChild(this.description)}this.left.appendChild(this.altField.layout);this.left.appendChild(this.linkInput.layout);this.uploadButton=b();this.uploadButton.on("click",this.onUploadClick.bind(this));this.editButton=_();this.editButton.on("click",this.onEditClick.bind(this));this.right=x();this.right.appendChild(this.uploadButton.layout);this.right.appendChild(this.editButton.layout);this.form=y();this.form.appendChild(this.left);this.form.appendChild(this.right);this.layout.appendChild(this.form);this.enableTextOnly();if(!this.input.innerText.trim()||this.input.innerText.trim()===window.location.toString()){this.showDropzone()}if(this.disableAltField){this.altField.layout.hidden=true;this.altField.layout.style.display="none";this.altField.layout.classList.add("landing-ui-hide")}if(this.content.type==="icon"){this.type="icon";this.classList=this.content.classList;var e=this.content.classList;var n=[];BX.Landing.UI.Panel.Icon.getInstance().libraries.forEach(function(i){i.categories.forEach(function(i){i.items.forEach(function(i){var t=i.split(" ");t.forEach(function(i){if(e.indexOf(i)!==-1&&n.indexOf(i)===-1){n.push(i)}})})})});this.icon.innerHTML='<span class="'+n.join(" ")+'"></span>';this.showPreview();this.altField.layout.hidden=true}this.makeAsLinkWrapper=o("div",{props:{className:"landing-ui-field-image-make-as-link-wrapper"},children:[o("div",{props:{className:"landing-ui-field-image-make-as-link-button"},children:[]})]});this.url=new BX.Landing.UI.Field.Link({content:this.content.url||{text:"",href:""},options:{siteId:BX.Landing.Main.getInstance().options.site_id,landingId:BX.Landing.Main.getInstance().id}});this.urlCheckbox=o("input",{props:{type:"checkbox"},attrs:{style:"margin-left: 4px;"}});function s(i,t){if(i.checked){t.querySelector(".landing-ui-field-link-right").classList.remove("landing-ui-disabled");t.querySelector(".landing-ui-field-link-url-grid").classList.remove("landing-ui-disabled")}else{t.querySelector(".landing-ui-field-link-right").classList.add("landing-ui-disabled");t.querySelector(".landing-ui-field-link-url-grid").classList.add("landing-ui-disabled")}}this.urlCheckbox.addEventListener("change",function(){s(this.urlCheckbox,this.url.layout)}.bind(this));this.urlCheckbox.checked=this.content.url&&this.content.url.enabled;s(this.urlCheckbox,this.url.layout);this.url.hrefInput.header.appendChild(this.urlCheckbox);this.url.left.hidden=true;this.makeAsLinkWrapper.appendChild(this.url.layout);if(!t.disableLink){this.layout.appendChild(this.makeAsLinkWrapper)}this.content=this.getValue();BX.DOM.write(function(){this.adjustPreviewBackgroundSize()}.bind(this))};function c(i){return BX.create("input",{props:{className:"landing-ui-field-image-dropzone-input"},attrs:{accept:"image/*",type:"file",id:"file_"+i,name:"picture"}})}function p(){var i=new BX.Landing.UI.Field.Text({id:"path_to_image",placeholder:BX.message("LANDING_IMAGE_UPLOAD_MENU_LINK_LABEL")});i.enableTextOnly();i.layout.hidden=true;return i}function g(i){return BX.create("label",{props:{className:"landing-ui-field-image-dropzone"},children:[BX.create("div",{props:{className:"landing-ui-field-image-dropzone-text"},html:'<div class="landing-ui-field-image-dropzone-title">'+BX.message("LANDING_IMAGE_DROPZONE_TITLE")+"</div>"+'<div class="landing-ui-field-image-dropzone-subtitle">'+BX.message("LANDING_IMAGE_DROPZONE_SUBTITLE")+"</div>"})],attrs:{for:"file_"+i}})}function m(){return new BX.Landing.UI.Button.BaseButton("clear",{className:"landing-ui-field-image-action-button-clear"})}function f(){return BX.create("div",{props:{className:"landing-ui-field-image-preview-inner"}})}function L(){return BX.create("span",{props:{className:"landing-ui-field-image-preview-icon"}})}function I(){return BX.create("div",{props:{className:"landing-ui-field-image-preview"}})}function v(){var i=new BX.Landing.UI.Field.Text({placeholder:BX.message("LANDING_FIELD_IMAGE_ALT_PLACEHOLDER"),className:"landing-ui-field-image-alt",textOnly:true});return i}function B(){return BX.create("div",{props:{className:"landing-ui-field-image-left"}})}function b(){return new BX.Landing.UI.Button.BaseButton("upload",{text:BX.message("LANDING_FIELD_IMAGE_UPLOAD_BUTTON"),className:"landing-ui-field-image-action-button"})}function _(){var i=new BX.Landing.UI.Button.BaseButton("edit",{text:BX.message("LANDING_FIELD_IMAGE_EDIT_BUTTON"),className:"landing-ui-field-image-action-button"});return i}function x(){return BX.create("div",{props:{className:"landing-ui-field-image-right"}})}function y(){return BX.create("form",{props:{className:"landing-ui-field-image-container"},attrs:{method:"post",enctype:"multipart/form-data"},events:{submit:function(i){i.preventDefault()}}})}BX.Landing.UI.Field.Image.prototype={constructor:BX.Landing.UI.Field.Image,__proto__:BX.Landing.UI.Field.Text.prototype,superClass:BX.Landing.UI.Field.Text,onInputInput:function(){this.preview.src=this.input.innerText.trim()},onImageDragEnter:function(i){i.preventDefault();i.stopPropagation();if(!this.imageHidden){this.showDropzone();this.imageHidden=true}},onDragOver:function(i){i.preventDefault();i.stopPropagation();this.dropzone.classList.add("landing-ui-active")},onDragLeave:function(i){i.preventDefault();i.stopPropagation();this.dropzone.classList.remove("landing-ui-active");if(this.imageHidden){this.imageHidden=false;this.showPreview()}},onDrop:function(i){i.preventDefault();i.stopPropagation();this.dropzone.classList.remove("landing-ui-active");this.onFileChange(i.dataTransfer.files[0]);this.imageHidden=false},onFileChange:function(i){this.showLoader();this.upload(i).then(this.setValue.bind(this)).then(this.hideLoader.bind(this)).catch(function(i){console.error(i);this.hideLoader()}.bind(this))},onFileInputChange:function(i){this.onFileChange(i.currentTarget.files[0])},onUploadClick:function(i){this.bindElement=i.currentTarget;i.preventDefault();if(!this.uploadMenu){this.uploadMenu=BX.PopupMenu.create("upload_"+this.selector+ +new Date,this.bindElement,[{text:BX.message("LANDING_IMAGE_UPLOAD_MENU_UNSPLASH"),onclick:this.onUnsplashShow.bind(this)},{text:BX.message("LANDING_IMAGE_UPLOAD_MENU_GOOGLE"),onclick:this.onGoogleShow.bind(this)},{text:BX.message("LANDING_IMAGE_UPLOAD_MENU_UPLOAD"),onclick:this.onUploadShow.bind(this)},{text:BX.message("LANDING_IMAGE_UPLOAD_MENU_LINK"),onclick:this.onLinkShow.bind(this)}],{events:{onPopupClose:function(){this.bindElement.classList.remove("landing-ui-active");if(this.uploadMenu){this.uploadMenu.destroy();this.uploadMenu=null}}.bind(this)}});this.bindElement.parentNode.appendChild(this.uploadMenu.popupWindow.popupContainer)}this.bindElement.classList.add("landing-ui-active");this.uploadMenu.show();var t=BX.pos(this.bindElement,this.bindElement.parentNode);this.uploadMenu.popupWindow.popupContainer.style.top=t.bottom+"px";this.uploadMenu.popupWindow.popupContainer.style.left="auto";this.uploadMenu.popupWindow.popupContainer.style.right="5px"},onUnsplashShow:function(){this.uploadMenu.close();this.showLoader();BX.Landing.UI.Panel.Image.getInstance().show("unsplash",this.dimensions,this.loader,this.uploadParams).then(this.upload.bind(this)).then(this.setValue.bind(this)).then(this.hideLoader.bind(this)).catch(function(i){console.error(i);this.hideLoader()}.bind(this))},onGoogleShow:function(){this.uploadMenu.close();this.showLoader();BX.Landing.UI.Panel.Image.getInstance().show("google",this.dimensions,this.loader,this.uploadParams).then(this.upload.bind(this)).then(this.setValue.bind(this)).then(this.hideLoader.bind(this)).catch(function(i){console.error(i);this.hideLoader()}.bind(this))},onUploadShow:function(){this.uploadMenu.close();this.fileInput.click()},onLinkShow:function(){this.uploadMenu.close();this.showLinkField();this.linkInput.setValue("")},onEditClick:function(i){i.preventDefault();this.edit({src:this.hiddenImage.src})},onClearClick:function(i){i.preventDefault();this.setValue({src:""});this.fileInput.value="";this.showDropzone()},showDropzone:function(){this.dropzone.hidden=false;this.image.hidden=true;this.altField.layout.hidden=true;this.linkInput.layout.hidden=true},showPreview:function(){this.dropzone.hidden=true;this.image.hidden=false;this.altField.layout.hidden=false;this.linkInput.layout.hidden=true},showLinkField:function(){this.dropzone.hidden=true;this.image.hidden=true;this.altField.layout.hidden=true;this.linkInput.layout.hidden=false},onLinkInput:function(i){var t=BX.create("img");t.src=i;t.onload=function(){this.showPreview();this.setValue({src:i})}.bind(this)},showLoader:function(){if(this.dropzone&&!this.dropzone.hidden){this.loader.show(this.dropzone);return}this.loader.show(this.preview)},hideLoader:function(){this.loader.hide()},onInputClick:function(i){i.preventDefault()},isChanged:function(){var i=r(this.content);var t=r(this.getValue());if(i.url&&s(i.url)){i.url=a(i.url)}if(t.url&&s(t.url)){t.url=a(t.url)}return JSON.stringify(i)!==JSON.stringify(t)},adjustPreviewBackgroundSize:function(){var i=BX.create("img",{attrs:{src:this.getValue().src}});i.onload=function(){var t=this.preview.getBoundingClientRect();var e="cover";if(i.width>t.width||i.height>t.height){e="contain"}if(i.width<t.width&&i.height<t.height){e="auto"}BX.DOM.write(function(){this.preview.style.backgroundSize=e}.bind(this))}.bind(this)},setValue:function(i){if(i.type!=="icon"){if(!i||!i.src){this.input.innerText="";this.preview.removeAttribute("style");this.input.dataset.ext=""}else{this.input.innerText=i.src;this.input2x.innerText=i.src2x;this.preview.style.backgroundImage='url("'+(i.src2x||i.src)+'")';this.preview.id=BX.util.getRandomString();this.hiddenImage.src=i.src2x||i.src;this.showPreview()}this.image.dataset.fileid=i&&i.id?i.id:-1;this.image.dataset.fileid2x=i&&i.id2x?i.id2x:-1;this.classList=[]}else{this.preview.style.backgroundImage=null;this.classList=i.classList;this.icon.innerHTML='<span class="'+i.classList.join(" ")+'"></span>';this.showPreview();this.type="icon";this.altField.layout.hidden=true;this.altField.setValue("");this.input.innerText=""}if(i.url){this.url.setValue(i.url)}this.adjustPreviewBackgroundSize();this.hideLoader();this.onValueChangeHandler(this);BX.fireEvent(this.layout,"input");d(this,"BX.Landing.UI.Field:change",[this.getValue()])},reset:function(){this.setValue({type:this.getValue().type,id:-1,src:"",alt:""})},getValue:function(){var i=parseInt(this.image.dataset.fileid);var t=parseInt(this.image.dataset.fileid2x);i=i===i?i:-1;t=t===t?t:-1;var e={type:"",src:"",id:i,id2x:t,src2x:"",alt:"",url:""};if(this.type==="background"){e.type="background";e.src=this.input.innerText.trim();e.src2x=this.input2x.innerText.trim();e.id=i;e.id2x=t}if(this.type==="image"){e.type="image";e.src=this.input.innerText.trim();e.src2x=this.input2x.innerText.trim();e.id=i;e.id2x=t;e.alt=this.altField.getValue()}if(this.type==="icon"){e.type="icon";e.classList=this.classList}e.url=Object.assign({},this.url.getValue(),{enabled:this.urlCheckbox.checked});return e},edit:function(i){var e={image:i.src,proxy:"/bitrix/tools/landing/proxy.php"};this.hiddenImage.src=i.src;var s=function(i){var t;if(i.includes("sites_recommended_transform_default")){t=i.split("sites_recommended_transform_default");return"/bitrix/js/main/imageeditor/external/photoeditorsdk/assets/ui/desktop/editor/controls/transform/ratios/imgly_transform_common_4-3"+t[1]}if(i.includes("sites_recommended_transform_retina")){t=i.split("sites_recommended_transform_retina");return"/bitrix/js/main/imageeditor/external/photoeditorsdk/assets/ui/desktop/editor/controls/transform/ratios/imgly_transform_common_4-3"+t[1]}if(i.includes("landing-transform-3-4")){t=i.split("landing-transform-3-4");return"/bitrix/images/landing/imageeditor/assets/transform/ratios/landing-transform-3-4"+t[1]}if(i.includes("landing-transform-4-3")){t=i.split("landing-transform-4-3");return"/bitrix/images/landing/imageeditor/assets/transform/ratios/landing-transform-4-3"+t[1]}if(i.includes("landing-transform-9-16")){t=i.split("landing-transform-9-16");return"/bitrix/images/landing/imageeditor/assets/transform/ratios/landing-transform-9-16"+t[1]}if(i.includes("landing-transform-16-9")){t=i.split("landing-transform-16-9");return"/bitrix/images/landing/imageeditor/assets/transform/ratios/landing-transform-16-9"+t[1]}if(i.includes("landing-transform-1-1")){t=i.split("landing-transform-1-1");return"/bitrix/images/landing/imageeditor/assets/transform/ratios/landing-transform-1-1"+t[1]}if(i.includes("landing-transform-custom")){t=i.split("landing-transform-custom");return"/bitrix/images/landing/imageeditor/assets/transform/ratios/landing-transform-custom"+t[1]}return i};var a=BX.util.getExtension(i.src);if(!n(this.dimensions)&&t(this.dimensions.width)&&this.dimensions.height){var r=this.dimensions.width/this.dimensions.height;var o={width:this.dimensions.width,height:this.dimensions.height};e={image:i.src,megapixels:100,proxy:"/bitrix/tools/landing/proxy.php",assets:{resolver:s},export:{format:"image/"+(a==="jpg"?"jpeg":a),type:BX.Main.ImageEditor.renderType.BLOB,quality:1},controlsOptions:{transform:{categories:[{identifier:"sites_recommended",defaultName:BX.message("LANDING_IMAGE_EDITOR_RECOMMENDED_RATIOS"),ratios:[{identifier:"sites_recommended_transform_retina",defaultName:BX.message("LANDING_IMAGE_EDITOR_TRANSFORM_DEFAULT"),ratio:r,dimensions:o},{identifier:"landing-transform-custom",defaultName:BX.message("IMAGE_EDITOR_RATIOS_CUSTOM"),ratio:"*",dimensions:o}]},{identifier:"sites_other",defaultName:BX.message("LANDING_IMAGE_EDITOR_OTHER_RATIOS"),ratios:[{identifier:"landing-transform-1-1",defaultName:"1:1",ratio:1,dimensions:o},{identifier:"landing-transform-3-4",defaultName:"3:4",ratio:3/4,dimensions:o},{identifier:"landing-transform-4-3",defaultName:"4:3",ratio:4/3,dimensions:o},{identifier:"landing-transform-9-16",defaultName:"9:16",ratio:9/16,dimensions:o},{identifier:"landing-transform-16-9",defaultName:"16:9",ratio:16/9,dimensions:o}]}],replaceCategories:false,availableRatios:["sites_recommended_transform_default","sites_recommended_transform_retina","landing-transform-3-4","landing-transform-4-3","landing-transform-9-16","landing-transform-16-9","landing-transform-1-1","landing-transform-custom"]}}}}BX.Main.ImageEditor.getInstance().edit(e).then(function(t){BX.Main.ImageEditor.getInstance().SDKInstance=null;t.name=BX.Landing.Utils.getFileName(i.src);return t}).then(this.upload.bind(this)).then(this.setValue.bind(this)).then(this.hideLoader.bind(this)).catch(function(i){console.error(i);this.hideLoader()}.bind(this));var d=function(){if(!BX.Main.ImageEditor.getInstance().SDKInstance){return requestAnimationFrame(d)}BX.Main.ImageEditor.getInstance().SDKInstance._options.assets.resolver=s};requestAnimationFrame(d)},upload:function(i){return Promise.all([BX.Landing.ImageCompressor.compress(i,this.dimensions).then(function(i){return BX.Landing.Backend.getInstance().upload(i,this.uploadParams).catch(console.error)}.bind(this)),BX.Landing.ImageCompressor.compress(i,Object.assign({},this.dimensions,{retina:true})).then(function(i){if(i instanceof File){var t=i.name;Object.defineProperty(i,"name",{get:function(){return BX.Landing.Utils.rename2x(t)},configurable:true})}else{i.name=BX.Landing.Utils.rename2x(i.name)}return BX.Landing.Backend.getInstance().upload(i,this.uploadParams).catch(console.error)}.bind(this))]).then(function(i){return Object.assign({},i[0],{src2x:i[1].src,id2x:i[1].id})})}}})(); //# sourceMappingURL=image_field.map.js