distorted-jekyll 0.4.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (3) hide show
  1. checksums.yaml +7 -0
  2. data/README.md +158 -0
  3. metadata +157 -0
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA256:
3
+ metadata.gz: f9bbc746db97aa347f0e71ee17415beafa975ae919e705ac980f3e2e4e08844a
4
+ data.tar.gz: 2f2b88dc9a1cf031f86cb1cd3dd065e81020ea6ea25c8217da75c7bcef8c2113
5
+ SHA512:
6
+ metadata.gz: 9c9bff0180149180425291ea47d6029e4d1d59c0d86ac6a52ec8373c86b00771cf2fe1f7f7c97cd8c0280d408ae5ba8b7a9d518fad8ed4fc214ded2299beaff6
7
+ data.tar.gz: cd89b101f471eaf614e0fa01bafc79c6642fc1f8b3934ceb0ccecce361c94ce6a74035e6e466d5ab7039f6884fdbb259cdea440013b9c0354e7825e8b6e4e361
@@ -0,0 +1,158 @@
1
+ # Cooltrainer::DistorteD
2
+
3
+ `DistorteD` is a multimedia framework for Jekyll websites.
4
+
5
+ Right now this repo contains two Gems:
6
+ - `DistorteD-Jekyll` contains anything and everything that depends on Jekyll.
7
+ - `DistorteD-Ruby` contains just the abstract media file format handling code. It's separate so I can use those functions in other contexts and/or easily replace the Ruby core if necessary.
8
+
9
+ ## Motivation
10
+
11
+ DD is my solution for displaying photos, videos, and other types of media on [cooltrainer.org](https://cooltrainer.org) due to my dissatisfaction with every other solution I could find.
12
+
13
+ My previous approach was similar to what's [described here](https://eduardoboucas.com/blog/2014/12/07/including-and-managing-images-in-jekyll.html), with small/medium/large image size variations generated with [Jekyll-MiniMagick](https://github.com/MattKevan/Jekyll-MiniMagick-new).
14
+
15
+ Here are some already-existing ways to put pictures on your Jekyll site that are worth your consideration before choosing DistorteD:
16
+
17
+ - [jekyll-responsive-image](https://github.com/wildlyinaccurate/jekyll-responsive-image)
18
+ - [jekyll_picture_tag](https://rbuchberger.github.io/jekyll_picture_tag/)
19
+ - [jekyll-gallery-generator](https://github.com/ggreer/jekyll-gallery-generator)
20
+ - [jekyll-photo-gallery](https://github.com/aerobless/jekyll-photo-gallery)
21
+ - [jekyll-thumbnail](https://superterran.github.io/jekyll-thumbnail/)
22
+ - [jekyll-assets](https://github.com/envygeeks/jekyll-assets)
23
+
24
+ I wanted a solution that fit all of my preferences:
25
+
26
+ - I want to write Markdown and stop littering my Markdown files with instances of Liquid tags like `{% my_image_tag some_photo.jpg %}`. Markdown has an image syntax: same as the hyperlink syntax but with a preceding bang (`!`). It seems [generally accepted](https://talk.commonmark.org/t/embedded-audio-and-video/441/15) that this same syntax is used for video as well.
27
+ - I try to [avoid shelling out](https://julialang.org/blog/2012/03/shelling-out-sucks/) if possible, mostly for the sake of efficiency with very large Jekyll sites so we aren't forking and spawning an entire shell just to call `convert` or `ffmpeg` for every single image in every single page. That means avoiding some popular libraries like [mini_magick](https://github.com/minimagick/minimagick/blob/master/lib/mini_magick/shell.rb) and [streamio-ffmpeg](https://github.com/streamio/streamio-ffmpeg/blob/master/lib/streamio-ffmpeg.rb).
28
+ - I want to support many media types (images, videos, PDF, SVG, etc) with the same syntax and workflow on the source side, and with consistent look-and-feel on the output side.
29
+ - I want my media files to be able to live in the same directory as their corresponding post/page Markdown. This is something I think Hugo gets right with its concept of [Page Bundles](https://gohugo.io/content-management/page-bundles/). You can get similar functionality with [jekyll-postfiles](https://nhoizey.github.io/jekyll-postfiles/), but it won't generate thumbnails or `<img>`/`<picture>` tags for you. Most Jekyll asset plugins want me to have a single images folder for my entire site.
30
+ - I don't want to depend on any APIs, so plugins like [jekyll-cloudinary](https://nhoizey.github.io/jekyll-cloudinary/) and [S3_Video](https://gist.github.com/TimShi/a48fa83abbc8a0242557) are out.
31
+ - I want automatic format conversion to maximize compatibility and efficiency, e.g. JPEGs and PNGs should also generate a WebP, native WebPs should generate JPEG or PNG for older browsers, single-frame GIFs should generate a PNG/WebP, animated GIFs should generate an MPEG-4 (or other format) video, all videos should generate HLS and DASH segments/playlists, etc.
32
+ - I want to good defaults handling of things like EXIF tag sanitization, auto-rotation, smart cropping, and chosen formats. Any of these options should be configurable per-instance with a Maruku/Kramdown-style [attribute list](https://golem.ph.utexas.edu/~distler/maruku/proposal.html).
33
+
34
+ ## Status
35
+
36
+ Images are fairly well supported and are enabled by default. Video support is very experimental and fragile and is not enabled in the default config. HLS works fine right now with iOS/Safari/Edge, but my current Gst pipeline is very specific to my hardware. I'm waiting on a version of GStreamer to include the new [dashsink2](https://gitlab.freedesktop.org/gstreamer/gst-plugins-bad/merge_requests/704) before I do the work to rewrite my basic `gst_parse`-based pipeline and get it into a usable state for Firefox/Chrome. All other media types are still conceptual. Please don't ask me for ETAs :)
37
+
38
+ ## Installation
39
+
40
+ Add this line to your site's Gemfile:
41
+
42
+ ```ruby
43
+ gem 'distorted-jekyll'
44
+ ```
45
+
46
+ And then execute:
47
+
48
+ $ bundle
49
+
50
+ Or install it yourself as:
51
+
52
+ $ gem install distorted-jekyll
53
+
54
+ ## Usage
55
+
56
+ No manual usage is necessary! Just write Markdown and use Markdown's image syntax
57
+ for photos and videos. DistorteD (by default) uses a `pre_render` hook to
58
+ transform instances of Markdown image syntax to instances of DistorteD's
59
+ Liquid tag.
60
+
61
+ ```
62
+ ![alt text](some-photo.jpg "title text")
63
+ ```
64
+
65
+ e.g.
66
+
67
+ ```
68
+ !["beatmania IIDX WavePass card readers being removed from shipping box."](IIDX-Readers-Unboxing.jpg "Including that authentic game center cigarette smell."]
69
+ ```
70
+
71
+ Two or more adjacent lines containing a Markdown image/video inside a Markdown
72
+ list item will be combined into a DistorteD Block where the images or videos
73
+ will group and flow together in one block on the page, like a tweet.
74
+
75
+ ```
76
+ ‑ ![Wavepass card reader installed on my IIDX machine](IIDX-Readers-Installed.jpg "Number one")
77
+ ‑ ![IIDX PC parts](IIDX-PC-Parts.jpg "Twoooo")
78
+ ‑ ![Adjusting monitor height](IIDX-Raising-Monitor.jpg "Three.")
79
+ ‑ ![Card reader enclosures unlocked and hanging open](IIDX-Readers-Unlocked.jpg "Four!")
80
+ ```
81
+ ## Manual Usage
82
+
83
+ You can also invoke DD's Liquid tag directly. This is the syntax the above Markdown
84
+ will be transformed into.
85
+
86
+ ```
87
+ {% distorted
88
+ IIDX-Readers-Unboxing.jpg
89
+ href="original"
90
+ alt="Wavepass card reader hardware being removed from a shipping box"
91
+ title="Complete with that fresh Game Center cigarette smell."
92
+ %}
93
+ ```
94
+
95
+ Or, for a DD grid:
96
+
97
+ ```
98
+ {% distort %}
99
+ {% distorted […] %}
100
+ {% distorted […] %}
101
+ {% distorted […] %}
102
+ {% distorted […] %}
103
+ {% enddistort %}
104
+ ```
105
+
106
+ ## Example
107
+
108
+ Here's an example of embedding an example image in a Jekyll demo site's first post. No site configuration was changed aside from installing the Gem.
109
+
110
+ The log output:
111
+
112
+ ```
113
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-full.png
114
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-small.png
115
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-medium.png
116
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-large.png
117
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-full.webp
118
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-small.webp
119
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-medium.webp
120
+ DistorteD Writing: /home/okeeblow/Works/DDDemo/jekyll/update/2020/06/17/DistorteD-large.webp
121
+ Writing: /home/okeeblow/Works/DDDemo/_site/jekyll/update/2020/06/17/welcome-to-jekyll.html
122
+ ```
123
+
124
+ And the actual template output that ends up in the final page:
125
+
126
+ ```
127
+ <div class="distorted">
128
+ <a href="/jekyll/update/2020/06/17/DistorteD.png" target="_blank">
129
+ <picture>
130
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-full.png" />
131
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-small.png" media="(max-width: 400px)" />
132
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-medium.png" media="(min-width: 800px)" />
133
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-large.png" media="(min-width: 1500px)" />
134
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-full.webp" />
135
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-small.webp" media="(max-width: 400px)" />
136
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-medium.webp" media="(min-width: 800px)" />
137
+ <source srcset="/jekyll/update/2020/06/17/DistorteD-large.webp" media="(min-width: 1500px)" />
138
+ <img src="/jekyll/update/2020/06/17/DistorteD.png" alt="DistorteD logo" title="DistorteD Demo!" loading="eager" />
139
+ </picture>
140
+ </a>
141
+ <span style="clear: left;"></span>
142
+ </div>
143
+ ```
144
+
145
+ ## Development
146
+
147
+ Clone the DistorteD repository and modify your Jekyll `Gemfile` to refer to your local path instead of to the newest published version of the gem:
148
+
149
+ ```
150
+ gem 'distorted-jekyll', :path => '~/repos/DistorteD/DistorteD-Jekyll/'[, :branch => 'NEW-SENSATION']
151
+ gem 'distorted', :path => '~/repos/DistorteD/DistorteD-Ruby/'[, :branch => 'NEW-SENSATION']
152
+ ```
153
+
154
+ The `DistorteD-Jekyll` Gem will automatically use its local sibling `DistorteD-Ruby` Gem if used in this way.
155
+
156
+ ## License
157
+
158
+ DistorteD is available as open source under the terms of the [GNU Affero General Public License version 3](https://opensource.org/licenses/AGPL-3.0).
metadata ADDED
@@ -0,0 +1,157 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: distorted-jekyll
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.4.0
5
+ platform: ruby
6
+ authors:
7
+ - Allison Reid
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2020-06-18 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: bundler
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: '2.0'
20
+ type: :development
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: '2.0'
27
+ - !ruby/object:Gem::Dependency
28
+ name: rake
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: '10.0'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: '10.0'
41
+ - !ruby/object:Gem::Dependency
42
+ name: minitest
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - "~>"
46
+ - !ruby/object:Gem::Version
47
+ version: '5.0'
48
+ type: :development
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - "~>"
53
+ - !ruby/object:Gem::Version
54
+ version: '5.0'
55
+ - !ruby/object:Gem::Dependency
56
+ name: liquid
57
+ requirement: !ruby/object:Gem::Requirement
58
+ requirements:
59
+ - - "~>"
60
+ - !ruby/object:Gem::Version
61
+ version: '4.0'
62
+ type: :runtime
63
+ prerelease: false
64
+ version_requirements: !ruby/object:Gem::Requirement
65
+ requirements:
66
+ - - "~>"
67
+ - !ruby/object:Gem::Version
68
+ version: '4.0'
69
+ - !ruby/object:Gem::Dependency
70
+ name: liquid-tag-parser
71
+ requirement: !ruby/object:Gem::Requirement
72
+ requirements:
73
+ - - "~>"
74
+ - !ruby/object:Gem::Version
75
+ version: '1.9'
76
+ type: :runtime
77
+ prerelease: false
78
+ version_requirements: !ruby/object:Gem::Requirement
79
+ requirements:
80
+ - - "~>"
81
+ - !ruby/object:Gem::Version
82
+ version: '1.9'
83
+ - !ruby/object:Gem::Dependency
84
+ name: distorted
85
+ requirement: !ruby/object:Gem::Requirement
86
+ requirements:
87
+ - - "~>"
88
+ - !ruby/object:Gem::Version
89
+ version: '0.4'
90
+ type: :runtime
91
+ prerelease: false
92
+ version_requirements: !ruby/object:Gem::Requirement
93
+ requirements:
94
+ - - "~>"
95
+ - !ruby/object:Gem::Version
96
+ version: '0.4'
97
+ - !ruby/object:Gem::Dependency
98
+ name: mime-types
99
+ requirement: !ruby/object:Gem::Requirement
100
+ requirements:
101
+ - - "~>"
102
+ - !ruby/object:Gem::Version
103
+ version: '3.0'
104
+ type: :runtime
105
+ prerelease: false
106
+ version_requirements: !ruby/object:Gem::Requirement
107
+ requirements:
108
+ - - "~>"
109
+ - !ruby/object:Gem::Version
110
+ version: '3.0'
111
+ - !ruby/object:Gem::Dependency
112
+ name: kramdown
113
+ requirement: !ruby/object:Gem::Requirement
114
+ requirements:
115
+ - - "~>"
116
+ - !ruby/object:Gem::Version
117
+ version: '2.0'
118
+ type: :runtime
119
+ prerelease: false
120
+ version_requirements: !ruby/object:Gem::Requirement
121
+ requirements:
122
+ - - "~>"
123
+ - !ruby/object:Gem::Version
124
+ version: '2.0'
125
+ description: Jekyll::DistorteD is a Liquid tag for embedding media in a Jekyll site
126
+ with automatic thumbnailing, cropping, and format conversion.
127
+ email:
128
+ - root@cooltrainer.org
129
+ executables: []
130
+ extensions: []
131
+ extra_rdoc_files: []
132
+ files:
133
+ - README.md
134
+ homepage: https://cooltrainer.org
135
+ licenses:
136
+ - AGPL-3.0
137
+ metadata: {}
138
+ post_install_message:
139
+ rdoc_options: []
140
+ require_paths:
141
+ - lib
142
+ required_ruby_version: !ruby/object:Gem::Requirement
143
+ requirements:
144
+ - - ">="
145
+ - !ruby/object:Gem::Version
146
+ version: '0'
147
+ required_rubygems_version: !ruby/object:Gem::Requirement
148
+ requirements:
149
+ - - ">="
150
+ - !ruby/object:Gem::Version
151
+ version: '0'
152
+ requirements: []
153
+ rubygems_version: 3.1.2
154
+ signing_key:
155
+ specification_version: 4
156
+ summary: Media transformation and embedding framework for Jekyll.
157
+ test_files: []