Skip to content

Commit

Permalink
updated readme,fix the npm modules bugs
Browse files Browse the repository at this point in the history
  • Loading branch information
DomonJi committed Sep 25, 2016
1 parent a4742e1 commit 0ac2dfc
Show file tree
Hide file tree
Showing 9 changed files with 131 additions and 85 deletions.
38 changes: 6 additions & 32 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,12 +33,8 @@ $ npm install vue-clock-picker
dependencies:

- [`vue@^2.0.0`](https://github.com/vuejs/vue)

Because this is a vue-based component, you should already have `vue` dependencies in your project. If not:

```bash
$ npm install react vue@next --save-dev
```
- [`pug@^2.0.0`](https://github.com/pugjs/pug)
- [`vue-loader@^9.4.0`](https://github.com/vuejs/vue-loader)

## USAGE

Expand All @@ -57,6 +53,10 @@ Until now, this Component has only one theme -- The Material Theme. I'll working
</vue-clock-picker>
</div>
</template>

<style>
/*your style*/
</style>
```

```javascript
Expand Down Expand Up @@ -179,29 +179,3 @@ onTimeChange(time) {
## THANK

Thanks to the Ecmadao's open source project: [react-times](https://github.com/ecmadao/react-times), I have learn a lot from that. Thanks.

## LICENSE

```
MIT License
Copyright (c) 2016 Domon
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
```
24 changes: 8 additions & 16 deletions build/build.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// https://github.com/shelljs/shelljs
require('shelljs/global')
env.NODE_ENV = 'production'

Expand All @@ -8,11 +7,9 @@ var ora = require('ora')
var webpack = require('webpack')
var webpackConfig = require('./webpack.prod.conf')

console.log(
' Tip:\n' +
' Built files are meant to be served over an HTTP server.\n' +
' Opening index.html over file:// won\'t work.\n'
)
console.log(' Tip:\n' +
' Built files are meant to be served over an HTTP server.\n' +
' Opening index.html over file:// won\'t work.\n')

var spinner = ora('building for production...')
spinner.start()
Expand All @@ -22,14 +19,9 @@ rm('-rf', assetsPath)
mkdir('-p', assetsPath)
cp('-R', 'static/', assetsPath)

webpack(webpackConfig, function (err, stats) {
spinner.stop()
if (err) throw err
process.stdout.write(stats.toString({
colors: true,
modules: false,
children: false,
chunks: false,
chunkModules: false
}) + '\n')
webpack(webpackConfig, function(err, stats) {
spinner.stop()
if (err)
throw err
process.stdout.write(stats.toString({colors: true, modules: false, children: false, chunks: false, chunkModules: false}) + '\n')
})
81 changes: 81 additions & 0 deletions build/webpack.conf.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
const webpack = require('webpack');

const path = require('path');
const fs = require('fs');
const srcFolder = path.join(__dirname, '../src', 'components');
const components = fs.readdirSync(srcFolder);
const utils = require('./utils')
const files = [];
const entries = {};
components.forEach(component => {
const name = component.split('.')[0];
if (name) {
const file = `./src/components/${name}`;
files.push(file);
entries[name] = file;
}
});

module.exports = {
entry: entries,
output: {
filename: '[name].js',
path: './lib/components/',
libraryTarget: 'commonjs2'
},
externals(context, request, callback) {
if (files.indexOf(request) > -1) {
return callback(null, false);
}
return callback(null, true);
},
module: {
loaders: [
{
test: /\.vue$/,
loader: 'vue'
}, {
test: /\.js$/,
loader: 'babel',
include: path.join(__dirname, '../src'),
exclude: /node_modules/
}, {
test: /\.jsx$/,
loader: 'jsx'
}, {
test: /\.json$/,
loader: 'json'
}, {
test: /\.html$/,
loader: 'vue-html'
}, {
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url',
query: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
}, {
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url',
query: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
]
},
resolve: {
extensions: ['', '.vue']
},
plugins: [
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.DefinePlugin({'process.env.NODE_ENV': '"production"'}),
new webpack.NoErrorsPlugin()
]
};
15 changes: 9 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,22 +1,24 @@
{
"name": "vue-clock-picker",
"version": "0.2.0",
"description": "A time picker based on Vue.js",
"version": "0.3.0",
"description": "A lite time picker based on Vue2.0",
"author": "domon <domonji95@gmail.com>",
"scripts": {
"dev": "node build/dev-server.js",
"build": "node build/build.js",
"test": ""
},
"main": "./src/index.js",
"dependencies": {
"babel-runtime": "^6.0.0",
"vue": "^2.0.0-rc.6"
"vue": "^2.0.0-rc.6",
"pug": "^2.0.0-beta6",
"vue-loader": "^9.4.0"
},
"devDependencies": {
"babel-core": "^6.0.0",
"babel-loader": "^6.0.0",
"babel-plugin-transform-runtime": "^6.0.0",
"babel-preset-es2015": "^6.0.0",
"babel-preset-stage-2": "^6.0.0",
"babel-register": "^6.0.0",
"connect-history-api-fallback": "^1.1.0",
Expand All @@ -31,7 +33,6 @@
"json-loader": "^0.5.4",
"node-sass": "^3.10.0",
"ora": "^0.2.0",
"pug": "^2.0.0-beta6",
"sass-loader": "^4.0.2",
"shelljs": "^0.6.0",
"url-loader": "^0.5.7",
Expand All @@ -43,5 +44,7 @@
"webpack-dev-middleware": "^1.8.1",
"webpack-hot-middleware": "^2.6.0",
"webpack-merge": "^0.8.3"
}
},
"license": "MIT",
"repository": "https://github.com/domonji/vue-clock-picker"
}
40 changes: 19 additions & 21 deletions src/App.vue
Original file line number Diff line number Diff line change
@@ -1,46 +1,44 @@
<template lang="pug">


div(id="app")
div
time-picker


</template>

<script>
import TimePicker from './components/TimePicker.vue'
import TimePicker from './components/TimePicker'
export default {
components: {
TimePicker
},
components: {
TimePicker
},
}
</script>

<style>
html {
height: 100%;
height: 100%;
}
body {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
#app {
color: #2c3e50;
margin-top: -100px;
max-width: 600px;
font-family: Source Sans Pro, Helvetica, sans-serif;
text-align: center;
color: #2c3e50;
margin-top: -100px;
max-width: 600px;
font-family: Source Sans Pro, Helvetica, sans-serif;
text-align: center;
}
#app a {
color: #42b983;
text-decoration: none;
}
.logo {
width: 100px;
height: 100px
color: #42b983;
text-decoration: none;
}
</style>
2 changes: 2 additions & 0 deletions src/components/TimePickerGenerator.vue
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<template lang="pug">


div
div(v-if="type=='minute'" id="picker-pointer-container")
picker-points(v-for="(m,i) in MINUTES" v-if="i%5==0" ':index'="i" ':key'="i" ':angle'="6*i" ':handle-time-change'="handleTimePointerClick" ':picked'="i==minute")
Expand All @@ -10,6 +11,7 @@ div
| &nbsp;|&nbsp;
span(@click="handleIntervalChange('PM')" class="time-picker-interval" ':class'="{active:interval=='PM'}") PM


</template>

<script>
Expand Down
2 changes: 2 additions & 0 deletions src/components/TimePickerModal.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
<template lang="pug">



div(class="time-picker-modal-container")
div(class="time-picker-modal-header")
span(@click="handleStepChange(0)" class="time-picker-header" ':class'="{active:!step}") {{hourString}}
Expand All @@ -10,6 +11,7 @@ div(class="time-picker-modal-container")
time-picker-generator(':handle-time-pointer-click'="handleTimePointerClick" ':type'="timeType" ':hour'="hour" ':minute'="minute")



</template>

<script>
Expand Down
11 changes: 3 additions & 8 deletions src/constValues.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,3 @@
export const HOURS = new Array(24 + 1).join('0').split('')
export const TWELVE_HOURS = new Array(12 + 1).join('0').split('')
export const MINUTES = new Array(60 + 1).join('0').split('')

export const PICKER_RADIUS = 130
export const MAX_ABSOLUTE_POSITION = 125
export const MIN_ABSOLUTE_POSITION = 90
export const POINTER_RADIUS = 15
module.exports.HOUR = new Array(24 + 1).join('0').split('')
module.exports.TWELVE_HOURS = new Array(12 + 1).join('0').split('')
module.exports.MINUTES = new Array(60 + 1).join('0').split('')
3 changes: 1 addition & 2 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
import TimePicker from './components/TimePicker.vue'
module.exports = TimePicker
module.exports = require('./components/TimePicker.vue')

0 comments on commit 0ac2dfc

Please sign in to comment.