Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
e14e5b0
bitmap intial project scaffold
jonathanheemstra Dec 9, 2016
a26d48f
Merge pull request #1 from jonathanheemstra/scaffold-project
jonathanheemstra Dec 9, 2016
6092d3a
build bitmap constructor
jonathanheemstra Dec 9, 2016
321668b
Merge pull request #2 from jonathanheemstra/bmp-constructor
jonathanheemstra Dec 9, 2016
23ac1a0
build out constructor, returning buffer data
peterkim2 Dec 9, 2016
3f790e2
Merge pull request #3 from peterkim2/friday-peter
peterkim2 Dec 9, 2016
2da2ef6
stash friday afternoon work
jonathanheemstra Dec 10, 2016
fdbd0a6
Adding gulpfile.
Dec 10, 2016
67903b8
Adding more information to the package.json.
Dec 10, 2016
f0e7d77
update object constructor
jonathanheemstra Dec 10, 2016
a981d61
set convert var to process.argv[2]
jonathanheemstra Dec 10, 2016
0504965
add validation to process.argv
jonathanheemstra Dec 10, 2016
8d006ed
hot fix to change back to readInt32LE
jonathanheemstra Dec 10, 2016
c1e81a6
Merge pull request #4 from jonathanheemstra/object-constructor-build
jonathanheemstra Dec 10, 2016
03eeaaf
Adding fiddling around constructor things from Sat morning.
Dec 10, 2016
45af2da
Abstracted callback, bitmap, and read/write file components.
Dec 11, 2016
82008a2
Merge pull request #5 from brittdawn/transform
Dec 11, 2016
52cdfb1
Abstracted helper file. removed transforms file. Index is now entry p…
peterkim2 Dec 11, 2016
2aa61c6
Merge pull request #6 from peterkim2/abstract-stuff
peterkim2 Dec 11, 2016
97cd0a3
set up two simple tests
jonathanheemstra Dec 11, 2016
3d84c89
Merge pull request #7 from jonathanheemstra/add-tests
jonathanheemstra Dec 11, 2016
979b80d
add tests
jonathanheemstra Dec 12, 2016
668c952
Merge pull request #8 from jonathanheemstra/add-tests
jonathanheemstra Dec 12, 2016
2535f49
added swtich statements to accept CLI flags for transforms
peterkim2 Dec 12, 2016
fc0d297
Merge pull request #9 from peterkim2/more-testing
peterkim2 Dec 12, 2016
dad2a98
Cleaning up dead code.
Dec 12, 2016
d0e02d4
Updating README docs.
Dec 12, 2016
6365878
Clarifying how to run the project locally in the README.
Dec 13, 2016
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions .eslintrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
{
"rules": {
"no-console": "off",
"indent": [ "error", 2 ],
"quotes": [ "error", "single" ],
"semi": ["error", "always"],
"linebreak-style": [ "error", "unix" ]
},
"env": {
"es6": true,
"node": true,
"mocha": true,
"jasmine": true
},
"ecmaFeatures": {
"modules": true,
"experimentalObjectRestSpread": true,
"impliedStrict": true
},
"extends": "eslint:recommended"
}
116 changes: 116 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,116 @@

# Created by https://www.gitignore.io/api/node,macos,windows,linux

### Node ###
# Logs
logs
*.log
npm-debug.log*
node_modules
coverage

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# nyc test coverage
.nyc_output

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# node-waf configuration
.lock-wscript

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules
jspm_packages

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Optional REPL history
.node_repl_history

# Output of 'npm pack'
*.tgz

# Yarn Integrity file
.yarn-integrity



### macOS ###
*.DS_Store
.AppleDouble
.LSOverride

# Icon must end with two \r
Icon
# Thumbnails
._*
# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent
# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk


### Windows ###
# Windows image file caches
Thumbs.db
ehthumbs.db

# Folder config file
Desktop.ini

# Recycle Bin used on file shares
$RECYCLE.BIN/

# Windows Installer files
*.cab
*.msi
*.msm
*.msp

# Windows shortcuts
*.lnk


### Linux ###
*~

# temporary files which can be created if a process still has a handle open of a deleted file
.fuse_hidden*

