Skip to content

Commit

Permalink
updates readme, adds bin, updates package.json
Browse files Browse the repository at this point in the history
  • Loading branch information
Ciro S. Costa committed Apr 18, 2014
1 parent 245e53c commit 06ad99c
Show file tree
Hide file tree
Showing 5 changed files with 51 additions and 31 deletions.
46 changes: 28 additions & 18 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,38 +1,48 @@
# Injetador

> Naively injects stuff
> ps.: in heavy dev yet
> Naively reloads browsers and injects stuff
![Imgur](http://i.imgur.com/6fUHVC3.png)

## Usage

| arg | description |
| --------- | ---------------------------------------------------------- |
| --webpage | the webpage which will be proxied to our the local server |
| --dir | the directory where your awesome stuff lives (relative) |
| --watch | watches the specified *dir* and reloads the page when that |
| | happens. |
Very often i want to see changes that i'm doing across other browsers. With *Injetador* you are fully able to do that :neckbeard:

**Install it** with:

## Motivation
```bash
$ npm install -g injetador
```

[Chrome DevTools](https://developers.google.com/chrome-developer-tools/) comes with a lot of cool stuff for those awesome devs (which are, by definition, [lazy](http://blog.codinghorror.com/how-to-be-lazy-dumb-and-successful/)).
and then **run** it with:

Here comes a great quote from the link above:
```bash
$ injetador
```

> only lazy programmers will want to write the kind of tools that might replace them in the end. Only a lazy programmer will avoid writing monotonous, repetitive code.
### Reload multiple browsers on file changes

Specify a *webpage* and a *directory*. Go to `localhost:3000` and then change a file from that *dir*. It will reload the page across all browsers at *localhost:3000*.

As we, from the frontend team, didn't wan't to keep injecting code into devtools and them repeting this, we've then developed this.
### Reload multiple browsers on changes and inject js/css there

By utilizing this little hack we are able to use some debugging and fast debugging cool stuff provided by devtools like Workspaces w/ mapping (both js and css) which is extremely great.
Just like the above, but now you are able to specify a *js* file and a *cssfile*, which will then be injected when the page finishes its loading process.

For more on how this improves debugging/refactoring, see [this](http://www.html5rocks.com/en/tutorials/developertools/revolutions2013) article on the new dev tools powers and particularly [this](http://www.html5rocks.com/en/tutorials/developertools/revolutions2013/#toc-adding-workspace) part of it.
### Arguments

Here are the arguments that you are able to specify when initializing Injetador. You are not required to use as Injetador provides a familiar Q&A interface.

## Piping to multiple browsers
| arg | description |
| --------- | ---------------------------------------------------------- |
| --webpage | the webpage which will be proxied to our the local server |
| --dir | the directory where your awesome stuff lives (relative) |
| --watch | watches the specified *dir* and reloads the page when that |
| | happens. |
| --jsfile | determines the js file to inject (relative to --dir) |
| --cssfile | determines the css file to inject (relative to --dir) |


> only lazy programmers will want to write the kind of tools that might replace them in the end. Only a lazy programmer will avoid writing monotonous, repetitive code.
One of the problems that we were facing prior to this project was to test a particular js code into different browsers.

**MIT License**
3 changes: 3 additions & 0 deletions bin/injetador
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
#!/usr/bin/env node

require('../src/app.js');
4 changes: 1 addition & 3 deletions examples/app.js
Original file line number Diff line number Diff line change
@@ -1,3 +1 @@
console.log("dahora a asd sd hsiudashiuasdhiudsahdssaddsdasjiuss");
alert('wow');
console.log("dasiuhadsuih"); console.log("dshaiuhads");
alert('Alerting from app.js ;)');
24 changes: 16 additions & 8 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,26 +1,34 @@
{
"name": "injetador",
"version": "0.0.6",
"description": "Injects stuff into the browser",
"version": "0.0.1",
"description": "Reloads browser on changes and also injects stuff",
"author": {
"name": "Eder Eduardo",
"email": "eder.esilva@gmail.com"
},
"contributors": [
{
"name": "Ciro S. Costa",
"email": "ciro9758@gmail.com",
"url": "https://github.com/cirocosta"
},
"contributors": [
{
"name": "Eder Eduardo",
"email": "eder.esilva@gmail.com"
}
],
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/cirocosta/injetador"
},
"engines": {
"node": ">=0.10"
},
"preferGlobal": true,
"directories":{
"bin": "./bin"
},
"main": "src/app.js",
"scripts": {
"test": "mocha tests"
"test": "mocha tests",
"start": "node src/app.js"
},
"dependencies": {
"express": "~3.4.8",
Expand Down
5 changes: 3 additions & 2 deletions src/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,8 @@ if (args.length) {
break;

default:
console.log("Invalid arg.");
console.log("Invalid argument.");
console.log("Only --[dir|watch|jsfile|cssfile] are valid args.");
process.exit(1);
}
});
Expand Down Expand Up @@ -122,7 +123,7 @@ if (answers.dir) {
// Server Initialization

server = http.createServer(app).listen(app.get('port'), function () {
console.log('Express server listening on port ' + app.get('port'));
console.log('Injetador server is now running on port ' + app.get('port'));
});


Expand Down

0 comments on commit 06ad99c

Please sign in to comment.