"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactNative = require("react-native");
var _primitives = require("@wordpress/primitives");
var _components = require("@wordpress/components");
var _blockEditor = require("@wordpress/block-editor");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
var _element = require("@wordpress/element");
var _data = require("@wordpress/data");
var _notices = require("@wordpress/notices");
var _url = require("@wordpress/url");
var _style = _interopRequireDefault(require("./style.scss"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const ALLOWED_MEDIA_TYPES = ['audio'];
function AudioEdit({
  attributes,
  setAttributes,
  isSelected,
  insertBlocksAfter,
  onFocus,
  onBlur,
  clientId
}) {
  const {
    id,
    autoplay,
    loop,
    preload,
    src
  } = attributes;
  const [isCaptionSelected, setIsCaptionSelected] = (0, _element.useState)(false);
  const onFileChange = ({
    mediaId,
    mediaUrl
  }) => {
    setAttributes({
      id: mediaId,
      src: mediaUrl
    });
  };
  const {
    wasBlockJustInserted
  } = (0, _data.useSelect)(select => ({
    wasBlockJustInserted: select(_blockEditor.store).wasBlockJustInserted(clientId, 'inserter_menu')
  }));
  const {
    createErrorNotice
  } = (0, _data.useDispatch)(_notices.store);
  function toggleAttribute(attribute) {
    return newValue => {
      setAttributes({
        [attribute]: newValue
      });
    };
  }
  function onSelectURL(newSrc) {
    if (newSrc !== src) {
      if ((0, _url.isURL)(newSrc) && /^https?:/.test((0, _url.getProtocol)(newSrc))) {
        setAttributes({
          src: newSrc,
          id: undefined
        });
      } else {
        createErrorNotice((0, _i18n.__)('Invalid URL. Audio file not found.'));
      }
    }
  }
  function onSelectAudio(media) {
    if (!media || !media.url) {
      // In this case there was an error and we should continue in the editing state
      // previous attributes should be removed because they may be temporary blob urls.
      setAttributes({
        src: undefined,
        id: undefined
      });
      return;
    }
    // Sets the block's attribute and updates the edit component from the
    // selected media, then switches off the editing UI.
    setAttributes({
      src: media.url,
      id: media.id
    });
  }
  function onAudioPress() {
    setIsCaptionSelected(false);
  }
  function onFocusCaption() {
    if (!isCaptionSelected) {
      setIsCaptionSelected(true);
    }
  }
  if (!src) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.View, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.MediaPlaceholder, {
        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.BlockIcon, {
          icon: _icons.audio
        }),
        onSelect: onSelectAudio,
        onSelectURL: onSelectURL,
        accept: "audio/*",
        allowedTypes: ALLOWED_MEDIA_TYPES,
        value: attributes,
        onFocus: onFocus,
        autoOpenMediaUpload: isSelected && wasBlockJustInserted
      })
    });
  }
  function getBlockControls(open) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.BlockControls, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToolbarGroup, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToolbarButton, {
          title: (0, _i18n.__)('Replace audio'),
          icon: _icons.replace,
          onClick: open
        })
      })
    });
  }
  function getBlockUI(open, getMediaOptions) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.MediaUploadProgress, {
      mediaId: id,
      onFinishMediaUploadWithSuccess: onFileChange,
      onMediaUploadStateReset: onFileChange,
      containerStyle: _style.default.progressContainer,
      progressBarStyle: _style.default.progressBar,
      spinnerStyle: _style.default.spinner,
      renderContent: ({
        isUploadInProgress,
        isUploadFailed,
        retryMessage
      }) => {
        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
          children: [!isCaptionSelected && !isUploadInProgress && getBlockControls(open), getMediaOptions(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.AudioPlayer, {
            isUploadInProgress: isUploadInProgress,
            isUploadFailed: isUploadFailed,
            retryMessage: retryMessage,
            attributes: attributes,
            isSelected: isSelected
          })]
        });
      }
    });
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableWithoutFeedback, {
    accessible: !isSelected,
    onPress: onAudioPress,
    disabled: !isSelected,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.View, {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.PanelBody, {
          title: (0, _i18n.__)('Settings'),
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, {
            label: (0, _i18n.__)('Autoplay'),
            onChange: toggleAttribute('autoplay'),
            checked: autoplay,
            help: (0, _i18n.__)('Autoplay may cause usability issues for some users.')
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, {
            label: (0, _i18n.__)('Loop'),
            onChange: toggleAttribute('loop'),
            checked: loop
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.SelectControl, {
            label: (0, _i18n._x)('Preload', 'noun; Audio block parameter'),
            value: preload || ''
            // `undefined` is required for the preload attribute to be unset.
            ,
            onChange: value => setAttributes({
              preload: value || undefined
            }),
            options: [{
              value: '',
              label: (0, _i18n.__)('Browser default')
            }, {
              value: 'auto',
              label: (0, _i18n.__)('Auto')
            }, {
              value: 'metadata',
              label: (0, _i18n.__)('Metadata')
            }, {
              value: 'none',
              label: (0, _i18n._x)('None', '"Preload" value')
            }],
            hideCancelButton: true
          })]
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.MediaUpload, {
        allowedTypes: ALLOWED_MEDIA_TYPES,
        isReplacingMedia: true,
        onSelect: onSelectAudio,
        onSelectURL: onSelectURL,
        render: ({
          open,
          getMediaOptions
        }) => {
          return getBlockUI(open, getMediaOptions);
        }
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.BlockCaption, {
        accessible: true,
        accessibilityLabelCreator: caption => _blockEditor.RichText.isEmpty(caption) ? /* translators: accessibility text. Empty Audio caption. */
        (0, _i18n.__)('Audio caption. Empty') : (0, _i18n.sprintf)( /* translators: accessibility text. %s: Audio caption. */
        (0, _i18n.__)('Audio caption. %s'), caption),
        clientId: clientId,
        isSelected: isCaptionSelected,
        onFocus: onFocusCaption,
        onBlur: onBlur,
        insertBlocksAfter: insertBlocksAfter
      })]
    })
  });
}
var _default = exports.default = AudioEdit;
//# sourceMappingURL=edit.native.js.map