# KDE directory preferences
.directory

# Linux trash folder which might appear on any partition or disk
.Trash-*

# .nfs files are created when an open file is removed but is still being accessed
.nfs*
57 changes: 57 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
## Bitmap Project:
This is a bitmap transformer built by Jonathan, Peter, and Britt.

In this project, we are converting the image below using different transforms:

![alt](https://raw.githubusercontent.com/brittdawn/04-bitmap-transformer/master/assets/palette-bitmap.bmp)

##### Our transforms are as follows:
- Green
- Invert
- Greyscale
- Black
- White
- Luminosity

##### Green Transform Formula

> Multiply the green element (color value) of the RGBA array by the max number of colors minus one (256 - 1) or 255.

##### Black & White Transform Formula

> Fill the entire colorArray / its elements with 255 or 0.

##### Invert Transform Formula

> Subtract each color value (RGB) from 255.

##### Greyscale Transform Formula

> Average the RGB color values and set the color values to this average.

##### Luminosity Transform Formula

> Multiply the red color value by .21. Multiply the green color value by .72. Multiply the blue color value by .07.

---
## To Run This Project Locally:

To run this project locally, type the following into your terminal:

1. `git clone https://github.com/brittdawn/04-bitmap-transformer.git`
2. `cd 04-bitmap-transformer/`
3. `npm i`
4. `node index.js`

The terminal will then prompt you: "Please enter one of the following: green, white, invert, greyscale, luminosity, black or all."

You may then type which transform you wish to implement, like so: `node index.js invert`.

You may now go to the assets folder and see your transformed image.

Repeat as you wish with other transforms.

---
## To Run Tests:

You can type the following into the command line: `gulp test`.
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 README.md looks good!

Binary file added assets/astro.bmp
Binary file not shown.
Binary file added assets/palette-bitmap.bmp
Binary file not shown.
37 changes: 37 additions & 0 deletions gulpfile.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
'use strict';

const gulp = require('gulp');
const eslint = require('gulp-eslint');
const mocha = require('gulp-mocha');
const cache = require('gulp-cache');
const istanbul = require('gulp-istanbul');

gulp.task('pre-test', function() {
return gulp.src(['./lib/*.js', './model/*.js', '!node_modules/**'])
.pipe(istanbul())
.pipe(istanbul.hookRequire());
});

gulp.task('test', ['pre-test'], function() {
gulp.src('./test/*-test.js', { read: false})
.pipe(mocha({ report: 'spec'}))
.pipe(istanbul.writeReports())
.pipe(istanbul.enforceThresholds({thresholds: {global: 90}}));
});

gulp.task('lint', function() {
return gulp.src(['**/*.js', '!node_modules/**'])
.pipe(eslint())
.pipe(eslint.format())
.pipe(eslint.failAfterError());
});

gulp.task('dev', function() {
gulp.watch(['**/*.js', '!node_modules/**'], ['lint', 'test']);
});

gulp.task('default', ['dev']);

gulp.task('clear', function (done) {
return cache.clearAll(done);
});
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 gulpfile.js looks good - nice job including a clear task

38 changes: 38 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
'use strict';

const readFileHelper = require('./lib/bitmap-file-helper.js');

module.exports = exports = {};

switch (process.argv[2]) {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 generally speaking, it's bad practice to use switch statements but this seems like an interesting use case for one - that said, the following code could be refactored to be more dynamic and with way fewer lines of code - you could just grab the command line argument and pass that as the final parameter of your readFileHelper

case 'green':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'green');
break;
case 'white':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'white');
break;
case 'invert':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'invert');
break;
case 'greyscale':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'greyscale');
break;
case 'luminosity':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'luminosity');
break;
case 'black':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'black');
break;
case 'all':
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'green');
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'white');
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'invert');
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'greyscale');
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'luminosity');
readFileHelper.bitmap(readFileHelper.filePath, readFileHelper.callback, 'black');
break;
default:
console.log('Please enter one of the following: green, white, invert, greyscale, luminosity, black or all');
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

}

exports.convert = process.argv[2];
24 changes: 24 additions & 0 deletions lib/bitmap-file-helper.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
'use strict';

const fs = require('fs');
const bitmap = require('../model/bitmap-constructor.js');

