Skip to content

Nikko Bitmap Transformer Submission #24

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 49 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
49 commits
Select commit Hold shift + click to select a range
d592378
set up basic structure and files
radenska Feb 16, 2017
ea84d48
Merge pull request #1 from radenska/yana-setup
radenska Feb 16, 2017
f7da3b8
created our constructor for the bitmap object we'll be creating
sneakyneeks2 Feb 17, 2017
7699037
Merge pull request #2 from radenska/bmobj-constructor
radenska Feb 17, 2017
f0dc71e
getting file data and making constructor
radenska Feb 17, 2017
0fe450c
Merge pull request #3 from radenska/yana-darcy-nikko
radenska Feb 17, 2017
339ec68
saving changes before working on branch
radenska Feb 17, 2017
43dc59e
some conversion code added
radenska Feb 17, 2017
c3223c1
conversions work, new file generated
radenska Feb 17, 2017
1125ba0
Merge pull request #4 from radenska/yana-conversions
radenska Feb 17, 2017
e9eb491
Merge branch 'master' of https://github.com/radenska/04-bitmap_transf…
radenska Feb 17, 2017
8062078
new branch
radenska Feb 17, 2017
a9547d8
added a single test and master fix
sneakyneeks2 Feb 17, 2017
3168afa
Merge pull request #5 from radenska/nikko-constructors-master-fix
radenska Feb 17, 2017
28bbbe7
Merge branch 'master' of https://github.com/radenska/04-bitmap_transf…
radenska Feb 17, 2017
c77c30f
trying to fix odd git issue
radenska Feb 17, 2017
a686c80
Merge pull request #6 from radenska/yana-conversions
radenska Feb 17, 2017
155cbd2
Merge branch 'master' of https://github.com/radenska/04-bitmap_transf…
radenska Feb 17, 2017
bb3baca
Merge branch 'yana-conversions' into yana-con2
radenska Feb 17, 2017
2d9723c
Merge branch 'yana-con2'
radenska Feb 17, 2017
502cded
added cli interface
radenska Feb 17, 2017
7cb428b
Merge pull request #7 from radenska/yana-con2
radenska Feb 17, 2017
ced7e3d
added large change in modularity, both prepare/package array function…
sneakyneeks2 Feb 18, 2017
85e7588
test for bitmap constructor buffer
darms Feb 18, 2017
c8ae7c4
prototype model now working
radenska Feb 18, 2017
370430d
resolved merge conflicts
radenska Feb 18, 2017
8a16455
added prototype methods
radenska Feb 18, 2017
11066a1
more refactoring, fixed colors
radenska Feb 19, 2017
90bb32e
Add files via upload
radenska Feb 19, 2017
d17a4db
Add files via upload
radenska Feb 19, 2017
4e661df
Add files via upload
radenska Feb 19, 2017
d07ac2d
Delete Octocat.png
radenska Feb 19, 2017
c06b944
Add files via upload
radenska Feb 19, 2017
48fe73e
added more images, added content to readme
radenska Feb 19, 2017
fcd8289
minor tweaks
radenska Feb 19, 2017
3f8b6c4
changed some array/function names, deleted transformed images
radenska Feb 19, 2017
76ef542
Merge pull request #8 from radenska/yana-stretch2
radenska Feb 19, 2017
65be057
Merge branch 'master' of https://github.com/radenska/04-bitmap_transf…
darms Feb 20, 2017
581456f
created color-constructor test for greyscale but isn't currently pass…
sneakyneeks2 Feb 20, 2017
f388951
added 6 other test-control files for each color transformation, seems…
sneakyneeks2 Feb 20, 2017
14974e7
Merge pull request #9 from radenska/nikko-final-tests
radenska Feb 20, 2017
feb500c
cleaned unnecessary logs
sneakyneeks2 Feb 20, 2017
6f6b8a3
Merge pull request #10 from radenska/nikko-final-tests
npisciotti1 Feb 20, 2017
37574ae
tried to write new test. New test is writing me off instead. :(
darms Feb 20, 2017
53a3521
tried to write new test. Kept saying it couldn't find the module
darms Feb 20, 2017
84b5c76
Tests all pass!
darms Feb 20, 2017
2394bd5
Merge pull request #12 from radenska/darcyTest
radenska Feb 20, 2017
8a57344
Merge branch 'master' into darcyTest
radenska Feb 20, 2017
61d4a4b
Merge pull request #13 from radenska/darcyTest
radenska Feb 20, 2017
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
Binary file added .DS_Store
Binary file not shown.
21 changes: 21 additions & 0 deletions bitmap-team-TeamName/.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"
}
Copy link
Contributor

