• Stars
    star
    1,051
  • Rank 43,859 (Top 0.9 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 11 years ago
  • Updated over 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Drag-based vanilla JS component

Dragdealer.js Build Status

Drag-based JavaScript component, embracing endless UI solutions

Specs & (sweet) demos: http://skidding.github.io/dragdealer

Install

The basic way to install Dragdealer is to include the minified script into your web page.

You can check the examples to see how you can add a particular slider from the demo to your own project.

Node package

It can also be installed through npm, using something like browserify.

var Dragdealer = require('dragdealer').Dragdealer;

Running tests

Dragdealer has CI set up through Travis CI and Sauce Labs (who both offer their outstanding services for free to open-source projects.) Any pull-request will be tested automatically after each commit.

You can also run the tests by hand, of course.

Fire up the browser

Just load index.html in a browser of choice and pull the top slider to the right or access URL with the /#runner hashtag directly. Example: http://skidding.github.io/dragdealer/#runner

You can start a web server using the ./node_modules/.bin/grunt dev task, which will make the project available at localhost:9999

Sauce Labs and PhantomJS

Run the ./node_modules/.bin/grunt test grunt task to run the tests from the terminal.

If you have SauceLabs credentials (SAUCE_USERNAME and SAUCE_ACCESS_KEY), tests will run there, otherwise the task will fall back to PhantomJS. You can also force grunt to run the tests one way or the other using the test-phantomjs and test-saucelabs tasks.

Minifying

node_modules/.bin/uglifyjs src/dragdealer.js -o src/dragdealer.min.js

Make sure you ran npm install in the project directory first. Also, you can use global paths if you have the npm modules installed globally (-g), but you shouldn't need to.

Contributing

There's no contributing guide so far, but you're more than welcome to start a discussion.

More Repositories

1

illustrated-algorithms

Interactive algorithm visualizations
JavaScript
2,770
star
2

flatris

Fast-paced two-player web game
JavaScript
1,446
star
3

jobs-done

Ritual app for ending the work day inspired by Deep Work
JavaScript
943
star
4

react-testing-examples

Searchable library of React testing examples
JavaScript
387
star
5

react-mock

Declarative mocks for React state and global APIs
JavaScript
368
star
6

react-component-tree

Serialize and reproduce the state of an entire tree of React components.
JavaScript
87
star
7

aufond

A résumé for the modern age
JavaScript
77
star
8

react-component-playground

Minimal frame for loading and testing React components in isolation.
JavaScript
76
star
9

obvious-buttons

Almost flat CSS buttons
CSS
62
star
10

babel-plugin-trace-execution

Trace execution context of JS functions
JavaScript
61
star
11

async-hacker-handbook

The Asynchronous Hacker Handbook
35
star
12

github-issue-template

BDD Issue Template for Github (with Chrome Extension)
JavaScript
18
star
13

chrome-imdb-ratings

Chrome extension for displaying IMDB ratings in listings
JavaScript
16
star
14

async-until

Wait until a given callback returns true
TypeScript
10
star
15

cosmos-example

Example of loading components and fixtures using Cosmos.
JavaScript
10
star
16

react-data-fetch

A good-enough data fetching mixin for React components.
JavaScript
8
star
17

react-querystring-router

Bare router for React components, using query string as props.
JavaScript
8
star
18

play

Agnostic frame-skipping animation library
JavaScript
6
star
19

react-redux-layout

Unleash your creativity with dynamic layouts!
JavaScript
4
star
20

react-cosmos-redux

Redux mock for React Cosmos fixtures
TypeScript
4
star
21

chrome-hide-facebook-sponsored-posts

A Chrome extension for automatically hiding sponsored posts from your Facebook News Feed.
JavaScript
4
star
22

ui-development-made-simple

My JSHeroes talk on how to build a scalable UI architecture
JavaScript
4
star
23

gutenHashTag

Dynamic Twitter background
PHP
3
star
24

mode

A node.js web framework for real-world applications
JavaScript
3
star
25

stoic-guide-to-good-life

Notes from William B. Irvine's book, A Guide to the Good Life: The Ancient Art of Stoic Joy.
3
star
26

berlinjs-2017

Code used for my BerlinJS talk
JavaScript
2
star
27

hacker-comments

A browser hack for hackers
JavaScript
2
star
28

react-animation-loop

React mixin for running a callback at 60fps with frame skipping
JavaScript
2
star
29

react-test-useeffect

JavaScript
2
star
30

react-testing-talk

Slides and resources for my React testing talk
JavaScript
2
star
31

linked-list

Turn an array into a stateless linked list
TypeScript
2
star
32

react-plugin

API for composable 3rd party React plugins
TypeScript
1
star
33

YOH2011

1
star
34

flux-dispatcher-game

Fun with Flux
CSS
1
star
35

chrome-mozaic-profiler

JavaScript
1
star
36

after-pending-promises

Wait for pending promises to resolve
JavaScript
1
star
37

jLaid

JavaScript
1
star
38

async-retry

Wait until cb doesn't throw or time out
TypeScript
1
star