Permalink
Browse files

Added support for express-processimage (livestyle --processimage).

  • Loading branch information...
1 parent 4b23508 commit 7f5c484d9953648ddd84c47e78ff3b2de5b7e471 @papandreou papandreou committed Dec 1, 2012
Showing with 57 additions and 1 deletion.
  1. +5 −0 README.md
  2. +7 −0 bin/livestyle
  3. +21 −0 examples/processImage.css
  4. +17 −0 examples/processImage.html
  5. BIN examples/turtle.jpg
  6. +6 −1 lib/createLiveStyleApp.js
  7. +1 −0 package.json
View
@@ -70,6 +70,11 @@ Compile less assets on-the-fly using <a
href="https://github.com/papandreou/express-compiless">express-compiless</a>. Also
supports watching @import'ed less assets.
+#### --processimage
+
+Process images on the server according to the query string using using <a
+href="https://github.com/papandreou/express-processimage">express-processimage</a>.
+
#### --debug|-d
Outputs a bunch of debugging information on both the server and the
View
@@ -19,6 +19,12 @@ var express = require('express'),
describe: 'Whether to add the express-compiless middleware to the stack (compiles less files and serves it them as text/css).',
default: false
})
+ .options('processimage', {
+ alias: 'processimages',
+ type: 'boolean',
+ describe: 'Whether to add the express-processimage middleware to the stack.',
+ default: false
+ })
.options('debug', {
alias: 'd',
describe: 'Turn on debug mode (server logs events to stderr, client logs to console).'
@@ -89,6 +95,7 @@ require('../lib/createLiveStyleApp')({
watchfile: commandLineOptions.watchfile,
root: root,
compiless: commandLineOptions.compiless,
+ processImage: commandLineOptions.processimage,
mappings: mappings,
proxy: commandLineOptions.proxy || null
}).listen(commandLineOptions.port, commandLineOptions.host);
View
@@ -0,0 +1,21 @@
+.turtle {
+ float: left;
+ width: 481px;
+ height: 424px;
+}
+
+.first {
+ background-image: url(turtle.jpg);
+}
+
+.second {
+ background-image: url(turtle.jpg?jpegtran=-flip,horizontal);
+}
+
+.third {
+ background-image: url(turtle.jpg?jpegtran=-grayscale);
+}
+
+.fourth {
+ background-image: url(turtle.jpg?setFormat=png&pngquant=16);
+}
View
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>express-processimages example</title>
+ <link rel="stylesheet" href="processImage.css">
+</head>
+<body>
+ <p>Launch <tt>livestyle --processimage</tt> and play with the
+ processing instructions in the image urls
+ in <a href="processImage.css">processImage.css</a></p>
+
+ <div class="turtle first"></div>
+ <div class="turtle second"></div>
+ <div class="turtle third"></div>
+ <div class="turtle fourth"></div>
+</body>
+</html>
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -1,7 +1,8 @@
var URL = require('url'),
express = require('express'),
request = require('request'),
- compiless = require('express-compiless');
+ compiless = require('express-compiless'),
+ processImage = require('express-processimage');
module.exports = function createLiveStyleApp(options) {
var app = express.createServer(),
@@ -35,6 +36,10 @@ module.exports = function createLiveStyleApp(options) {
});
}
+ if (options.processImage) {
+ app.use(processImage());
+ }
+
if (options.root) {
if (options.compiless) {
app.use(compiless({root: options.root}));
View
@@ -24,6 +24,7 @@
"express": "=2.5.11",
"express-compiless": "=0.0.10",
"express-hijackresponse": "=0.0.6",
+ "express-processimage": "=0.0.2",
"optimist": "=0.3.0",
"request": "=2.9.3",
"socket.io": "=0.9.4",

0 comments on commit 7f5c484

Please sign in to comment.