Choose a reason for hiding this comment

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

117 changes: 117 additions & 0 deletions bitmap-team-TeamName/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
# Created by https://www.gitignore.io/api/node,vim,osx,macos,linux

*node_modules

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

# 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



### Vim ###
# swap
[._]*.s[a-v][a-z]
[._]*.sw[a-p]
[._]s[a-v][a-z]
[._]sw[a-p]
# session
Session.vim
# temporary
.netrwhist
*~
# auto-generated tag files
tags


### OSX ###
*.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


### macOS ###
# Icon must end with two \r
# Thumbnails
# Files that might appear in the root of a volume
# Directories potentially created on remote AFP share


### 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*

# End of https://www.gitignore.io/api/node,vim,osx,macos,linux
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms .gitignore looks good

43 changes: 43 additions & 0 deletions bitmap-team-TeamName/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
## Bitmap Transformer

The Bitmap Transformer allows you to change any shape and size 8-bit palette bitmap file (extension .bmp) using your terminal command line and node.js.

***
## How to Use

* Install node.js if you do not have it (if you are not sure how, here is a [tutorial](https://docs.npmjs.com/getting-started/installing-node)).
* Clone the Bitmap Transformer.

```
$ git clone https://github.com/radenska/04-bitmap_transformer.git
```
* Navigate to the bitmap-team-TeamName directory and run the transformer.

```
$ node index <filename> <transformation>
```
* You can view available files in the img directory, which is also where the new transformed files will appear (old filename + 'new').

```
$ ls img
```

* The following transformations are available: red, green, blue, yellow, purple, invert, grayscale
* Examples
```
$ node index butterfly.bmp invert
```
#### Original
![N|Solid](https://raw.githubusercontent.com/radenska/04-bitmap_transformer/master/bitmap-team-TeamName/img/butterfly.bmp)
#### Inverted
![N|Solid](https://raw.githubusercontent.com/radenska/04-bitmap_transformer/master/img/butterfly-inverted.bmp)


***
***

#### *Created by*

|Darcy McCabe|Nikko Pisciotti|Yana Radenska
|:---:|:---:|:---:|
[GitHub Repos](https://github.com/darms) |[GitHub Repos](https://github.com/npisciotti1)| [GitHub Repos](https://github.com/radenska)|
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms README and associated documentation looks good

20 changes: 20 additions & 0 deletions bitmap-team-TeamName/gulpfile.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
'use strict';

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

gulp.task('test', function() {
gulp.src('./test/*-test.js', { read: false })
.pipe(mocha({ reporter: 'spec' }));
});

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']);
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms gulpfile.js looks good

Binary file added bitmap-team-TeamName/img/black.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-big.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-blue.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-green.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-greyscale.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-invert.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-purple.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-rectangle.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly-red.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/butterfly.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/flower-big.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/flower.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/kitten.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/leaf-sm.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/leaf.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/palette-bitmap.bmp
Binary file not shown.
Binary file added bitmap-team-TeamName/img/red.bmp
Binary file not shown.
13 changes: 13 additions & 0 deletions bitmap-team-TeamName/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
'use strict';

const fileReadHelper = require(`${__dirname}/lib/bmp-file-helper.js`);
const bmpCon = require(`${__dirname}/model/bmp-constructor.js`);
const makeBitMap = bmpCon.makeBitMap;


if (!process.argv[2] || !process.argv[3]) {
console.error('Please enter two parameters: file name and transformation type (grayscale, invert, blue, green, red, yellow, purple)');
console.log('Format: node index <filename> <transformation type> Example: node index color-palette.bmp invert');
throw('error');
}
fileReadHelper.getBitMap(makeBitMap);
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms great job checking command line arguments and handling any errors if the proper filename/transformation type were not provided

additionally, great job creating and including a readFile helper module for reusability

side note: no need to use ${__dirname} in your require statements - simple relative paths are fine for this and have become an industry standard

33 changes: 33 additions & 0 deletions bitmap-team-TeamName/lib/bmp-file-helper.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
'use strict';

const fs = require('fs');
module.exports = exports = {};
const filepath = `${__dirname}/../img/${process.argv[2]}`;
const filepathNewfile = `${filepath.slice(0,filepath.length-4)}-new.bmp`;
const testFilePath = `${filepath.slice(0,filepath.length-4)}-test.txt`;

exports.getBitMap = function(cb) {
fs.readFile(filepath, function(err, data) {
if (err) throw err;
cb(data);
});
};

exports.newBitMap = function(data) {
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms i like the modularity and separate methods in this file but you may want to consider passing the file path into your getBitMap function so that this it is more dynamic and can be reused without a globally accessible variable within the file

fs.writeFile(filepathNewfile, data, function(err) {
if (err) throw err;
console.log('your new file can be found here: ', filepathNewfile);
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms - this looks fine with the exception of the commented line below and the comment block for your makeTestData - while this is for testing, it should not be on the master branch - best approach is to apply this to a dev branch

// makeTestData(testFilePath, data);
});
};


//::this will write a buffer as a string to a new file for testing purposes::

// var makeTestData = function(testFilePath, data) {
// var buffer = Buffer.from(data);
// var testData = buffer.toString('hex');
// fs.writeFile(testFilePath, testData, function() {
// console.log('Done writing test file!');
// });
// };
104 changes: 104 additions & 0 deletions bitmap-team-TeamName/model/bmp-constructor.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
'use strict';

const fileReadHelper = require(`${__dirname}/../lib/bmp-file-helper.js`);
module.exports = exports = {};

var bmObj = {};

exports.makeBitMap = function(data) {
bmObj = new BitMap(data);
bmObj.prepareArray();
selectTransformation();
bmObj.packageArray();
fileReadHelper.newBitMap(bmObj.buffer);
};

function BitMap(data) {
this.type = data.toString('utf-8', 0, 2);
this.totalFileSize = data.readInt32LE(2);
this.arrayLoc = data.readInt32LE(10);
this.width = data.readInt32LE(18);
this.height = data.readInt32LE(22);
this.numColorPanes = data.readInt32LE(26);
this.bitsPerPixel = data.readInt32LE(28);
this.horizRes = data.readInt32LE(38);
this.verticRes = data.readInt32LE(42);
this.singles = data.toString('hex', 66, 1090).split('');
this.buffer = data;
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms great job including the raw buffer as part of your constructor!! generally speaking, this constructor looks great - lots of good and usable metadata extracted from the bitmap. i also really like the pairs, packaged, and transformed arrays that are used to collect data

this.pairs = [];
this.packaged = [];
this.transformed = [];
}

BitMap.prototype.prepareArray = function() {
for (let i = 0; i <= this.singles.length - 2; i += 2) {
this.pairs.push(this.singles[i] + this.singles[i+1]);
}
};

BitMap.prototype.packageArray = function() {
for (let i = 0; i <= this.transformed.length - 4; i += 4) {
this.packaged.push(this.transformed[i] + this.transformed[i+1] + this.transformed[i+2]);
}
var offset = 66;
for (let i = 0; i < this.packaged.length; i++) {
this.buffer.write(this.packaged[i], offset, 'hex');
offset += 4;
}
};

BitMap.prototype.invert = function(){
this.transformed = this.pairs.map(val => { //invert colors
val = (255 - parseInt(val, 16)).toString(16);
if (val.length === 1) val = '0' + val;
return val;
});
};

BitMap.prototype.greyscale = function() {
//a grayscale formula: 0.2989*red + 0.5870*green + 0.1140*blue, then each value (R, G, and B) is assigned the weighted average
var grayArray = this.pairs.map(val => parseInt(val, 16));
for (let i = 0; i < grayArray.length - 4; i += 4) {
let sumRGB = Math.floor(grayArray[i]*0.114 + grayArray[i+1]*0.587 + grayArray[i+2]*0.2989); //calculate weighted average
grayArray[i] = grayArray[i+1] = grayArray[i+2] = sumRGB; //each value equals the sum
}
this.transformed = grayArray.map(val => { //turn into string and assign to transformed
val = val.toString(16);
if (val.length === 1) val = '0' + val;
return val;
});
};

BitMap.prototype.colorify = function(colorIndex, i2, i3) {
this.transformColor(colorIndex, 0.7);
this.transformColor(i2, 0); //set non chosen values to 0
this.transformColor(i3, 0);
this.transformed = this.pairs;
};

BitMap.prototype.transformColor = function(start, colorVal) {
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms transform prototype methods look good but there is a bit too much going on in this file - a better approach would be to simply create the constructor, add the prototype methods, and export the constructor (which will have access to the prototype methods after instantiation in another file)

example:

const Bitmap = module.exports = function() { ... };

Bitmap.prototype.colorify = function() { ... };

Bitmap.prototype.grayscale = function() { ... };

// position 0: blue 1: green 2: red 3: padding
for (let i = start; i <= this.pairs.length - 4; i += 4) { //change blue values
this.pairs[i] = Math.floor((parseInt(this.pairs[i], 16))*colorVal);
if (this.pairs[i] > 255) this.pairs[i] = 255;
this.pairs[i] = this.pairs[i].toString(16);
if (this.pairs[i].length === 1) this.pairs[i] = '0' + this.pairs[i];
}
};

function selectTransformation() {
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms great transform selector - this could be refactored to be a bit more DRY but i love the addition of it!

let userChoice = process.argv[3].toLowerCase();
if (userChoice === 'blue') bmObj.colorify(0, 1, 2);
if (userChoice === 'red') bmObj.colorify(2, 0, 1);
if (userChoice === 'green') bmObj.colorify(1, 0, 2);
if (userChoice === 'invert') bmObj.invert();
if (userChoice === 'purple') {
bmObj.colorify(0, 1, 1);
bmObj.colorify(2, 1, 1);
}
if (userChoice === 'yellow') {
bmObj.colorify(1, 0, 0);
bmObj.colorify(2, 0, 0);
}
if (userChoice === 'grayscale' || userChoice === 'greyscale') bmObj.greyscale();
}
22 changes: 22 additions & 0 deletions bitmap-team-TeamName/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"name": "bitmap-team-TeamName",
"version": "1.0.0",
"description": "",
"main": "index.js",
"directories": {
"test": "test"
},
"devDependencies": {
"chai": "^3.5.0",
"gulp": "^3.9.1",
"gulp-eslint": "^3.0.1",
"gulp-mocha": "^3.0.1",
"mocha": "^3.2.0"
},
"scripts": {
"test": "mocha"
},
"keywords": [],
"author": "",
"license": "ISC"
}
Copy link
Contributor

Choose a reason for hiding this comment

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

@npisciotti1 @radenska @sneakyneeks2 @darms package.json looks good

Loading