fix video updates

2018-11-07 17:51:06 -05:00 · 2018-11-07 17:51:06 -05:00 · cb28ad5c67
commit cb28ad5c67
parent d35f48a90e
7 changed files with 133 additions and 72 deletions
--- a/client/src/components/DropzoneInstructionsDisplay/index.jsx
+++ b/client/src/components/DropzoneInstructionsDisplay/index.jsx
@ -2,11 +2,14 @@ import React from 'react';
 import FormFeedbackDisplay from '@components/FormFeedbackDisplay';
 import Row from '@components/Row';

-const DropzoneInstructionsDisplay = ({fileError}) => {
+const DropzoneInstructionsDisplay = ({fileError, message}) => {
+  if (!message) {
+    message = 'Drag & drop image or video here to publish';
+  }
  return (
    <div className={'dropzone-instructions-display'}>
      <Row>
-        <p className={'text--large'}>Drag & drop image or video here to publish</p>
+        <p className={'text--large'}>{message}</p>
      </Row>
      <Row>
        <p className={'text--small'}>OR</p>
--- a/client/src/components/DropzonePreviewImage/index.jsx
+++ b/client/src/components/DropzonePreviewImage/index.jsx
@ -12,6 +12,7 @@ class PublishPreview extends React.Component {
  componentDidMount () {
    const { isUpdate, sourceUrl, file } = this.props;
    if (isUpdate && sourceUrl) {
+      console.log('setting sourceUrl:', sourceUrl);
      this.setState({ imgSource: sourceUrl });
    } else {
      this.setPreviewImageSource(file);
--- a/client/src/containers/Dropzone/index.js
+++ b/client/src/containers/Dropzone/index.js
@ -13,7 +13,8 @@ const mapStateToProps = ({ show, publish: { file, thumbnail, fileError, isUpdate
  if (isUpdate) {
    asset = selectAsset(show);
    if (asset) {
-      if (asset.claimData.fileExt === 'mp4') {
+      obj.fileExt = asset.claimData.contentType.split('/')[1];
+      if (obj.fileExt === 'mp4') {
        obj.sourceUrl = asset.claimData.thumbnail ? asset.claimData.thumbnail : defaultThumbnail;
      } else {
        ({claimData: {fileExt, outpoint}} = asset);
--- a/client/src/containers/Dropzone/view.jsx
+++ b/client/src/containers/Dropzone/view.jsx
@ -82,61 +82,65 @@ class Dropzone extends React.Component {
  }
  render () {
    const { dragOver, mouseOver, dimPreview } = this.state;
-    const { file, thumbnail, fileError, isUpdate, sourceUrl } = this.props;
+    const { file, thumbnail, fileError, isUpdate, sourceUrl, fileExt } = this.props;
    return (
-      <div className='dropzone-wrapper'>
-        <form>
-          <input
-            className='input-file'
-            type='file'
-            id='file_input'
-            name='file_input'
-            accept='video/*,image/*'
-            onChange={this.handleFileInput}
-            encType='multipart/form-data'
-          />
-        </form>
-        <div
-          className={'dropzone' + (dragOver ? ' dropzone--drag-over' : '')}
-          onDrop={this.handleDrop}
-          onDragOver={this.handleDragOver}
-          onDragEnd={this.handleDragEnd}
-          onDragEnter={this.handleDragEnter}
-          onDragLeave={this.handleDragLeave}
-          onMouseEnter={this.handleMouseEnter}
-          onMouseLeave={this.handleMouseLeave}
-          onClick={this.handleClick}>
-          {file || isUpdate ? (
-            <div className={'dropzone-preview-wrapper'}>
-              {file ? (
-                <DropzonePreviewImage
-                  dimPreview={dimPreview}
-                  file={file}
-                  thumbnail={thumbnail}
-                />
-              ) : (
-                <DropzonePreviewImage
-                  dimPreview
-                  isUpdate
-                  sourceUrl={sourceUrl}
-                />
-              )}
-              <div className={'dropzone-preview-overlay'}>
-                { dragOver ? <DropzoneDropItDisplay /> : null }
-                { mouseOver ? (
-                  <DropzoneInstructionsDisplay
-                    fileError={fileError}
+      <div>
+        {isUpdate && fileExt === 'mp4' && (<p>Video thumbnail:</p>)}
+        <div className='dropzone-wrapper'>
+          <form>
+            <input
+              className='input-file'
+              type='file'
+              id='file_input'
+              name='file_input'
+              accept='video/*,image/*'
+              onChange={this.handleFileInput}
+              encType='multipart/form-data'
+            />
+          </form>
+          <div
+            className={'dropzone' + (dragOver ? ' dropzone--drag-over' : '')}
+            onDrop={this.handleDrop}
+            onDragOver={this.handleDragOver}
+            onDragEnd={this.handleDragEnd}
+            onDragEnter={this.handleDragEnter}
+            onDragLeave={this.handleDragLeave}
+            onMouseEnter={this.handleMouseEnter}
+            onMouseLeave={this.handleMouseLeave}
+            onClick={this.handleClick}>
+            {file || isUpdate ? (
+              <div className={'dropzone-preview-wrapper'}>
+                {file ? (
+                  <DropzonePreviewImage
+                    dimPreview={dimPreview}
+                    file={file}
+                    thumbnail={thumbnail}
                  />
-                ) : null }
+                ) : (
+                  <DropzonePreviewImage
+                    dimPreview
+                    isUpdate
+                    sourceUrl={sourceUrl}
+                  />
+                )}
+                <div className={'dropzone-preview-overlay'}>
+                  { dragOver ? <DropzoneDropItDisplay /> : null }
+                  { mouseOver ? (
+                    <DropzoneInstructionsDisplay
+                      fileError={fileError}
+                      message={fileExt === 'mp4' ? 'Drag & drop new thumbnail' : null}
+                    />
+                  ) : null }
+                </div>
              </div>
-            </div>
-          ) : (
-            dragOver ? <DropzoneDropItDisplay /> : (
-              <DropzoneInstructionsDisplay
-                fileError={fileError}
-              />
-            )
-          )}
+            ) : (
+              dragOver ? <DropzoneDropItDisplay /> : (
+                <DropzoneInstructionsDisplay
+                  fileError={fileError}
+                />
+              )
+            )}
+          </div>
        </div>
      </div>
    );
--- a/server/controllers/api/claim/publish/publish.js
+++ b/server/controllers/api/claim/publish/publish.js
@ -5,11 +5,11 @@ const { createFileRecordDataAfterPublish } = require('../../../../models/utils/c
 const { createClaimRecordDataAfterPublish } = require('../../../../models/utils/createClaimRecordData.js');
 const deleteFile = require('./deleteFile.js');

-const publish = async (publishParams, fileName, fileType, filePath) => {
+const publish = async (publishParams, fileName, fileType) => {
  let publishResults;
  let channel;
  let fileRecord;
-  let newFile = Boolean(filePath);
+  let newFile = Boolean(publishParams.file_path);

  try {
    publishResults = await publishClaim(publishParams);
@ -33,22 +33,28 @@ const publish = async (publishParams, fileName, fileType, filePath) => {
    const {claimId} = claimRecord;
    const upsertCriteria = {name: publishParams.name, claimId};
    if (newFile) {
+      // this is the problem
+      //
      fileRecord = await createFileRecordDataAfterPublish(fileName, fileType, publishParams, publishResults);
    } else {
-      fileRecord = await db.File.findOne({where: {claimId}});
+      fileRecord = await db.File.findOne({where: {claimId}}).then(result => result.dataValues);
    }

+    logger.info('fileRecord:', fileRecord);
+    logger.info('claimRecord:', claimRecord);
+    logger.info('upsertCriteria:', upsertCriteria);
+
    const [file, claim] = await Promise.all([
      db.upsert(db.File, fileRecord, upsertCriteria, 'File'),
      db.upsert(db.Claim, claimRecord, upsertCriteria, 'Claim'),
    ]);
-    logger.info('File and Claim records successfully created');
+    logger.info(`File and Claim records successfully created (${publishParams.name})`);

    await Promise.all([
      file.setClaim(claim),
      claim.setFile(file),
    ]);
-    logger.info('File and Claim records successfully associated');
+    logger.info(`File and Claim records successfully associated (${publishParams.name})`);

    return Object.assign({}, claimRecord, {outpoint});
  } catch (err) {
@ -56,8 +62,8 @@ const publish = async (publishParams, fileName, fileType, filePath) => {
    // this needs work
    logger.info('publish/publish err:', err);
    const error = typeof err === 'string' ? JSON.parse(err) : err;
-    if (filePath) {
-      await deleteFile(filePath);
+    if (publishParams.file_path) {
+      await deleteFile(publishParams.file_path);
    }
    const message = error.error && error.error.message ? error.error.message : 'Unknown publish error';
    return {
--- a/server/controllers/api/claim/update/index.js
+++ b/server/controllers/api/claim/update/index.js
@ -25,6 +25,13 @@ const updateMetadata = ({nsfw, license, title, description}) => {
  return update;
 };

+const rando = () => {
+  let text = '';
+  const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+  for (let i = 0; i < 6; i += 1) text += possible.charAt(Math.floor(Math.random() * 62));
+  return text;
+};
+
 const claimUpdate = ({ body, files, headers, ip, originalUrl, user, tor }, res) => {
  // logging
  logger.info('Claim update request:', {
@ -44,7 +51,27 @@ const claimUpdate = ({ body, files, headers, ip, originalUrl, user, tor }, res)
  }

  // define variables
-  let channelName, channelId, channelPassword, description, fileName, filePath, fileType, gaStartTime, thumbnail, fileExtension, license, name, nsfw, thumbnailFileName, thumbnailFilePath, thumbnailFileType, title, claimRecord, metadata, publishResult;
+  let channelName,
+    channelId,
+    channelPassword,
+    description,
+    fileName,
+    filePath,
+    fileType,
+    gaStartTime,
+    thumbnail,
+    fileExtension,
+    license,
+    name,
+    nsfw,
+    thumbnailFileName,
+    thumbnailFilePath,
+    thumbnailFileType,
+    title,
+    claimRecord,
+    metadata,
+    publishResult,
+    thumbnailUpdate = false;
  // record the start time of the request
  gaStartTime = Date.now();

@ -59,12 +86,19 @@ const claimUpdate = ({ body, files, headers, ip, originalUrl, user, tor }, res)
  // check channel authorization
  authenticateUser(channelName, channelId, channelPassword, user)
    .then(({ channelName, channelClaimId }) => {
+      if (!channelId) {
+        channelId = channelClaimId;
+      }
      return chainquery.claim.queries.resolveClaimInChannel(name, channelClaimId).then(claim => claim.dataValues);
    })
    .then(claim => {
      claimRecord = claim;
+      if (claimRecord.content_type === 'video/mp4' && files.file) {
+        thumbnailUpdate = true;
+      }
+      logger.info('claimRecord:', claimRecord);

-      if (!files.file) {
+      if (!files.file || thumbnailUpdate) {
        return Promise.all([
          db.File.findOne({ where: { name, claimId: claim.claim_id } }),
          resolveUri(`${claim.name}#${claim.claim_id}`),
@ -91,18 +125,26 @@ const claimUpdate = ({ body, files, headers, ip, originalUrl, user, tor }, res)
        channel_id   : channelId,
        metadata,
      };
+
      if (files.file) {
-        publishParams['file_path'] = filePath;
+        if (thumbnailUpdate) {
+          // publish new thumbnail
+          const newThumbnailName = `${name}-${rando()}`;
+          const newThumbnailParams = createThumbnailPublishParams(filePath, newThumbnailName, license, nsfw);
+          newThumbnailParams['file_path'] = filePath;
+          logger.info('newThumbnailParams:', newThumbnailParams);
+          publish(newThumbnailParams, fileName, fileType);
+
+          publishParams['sources'] = resolution.claim.value.stream.source;
+          publishParams['thumbnail'] = `${details.host}/${newThumbnailParams.channel_name}:${newThumbnailParams.channel_id}/${newThumbnailName}-thumb.jpg`;
+        } else {
+          publishParams['file_path'] = filePath;
+        }
      } else {
        fileName = fileResult.fileName;
        fileType = fileResult.fileType;
        publishParams['sources'] = resolution.claim.value.stream.source;
-      }
-      // publish the thumbnail, if one exists
-      if (thumbnailFileName) {
-        const thumbnailPublishParams = createThumbnailPublishParams(thumbnailFilePath, name, license, nsfw);
-        publish(thumbnailPublishParams, thumbnailFileName, thumbnailFileType);
-        publishParams['thumbnail'] = `${details.host}/${channelName}:${channelId}/${name}-thumb.jpg`;
+        publishParams['thumbnail'] = claimRecord.thumbnail_url;
      }

      const fp = files && files.file && files.file.path ? files.file.path : undefined;
--- a/server/models/utils/createFileRecordData.js
+++ b/server/models/utils/createFileRecordData.js
@ -47,7 +47,7 @@ async function createFileRecordDataAfterPublish (fileName, fileType, publishPara
    width: fileWidth,
  } = await getMediaDimensions(fileType, filePath);

-  return {
+  const obj = {
    name,
    claimId,
    outpoint: `${txid}:${nout}`,
@ -57,6 +57,10 @@ async function createFileRecordDataAfterPublish (fileName, fileType, publishPara
    filePath,
    fileType,
  };
+
+  console.log('createFileRecordDataAfterPublish return:', obj);
+
+  return obj;
 }

 module.exports = {