{"id":21068392,"url":"https://github.com/datchley/flight-handlebars-view","last_synced_at":"2026-02-20T19:04:15.797Z","repository":{"id":22230616,"uuid":"25563664","full_name":"datchley/flight-handlebars-view","owner":"datchley","description":"A Flight.js mixin for using Handlebars.js templates in Components","archived":false,"fork":false,"pushed_at":"2015-12-28T14:06:54.000Z","size":248,"stargazers_count":3,"open_issues_count":1,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2026-02-05T00:46:36.271Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/datchley.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-10-22T05:34:51.000Z","updated_at":"2015-01-21T03:40:02.000Z","dependencies_parsed_at":"2022-07-17T12:46:07.729Z","dependency_job_id":null,"html_url":"https://github.com/datchley/flight-handlebars-view","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/datchley/flight-handlebars-view","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/datchley%2Fflight-handlebars-view","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/datchley%2Fflight-handlebars-view/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/datchley%2Fflight-handlebars-view/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/datchley%2Fflight-handlebars-view/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/datchley","download_url":"https://codeload.github.com/datchley/flight-handlebars-view/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/datchley%2Fflight-handlebars-view/sbom","scorecard":{"id":324954,"data":{"date":"2025-08-11","repo":{"name":"github.com/datchley/flight-handlebars-view","commit":"f68f8cad95f025f5ef95af17e6d1b8e7afa19c07"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":3,"checks":[{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Code-Review","score":0,"reason":"Found 0/15 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Vulnerabilities","score":10,"reason":"0 existing vulnerabilities detected","details":null,"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}}]},"last_synced_at":"2025-08-18T02:12:42.140Z","repository_id":22230616,"created_at":"2025-08-18T02:12:42.140Z","updated_at":"2025-08-18T02:12:42.140Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29661585,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-20T16:33:43.953Z","status":"ssl_error","status_checked_at":"2026-02-20T16:33:43.598Z","response_time":59,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-19T18:20:26.506Z","updated_at":"2026-02-20T19:04:15.764Z","avatar_url":"https://github.com/datchley.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# flight-handlebars-view\n\nA [Flight](https://github.com/flightjs/flight) mixin for Handlebars templating with Components.\n\n[![NPM](https://nodei.co/npm/flight-handlebars-view.png?downloads=true\u0026downloadRank=true\u0026stars=true)](https://nodei.co/npm/flight-handlebars-view/)\n\n[![Caffeine](http://img.shields.io/badge/caffeine%20level-low-yellow.svg)](http://theoatmeal.com/comics/coffee)\n\n## Installation\n\nWith Bower:\n```bash\n$ bower install --save flight-handlebars-view\n```\n\nWith npm:\n```bash\n$ npm install flight-handlebars-view --save-dev\n```\n\n## What is this?\nThis project provides a `mixin` for Flight.js components to use so they can implement all or part of their DOM behavior using [Handlebars.js](http://handlebarsjs.com/) client-side templates.  It is __not__ a Component by itself. \n\nA number of other flight templating mixins for Hogan, Mustache and others include a full Component piece along with a Mixin.  They do this to abstract the entire managing of templates to a data/utility type mixin that attaches to the DOM and then listens for requests for templates from UI Components.  The templates, rather their rendered html, is then sent back to the requesting UI Component via an event.\n\nThis approach has the drawback of tightly coupling the utility, template serving Component to any UI Component that wants to use the Mixin to render templates. Not to mention it makes us add another Component to the page and generate more events when the UI is rendering.\n\nThe approach taken here is to remove the data/utility Component all together, and thereby remove any dependency for other UI Components that want to use Handlebars templates to manage their DOM behavior.  Let the UI Component manage their templates directly, as you already have Handlebars included on the page in the first place.\n\n## Requirements\n\nThis mixin can be used with Flight.js via [Require.js](http://requirejs.org/) or using standalone Flight.js.\n\nYou only need to include/require Handlebars.js library (_full or just the runtime if using only pre-compiled templates_) for this mixin to work.\n\n## API\n\n#### `Render({String}, {Object})`\nUse the `with_handlebars_view` mixin.  The mixin provides any Component with a `render()` method.  Then render method has the following signature:\n\n+ {string} _html_ = this-\u003e**render(**{string} _name_, {object} _context_**)**\n\nWhere:\n\n+  **{string} _name_** - the property in `this.attr.templates` that references the specific template. A template can be referenced as any of the following:\n    1. an inline, string template\n    2. an '#' id selector referencing a template in a `\u003cscript\u003e` tag\n    3. the name of a pre-compiled template function\n    \n    any template may contain partials, and even inline string templates can be partials as long as their property name is referenced as the partial (_see example below_).\n+ **{object} _context_** - an object containing the context data to be used to render the template.\n\n#### `templates({Object})`\nUse the `templates()` method to define the templates and partials that your component will use.\n\nYou can define templates that refer to external templates (*via `\u003cscript\u003e` tags*), plain string/HTML templates and pre-compiled templates. For the first two, you can also pass in compile options for each template as well, which is the same object/options accepted by `Handlebars.compile()`.\n\n**external `\u003cscript\u003e` templates**\n```javascript\nthis.after('initialize', function() {\n\tthis.templates({\n\t\t// references \u003cscript id=\"hello\" ...\u003e\n\t\t'hello':  '#hello',   \n\t\t// with Handlebars.compile options\n\t\t'users': [ '#user-list',  { noEscape:  true }]   \n\t});\n});\n```\n**string/html templates**\n```javascript\nthis.after('initialize', function() {\n\tthis.templates({\n\t\t'hello':  '\u003ch1\u003e{{greeting}}\u003c/h1\u003e',   \n\t\t'user': [ '\u003cli\u003e{{name}} - {{age}}\u003c/li\u003e',  { noEscape:  true }]\n\t});\n});\n```\n**pre-compiled templates**\nYou can load your pre-compiled templates however you like, just use the actual template name as the value for the template property you setup.  Pre-compiled templates can be setup as an array passing in compile options, as they're already compiled on the server side.\n```javascript\nthis.after('initialize', function() {\n\tthis.templates({\t\n\t\t// references Handlebars.templates.hello\n\t\t'hello':  'hello',   \n\t});\n});\n```\n#### `templateHelpers({Object})`\nUse the `templateHelpers()` method to define Handlebars helpers to be used in your templates.  Be sure and set these up before calling `render()` in your component.\n\nHelpers are passed in as an object, where the property name is the Handlebars helper name to use. For example:\n```javascript\nthis.templateHelpers({\n    'json': function(obj) {\n        // return JSON formatted object\n        return new Handlebars.SafeString(JSON.stringify(obj));\n    }\n});\n```\n\n### [deprecated] Define templates via attributes\n\n\u003e Defining templates via `this.defaultAttrs()` of `this.attributes()`in the `templates` property is\n\u003e deprecated; but will still work.  Use the `templates()`method to\n\u003e define the templates for your component.\n\n \nExamples of deprecated way of setting up templates via a components attributes:\n\n```javascript\nthis.defaultAttrs({\n templates: { /*...*/  }\n});\n```\n\n```javascript\nthis.attributes({\n\ttemplates: { /*...*/  }\n});\n```\n\n\n\n## Example Usage\nThe following gives an example shows each of the above use-cases within one UI Component.\n\nExample using Flight standalone:\n```html\n    \u003c!-- 1.) load pre-compiled templates from external file (from list-component.hbs) --\u003e\n    \u003cscript src=\"pre-compiled.js\"\u003e\u003c/script\u003e\n    \n    \u003c!-- 2.) handlebars templates via SCRIPT tags (w/ partial) --\u003e\n    \u003cscript id=\"list\" type=\"text/x-template-handlebars\"\u003e\n        \u003cul\u003e\n            {{\u003e item}}\n        \u003c/ul\u003e\n    \u003c/script\u003e\n    \n    \u003c!-- component node --\u003e\n    \u003cdiv id=\"list-component\"\u003e\n    \u003c/div\u003e\n    \n    \u003c!-- Define a component using this mixin --\u003e\n    \u003cscript\u003e\n        var ListComponent = (function() {\n        \n          return flight.component(function() {\n            this.defaultAttrs({\n              title: '',\n              items: []\n            });\n        \n            this.after('initialize', function() \n              this.templates({\n                // string literal, used as partial {{\u003e item }}\n                item: '\u003cli\u003e{{description}} - $\u003cb\u003e{{price}}\u003c\\/b\u003e\u003c\\/li\u003e',\n                // pre-compiled template loaded externally\n                main: 'list-component',\n                // template via \u003cscript\u003e tag id selector\n                list: '#list'\n              });\n              \n              this.$node.html(this.render('main', this.attr));\n              this.$node.append(this.render('list', this.attr));\n            });\n          }, withHandlebarsView);\n          \n        })();\n        \n        \u003c!-- Attach component to DOM --\u003e\n        ListComponent.attachTo('#list-component', {\n            title: 'My List',\n            items: [\n                { description: 'one', price: 10.00 },\n                { description: 'two', price: 20.00 }\n            ]\n        });\n    \u003c/script\u003e\n\n```\n\n\n## Development\n\nDevelopment of this component requires [Bower](http://bower.io), and preferably\n[Karma](http://karma-runner.github.io) to be globally installed:\n\n```bash\nnpm install -g bower karma\n```\n\nThen install the Node.js and client-side dependencies by running the following\ncommands in the repo's root directory.\n\n```bash\nnpm install\nbower install\n```\n\nTo continuously run the tests in Chrome and Firefox during development, just run:\n\n```bash\nkarma start\n```\n\n## Contributing to this project\n\nAnyone and everyone is welcome to contribute. Please take a moment to\nreview the [guidelines for contributing](CONTRIBUTING.md).\n\n* [Bug reports](CONTRIBUTING.md#bugs)\n* [Feature requests](CONTRIBUTING.md#features)\n* [Pull requests](CONTRIBUTING.md#pull-requests)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdatchley%2Fflight-handlebars-view","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdatchley%2Fflight-handlebars-view","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdatchley%2Fflight-handlebars-view/lists"}