diff --git a/README.md b/README.md index 475dc6f..973fe41 100644 --- a/README.md +++ b/README.md @@ -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** diff --git a/bin/injetador b/bin/injetador new file mode 100644 index 0000000..99a4a8d --- /dev/null +++ b/bin/injetador @@ -0,0 +1,3 @@ +#!/usr/bin/env node + +require('../src/app.js'); diff --git a/examples/app.js b/examples/app.js index c395cf1..396df75 100644 --- a/examples/app.js +++ b/examples/app.js @@ -1,3 +1 @@ -console.log("dahora a asd sd hsiudashiuasdhiudsahdssaddsdasjiuss"); -alert('wow'); -console.log("dasiuhadsuih"); console.log("dshaiuhads"); +alert('Alerting from app.js ;)'); diff --git a/package.json b/package.json index c7f5f34..0721ea8 100644 --- a/package.json +++ b/package.json @@ -1,16 +1,16 @@ { "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", @@ -18,9 +18,17 @@ "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", diff --git a/src/app.js b/src/app.js index 35c7044..b9b7bf4 100755 --- a/src/app.js +++ b/src/app.js @@ -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); } }); @@ -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')); });