Merge pull request #26 from benox3/blur

Update default blur to be false

Author: benox3

README.md

@@ -56,8 +56,8 @@ export default class Example extends Component {
 | noscriptIndex | `images.length-1` | false    | number | The image object to use on noscript render.                                                                                 |
 | baseStyle        | `{ position: 'relative', margin: '-5px', overflow: 'hidden' }` | false    | object | Override the container style object. |
 | imgStyle        | `{ margin: '0 auto', maxWidth: '100%', width: '100%' }` | false    | object | Override the image style object. |
-| shouldBlur        | true | false    | boolean | Determines if the image should be blurred before setting the optimal image. |
-| blurAmmount        | '10px' | false    | string | The ammount of blur. Expected format: '10px' or '15%'. |
+| shouldBlur        | false | false    | boolean | Determines if the image should be blurred before setting the optimal image. |
+| blurAmmount        | '20px' | false    | string | The ammount of blur. Expected format: '10px' or '15%'. |
 | renderOutOfView        | false | false    | boolean | Determines if the optimal image should be selected even if not in view |
 
 ## Special Thanks

lib/common/Pic.js

@@ -91,8 +91,8 @@ export default class Pic extends Component {
 Pic.defaultProps = {
   alt: '',
   defaultIndex: 0,
-  shouldBlur: true,
-  blurAmmount: '10px',
+  shouldBlur: false,
+  blurAmmount: '20px',
   baseStyle: {
     position: 'relative',
     margin: '-5px',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-pic",
-  "version": "0.0.10",
+  "version": "0.0.11",
   "description": "React component for progressive and responsive image loading.",
   "author": "Ben Budnevich",
   "main": "dist/commonjs/react-pic.js",
@@ -62,6 +62,7 @@
     "nodemon": "^1.10.2",
     "npm-run-all": "^3.1.0",
     "react": "^15.3.2",
+    "react-addons-shallow-compare": "^15.3.2",
     "react-addons-test-utils": "^15.3.2",
     "react-dom": "^15.3.2",
     "sinon": "^1.17.6",

test/component.js

@@ -131,7 +131,7 @@ describe('Pic', function() {
     expect(Pic.prototype.setResponsiveImage).to.have.property('callCount', 1);
   });
 
-  it('should set blur by default', function() {
+  it('should set blur to false by default', function() {
     const props = {
       images: [
         {
@@ -150,12 +150,12 @@ describe('Pic', function() {
 
     expect(
       pic.find('img').last().attr('style')
-    ).to.contain('blur');
+    ).to.not.contain('blur');
   });
 
-  it('should not set blur style based if shouldBlur prop is false', function() {
+  it('should set blur style based if shouldBlur prop is true', function() {
     const props = {
-      shouldBlur: false,
+      shouldBlur: true,
       blurAmmount: '10px',
       images: [
         {
@@ -174,11 +174,12 @@ describe('Pic', function() {
 
     expect(
       pic.find('img').last().attr('style')
-    ).to.not.contain(`blur(${props.blurAmmount});`);
+    ).to.contain(`blur(${props.blurAmmount});`);
   });
 
   it('should set blur style based on blurAmmount prop', function() {
     const props = {
+      shouldBlur: true,
       blurAmmount: '20px',
       images: [
         {