{"id":20762010,"url":"https://github.com/donkeyclip/motorcortex-abstracts","last_synced_at":"2025-04-30T06:28:45.090Z","repository":{"id":37460776,"uuid":"300254117","full_name":"donkeyclip/motorcortex-abstracts","owner":"donkeyclip","description":null,"archived":false,"fork":false,"pushed_at":"2025-04-19T20:29:31.000Z","size":18974,"stargazers_count":0,"open_issues_count":20,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-19T22:04:55.005Z","etag":null,"topics":["abstracts","motorcortex","motorcortex-plugin"],"latest_commit_sha":null,"homepage":"","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/donkeyclip.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":"CODE_OF_CONDUCT.md","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,"zenodo":null}},"created_at":"2020-10-01T11:26:26.000Z","updated_at":"2022-04-01T08:41:48.000Z","dependencies_parsed_at":"2023-02-08T04:46:06.807Z","dependency_job_id":"c090c75a-b70e-476a-b0ea-359ca419dec5","html_url":"https://github.com/donkeyclip/motorcortex-abstracts","commit_stats":{"total_commits":837,"total_committers":14,"mean_commits":"59.785714285714285","dds":0.3882915173237754,"last_synced_commit":"05da0b67162b2f19c899f521cd434b17d6a19926"},"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donkeyclip%2Fmotorcortex-abstracts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donkeyclip%2Fmotorcortex-abstracts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donkeyclip%2Fmotorcortex-abstracts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donkeyclip%2Fmotorcortex-abstracts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/donkeyclip","download_url":"https://codeload.github.com/donkeyclip/motorcortex-abstracts/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250566458,"owners_count":21451231,"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":["abstracts","motorcortex","motorcortex-plugin"],"created_at":"2024-11-17T10:28:38.723Z","updated_at":"2025-04-30T06:28:45.057Z","avatar_url":"https://github.com/donkeyclip.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# MotorCortex-Abstracts\n\n**Table of Contents**\n\n- [MotorCortex-Abstracts](#motorcortex-abstracts)\n  - [Demo](#demo)\n- [Intro / Features](#intro--features)\n- [Getting Started](#getting-started)\n  - [Installation](#installation)\n  - [Importing and Loading](#importing-and-loading)\n- [Creating Incidents](#creating-incidents)\n  - [CrossMoveRight](#crossmoveright)\n  - [CrossMoveRightOutline](#crossmoverightoutline)\n  - [CrossRandom](#crossrandom)\n  - [CrossRowReveal](#crossrowreveal)\n  - [VerticalLinesMove](#verticallinesmove)\n  - [HorizontalLinesMove](#horizontallinesmove)\n  - [CircleExplosion](#circleexplosion)\n  - [CircleBubbleUp](#circlebubbleup)\n  - [Dots](#dots)\n- [Adding Incidents in your clip](#adding-incidents-in-your-clip)\n- [Contributing](#contributing)\n- [License](#license)\n- [Sponsored by](#sponsored-by)\n\n## Demo\n\n[Check it out here](https://donkeyclip.github.io/motorcortex-abstracts/demo/index.html)\n\n# Intro / Features\n\nMotorCortex-Abstracts helps you add cross, line, circle, dot and bubble effects in your clip in an easy way.\n\nThis Plugin exposes nine Incidents:\n- CrossMoveRight\n- CrossMoveRightOutline\n- CrossRandom\n- CrossRowReveal\n- VerticalLinesMove\n- HorizontalLinesMove\n- CircleExplosion\n- CircleBubbleUp\n- Dots\n\n# Getting Started\n\n## Installation\n\n```bash\n$ npm install --save @donkeyclip/motorcortex-abstracts\n# OR\n$ yarn add @donkeyclip/motorcortex-abstracts\n```\n\n## Importing and Loading\n\n```javascript\nimport { loadPlugin } from \"@donkeyclip/motorcortex\";\nimport AbstractsDefinition from \"@donkeyclip/motorcortex-abstracts\";\nconst Plugin = loadPlugin(AbstractsDefinition);\n```\n\n# Creating Incidents\n\n## CrossMoveRight\n\n```javascript\nconst CrossMoveRight = new Plugin.CrossMoveRight(\n  {\n    width: 425,\n    height: 240,\n    crossSize: 30,\n    crossThiknes: 5,\n    travelDistance: 240,\n    items: 3,\n    color: \"#8300ff\",\n  },\n  {\n    selector: \".container1\",\n  }\n);\n```\n\n### CrossMoveRight Attrs\n\n| Name           |                   Are                   |                Values |\n| -------------- | :-------------------------------------: | --------------------: |\n| width          |            width of incident            |                   num |\n| height         |           height of incident            |                   num |\n| crossSize      |        height and width of cross        |                   num |\n| crossThickness |          cross line thickness           |                   num |\n| travelDistance |         how far cross will move         |                   num |\n| items          | how many crosses will be in an incident |                   num |\n| color          |          color of the crosses           | hex,rgb or color name |\n\n## CrossMoveRightOutline\n\n```javascript\nconst CrossMoveRightOutline = new Plugin.CrossMoveRightOutline(\n  {\n    width: 425,\n    height: 240,\n    crossSize: 30,\n    travelDistance: 240,\n    steps: 5,\n    color: \"#8300ff\",\n  },\n  {\n    selector: \".container2\",\n  }\n);\n```\n\n### CrossMoveRightOutline Attrs\n\n| Name           |                       Are                       |                Values |\n| -------------- | :---------------------------------------------: | --------------------: |\n| width          |                width of incident                |                   num |\n| height         |               height of incident                |                   num |\n| crossSize      |            height and width of cross            |                   num |\n| travelDistance |             how far cross will move             |                   num |\n| steps          | how many steps will cross make to reach the end |                   num |\n| color          |              color of the crosses               | hex,rgb or color name |\n\n## CrossRandom\n\n```javascript\nconst CrossRandom = new Plugin.CrossRandom(\n  {\n    width: 425,\n    crossSize: 30,\n    crossThickness: 5,\n    items: 12,\n    color: \"#8300ff\",\n    rows: 3,\n    timing: 0.5,\n  },\n  {\n    selector: \".container3\",\n  }\n);\n```\n\n### CrossRandom Attrs\n\n| Name           |              Are               |                Values |\n| -------------- | :----------------------------: | --------------------: |\n| width          |       width of incident        |                   num |\n| crossSize      |   height and width of cross    |                   num |\n| crossThickness |      cross line thickness      |                   num |\n| items          |     how many cross will be     |                   num |\n| color          |      color of the crosses      | hex,rgb or color name |\n| rows           | how many rows of cross will be |                   num |\n| timing         |  incident duration multiplier  |                   num |\n\n## CrossRowReveal\n\n```javascript\nconst CrossRowReveal = new Plugin.CrossRowReveal(\n  {\n    width: 425,\n    crossSize: 30,\n    crossThickness: 5,\n    items: 8,\n    color: \"#8300ff\",\n    reverse: false,\n    timing: 1,\n  },\n  {\n    selector: \".container9\",\n  }\n);\n```\n\n### CrossRowReveal Attrs\n\n| Name           |                              Are                               |                Values |\n| -------------- | :------------------------------------------------------------: | --------------------: |\n| width          |                       width of incident                        |                   num |\n| height         |                       height of incident                       |                   num |\n| crossSize      |                   height and width of cross                    |                   num |\n| crossThickness |                      cross line thickness                      |                   num |\n| items          |            how many crosses will be in an incident             |                   num |\n| color          |                      color of the crosses                      | hex,rgb or color name |\n| reverse        | if crosses will be revealed from left to right or the opposite |               boolean |\n| timing         |                  incident duration multiplier                  |                   num |\n\n## VerticalLinesMove\n\n```javascript\nconst VerticalLinesMove = new Plugin.VerticalLinesMove(\n  {\n    width: 425,\n    height: 240,\n    maxLineWidth: 250,\n    color: \"#8300ff\",\n  },\n  {\n    selector: \".container4\",\n  }\n);\n```\n\n### VerticalLinesMove Attrs\n\n| Name         |             Are             |                Values |\n| ------------ | :-------------------------: | --------------------: |\n| width        |      width of incident      |                   num |\n| height       |     height of incident      |                   num |\n| maxLineWidth | the maximum width of a line |                   num |\n| color        |    color of the crosses     | hex,rgb or color name |\n\n## HorizontalLinesMove\n\n```javascript\nconst HorizontalLinesMove = new Plugin.HorizontalLinesMove(\n  {\n    width: 425,\n    height: 240,\n    maxLineHeight: 50,\n    color: \"#8300ff\",\n  },\n  {\n    selector: \".container7\",\n  }\n);\n```\n\n### HorizontalLinesMove Attrs\n\n| Name         |             Are             |                Values |\n| ------------ | :-------------------------: | --------------------: |\n| width        |      width of incident      |                   num |\n| height       |     height of incident      |                   num |\n| maxLineWidth | the maximum width of a line |                   num |\n| color        |    color of the crosses     | hex,rgb or color name |\n\n## CircleExplosion\n\n```javascript\nconst CircleExplosion = new Plugin.CircleExplosion(\n  {\n    width: 425,\n    height: 240,\n    maxCirlcleSize: 30,\n    travelDistance: 200,\n    color: \"#8300ff\",\n    items: 5,\n    minR: 0,\n    maxR: 180,\n    border: true,\n  },\n  {\n    selector: \".container5\",\n  }\n);\n```\n\n### CircleExplosion Attrs\n\n| Name           |                      Are                      |                Values |\n| -------------- | :-------------------------------------------: | --------------------: |\n| width          |               width of incident               |                   num |\n| height         |              height of incident               |                   num |\n| maxCirlcleSize |         the maximum size of a circle          |                   num |\n| travelDistance |            how far cross will move            |                   num |\n| color          |             color of the crosses              | hex,rgb or color name |\n| items          |           how many circles will be            |                   num |\n| minR           | indicate the minimum angle of circle movement |                   num |\n| maxR           | indicate the maximum angle of circle movement |                   num |\n| border         |           if circle will be hollow            |               boolean |\n\n## CircleBubbleUp\n\n```javascript\nconst CircleBubbleUp = new Plugin.CircleBubbleUp(\n  {\n    width: 425,\n    height: 240,\n    maxCirlcleSize: 30,\n    travelDistance: 200,\n    color: \"#8300ff\",\n    items: 5,\n    border: true,\n  },\n  {\n    selector: \".container6\",\n  }\n);\n```\n\n### CircleBubbleUp Attrs\n\n| Name           |             Are              |                Values |\n| -------------- | :--------------------------: | --------------------: |\n| width          |      width of incident       |                   num |\n| height         |      height of incident      |                   num |\n| maxCirlcleSize | the maximum size of a circle |                   num |\n| travelDistance |   how far cross will move    |                   num |\n| color          |     color of the crosses     | hex,rgb or color name |\n| items          |   how many circles will be   |                   num |\n| border         |   if circle will be hollow   |               boolean |\n\n## Dots\n\n```javascript\nconst Dots = new Plugin.Dots(\n  {\n    width: 425,\n    dotSize: 10,\n    items: 28,\n    color: \"#8300ff\",\n    rowGap: 30,\n    columnGap: 50,\n    rows: 7,\n    timing: 1.5,\n    repeats: 3,\n  },\n  {\n    selector: \".container8\",\n  }\n);\n```\n\n### Dots Attrs\n\n| Name      |                 Are                  |                Values |\n| --------- | :----------------------------------: | --------------------: |\n| width     |          width of incident           |                   num |\n| height    |          height of incident          |                   num |\n| dotSize   |          the size of a dots          |                   num |\n| color     |         color of the crosses         | hex,rgb or color name |\n| rowGap    |  the gap between every row of dots   |                   num |\n| columnGap | the gap between every column of dots |                   num |\n| items     |        how many dots will be         |                   num |\n| rows      |    how many rows of dots will be     |                   num |\n| timing    |     incident duration multiplier     |                   num |\n| repeats   | how many times dots will be flashing |                   num |\n\n# Adding Incidents in your clip\n\n```javascript\nclipName.addIncident(incidentName,startTime);\n```\n\n# Contributing \n\nIn general, we follow the \"fork-and-pull\" Git workflow, so if you want to submit patches and additions you should follow the next steps:\n1.\t**Fork** the repo on GitHub\n2.\t**Clone** the project to your own machine\n3.\t**Commit** changes to your own branch\n4.\t**Push** your work back up to your fork\n5.\tSubmit a **Pull request** so that we can review your changes\n\n# License\n\n[MIT License](https://opensource.org/licenses/MIT)\n\n# Sponsored by\n[\u003cimg src=\"https://presskit.donkeyclip.com/logos/donkey%20clip%20logo.svg\" width=250\u003e\u003c/img\u003e](https://donkeyclip.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdonkeyclip%2Fmotorcortex-abstracts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdonkeyclip%2Fmotorcortex-abstracts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdonkeyclip%2Fmotorcortex-abstracts/lists"}