module.exports = exports = {};
exports.callback = function (err, data, convert) {
if (err) throw err;
let transform = new bitmap.BufferData(data);
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if(convert) transform[convert]();
};

exports.bitmap = function (file, callback, color) {
return fs.readFile(file, function(err, data) {
if (err) return callback(err);
fs.writeFile(`${__dirname}/../assets/${color}.bmp`, data, function(err) {
if(err) throw err;
});
return callback(null, data, color);
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 great use of the (err, result) callback pattern along with passing null as the first parameter

});
};

exports.filePath = `${__dirname}/../assets/palette-bitmap.bmp`;
exports.filePath2 = `${__dirname}/../assets/astro.bmp`;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 bitmap-file-helper module looks good

64 changes: 64 additions & 0 deletions model/bitmap-constructor.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
'use strict';

module.exports = exports = {};

exports.BufferData = function(data) {
this.buffer = data;
this.id = data.toString('utf-8', 0, 2);
this.size = data.readInt32LE(2);
this.offset = data.readInt32LE(10);
this.dibheader = data.readInt32LE(14);
this.width = data.readInt32LE(18);
this.height = data.readInt32LE(22);
this.pixel_horizontal = data.readInt32LE(38);
this.pixel_vertical = data.readInt32LE(42);
this.number_colors = data.readInt32LE(46);
this.colorArray = data.slice(54, this.offset);
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 excellent bitmap constructor - I like that you included the raw buffer in your constructor, along with storing all of the necessary metadata about the bitmap

};

exports.BufferData.prototype.green = function() {
for (var i = 0, j = this.colorArray.length; i < j; i += 4) {
let color = this.colorArray.slice(i, i+4);
let maxColor = this.number_colors - 1;
color[0] = color[2] = color[3] = 0;
color[1] *= maxColor;
}
};

exports.BufferData.prototype.white = function() {
this.colorArray.fill(255);
};

exports.BufferData.prototype.invert = function() {
for (var i = 0, j = this.colorArray.length; i < j; i += 4) {
let color = this.colorArray.slice(i, i+4);
let maxColor = this.number_colors - 1;
color[0] = maxColor - color[0];
color[1] = maxColor - color[1];
color[2] = maxColor - color[2];
color[3] = 0;
}
};

exports.BufferData.prototype.greyscale = function() {
for (var i = 0, j = this.colorArray.length; i < j; i += 4) {
let color = this.colorArray.slice(i, i+4);
let averageColor = (color[0] + color[1] + color[2] / 3);
color[0] = color[1] = color[2] = averageColor;
color[3] = 0;
}
};

exports.BufferData.prototype.luminosity = function() {
for (var i = 0, j = this.colorArray.length; i < j; i += 4) {
let color = this.colorArray.slice(i, i+4);
color[0] = color[0] * .07;
color[1] = color[1] * .72;
color[2] = color[2] * .21;
color[3] = 0;
}
};

exports.BufferData.prototype.black = function() {
this.colorArray.fill(0);
};
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 transform methods look great! Nice job adding the luminosity, invert, and greyscale transforms

33 changes: 33 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
{
"name": "04-bitmap-transformer",
"version": "1.0.0",
"description": "Fun bitmap lab.",
"main": "index.js",
"directories": {
"test": "test"
},
"devDependencies": {
"chai": "^3.5.0",
"eslint": "^3.12.0",
"gulp": "^3.9.1",
"gulp-cache": "^0.4.5",
"gulp-eslint": "^3.0.1",
"gulp-istanbul": "^1.1.1",
"gulp-mocha": "^3.0.1",
"mocha": "^3.2.0"
},
"scripts": {
"test": "mocha"
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brittdawn @jonathanheemstra @peterkim2 nice job adding a basic npm "test" script

},
"repository": {
"type": "git",
"url": "git+https://github.com/brittdawn/04-bitmap-transformer.git"
},
"keywords": [],
"author": "Jonathan, Peter, Britt",
"license": "MIT",
"bugs": {
"url": "https://github.com/brittdawn/04-bitmap-transformer/issues"
},
"homepage": "https://github.com/brittdawn/04-bitmap-transformer#readme"
}
Loading