{"id":16537315,"url":"https://github.com/harry-sm/core","last_synced_at":"2026-05-30T20:31:00.631Z","repository":{"id":124699436,"uuid":"111473265","full_name":"harry-sm/CORE","owner":"harry-sm","description":"Core is a modular, scalable and concise frontend framework.","archived":false,"fork":false,"pushed_at":"2017-12-03T16:37:27.000Z","size":36,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-03T18:39:15.411Z","etag":null,"topics":["browser","framework","frontend","javascript","library","modular"],"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/harry-sm.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-11-20T23:16:14.000Z","updated_at":"2017-11-21T02:21:18.000Z","dependencies_parsed_at":null,"dependency_job_id":"e68dd0ce-fa20-48d0-bf4a-f6cdd18542bd","html_url":"https://github.com/harry-sm/CORE","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/harry-sm/CORE","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harry-sm%2FCORE","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harry-sm%2FCORE/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harry-sm%2FCORE/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harry-sm%2FCORE/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/harry-sm","download_url":"https://codeload.github.com/harry-sm/CORE/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harry-sm%2FCORE/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33709269,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-05-30T02:00:06.278Z","response_time":92,"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":["browser","framework","frontend","javascript","library","modular"],"created_at":"2024-10-11T18:35:27.917Z","updated_at":"2026-05-30T20:31:00.600Z","avatar_url":"https://github.com/harry-sm.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# CORE\n\nCore is a modular, scalable and concise frontend framework. It's main purpose is to manage modules, plugins and extensions. It ensures loose coupling of components and allows for the use whatever communication system you want; however, one is provide in the extras folder.\n\n### Advance Usage\n\nFetch the project via git:\n\n`git clone https://github.com/harry-sm/CORE.git`\n\nInclude in your project\n\n```html\n\u003cscript src=\"\u003cpath\u003e/core.js\"\u003e\u003c/script\u003e\n```\n\n```html\n\u003cscript src=\"\u003cpath\u003e/extensions.js\"\u003e\u003c/script\u003e\n```\n\nThis library uses a variant of the naming convention known as [Hungarian Notation](https://en.wikipedia.org/wiki/Hungarian_notation) for variable names. Simply put the variable name is prefixed with the first letter of the data type that the variable is.\n\n| Prefix | Data Type  | Example  |\n| ------ | ---------- | -------- |\n| s      | string     | sData    |\n| n      | number     | nData    |\n| a      | array      | aData    |\n| o      | object     | oData    |\n| $      | DOM object | $element |\n\n### Browser Support\n\n- IE9+\n- Chrome\n- Firefox\n\nThe parameter `$`  used in the factory functions contains the DOM element that corresponds with the module ID and other module data along with the methods for any extensions and plugins specified.  All dependencies are injected into each component when they are instantiated.\n\n\u003e **NOTE: ** All modules are connected to a DOM element.\n\n| Parameter(object) | Defaults                  | Type             | Description                              |\n| ----------------- | ------------------------- | ---------------- | ---------------------------------------- |\n| $                 | domEl                     | [HTMLCollection] | The corresponding DOM element of the module name. |\n|                   | find(sEl)                 | function         | Gets the descendants of the module DOM element that matches the query. |\n|                   | length                    | number           | The number of elements that was returned from the DOM query. |\n|                   | moduleIdentifier          | string           | The name of the module.                  |\n|                   | plugin( sPluginID, oData) | function         | Initialize any the plugin specified.     |\n\n#### $.find(sEl)\n\n| Parameter | Type   | Example               | Description                              |\n| --------- | ------ | --------------------- | ---------------------------------------- |\n| sEl       | string | '#id' of '.classname' | The selector string that will be queried against the DOM elements. |\n\n\n\n#### $.plugin( sPluginID, oData)\n\n| Parameter | Type   | Example     | Description                              |\n| --------- | ------ | ----------- | ---------------------------------------- |\n| sPluginID | string | 'accordion' | The name of the plugin.                  |\n| oData     | object | {data}      | The data should be provided upon initialization of the plugin. |\n\n\n\n## Module Methods\n\n### CORE.module.create(sModuleID, aExtensions, fFn, aPlugins)\n\nThis factory function registers a new module to CORE module management system.\n\n#### Parameters\n\n| Parameter   | Type     | Example              | Description                              |\n| ----------- | -------- | -------------------- | ---------------------------------------- |\n| sModuleID   | string   | '#foo'               | The module name which is use to query the DOM for corresponding element with an ID with the same name. |\n| aExtensions | [string] | ['dom']              | An array containing the extension IDs of the module's dependencies. |\n| fFn         | function | function ($) { ... } | The function that contains the implementation details of the module. |\n| aPlugins    | [string] | ['myPlugin']         | An array containing the plugin IDs of the module's dependencies. |\n\n#### Return Type\n\n`void`\n\n#### Example\n\n```js\nCORE.module.create('#foo', ['dom'], function ($) {\n\tvar $childElement = $.find('#foo-child');\n  \n    return {\n        init: function() {\n            $.plugin('plugin', $);\n        },\n        destroy: function () {\n          //body\n        }\n    };\n}, ['plugin']);\n```\n\n```html\n\u003cdiv id=\"foo\"\u003e\n  ...\n\u003c/div\u003e\n```\n\n\n\n### CORE.module.start( sModuleID, oData )\nStarts the module by creating a new instance of it.\n\n#### Parameters\n\n| Parameter | Type   | Example                     | Description                              |\n| --------- | ------ | --------------------------- | ---------------------------------------- |\n| sModuleID | string | '#foo'                      | The name of the module that should be instantiated. |\n| oData     | object | {\u003cbr /\u003ename: 'Harry'\u003cbr /\u003e} | Any data that should be consumes upon the module instantiation. The data is passed to the `init()` function of the module and is optional. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.module.start('#foo');\n```\n\n### CORE.module.stop( sModuleID )\nStops the module by calling the destroy method and removing the instance from CORE.\n\n#### Parameters\n\n| Parameter | Type   | Example | Description                              |\n| --------- | ------ | ------- | ---------------------------------------- |\n| sModuleID | string | '#foo'  | The name of the module instance that should be destroyed. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.module.stop('#foo');\n```\n\n\n\n### CORE.module.startAll( aExcept )\nStart all modules except the ones specified.\n\n#### Parameters\n\n| Parameter | Type     | Example  | Description                              |\n| --------- | -------- | -------- | ---------------------------------------- |\n| aExcept   | [string] | ['#bar'] | An array containing all the module IDs that should be instantiated. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.module.startAll();\n```\n\n\n\n### CORE.module.stopAll( aExcept )\nStop all modules except the ones specified.\n\n#### Parameters\n\n| Parameter | Type     | Example  | Description                              |\n| --------- | -------- | -------- | ---------------------------------------- |\n| aExcept   | [string] | ['#foo'] | An array containing all the module IDs that should not be instantiated. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.module.stopAll(['#foo']);\n```\n\n\n\n### CORE.module.restart( aModuleID )\n\nStops and then  starts modules.\n\n#### Parameters\n\n| Parameter | Type     | Example  | Description                              |\n| --------- | -------- | -------- | ---------------------------------------- |\n| aModuleID | [string] | ['#foo'] | The name of the module that should be restarted. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.module.restart(['#foo']);\n```\n\n\n\n## Plugins\nPlugins are reuseable behaviours that are used within the app, such as sliders, accordion and carousels.\n\n\n### CORE.plugin.create( sPluginID, aExtensions, fFn )\nRegisters plugins to CORE.\n\n#### Parameters\n\n| Parameter   | Type     | Example              | Description                              |\n| ----------- | -------- | -------------------- | ---------------------------------------- |\n| sPluginID   | string   | 'accordion'          | The name of the plugin. This should be unique. |\n| aExtensions | [string] | ['dom', 'events']    | An array containing the extension IDs of the module's dependencies. |\n| fFn         | function | function ($) { ... } | The function that contains the implementation details of the plugin. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.plugin.create('accordion', ['dom', 'events'], function( $ ) {\n\tvar\n\t\tnPrev,\n\t\tnIdx,\n\t\t_$elem,\n\t\t$accordionBtns\n\t;\n\n\tfunction selectAccordionContent (){\n\t\tnIdx = $.dom.index(this, $accordionBtns);\n\n\t\tif(nPrev === nIdx){\n\t\t\t$.dom.removeClass('current', $accordionBtns[nIdx]);\n\t\t\tnPrev = null;\n\t\t\treturn;\n\t\t}\n\t\t$.dom.removeClass('current', $accordionBtns);\n\t\t$.dom.addClass('current', $accordionBtns[nIdx]);\n\n\t\tnPrev = nIdx;\n\t}\n\treturn {\n\t\tinit: function ($elem){\n\t\t\t_$elem = $elem;\n\t\t\t$accordionBtns = _$elem.find('.accordion-btn');\n\n\t\t\t$.events.on(_$elem, 'click', '.accordion-btn', selectAccordionContent);\n\t\t},\n\t\tdestroy: function (){\n\t\t\t$.events.off(_$elem, 'click', '.accordion-btn', selectAccordionContent);\n\t\t}\n\t};\n});\n```\n\n\n\n#### Usage\n\n```html\n\u003cdiv id=\"accordian-element\" class=\"accordion\"\u003e\n    \u003cdiv class=\"accordion-btn\"\u003eAccordian 1\u003c/div\u003e\n    \u003cdiv class=\"accordion-content\"\u003e\n        \u003cdiv\u003e\n            Content 1\n        \u003c/div\u003e\n    \u003c/div\u003e\n    \u003cdiv class=\"accordion-btn\"\u003eAccordian 2\u003c/div\u003e\n    \u003cdiv class=\"accordion-content\"\u003e\n        \u003cdiv\u003e\n            Content 2\n        \u003c/div\u003e\n    \u003c/div\u003e\n\u003c/div\u003e\n```\n\n```js\nCORE.module.create('#accordian-element', ['dom'], function ($) {\t\n\treturn {\n\t\tinit: function() {\n\t\t\t$.plugin('accordion', $);\n\t\t},\n\t\tdestroy: function () {\n\t\t\tthis.plugin = null;\n\t\t}\n\t};\n\n}, ['accordion']);\n```\n\n\n\n## Extensions\n\nExtensions are third party functionality you want to inject into the module, such as DOM manipulation, DOM events and a messaging system like a mediator.\n\n\n### CORE.extension.create( sExtensionID, fFn )\nRegisters extensions to CORE.\n\n#### Parameters\n\n| Parameter    | Type     | Example              | Description                              |\n| ------------ | -------- | -------------------- | ---------------------------------------- |\n| sExtensionID | string   | 'dom'                | The name of the extension. This should be unique. |\n| fFn          | function | function ($) { ... } | The function that contains the implementation details of the extension. |\n\n#### Return Type\n`void`\n\n#### Example\n```js\nCORE.extension.create('dom', function ( oData ){\n\treturn {\n\t\taddClass: function (sClassName, $el) {\n            // body\n\t\t},\n\t\tremoveClass: function (sClassName, $el) {\n\t\t\t// body\n\t\t},\n\t\ttoggleClass: function (sClassName, $el) {\n\t\t\t// body\n\t\t},\n\t\thasClass: function (sClassName, $el) {\n\t\t\t// body\n\t\t},\n\t\t...\n\t};\n});\n```\n\n#### Usage\n\n```js\nCORE.module.create('#elem', ['dom'], function ($) {\n\treturn {\n\t\tinit: function() {\n            // adds css class hide to it's dom element.\n\t\t\t$.dom.addClass('.hide', $);\n\t\t},\n\t\tdestroy: function () {\n\t\t}\n\t};\n\n});\n```\n\n\n\n## CORE\n\n#### CORE.debug( bOption )\n\nLogs warnings and errors about CORE's internal operations  to the console. Default value: **true**\n\n#### Parameters\n\n| Parameter | Type    | Example | Description                   |\n| --------- | ------- | ------- | ----------------------------- |\n| bOption   | boolean | true    | Enable or disable debug mode. |\n\n#### Return Type\n\n`void`\n\n#### Example\n\n```js\nCORE.debug(true)\n```\n\n\n\n#### CORE.log( nSeverity, sMsg )\n\nPrints message to the console.\n\n#### Parameters\n\n| Parameter | Type   | Example             | Description                              |\n| --------- | ------ | ------------------- | ---------------------------------------- |\n| nSeverity | number | 2                   | Specifies the type of message that will be logged to the console. Options:\u003cbr /\u003e1: INFO\u003cbr /\u003e2: WARNING\u003cbr /\u003e3: ERROR |\n| sMsg      | string | 'This is a warning' | The message that should be logged to the console. |\n\n#### Return Type\n\n`void`\n\n#### Example\n\n```js\nCORE.log(1, 'Normal message');\nCORE.log(2, 'Warning message');\nCORE.log(1, 'Error message');\n```\n\n\n\n#### CORE.extend( sExtensionID, fFn )\n\nExtend adds additional functionality you want to the CORE object.\n\n#### Parameters\n\n| Parameter    | Type     | Example              | Description                              |\n| ------------ | -------- | -------------------- | ---------------------------------------- |\n| sExtensionID | string   | 'dom'                | The name of the extension. This should be unique. |\n| fFn          | function | function ($) { ... } | The function that contains the implementation details of the extension. |\n\n#### Return Type\n\n`void`\n\n#### Example\n\n```js\nCORE.extend('anything', function (){\n\t\treturn {\n\t\t\tmethod: function (arg){\n\t\t\t\t// body\n\t\t\t}\n\t\t};\n\t});\n```\n\n#### Usage\n\n```js\nCORE.anything.method(data);\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharry-sm%2Fcore","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fharry-sm%2Fcore","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharry-sm%2Fcore/lists"}