Skip to content

Commit 3fc1a6b

Browse files
committed
[#1] Slushed the repository
Detail |-- Added standard repository files using slush generator
1 parent 7479bc0 commit 3fc1a6b

File tree

8 files changed

+263
-0
lines changed

8 files changed

+263
-0
lines changed

.editorconfig

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# EditorConfig helps developers define and maintain consistent
2+
# coding styles between different editors and IDEs
3+
# http://editorconfig.org
4+
5+
root = true
6+
7+
[*]
8+
# Change these settings to your own preference
9+
indent_style = space
10+
indent_size = 4
11+
12+
# We recommend you to keep these unchanged
13+
end_of_line = lf
14+
charset = utf-8
15+
trim_trailing_whitespace = true
16+
insert_final_newline = true
17+
18+
[*.md]
19+
trim_trailing_whitespace = false

.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
bower_components/
2+
node_modules/
3+
.tmp/

README.md

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
# <x-carousel>
2+
3+
> My awesome Custom Element
4+
5+
## Demo
6+
7+
[Check it live!](http://Nevraeka.github.io/x-carousel)
8+
9+
## Install
10+
11+
Install the component using [Bower](http://bower.io/):
12+
13+
```sh
14+
$ bower install x-carousel --save
15+
```
16+
17+
Or [download as ZIP](https://github.com/Nevraeka/x-carousel/archive/master.zip).
18+
19+
## Usage
20+
21+
1. Import Web Components' polyfill:
22+
23+
```html
24+
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
25+
```
26+
27+
2. Import Custom Element:
28+
29+
```html
30+
<link rel="import" href="bower_components/x-carousel/dist/x-carousel.html">
31+
```
32+
33+
3. Start using it!
34+
35+
```html
36+
<x-carousel></x-carousel>
37+
```
38+
39+
## Options
40+
41+
Attribute | Options | Default | Description
42+
--- | --- | --- | ---
43+
`foo` | *string* | `bar` | Lorem ipsum dolor.
44+
45+
## Methods
46+
47+
Method | Parameters | Returns | Description
48+
--- | --- | --- | ---
49+
`unicorn()` | None. | Nothing. | Magic stuff appears.
50+
51+
## Events
52+
53+
Event | Description
54+
--- | ---
55+
`onsomething` | Triggers when something happens.
56+
57+
## Development
58+
59+
In order to run it locally you'll need to fetch some dependencies and a basic server setup.
60+
61+
* Install [Bower](http://bower.io/) & [Gulp](http://gulpjs.com/):
62+
63+
```sh
64+
$ [sudo] npm install -g bower gulp
65+
```
66+
67+
* Install local dependencies:
68+
69+
```sh
70+
$ bower install && npm install
71+
```
72+
73+
* To test your project, start the development server and open `http://localhost:8000`.
74+
75+
```sh
76+
$ gulp server
77+
```
78+
79+
* To build the distribution files before releasing a new version.
80+
81+
```sh
82+
$ gulp build
83+
```
84+
85+
* To provide a live demo, send everything to `gh-pages` branch.
86+
87+
```sh
88+
$ gulp deploy
89+
```
90+
91+
## Contributing
92+
93+
1. Fork it!
94+
2. Create your feature branch: `git checkout -b my-new-feature`
95+
3. Commit your changes: `git commit -m 'Add some feature'`
96+
4. Push to the branch: `git push origin my-new-feature`
97+
5. Submit a pull request :D
98+
99+
## History
100+
101+
For detailed changelog, check [Releases](https://github.com/Nevraeka/x-carousel/releases).
102+
103+
## License
104+
105+
[MIT License](http://opensource.org/licenses/MIT)

bower.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"name": "x-carousel",
3+
"version": "0.0.0",
4+
"description": "My awesome Custom Element",
5+
"license": "MIT",
6+
"main": "dist/x-carousel.html",
7+
"keywords": [
8+
"x-tag",
9+
"web-components"
10+
],
11+
"ignore": [
12+
"**/.*",
13+
"node_modules",
14+
"bower_components"
15+
],
16+
"dependencies": {
17+
"x-tag-core": "^1.0.0",
18+
"webcomponentsjs": "^0.5.1"
19+
}
20+
}

gulpfile.js

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
var gulp = require('gulp');
2+
var connect = require('gulp-connect-multi')();
3+
var replace = require('gulp-replace');
4+
var ghpages = require('gh-pages');
5+
var clean = require('gulp-clean');
6+
var path = require('path');
7+
8+
var copy = function (){
9+
gulp.src([
10+
'bower_components/**/*',
11+
'demo/*',
12+
'src/*',
13+
'index.html'
14+
], {
15+
base: './'
16+
})
17+
.pipe(gulp.dest('./.tmp/'));
18+
}
19+
20+
var build = function (){
21+
gulp.src(['src/*'])
22+
.pipe(replace(/bower_components/g, '..'))
23+
.pipe(gulp.dest('dist/'));
24+
}
25+
var ignore = function (){
26+
gulp.src(['./.tmp/bower_components/x-carousel'])
27+
.pipe(clean());
28+
}
29+
30+
gulp.task('server', connect.server({
31+
root: [__dirname],
32+
port: 8000,
33+
livereload: true
34+
}));
35+
36+
gulp.task('build', ['beforebuild'],function(){
37+
build()
38+
});
39+
gulp.task('beforebuild', function(){
40+
copy()
41+
ignore()
42+
});
43+
44+
gulp.task('deploy', ['beforebuild'], function () {
45+
46+
ghpages.publish(path.join(__dirname, '.tmp/'), {
47+
clone: 'bower_components/x-carousel',
48+
logger: function(message) {
49+
console.log(message);
50+
}
51+
} , function(err) {
52+
53+
console.log("");
54+
if(err.errno == 34){
55+
console.log("Error: You need run 'gulp build' before deploy your custom element in gh-pages.\n");
56+
} else if(typeof err.errno == "undefined"){
57+
console.log("Error: You need add a remote repository before deploy your custom element in gh-pages.\n");
58+
}
59+
60+
}, true);
61+
62+
});

index.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>&lt;x-carousel&gt;</title>
6+
7+
<!-- Importing Web Component's Polyfill -->
8+
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
9+
10+
<!-- Importing Custom Elements -->
11+
<link rel="import" href="src/x-carousel.html">
12+
</head>
13+
<body>
14+
15+
<!-- Using Custom Elements -->
16+
<x-carousel></x-carousel>
17+
18+
</body>
19+
</html>

package.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"private": true,
3+
"devDependencies": {
4+
"gulp": "^3.8.7",
5+
"gulp-replace": "^0.4.0",
6+
"gulp-connect-multi": "^1.0.8",
7+
"gulp-clean": "^0.3.1",
8+
"gh-pages": "^0.2.0"
9+
}
10+
}

src/x-carousel.html

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!-- Import X-Tag -->
2+
<script src="../bower_components/x-tag-core/src/core.js"></script>
3+
4+
<script>
5+
(function() {
6+
xtag.register('x-carousel', {
7+
lifecycle: {
8+
// Fires when an instance of the element is created
9+
created: function() {},
10+
11+
// Fires when an instance was inserted into the document
12+
inserted: function() {},
13+
14+
// Fires when an instance was removed from the document
15+
removed: function() {},
16+
17+
// Fires when an attribute was added, removed, or updated
18+
attributeChanged: function(attr, oldVal, newVal) {}
19+
},
20+
events: {},
21+
accessors: {},
22+
methods: {}
23+
});
24+
}());
25+
</script>

0 commit comments

Comments
 (0)