{"id":13493763,"url":"https://github.com/vitaly-t/excellent","last_synced_at":"2025-04-28T16:10:23.092Z","repository":{"id":51341929,"uuid":"141819160","full_name":"vitaly-t/excellent","owner":"vitaly-t","description":"Basic DOM Component Framework","archived":false,"fork":false,"pushed_at":"2021-06-10T14:08:06.000Z","size":4794,"stargazers_count":58,"open_issues_count":2,"forks_count":5,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-23T05:44:05.607Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://vitaly-t.github.io/excellent/","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/vitaly-t.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-07-21T14:14:27.000Z","updated_at":"2025-02-22T22:47:10.000Z","dependencies_parsed_at":"2022-08-27T19:40:27.359Z","dependency_job_id":null,"html_url":"https://github.com/vitaly-t/excellent","commit_stats":null,"previous_names":[],"tags_count":81,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitaly-t%2Fexcellent","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitaly-t%2Fexcellent/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitaly-t%2Fexcellent/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitaly-t%2Fexcellent/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vitaly-t","download_url":"https://codeload.github.com/vitaly-t/excellent/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251342724,"owners_count":21574245,"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","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-31T19:01:18.575Z","updated_at":"2025-04-28T16:10:23.070Z","avatar_url":"https://github.com/vitaly-t.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Excellent.js\n\n\u003cimg align=\"left\" width=\"170\" height=\"170\" src=\"./.github/images/burns.gif\" alt=\"Excellent!\"\u003e\n\n## Basic DOM Component Framework\n\n[![Build Status](https://travis-ci.org/vitaly-t/excellent.svg?branch=master)](https://travis-ci.org/vitaly-t/excellent)\n[![Coverage Status](https://coveralls.io/repos/github/vitaly-t/excellent/badge.svg?branch=master)](https://coveralls.io/github/vitaly-t/excellent?branch=master)\n[![Join Chat](https://badges.gitter.im/vitaly-t/excellent.svg)](https://gitter.im/vitaly-t/excellent)\n\nIf you like VanillaJS, and working with DOM directly, this tiny (3Kb gzip) library helps\nwith organizing your code into reusable components. See [WiKi] for details.\n\n\u003cbr/\u003e\n\nYou get the essential _element-to-controllers_ bindings:\n\n```html\n\u003cdiv e-bind=\"awesome, twinkling, message\"\u003e\u003c/div\u003e\n```\n\nThat gives your code isolation and reusability (see [the plunker](http://plnkr.co/edit/60xPj9MiCIbZlfe0Xp2I?p=preview)):\n\n```js\napp.addController('message', function(ctrl) {\n    // this = ctrl\n    // this.node = your DOM element, to work with directly;\n    this.node.innerHTML = 'Awesome twinkling message :)';\n});\n\napp.addController('awesome', function(ctrl) {\n    this.node.className = 'green-box';\n});\n\napp.addController('twinkling', function(ctrl) {\n  var s = this.node.style, a = -0.01;\n  setInterval(function() {\n    a = (s.opacity \u003c 0 || s.opacity \u003e 1) ? -a : a;\n    s.opacity = +s.opacity + a;\n  }, 20);\n});\n```\n\nSuch controllers can easily find each other, either among children, with [EController.find] and [EController.findOne],\nor globally, with [ERoot.find] and [ERoot.findOne], and access methods and properties in found controllers directly:\n\n```js\napp.addController('myCtrl', function(ctrl) {\n    // this = ctrl\n\n    this.onInit = function() {\n        // find one child controller, and call its method:\n        ctrl.findOne('childCtrl').someMethod();\n\n        // find some global controllers, and call a method:\n        app.find('globCtrl').forEach(function(c) {\n            c.someMethod();\n        });\n    };\n});\n```\n\nOr you can alias + configure controllers at the same time (method [addAlias]), without any search.\n\n**Other features include:**\n\n* Global and local dynamic bindings, with [ERoot.bind] and [EController.bind].\n* Controllers can extend / inherit each other's functionality, see [Inheritance].\n* Native ES6 classes can be optionally used as controllers, see [Classes].\n* [Modules] offer greater reusability and simpler distribution of controllers.\n* [Services] share functionality across all controllers.\n* [TypeScript] support right out of the box.\n\nYou can create whole libraries of reusable components that will work with any UI framework, or on their own.\n\n#### Quick Links: \u0026nbsp;[Examples]\u0026nbsp; |\u0026nbsp; [WiKi]\u0026nbsp; |\u0026nbsp; [API]\n\n[API]:https://vitaly-t.github.io/excellent/\n[Examples]:https://github.com/vitaly-t/excellent/wiki/Examples\n[WiKi]:https://github.com/vitaly-t/excellent/wiki\n[Classes]:https://github.com/vitaly-t/excellent/wiki/Classes\n[Modules]:https://github.com/vitaly-t/excellent/wiki/Modules\n[Services]:https://github.com/vitaly-t/excellent/wiki/Services\n[Inheritance]:https://github.com/vitaly-t/excellent/wiki/Inheritance\n[TypeScript]:https://github.com/vitaly-t/excellent/wiki/TypeScript\n\n[EController.find]:https://vitaly-t.github.io/excellent/EController.html#find\n[EController.findOne]:https://vitaly-t.github.io/excellent/EController.html#findOne\n[ERoot.find]:https://vitaly-t.github.io/excellent/ERoot.html#find\n[ERoot.findOne]:https://vitaly-t.github.io/excellent/ERoot.html#findOne\n[ERoot.bind]:https://vitaly-t.github.io/excellent/ERoot.html#bind\n[EController.bind]:https://vitaly-t.github.io/excellent/EController.html#bind\n[addAlias]:https://vitaly-t.github.io/excellent/ERoot.html#addAlias\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvitaly-t%2Fexcellent","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvitaly-t%2Fexcellent","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvitaly-t%2Fexcellent/lists"}