html-pipeline-task_list 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 7f7c8e80e9c4e81c8f3e5664b8c4169c9058d1fc3e1f18b73717f5b4290ee717
+  data.tar.gz: 959db5129b1a159383a730d02ca2084880c9c88449bd6912971fcf5106186eb8
+SHA512:
+  metadata.gz: a40d56aadbe7e1a92361e7bd40a032cf42ec15def24d4de044099b81c14e7d00801c6f6918ddd603f078d9db258e97207afe02db8c9d3c77e6495e5bd106e7a8
+  data.tar.gz: '091d7c01b62a2ae4dae0698b44331ec811160452a48cf0e633bf9948307ac1d9c58a834af194479cd4d8fa4508f651e300a6966b755ddbcfbad05dee6bdf5e84'

data/.circleci/config.yml

@@ -0,0 +1,91 @@
+version: 2.1
+
+environment: &environment
+  LOG_LEVEL: WARN
+  TEST_PORT: 3000
+  TEST_HOST: http://localhost:3000
+
+jobs:
+  functional_tests:
+    working_directory: ~/repos/html-pipeline-task_list
+
+    docker:
+      - image: circleci/ruby:2.6.4-buster-node-browsers
+        environment:
+          <<: *environment
+
+    steps:
+      - checkout
+
+      - run:
+          name: install bundler
+          command: gem install bundler:2.1.4
+
+      - run:
+          name: check dependencies
+          command: |
+            bundle -v
+            bundle exec ruby -v
+
+      - restore_cache:
+          keys:
+            - html-pipeline-task_list-cache-v2-{{ checksum "html-pipeline-task_list.gemspec" }}
+            - html-pipeline-task_list-cache-v2-
+
+      - run:
+          name: install gems
+          command: bundle install && bundle clean
+
+      - run:
+          name: install packages
+          command: npm install
+
+      - save_cache:
+          key: html-pipeline-task_list-cache-v2-{{ checksum "html-pipeline-task_list.gemspec" }}
+          paths:
+            - vendor
+            - node_modules
+
+      - run:
+          name: run functional tests
+          command: bundle exec rake test
+
+      - run:
+          name: run javascript unit tests
+          command: npm test
+
+      - store_test_results:
+          path: test_results
+
+  publish_to_rubygems:
+    working_directory: ~/repos/html-pipeline-task_list
+
+    docker:
+      - image: circleci/ruby:2.6.4-buster-node
+        environment:
+          <<: *environment
+
+    steps:
+      - checkout
+
+      - run:
+          name: setup ubygems
+          command: bash .circleci/setup-rubygems.sh
+
+      - run:
+          name: publish to Rubygems
+          command: |
+            gem build html-pipeline-task_list.gemspec
+            gem push "html-pipeline-task_list-$(git describe --abbrev=0 --tags | cut -c 2-).gem"
+
+workflows:
+  version: 2
+  build_and_test:
+    jobs:
+      - functional_tests
+      - publish_to_rubygems:
+          filters:
+            tags:
+              only: /.*/
+            branches:
+              ignore: /.*/

data/.circleci/setup-rubygems.sh

@@ -0,0 +1,3 @@
+mkdir ~/.gem
+echo -e "---\r\n:rubygems_api_key: $RUBYGEMS_API_KEY" > ~/.gem/credentials
+chmod 0600 /home/circleci/.gem/credentials

data/.gitignore

@@ -0,0 +1,15 @@
+/.bundle/
+/.yardoc
+Gemfile.lock
+/_yardoc/
+/bin/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/
+/node_modules/
+/public/
+/vendor/
+.DS_Store
+*.gem

data/.rubocop.yml

@@ -0,0 +1,45 @@
+AllCops:
+  TargetRubyVersion: 2.4
+  Exclude:
+    - 'bin/**/*'
+    - 'vendor/**/*'
+    - 'config.ru'
+
+Layout/LineLength:
+  Max: 100
+
+Layout/ParameterAlignment:
+  Exclude:
+    - 'bin/**/*'
+
+Metrics/AbcSize:
+  Max: 20
+
+Metrics/BlockLength:
+  Max: 30
+
+Metrics/ClassLength:
+  Exclude:
+    - 'test/**/*.rb'
+
+Metrics/MethodLength:
+  Max: 15
+  Exclude:
+    - 'test/**/*.rb'
+
+Style/ClassAndModuleChildren:
+  Exclude:
+    - 'test/**/*.rb'
+
+Style/Documentation:
+  Exclude:
+    - 'test/**/*'
+
+Style/HashEachMethods:
+  Enabled: true
+
+Style/HashTransformKeys:
+  Enabled: true
+
+Style/HashTransformValues:
+  Enabled: true

data/CONTRIBUTING.md

@@ -0,0 +1,11 @@
+# Contributions Welcome!
+
+Hi there! We're thrilled that you'd like to contribute to this project. Before you do, would you mind reading [this license agreement](CLA.md)? If you open a PR, we'll assume you agree to it. If you have any hesitation or disagreement, please do open a PR still, but note your concerns as well.
+
+Once done, follow these steps:
+
+1. Fork this repository
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create a Pull Request

