UNPKG

19.4 kBSource Map (JSON)View Raw
1{"version":3,"sources":["@wordpress/block-library/src/cover/edit.js"],"names":["classnames","FastAverageColor","tinycolor","FocalPointPicker","IconButton","PanelBody","RangeControl","ToggleControl","Toolbar","withNotices","compose","BlockControls","BlockIcon","InnerBlocks","InspectorControls","MediaPlaceholder","MediaUpload","MediaUploadCheck","PanelColorSettings","withColors","Component","createRef","Fragment","__","icon","IMAGE_BACKGROUND_TYPE","VIDEO_BACKGROUND_TYPE","ALLOWED_MEDIA_TYPES","INNER_BLOCKS_TEMPLATE","align","fontSize","placeholder","INNER_BLOCKS_ALLOWED_BLOCKS","retrieveFastAverageColor","fastAverageColor","backgroundImageStyles","url","backgroundImage","dimRatioToClass","ratio","Math","round","CoverEdit","arguments","state","isDark","imageRef","videoRef","changeIsDarkIfRequired","bind","handleBackgroundMode","prevProps","props","attributes","setAttributes","className","noticeOperations","noticeUI","overlayColor","setOverlayColor","backgroundType","dimRatio","focalPoint","hasParallax","id","onSelectMedia","media","undefined","mediaType","media_type","type","toggleParallax","setDimRatio","style","backgroundColor","color","backgroundPosition","x","y","controls","open","value","onChange","label","placeholderIcon","title","instructions","createErrorNotice","classes","display","element","current","getColorAsync","newIsDark","setState"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport FastAverageColor from 'fast-average-color';\nimport tinycolor from 'tinycolor2';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tFocalPointPicker,\n\tIconButton,\n\tPanelBody,\n\tRangeControl,\n\tToggleControl,\n\tToolbar,\n\twithNotices,\n} from '@wordpress/components';\nimport { compose } from '@wordpress/compose';\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInnerBlocks,\n\tInspectorControls,\n\tMediaPlaceholder,\n\tMediaUpload,\n\tMediaUploadCheck,\n\tPanelColorSettings,\n\twithColors,\n} from '@wordpress/editor';\nimport { Component, createRef, Fragment } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport icon from './icon';\n\n/**\n * Module Constants\n */\nexport const IMAGE_BACKGROUND_TYPE = 'image';\nexport const VIDEO_BACKGROUND_TYPE = 'video';\nconst ALLOWED_MEDIA_TYPES = [ 'image', 'video' ];\nconst INNER_BLOCKS_TEMPLATE = [\n\t[ 'core/paragraph', {\n\t\talign: 'center',\n\t\tfontSize: 'large',\n\t\tplaceholder: __( 'Write title…' ),\n\t} ],\n];\nconst INNER_BLOCKS_ALLOWED_BLOCKS = [ 'core/button', 'core/heading', 'core/paragraph' ];\n\nfunction retrieveFastAverageColor() {\n\tif ( ! retrieveFastAverageColor.fastAverageColor ) {\n\t\tretrieveFastAverageColor.fastAverageColor = new FastAverageColor();\n\t}\n\treturn retrieveFastAverageColor.fastAverageColor;\n}\n\nexport function backgroundImageStyles( url ) {\n\treturn url ?\n\t\t{ backgroundImage: `url(${ url })` } :\n\t\t{};\n}\n\nexport function dimRatioToClass( ratio ) {\n\treturn ( ratio === 0 || ratio === 50 ) ?\n\t\tnull :\n\t\t'has-background-dim-' + ( 10 * Math.round( ratio / 10 ) );\n}\n\nclass CoverEdit extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\t\tthis.state = {\n\t\t\tisDark: false,\n\t\t};\n\t\tthis.imageRef = createRef();\n\t\tthis.videoRef = createRef();\n\t\tthis.changeIsDarkIfRequired = this.changeIsDarkIfRequired.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.handleBackgroundMode();\n\t}\n\n\tcomponentDidUpdate( prevProps ) {\n\t\tthis.handleBackgroundMode( prevProps );\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tattributes,\n\t\t\tsetAttributes,\n\t\t\tclassName,\n\t\t\tnoticeOperations,\n\t\t\tnoticeUI,\n\t\t\toverlayColor,\n\t\t\tsetOverlayColor,\n\t\t} = this.props;\n\t\tconst {\n\t\t\tbackgroundType,\n\t\t\tdimRatio,\n\t\t\tfocalPoint,\n\t\t\thasParallax,\n\t\t\tid,\n\t\t\turl,\n\t\t} = attributes;\n\t\tconst onSelectMedia = ( media ) => {\n\t\t\tif ( ! media || ! media.url ) {\n\t\t\t\tsetAttributes( { url: undefined, id: undefined } );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tlet mediaType;\n\t\t\t// for media selections originated from a file upload.\n\t\t\tif ( media.media_type ) {\n\t\t\t\tif ( media.media_type === IMAGE_BACKGROUND_TYPE ) {\n\t\t\t\t\tmediaType = IMAGE_BACKGROUND_TYPE;\n\t\t\t\t} else {\n\t\t\t\t\t// only images and videos are accepted so if the media_type is not an image we can assume it is a video.\n\t\t\t\t\t// Videos contain the media type of 'file' in the object returned from the rest api.\n\t\t\t\t\tmediaType = VIDEO_BACKGROUND_TYPE;\n\t\t\t\t}\n\t\t\t} else { // for media selections originated from existing files in the media library.\n\t\t\t\tif (\n\t\t\t\t\tmedia.type !== IMAGE_BACKGROUND_TYPE &&\n\t\t\t\t\tmedia.type !== VIDEO_BACKGROUND_TYPE\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tmediaType = media.type;\n\t\t\t}\n\n\t\t\tsetAttributes( {\n\t\t\t\turl: media.url,\n\t\t\t\tid: media.id,\n\t\t\t\tbackgroundType: mediaType,\n\t\t\t} );\n\t\t};\n\t\tconst toggleParallax = () => setAttributes( { hasParallax: ! hasParallax } );\n\t\tconst setDimRatio = ( ratio ) => setAttributes( { dimRatio: ratio } );\n\n\t\tconst style = {\n\t\t\t...(\n\t\t\t\tbackgroundType === IMAGE_BACKGROUND_TYPE ?\n\t\t\t\t\tbackgroundImageStyles( url ) :\n\t\t\t\t\t{}\n\t\t\t),\n\t\t\tbackgroundColor: overlayColor.color,\n\t\t};\n\n\t\tif ( focalPoint ) {\n\t\t\tstyle.backgroundPosition = `${ focalPoint.x * 100 }% ${ focalPoint.y * 100 }%`;\n\t\t}\n\n\t\tconst controls = (\n\t\t\t<Fragment>\n\t\t\t\t<BlockControls>\n\t\t\t\t\t{ !! url && (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t\t\t<Toolbar>\n\t\t\t\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\t\t\t\tvalue={ id }\n\t\t\t\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-toolbar__control\"\n\t\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Edit media' ) }\n\t\t\t\t\t\t\t\t\t\t\t\ticon=\"edit\"\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={ open }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Toolbar>\n\t\t\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t) }\n\t\t\t\t</BlockControls>\n\t\t\t\t{ !! url && (\n\t\t\t\t\t<InspectorControls>\n\t\t\t\t\t\t<PanelBody title={ __( 'Cover Settings' ) }>\n\t\t\t\t\t\t\t{ IMAGE_BACKGROUND_TYPE === backgroundType && (\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Fixed Background' ) }\n\t\t\t\t\t\t\t\t\tchecked={ hasParallax }\n\t\t\t\t\t\t\t\t\tonChange={ toggleParallax }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ IMAGE_BACKGROUND_TYPE === backgroundType && ! hasParallax && (\n\t\t\t\t\t\t\t\t<FocalPointPicker\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Focal Point Picker' ) }\n\t\t\t\t\t\t\t\t\turl={ url }\n\t\t\t\t\t\t\t\t\tvalue={ focalPoint }\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) => setAttributes( { focalPoint: value } ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<PanelColorSettings\n\t\t\t\t\t\t\t\ttitle={ __( 'Overlay' ) }\n\t\t\t\t\t\t\t\tinitialOpen={ true }\n\t\t\t\t\t\t\t\tcolorSettings={ [ {\n\t\t\t\t\t\t\t\t\tvalue: overlayColor.color,\n\t\t\t\t\t\t\t\t\tonChange: setOverlayColor,\n\t\t\t\t\t\t\t\t\tlabel: __( 'Overlay Color' ),\n\t\t\t\t\t\t\t\t} ] }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Background Opacity' ) }\n\t\t\t\t\t\t\t\t\tvalue={ dimRatio }\n\t\t\t\t\t\t\t\t\tonChange={ setDimRatio }\n\t\t\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\t\t\t\tstep={ 10 }\n\t\t\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</PanelColorSettings>\n\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t</InspectorControls>\n\t\t\t\t) }\n\t\t\t</Fragment>\n\t\t);\n\n\t\tif ( ! url ) {\n\t\t\tconst placeholderIcon = <BlockIcon icon={ icon } />;\n\t\t\tconst label = __( 'Cover' );\n\n\t\t\treturn (\n\t\t\t\t<Fragment>\n\t\t\t\t\t{ controls }\n\t\t\t\t\t<MediaPlaceholder\n\t\t\t\t\t\ticon={ placeholderIcon }\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tlabels={ {\n\t\t\t\t\t\t\ttitle: label,\n\t\t\t\t\t\t\tinstructions: __( 'Drag an image or a video, upload a new one or select a file from your library.' ),\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\t\t\taccept=\"image/*,video/*\"\n\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\tnotices={ noticeUI }\n\t\t\t\t\t\tonError={ noticeOperations.createErrorNotice }\n\t\t\t\t\t/>\n\t\t\t\t</Fragment>\n\t\t\t);\n\t\t}\n\n\t\tconst classes = classnames(\n\t\t\tclassName,\n\t\t\tdimRatioToClass( dimRatio ),\n\t\t\t{\n\t\t\t\t'is-dark-theme': this.state.isDark,\n\t\t\t\t'has-background-dim': dimRatio !== 0,\n\t\t\t\t'has-parallax': hasParallax,\n\t\t\t}\n\t\t);\n\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t{ controls }\n\t\t\t\t<div\n\t\t\t\t\tdata-url={ url }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t>\n\t\t\t\t\t{ IMAGE_BACKGROUND_TYPE === backgroundType && (\n\t\t\t\t\t\t// Used only to programmatically check if the image is dark or not\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tref={ this.imageRef }\n\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tdisplay: 'none',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsrc={ url }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ VIDEO_BACKGROUND_TYPE === backgroundType && (\n\t\t\t\t\t\t<video\n\t\t\t\t\t\t\tref={ this.videoRef }\n\t\t\t\t\t\t\tclassName=\"wp-block-cover__video-background\"\n\t\t\t\t\t\t\tautoPlay\n\t\t\t\t\t\t\tmuted\n\t\t\t\t\t\t\tloop\n\t\t\t\t\t\t\tsrc={ url }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t<div className=\"wp-block-cover__inner-container\">\n\t\t\t\t\t\t<InnerBlocks\n\t\t\t\t\t\t\ttemplate={ INNER_BLOCKS_TEMPLATE }\n\t\t\t\t\t\t\tallowedBlocks={ INNER_BLOCKS_ALLOWED_BLOCKS }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\thandleBackgroundMode( prevProps ) {\n\t\tconst { attributes, overlayColor } = this.props;\n\t\tconst { dimRatio, url } = attributes;\n\t\t// If opacity is greater than 50 the dominant color is the overlay color,\n\t\t// so use that color for the dark mode computation.\n\t\tif ( dimRatio > 50 ) {\n\t\t\tif (\n\t\t\t\tprevProps &&\n\t\t\t\tprevProps.attributes.dimRatio > 50 &&\n\t\t\t\tprevProps.overlayColor.color === overlayColor.color\n\t\t\t) {\n\t\t\t\t// No relevant prop changes happened there is no need to apply any change.\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( ! overlayColor.color ) {\n\t\t\t\t// If no overlay color exists the overlay color is black (isDark )\n\t\t\t\tthis.changeIsDarkIfRequired( true );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tthis.changeIsDarkIfRequired(\n\t\t\t\ttinycolor( overlayColor.color ).isDark()\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\t\t// If opacity is lower than 50 the dominant color is the image or video color,\n\t\t// so use that color for the dark mode computation.\n\n\t\tif (\n\t\t\tprevProps &&\n\t\t\tprevProps.attributes.dimRatio <= 50 &&\n\t\t\tprevProps.attributes.url === url\n\t\t) {\n\t\t\t// No relevant prop changes happened there is no need to apply any change.\n\t\t\treturn;\n\t\t}\n\t\tconst { backgroundType } = attributes;\n\n\t\tlet element;\n\n\t\tswitch ( backgroundType ) {\n\t\t\tcase IMAGE_BACKGROUND_TYPE:\n\t\t\t\telement = this.imageRef.current;\n\t\t\t\tbreak;\n\t\t\tcase VIDEO_BACKGROUND_TYPE:\n\t\t\t\telement = this.videoRef.current;\n\t\t\t\tbreak;\n\t\t}\n\t\tif ( ! element ) {\n\t\t\treturn;\n\t\t}\n\t\tretrieveFastAverageColor().getColorAsync( element, ( color ) => {\n\t\t\tthis.changeIsDarkIfRequired( color.isDark );\n\t\t} );\n\t}\n\n\tchangeIsDarkIfRequired( newIsDark ) {\n\t\tif ( this.state.isDark !== newIsDark ) {\n\t\t\tthis.setState( {\n\t\t\t\tisDark: newIsDark,\n\t\t\t} );\n\t\t}\n\t}\n}\n\nexport default compose( [\n\twithColors( { overlayColor: 'background-color' } ),\n\twithNotices,\n] )( CoverEdit );\n"]}
\No newline at end of file