{"id":13400067,"url":"https://github.com/rpocklin/angular-timeline","last_synced_at":"2025-10-22T21:35:01.822Z","repository":{"id":25878730,"uuid":"29318997","full_name":"rpocklin/angular-timeline","owner":"rpocklin","description":"An Angular.JS directive that generates a responsive, data-driven vertical timeline to tell a story,  show history or describe a sequence of events.","archived":false,"fork":false,"pushed_at":"2018-04-18T22:45:52.000Z","size":3441,"stargazers_count":417,"open_issues_count":13,"forks_count":107,"subscribers_count":20,"default_branch":"master","last_synced_at":"2025-10-13T20:53:32.883Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rpocklin.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":"2015-01-15T21:26:38.000Z","updated_at":"2025-09-02T16:11:48.000Z","dependencies_parsed_at":"2022-08-31T00:31:10.903Z","dependency_job_id":null,"html_url":"https://github.com/rpocklin/angular-timeline","commit_stats":null,"previous_names":[],"tags_count":11,"template":false,"template_full_name":null,"purl":"pkg:github/rpocklin/angular-timeline","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rpocklin%2Fangular-timeline","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rpocklin%2Fangular-timeline/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rpocklin%2Fangular-timeline/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rpocklin%2Fangular-timeline/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rpocklin","download_url":"https://codeload.github.com/rpocklin/angular-timeline/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rpocklin%2Fangular-timeline/sbom","scorecard":{"id":786338,"data":{"date":"2025-08-11","repo":{"name":"github.com/rpocklin/angular-timeline","commit":"437f4a22d62d1f6b1ea17a18bc60991d1dd15647"},"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":"Code-Review","score":0,"reason":"Found 0/30 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":"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":"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":"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":"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":"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":"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":"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":"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":9,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Warn: project license file does not contain an FSF or OSI license."],"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-23T06:12:47.205Z","repository_id":25878730,"created_at":"2025-08-23T06:12:47.205Z","updated_at":"2025-08-23T06:12:47.205Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":280402182,"owners_count":26324587,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-22T02:00:06.515Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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-07-30T19:00:47.655Z","updated_at":"2025-10-22T21:35:01.817Z","avatar_url":"https://github.com/rpocklin.png","language":"CSS","readme":"# Angular Timeline\n\nAn Angular.js directive that generates a responsive, data-driven vertical timeline to tell a story, \nshow history or describe a sequence of events.\n\n[![Build Status](https://secure.travis-ci.org/rpocklin/angular-timeline.svg)](http:/travis-ci.org/rpocklin/angular-timeline)\n\n# Demo\n\n[Demo](http://rpocklin.github.io/angular-timeline/example/index.html)\n\n[Demo without bootstrap](http://rpocklin.github.io/angular-timeline/example/index-no-bootstrap.html)\n\n[Original Implementation (HTML / Javascript)](http://bootsnipp.com/snippets/featured/timeline-responsive)\n\n# NG Docs\n\n[link](http://rpocklin.github.io/angular-timeline/docs/#/api/angular-timeline.directive:timeline)\n\n# Inspiration\n[1](http://bootsnipp.com/snippets/featured/two-column-timeline-not-responsive)\n[2](http://bootsnipp.com/snippets/featured/timeline-single-column)\n[3](http://bootsnipp.com/snippets/featured/single-column-timeline)\n[4](http://bootsnipp.com/snippets/featured/timeline-with-images-and-tooltip)\n[5](http://bootsnipp.com/snippets/featured/timeline-dotted)\n[6](http://codyhouse.co/demo/vertical-timeline/index.html)\n\n## Installation\n\n1. Install the plugin into your Angular.js project, manually or via\n\n  `bower install angular-timeline --save`\n\n1. Include `angular-timeline.css` in your app:\n\n  `\u003clink rel=\"stylesheet\" href=\"bower_components/angular-timeline/dist/angular-timeline.css\"/\u003e`\n\n1. Include `angular-timeline.js` in your app:\n\n  `\u003cscript src=\"bower_components/angular-timeline/dist/angular-timeline.js\"\u003e\u003c/script\u003e`\n\n1. Add `angular-timeline` as a new module dependency in your angular app.\n\n  `var myapp = angular.module('myapp', ['angular-timeline']);`\n\n1. To define a timeline, do the following (either manually or using ng-repeat on a dataset):\n\n  ```javascript\n  \n    // in controller\n    $scope.events = [{\n      badgeClass: 'info',\n      badgeIconClass: 'glyphicon-check',\n      title: 'First heading',\n      content: 'Some awesome content.'\n    }, {\n      badgeClass: 'warning',\n      badgeIconClass: 'glyphicon-credit-card',\n      title: 'Second heading',\n      content: 'More awesome content.'\n    }];\n  ```\n\n  ```html\n  \n    \u003c!-- view --\u003e\n    \u003ctimeline\u003e\n      \u003ctimeline-event ng-repeat=\"event in events\" side=\"right\"\u003e\n        \u003ctimeline-badge class=\"{{event.badgeClass}}\"\u003e\n          \u003ci class=\"glyphicon {{event.badgeIconClass}}\"\u003e\u003c/i\u003e\n        \u003c/timeline-badge\u003e\n        \u003ctimeline-panel class=\"{{event.badgeClass}}\"\u003e\n          \u003ctimeline-heading\u003e\n            \u003ch4\u003e{{event.title}}\u003c/h4\u003e\n          \u003c/timeline-heading\u003e\n          \u003cp\u003e{{event.content}}\u003c/p\u003e\n        \u003c/timeline-panel\u003e\n      \u003c/timeline-event\u003e\n    \u003c/timeline\u003e\n  ```\n\nThere is a bit of markup here but `\u003ctimeline-heading\u003e` is optional.\n`\u003ctimeline-badge\u003e` is for the centre line between the two sides, and should represent the event type that occured.\n\n## Notes\n\n- The demo uses [angular-scroll-animate](https://github.com/rpocklin/angular-scroll-animate) to trigger CSS animations when timeline events scroll into view.  It's totally optional to include this or not and is just there for effect.\n\n- Panels are now designed to float left, then right, side to side.  Float right is forced on smaller (eg. mobile) devices.\n- If you define the events in an array and have HTML content to output, use `ng-bind-html={{event.attribute}}` and require the `ngSanitize` module.\n\n- You can use either the SASS styles directly file under `/dist` or the compiled CSS files, up to you :)\n\n- If you are using Bootstrap 3 it affects the timeline CSS, so include `angular-timeline-bootstrap.[css|scss]}` to re-adjust the offsets e.g:\n\n```html\n  \u003clink rel=\"stylesheet\" href=\"bower_components/bootstrap/dist/css/bootstrap.css\" /\u003e\n  \u003clink rel=\"stylesheet\" href=\"bower_components/angular-timeline/dist/angular-timeline-bootstrap.css\" /\u003e\n  \u003cscript src=\"bower_components/angular-timeline/dist/angular-timeline.js\"\u003e\u003c/script\u003e\n```\n\n\n## Running Locally\n\n1. Checkout git repository locally: `git clone git@github.com:rpocklin/angular-timeline.git`\n1. `npm install`\n1. `bower install`\n1. `grunt serve`\n1. View `http://localhost:9000/example/` in your browser to see the example.\n\n\n## Contributing\n\n1. Fork it\n1. Create your feature branch (`git checkout -b my-new-feature`)\n1. Beautify (`grunt beautify`)\n1. Ensure it passes code-checks / tests (`grunt`)\n1. Commit your changes (`git commit -am 'Added some feature'`)\n1. Push to the branch (`git push origin my-new-feature`)\n1. Create a new Pull Request\n\n\n## History\n\n* 1.7.0 Changed CSS classes to fix animations in and out (in example).\n* 1.6.2 Fixed missing logic in passing `side` attribute declaration (was watching parent scope)\n* 1.6.1 Added attribute for `side=left` or `side=right` to force left or right-handed columns for timeline events.\n* 1.6.0 Changed `hidden` to `timeline-hidden` class in example an `angular-timeline-animations.css`.\n* 1.5.2 Updated dependency used in example `angular-scroll-animate` from 0.8.0 to 0.9.1.\n* 1.5.0 Updated dependencies, simplified nested components and improved example.  Changed `timeline-node` to `timeline-event`. Removed `replace = true` in directives.\n* 1.2.1 Cleaned up dependencies and build steps.\n* 1.2.0 Updated example and styling to be more responsive.\n* 1.0.0 Initial release\n\n\n## TODO\n\n- Add some tests\n\n## Thanks\n*luisrudge* for the original vanilla JS implementation on [Bootsnipp](http://bootsnipp.com/snippets/featured/timeline-responsive)\n\n\n## License\n\nReleased under the MIT License. See the [LICENSE][license] file for further details.\n\n[license]: https://github.com/rpocklin/angular-timeline/blob/master/LICENSE\n","funding_links":[],"categories":["CSS","UI Components"],"sub_categories":["Timeline"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frpocklin%2Fangular-timeline","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frpocklin%2Fangular-timeline","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frpocklin%2Fangular-timeline/lists"}