{"id":13447131,"url":"https://github.com/catc/displace","last_synced_at":"2025-03-21T17:30:50.072Z","repository":{"id":44100862,"uuid":"67537469","full_name":"catc/displace","owner":"catc","description":"Minimal javascript library for creating movable DOM elements","archived":false,"fork":false,"pushed_at":"2022-12-06T17:17:08.000Z","size":1214,"stargazers_count":134,"open_issues_count":14,"forks_count":23,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-03-02T05:56:31.354Z","etag":null,"topics":["drag","minimal-javascript-library","move","moveable-dom","touch-event"],"latest_commit_sha":null,"homepage":"https://catc.github.io/displace","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/catc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-09-06T18:53:49.000Z","updated_at":"2024-10-06T20:55:37.000Z","dependencies_parsed_at":"2023-01-23T11:00:13.349Z","dependency_job_id":null,"html_url":"https://github.com/catc/displace","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/catc%2Fdisplace","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/catc%2Fdisplace/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/catc%2Fdisplace/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/catc%2Fdisplace/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/catc","download_url":"https://codeload.github.com/catc/displace/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244838052,"owners_count":20518776,"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":["drag","minimal-javascript-library","move","moveable-dom","touch-event"],"created_at":"2024-07-31T05:01:09.032Z","updated_at":"2025-03-21T17:30:49.665Z","avatar_url":"https://github.com/catc.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"\u003c!--\nTODO\n- add eslint + prettier autofix\n- update webpack\n--\u003e\n\n# displace.js\n\nA minimal javascript library to enable moveable DOM elements.\n- ~1.2kb gzipped\n- supports mobile touch\n- no dependencies/bloat\n- IE9+\n\n## Getting started\n#### Reference\nInstall via npm:\n\n```sh\nnpm install --save displacejs\n```\n\nReference `displace.min.js` and use via `displace`:\n```javascript\n// es6\nimport displace from 'displacejs';\n\n// commonjs\nlet displace = require('displace');\n\n// if using globally in browser\nconst displace = window.displacejs;\n```\n\n#### Initialize\nInitialize and use:\n```javascript\n// initial\nconst d = displace(document.querySelector('.some-div'), options);\n```\n\n## API\n\n### Methods\n#### `displace(element, options)`\nCreates a new displace instance with a DOM element. For options, see [below](#options).\n\n#### `reinit()`\nRuns setup again. Useful when divs have been moved or resized.\n\n#### `displace.destroy()`\nRemoves event listeners and destroys instance.\n\n\u003cbr\u003e\n\n### Options\n#### `constrain`\nConstrains element to its parent container\n##### Default: `false`\n\n#### `relativeTo`\nConstrains element to the specified DOM element. Requires `constrain` to be `true`.\n##### Default: `null`\n\n#### `handle`\nAssigns a child element as the moveable handle for the parent element.\n##### Default: `null`\n\n#### `highlightInputs`\nAllows you to highlight text in inputs and textareas by disabling drag events originating from those elements.\n##### Default: `false`\n\n#### `ignoreFn`\nFunction that allows you to prevent dragging from an event. If the function returns true, the event will be ignored.\n##### Default: `null`\n\n\u003cbr\u003e\n\n#### `onMouseDown`\nFunction that is triggered when user clicks down on moveable element.\n##### Default: `null`\n\n#### `onMouseMove`\nFunction that is triggered when user moves element.\n##### Default: `null`\n\n#### `onMouseUp`\nFunction that is triggered when user clicks up on moveable element.\n##### Default: `null`\n\n#### `onTouchStart`\nFunction that is triggered when initiates touch event.\n##### Default: `null`\n\n#### `onTouchMove`\nFunction that is triggered when moves element during touch event.\n##### Default: `null`\n\n#### `onTouchStop`\nFunction that is triggered when user ends touch event.\n##### Default: `null`\n\n\u003cbr\u003e\n\n#### `customMove`\nFunction that can be used to override how x and y are being set on the displaced element on move.\n##### Default: `null`\n\n## Development\nClone the repo and `npm install`. Available `npm` scripts are:\n- build library: `lib-build`\n- library development (watch src files and build on change): `lib-dev`\n- docs development (port 3001): `docs-dev`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcatc%2Fdisplace","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcatc%2Fdisplace","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcatc%2Fdisplace/lists"}