talk-message-forms - npm Package Compare versions

Comparing version 0.1.6 to 0.1.7

lib/default/file.js

@@ -17,22 +17,4 @@ (function() {
       attachment: T.object.isRequired,
-      eventBus: T.object,
       color: T.string
     },
-    getInitialState: function() {
-      return {
-        progress: 0
-      };
-    },
-    componentDidMount: function() {
-      if (this.props.eventBus != null) {
-        if (this.props.attachment.data.fileKey == null) {
-          return this.props.eventBus.addListener('uploader/progress', this.onProgress);
-        }
-      }
-    },
-    componentWillUnoumt: function() {
-      if (this.props.eventBus != null) {
-        return eventBus.removeListener('uploader/progress', this.onProgress);
-      }
-    },
     getColor: function() {
@@ -50,22 +32,9 @@ var color, ref;
     },
-    onProgress: function(progress, data) {
-      var fileName, fileSize;
-      fileName = data.fileName, fileSize = data.fileSize;
-      if ((fileName === this.props.attachment.data.fileName) && (fileSize === this.props.attachment.data.fileSize)) {
-        if (this.isMounted()) {
-          return this.setState({
-            progress: progress
-          });
-        }
-      }
-    },
     renderProgress: function() {
-      var style;
-      if (this.props.eventBus == null) {
-        return;
-      }
-      if (this.props.attachment.data.fileKey == null) {
+      var progress, style;
+      progress = this.props.attachment.progress;
+      if (Number.isFinite(progress) && (0 <= progress && progress <= 1)) {
         style = {
           backgroundColor: this.getColor(),
-          width: (this.state.progress * 100) + "%"
+          width: (progress * 100) + "%"
         };
@@ -72,0 +41,0 @@ return div({

lib/default/image.js

@@ -19,31 +19,7 @@ (function() {
     propTypes: {
+      attachment: T.object.isRequired,
       collectionMode: T.bool,
       onClick: T.func,
-      onLoaded: T.func,
-      attachment: T.object.isRequired,
-      eventBus: T.object
+      onLoaded: T.func
     },
-    getInitialState: function() {
-      return {
-        isLoading: true,
-        isUploading: false
-      };
-    },
-    componentDidMount: function() {
-      var ref;
-      if (this.props.eventBus != null) {
-        if (!((ref = this.props.attachment.data.fileKey) != null ? ref.length : void 0)) {
-          this.props.eventBus.addListener('uploader/progress', this.onProgress);
-          this.props.eventBus.addListener('uploader/complete', this.onDone);
-          return this.props.eventBus.addListener('uploader/error', this.onDone);
-        }
-      }
-    },
-    componentWillUnoumt: function() {
-      if (this.props.eventBus != null) {
-        this.props.eventBus.removeListener('uploader/progress', this.onProgress);
-        this.props.eventBus.removeListener('uploader/complete', this.onDone);
-        return this.props.eventBus.removeListener('uploader/error', this.onDone);
-      }
-    },
     onClick: function() {
@@ -55,18 +31,23 @@ var base;
       var base;
-      this.setState({
-        isLoading: false
-      });
       return typeof (base = this.props).onLoaded === "function" ? base.onLoaded() : void 0;
     },
-    onProgress: function() {
-      if (this.isMounted()) {
-        return this.setState({
-          isUploading: true
-        });
+    renderLoadingScreen: function() {
+      var progress, style;
+      progress = this.props.attachment.progress;
+      if (this.props.attachment.isUploading && Number.isFinite(progress) && (0 <= progress && progress <= 1)) {
+        style = {
+          width: (progress * 100) + "%"
+        };
+        return div({
+          className: 'progress-background'
+        }, div({
+          className: 'progress-bar',
+          style: style
+        }));
       }
     },
-    onDone: function() {
-      if (this.isMounted()) {
-        return this.setState({
-          isUploading: false
+    renderLoadingIndicator: function() {
+      if (this.props.attachment.isUploading) {
+        return div({
+          className: 'uploading-indicator'
         });
@@ -76,44 +57,32 @@ }
     renderPreview: function() {
-      var boundary, imageHeight, imageWidth, previewHeight, previewWidth, ref, reg, src, style, thumbnailUrl;
-      if ((ref = this.props.attachment.data.thumbnailUrl) != null ? ref.length : void 0) {
-        imageHeight = this.props.attachment.data.imageHeight;
-        imageWidth = this.props.attachment.data.imageWidth;
-        thumbnailUrl = this.props.attachment.data.thumbnailUrl;
-        boundary = this.props.collectionMode ? 200 : 240;
-        reg = /(\/h\/\d+)|(\/w\/\d+)/g;
-        if (imageWidth > boundary) {
-          previewHeight = Math.round(imageHeight / (imageWidth / boundary));
-          previewWidth = boundary;
-        } else {
-          previewHeight = imageHeight;
-          previewWidth = imageWidth;
-        }
-        if (previewHeight > boundary) {
-          previewWidth = Math.round(previewWidth / (previewHeight / boundary));
-          previewHeight = boundary;
-        }
-        if (reg.test(thumbnailUrl)) {
-          src = thumbnailUrl.replace(/(\/h\/\d+)/g, "/h/" + previewHeight).replace(/(\/w\/\d+)/g, "/w/" + previewWidth);
-        } else {
-          src = thumbnailUrl;
-        }
-        if (this.state.isLoading && previewHeight < 120) {
-          style = {
-            height: 120
-          };
-        } else {
-          style = {
-            height: previewHeight
-          };
-        }
-        return div({
-          className: 'preview',
-          style: style
-        }, LiteImageLoading({
-          uploading: this.state.isUploading,
-          src: src,
-          onClick: this.onClick,
-          onLoaded: this.onLoaded
-        }));
+      var boundary, image, imageHeight, imageWidth, previewHeight, previewWidth, src, style, thumbnailUrl;
+      thumbnailUrl = this.props.attachment.data.thumbnailUrl;
+      imageHeight = this.props.attachment.data.imageHeight;
+      imageWidth = this.props.attachment.data.imageWidth;
+      boundary = this.props.collectionMode ? 200 : 240;
+      if (imageWidth > boundary) {
+        previewHeight = Math.round(imageHeight / (imageWidth / boundary));
+        previewWidth = boundary;
+      } else {
+        previewHeight = imageHeight;
+        previewWidth = imageWidth;
       }
+      if (previewHeight > boundary) {
+        previewWidth = Math.round(previewWidth / (previewHeight / boundary));
+        previewHeight = boundary;
+      }
+      src = thumbnailUrl.replace(/(\/h\/\d+)/g, "/h/" + previewHeight).replace(/(\/w\/\d+)/g, "/w/" + previewWidth);
+      style = {
+        height: this.props.attachment.isUploading && previewHeight < 120 ? 120 : previewHeight,
+        maxWidth: previewWidth
+      };
+      image = LiteImageLoading({
+        src: src,
+        onClick: this.onClick,
+        onLoaded: this.onLoaded
+      });
+      return div({
+        className: 'preview',
+        style: style
+      }, image, this.renderLoadingScreen());
     },
@@ -120,0 +89,0 @@ render: function() {

package.json

 {
   "name": "talk-message-forms",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "The Message Structure and Layout of jianliao.com",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

47975

increased by34.5%

Number of package files

47

increased by2.17%

Worsened metrics

Lines of code

543

decreased by-10.25%

No dependency changes