data/Gemfile

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+source 'https://rubygems.org'
+gemspec

data/Guardfile

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+# rspec configuration
+minitest_opts = {
+  cmd: 'rake test',
+  autorun: false,
+  all_on_start: true
+}
+
+rubocop_opts = {
+  all_on_start: true,
+  cli: ['--display-cop-names']
+}
+
+group :rails, halt_on_fail: true do
+  guard :minitest, minitest_opts do
+    directories %w[test lib]
+    watch %r{^test/(.+)_test\.rb$}
+    watch(%r{^lib/(.+)\.rb$}) { |m| "test/#{m[1]}_test.rb" }
+  end
+
+  guard :rubocop, rubocop_opts do
+    directories %w[test lib]
+    watch(%r{^test/.+\.rb$})
+    watch(%r{^lib/(.+)\.rb$})
+  end
+end

data/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2014 GitHub, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/README.md

@@ -0,0 +1,104 @@
+# Task Lists
+
+This Gem provides various components necessary for integrating
+[Task Lists](https://github.com/blog/1375-task-lists-in-gfm-issues-pulls-comments)
+into your GitHub-flavored-Markdown user content.
+
+`HTML::Pipeline::TaskList` is a successor to [TaskList](https://github.com/github/task_list) which GitHub stopped supporting and updating in 2016.  This gem updates key components to support changes to underlying gems.
+
+## Components
+
+The Task List feature is made of several different components:
+
+* GitHub-flavored-Markdown Ruby Filter
+* Summary Ruby Model: summarizes task list items
+* JavaScript: frontend task list update behavior
+* CSS: styles Markdown task list items
+
+## Usage & Integration
+
+The backend components are designed for rendering the Task List item checkboxes, and the frontend components handle updating the Markdown source (embedded in the markup).
+
+### Backend: Markdown pipeline filter
+
+Rendering Task List item checkboxes from source Markdown depends on the `HTML::Pipeline::TaskList::Filter`, designed to integrate with the [`html-pipeline`](https://github.com/jch/html-pipeline) gem. For example:
+
+``` ruby
+require 'html/pipeline'
+require 'html/pipeline/task_list/filter'
+
+pipeline = HTML::Pipeline.new [
+  HTML::Pipeline::MarkdownFilter,
+  HTML::Pipeline::TaskList::Filter
+]
+
+pipeline.call "- [ ] task list item"
+```
+
+### Frontend: Markdown Updates
+
+Task List updates on the frontend require specific HTML markup structure, and must be enabled with JavaScript.
+
+Rendered HTML (the `<ul>` element below) should be contained in a `js-task-list-container` container element and include a sibling `textarea.js-task-list-field` element that is updated when checkboxes are changed.
+
+``` markdown
+- [ ] text
+```
+
+``` html
+<div class="js-task-list-container">
+  <ul class="task-list">
+    <li class="task-list-item">
+      <input type="checkbox" class="js-task-list-item-checkbox" disabled />
+      text
+    </li>
+  </ul>
+  <form>
+    <textarea class="js-task-list-field">- [ ] text</textarea>
+  </form>
+</div>
+```
+
+Enable Task List updates with:
+
+``` javascript
+$('.js-task-list-container').taskList('enable')
+```
+
+NOTE: Updates are not persisted to the server automatically. Persistence is the responsibility of the integrating application, accomplished by hooking into the `tasklist:change` JavaScript event. For instance, we use AJAX to submit a hidden form on update.
+
+Read through the documented behaviors and samples [in the source][frontend_behaviors] for more detail, including documented events.
+
+[frontend_behaviors]: https://github.com/github/task_list/blob/master/app/assets/javascripts/task_list.coffee
+
+## Installation
+
+### Backend: RubyGem
+
+For the backend Ruby components, add this line to your application's Gemfile:
+
+    gem 'html-pipeline-task_list', '~> 0.0'
+
+And then execute `bundle install`
+
+## Development
+AAfter checking out the repo, run `bundle install && npm install` to install dependencies.
+
+To install this gem onto your local machine, run `bundle exec rake install`
+
+To release a new version, update run `bundle exec rake release` to create a git tag for the version.  push the git commits and tags and CI will automatically push to [RubyGems.org](https://rubygems.org).
+
+## Testing
+before beginning testing, be sure to run `bundle install && npm install`
+
+Ruby unit tests can be run with `rake test`.
+Javascript unit tests can be run with `npm test`
+
+Functional tests can be run manually in the browser.  To do so:
+1. run `npm run server`
+2. open a browser to http://localhost:3000/test/behavior.html
+3. you can also see the QUnit tests at http://localhost:4011/test/qunit.html
+
+## Contributing
+
+Read the [Contributing Guidelines](CONTRIBUTING.md) and open a Pull Request!

data/Rakefile

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+require 'bundler/gem_tasks'
+require 'rake/testtask'
+require 'rubocop/rake_task'
+
+task default: :test
+Rake::TestTask.new do |t|
+  t.libs << 'lib'
+  t.test_files = FileList['test/**/*_test.rb']
+  t.verbose = true
+end
+
+RuboCop::RakeTask.new
+
+Rake::Task['test'].enhance ['rubocop']

data/app/assets/javascripts/task_list.js

@@ -0,0 +1,107 @@
+// HTML::Pipeline::TaskList
+
+    var codeFencesPattern, complete, completePattern, disableTaskList, disableTaskLists, enableTaskList, enableTaskLists, escapePattern, incomplete, incompletePattern, itemPattern, itemsInParasPattern, updateTaskList, updateTaskListItem,
+      indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
+
+    incomplete = "[ ]";
+
+    complete = "[x]";
+
+    escapePattern = function(str) {
+      return str.replace(/([\[\]])/g, "\\$1").replace(/\s/, "\\s").replace("x", "[xX]");
+    };
+
+    incompletePattern = RegExp("" + (escapePattern(incomplete)));
+
+    completePattern = RegExp("" + (escapePattern(complete)));
+
+    itemPattern = RegExp("^(?:\\s*(?:>\\s*)*(?:[-+*]|(?:\\d+\\.)))\\s*(" + (escapePattern(complete)) + "|" + (escapePattern(incomplete)) + ")\\s+(?!\\(.*?\\))(?=(?:\\[.*?\\]\\s*(?:\\[.*?\\]|\\(.*?\\))\\s*)*(?:[^\\[]|$))");
+
+    codeFencesPattern = /^`{3}(?:\s*\w+)?[\S\s].*[\S\s]^`{3}$/mg;
+
+    itemsInParasPattern = RegExp("^(" + (escapePattern(complete)) + "|" + (escapePattern(incomplete)) + ").+$", "g");
+
+    updateTaskListItem = function(source, itemIndex, checked) {
+      var clean, index, line, result;
+      clean = source.replace(/\r/g, '').replace(codeFencesPattern, '').replace(itemsInParasPattern, '').split("\n");
+      index = 0;
+      result = (function() {
+        var i, len, ref, results;
+        ref = source.split("\n");
+        results = [];
+        for (i = 0, len = ref.length; i < len; i++) {
+          line = ref[i];
+          if (indexOf.call(clean, line) >= 0 && line.match(itemPattern)) {
+            index += 1;
+            if (index === itemIndex) {
+              line = checked ? line.replace(incompletePattern, complete) : line.replace(completePattern, incomplete);
+            }
+          }
+          results.push(line);
+        }
+        return results;
+      })();
+      return result.join("\n");
+    };
+
+    updateTaskList = function($item) {
+      var $container, $field, checked, event, index;
+      $container = $item.closest('.js-task-list-container');
+      $field = $container.find('.js-task-list-field');
+      index = 1 + $container.find('.task-list-item-checkbox').index($item);
+      checked = $item.prop('checked');
+      event = $.Event('tasklist:change');
+      $field.trigger(event, [index, checked]);
+      if (!event.isDefaultPrevented()) {
+        $field.val(updateTaskListItem($field.val(), index, checked));
+        $field.trigger('change');
+        return $field.trigger('tasklist:changed', [index, checked]);
+      }
+    };
+
+    $(document).on('change', '.task-list-item-checkbox', function() {
+      return updateTaskList($(this));
+    });
+
+    enableTaskList = function($container) {
+      if ($container.find('.js-task-list-field').length > 0) {
+        $container.find('.task-list-item').addClass('enabled').find('.task-list-item-checkbox').attr('disabled', null);
+        return $container.addClass('is-task-list-enabled').trigger('tasklist:enabled');
+      }
+    };
+
+    enableTaskLists = function($containers) {
+      var container, i, len, results;
+      results = [];
+      for (i = 0, len = $containers.length; i < len; i++) {
+        container = $containers[i];
+        results.push(enableTaskList($(container)));
+      }
+      return results;
+    };
+
+    disableTaskList = function($container) {
+      $container.find('.task-list-item').removeClass('enabled').find('.task-list-item-checkbox').attr('disabled', 'disabled');
+      return $container.removeClass('is-task-list-enabled').trigger('tasklist:disabled');
+    };
+
+    disableTaskLists = function($containers) {
+      var container, i, len, results;
+      results = [];
+      for (i = 0, len = $containers.length; i < len; i++) {
+        container = $containers[i];
+        results.push(disableTaskList($(container)));
+      }
+      return results;
+    };
+
+    $.fn.taskList = function(method) {
+      var $container, methods;
+      $container = $(this).closest('.js-task-list-container');
+      methods = {
+        enable: enableTaskLists,
+        disable: disableTaskLists
+      };
+      return methods[method || 'enable']($container);
+    };
+