httpng 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.md +59 -0
- data/bin/httpng +60 -0
- data/lib/httpng/app.rb +53 -0
- data/lib/httpng/assets/html2canvas.js +2795 -0
- data/lib/httpng/assets/httpng.js +66 -0
- data/lib/httpng/assets/jquery.plugin.html2canvas.js +87 -0
- data/lib/httpng/version.rb +5 -0
- data/lib/httpng.rb +6 -0
- metadata +77 -0
data/README.md
ADDED
@@ -0,0 +1,59 @@
|
|
1
|
+
httpng - A local server for snapshotting HTML elements
|
2
|
+
======================================================
|
3
|
+
|
4
|
+
## DESCRIPTION
|
5
|
+
|
6
|
+
Httpng is a local server that you can run if you want to use HTML5 & CSS3 to
|
7
|
+
design but you want to export the page elements as PNGs.
|
8
|
+
|
9
|
+
Httpng follows the rules of [Semantic Versioning](http://semver.org/).
|
10
|
+
|
11
|
+
|
12
|
+
## INSTALLATION
|
13
|
+
|
14
|
+
You can install httpng with RubyGems:
|
15
|
+
|
16
|
+
$ gem install httpng
|
17
|
+
|
18
|
+
|
19
|
+
## RUNNING
|
20
|
+
|
21
|
+
To run httpng, simply change directories to where your HTML file resides and
|
22
|
+
run the following command:
|
23
|
+
|
24
|
+
$ httpng
|
25
|
+
|
26
|
+
This will run a web server at `http://localhost:7020`. You can change the port
|
27
|
+
by setting the `--port` or `-p` option on the command line.
|
28
|
+
|
29
|
+
|
30
|
+
## EXPORTING
|
31
|
+
|
32
|
+
Once your server is running, simple add the following code to your HTML page in
|
33
|
+
the <head> tag:
|
34
|
+
|
35
|
+
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
|
36
|
+
<script src="/httpng.js"></script>
|
37
|
+
|
38
|
+
When you load your page then you should see a bar at the top that gives you a
|
39
|
+
button to export your images.
|
40
|
+
|
41
|
+
To mark HTML elements for export, simply add a `data-export="<name>"` tag to the
|
42
|
+
element like this:
|
43
|
+
|
44
|
+
<div style="border:1px solid black;" data-export="my_file">
|
45
|
+
<!-- More code here... -->
|
46
|
+
</div>
|
47
|
+
|
48
|
+
When you export your images, this `DIV` will be exported as `my_file.png` in
|
49
|
+
your output directory.
|
50
|
+
|
51
|
+
|
52
|
+
## Output Directory
|
53
|
+
|
54
|
+
By default, `httpng` will export your files to the `httpng-output/` directory
|
55
|
+
relative to when you started the command from. To change the output directory,
|
56
|
+
simply use the `--output` or `-o` arguments on the command line:
|
57
|
+
|
58
|
+
$ httpng -o /path/to/my_output_dir
|
59
|
+
|
data/bin/httpng
ADDED
@@ -0,0 +1,60 @@
|
|
1
|
+
#!/usr/bin/env ruby
|
2
|
+
|
3
|
+
$:.unshift(File.dirname(__FILE__) + '/../lib')
|
4
|
+
|
5
|
+
require 'rubygems'
|
6
|
+
require 'optparse'
|
7
|
+
require 'fileutils'
|
8
|
+
require 'httpng'
|
9
|
+
|
10
|
+
# Catch signals
|
11
|
+
Signal.trap('TERM') do
|
12
|
+
Process.kill('KILL', 0)
|
13
|
+
end
|
14
|
+
|
15
|
+
# Default options.
|
16
|
+
options = {
|
17
|
+
:port => 7020,
|
18
|
+
:output => File.join(Dir.getwd(), '/httpng-output')
|
19
|
+
}
|
20
|
+
|
21
|
+
# Parse options.
|
22
|
+
parser = ::OptionParser.new do |parser|
|
23
|
+
parser.banner = 'usage: httpng [OPTIONS] [PATH]\n\n'
|
24
|
+
|
25
|
+
parser.on('-p', '--port [PORT]', 'Bind port (default 7020).') do |port|
|
26
|
+
options[:port] = port.to_i
|
27
|
+
end
|
28
|
+
|
29
|
+
parser.on('-o', '--output [DIR]', 'Output directory (default httpng/).') do |dir|
|
30
|
+
options[:output] = dir
|
31
|
+
end
|
32
|
+
|
33
|
+
parser.on('-v', '--version', 'Display current version.') do
|
34
|
+
puts "httpng #{Httpng::VERSION}"
|
35
|
+
exit 0
|
36
|
+
end
|
37
|
+
end
|
38
|
+
|
39
|
+
# Read command line options into `options` hash
|
40
|
+
begin
|
41
|
+
parser.parse!
|
42
|
+
rescue ::OptionParser::InvalidOption
|
43
|
+
puts "httpng: #{$!.message}"
|
44
|
+
puts "httpng: try 'httpng --help' for more information"
|
45
|
+
exit
|
46
|
+
end
|
47
|
+
|
48
|
+
# Validate options.
|
49
|
+
if !File.exists?(options[:output])
|
50
|
+
FileUtils.mkdir_p(options[:output])
|
51
|
+
elsif !File.directory?(options[:output])
|
52
|
+
puts "Output directory is not a directory"
|
53
|
+
exit
|
54
|
+
end
|
55
|
+
|
56
|
+
# Run the web server
|
57
|
+
Httpng::App.set(:public_folder, Dir.getwd())
|
58
|
+
Httpng::App.set(:output_path, options[:output])
|
59
|
+
Httpng::App.run!(:port => options[:port])
|
60
|
+
|
data/lib/httpng/app.rb
ADDED
@@ -0,0 +1,53 @@
|
|
1
|
+
# encoding: binary
|
2
|
+
|
3
|
+
require 'base64'
|
4
|
+
require 'sinatra'
|
5
|
+
|
6
|
+
module Httpng
|
7
|
+
class App < Sinatra::Base
|
8
|
+
##############################################################################
|
9
|
+
#
|
10
|
+
# Routes
|
11
|
+
#
|
12
|
+
##############################################################################
|
13
|
+
|
14
|
+
# The JavaScript library.
|
15
|
+
get %r{/(httpng|html2canvas|jquery.plugin.html2canvas).js} do
|
16
|
+
file = File.join(File.dirname(__FILE__), "assets/#{request.path_info}")
|
17
|
+
send_file(file, :disposition => 'inline', :filename => File.basename(file))
|
18
|
+
end
|
19
|
+
|
20
|
+
# Export Base64 encoded image data to a file.
|
21
|
+
post '/export' do
|
22
|
+
# Retrieve parameters.
|
23
|
+
name = params[:name]
|
24
|
+
data = Base64.decode64(params[:data])
|
25
|
+
|
26
|
+
# Error if parameters not present.
|
27
|
+
if name.nil? || data.nil?
|
28
|
+
halt 422
|
29
|
+
end
|
30
|
+
|
31
|
+
# Write to file.
|
32
|
+
path = "#{settings.output_path}/#{name}.png"
|
33
|
+
IO.binwrite(path, data)
|
34
|
+
|
35
|
+
halt 200
|
36
|
+
end
|
37
|
+
|
38
|
+
|
39
|
+
##############################################################################
|
40
|
+
#
|
41
|
+
# Error Handling
|
42
|
+
#
|
43
|
+
##############################################################################
|
44
|
+
|
45
|
+
not_found do
|
46
|
+
if request.path_info == '/'
|
47
|
+
redirect '/index.html'
|
48
|
+
else
|
49
|
+
return "No file found at: #{settings.public_folder}#{request.path_info}"
|
50
|
+
end
|
51
|
+
end
|
52
|
+
end
|
53
|
+
end
|