diff --git a/.travis.yml b/.travis.yml index 8b7507a..1f31537 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,12 +1,10 @@ language: node_js node_js: -- '0.12' -before_script: -- npm install -g gulp + - '6.11.0' branches: only: - master -script: gulp && ls dist +script: yarn build deploy: provider: s3 skip_cleanup: true @@ -15,8 +13,8 @@ deploy: secure: WfWoAWzOpISW88V0ym6qCtw8wG4w8ej/owS8ai7SbeGj1PeCD9CNRRGMzjH4oUq0dPBJWJEAPAWjTLDRelX/ekO1+KaHaR88qqwBuvM0Jp+UO5n9U5ArMCgHrOsA1Y67fMY+qwgibyV199rZNou9XXtg6PYKLcoe1ZEFZl3Tf3k= bucket: deepumohan.com region: eu-west-1 - local-dir: dist/ - upload-dir: "/projects/word-count/" + local-dir: build/ + upload-dir: "/projects/word-count-plus/" on: repo: WarFox/word-count env: diff --git a/README.md b/README.md index 3a22c91..8ba0070 100644 --- a/README.md +++ b/README.md @@ -9,3 +9,5 @@ Capabilities include: Demo : https://deepumohan.com/projects/word-count/ jsFiddle: https://jsfiddle.net/deepumohanp/jZeKu/ + +[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier) diff --git a/package.json b/package.json index 9d85cbf..d859a0c 100644 --- a/package.json +++ b/package.json @@ -1,24 +1,22 @@ { - "private": true, - "author": "Deepu Mohan Puthrote", - "engines": { - "node": ">= 0.12", - "npm": ">= 2.1" - }, - "scripts": { - "build": "gulp" - }, - "devDependencies": { - "babelify": "^6.2.0", - "browserify": "^11.0.0", - "del": "^1.2.0", - "gulp": "^3.9.0", - "gulp-clean-css": "^2.3.2", - "gulp-plumber": "^1.0.1", - "gulp-rename": "^1.2.2", - "gulp-uglify": "1.2.0", - "gulp-util": "^3.0.6", - "vinyl-buffer": "^1.0.0", - "vinyl-source-stream": "^1.1.0" - } + "name": "word-count-plus", + "version": "2.0.0", + "author": "Deepu Mohan Puthrote", + "homepage": "https://deepumohan.com/projects/word-count-plus", + "private": true, + "dependencies": { + "react": "^16.2.0", + "react-dom": "^16.2.0", + "react-redux": "^5.0.7", + "react-scripts": "1.1.0", + "recharts": "^1.0.0-beta.10", + "redux": "^3.7.2", + "redux-logger": "^3.0.6" + }, + "scripts": { + "start": "react-scripts start", + "build": "react-scripts build", + "test": "react-scripts test --env=jsdom", + "eject": "react-scripts eject" + } } diff --git a/public/css/style.css b/public/css/style.css deleted file mode 100644 index 9106fce..0000000 --- a/public/css/style.css +++ /dev/null @@ -1,42 +0,0 @@ -/* - Document : style - Created on : Dec 20, 2011, 5:36:23 PM - Author : Deepu Mohan Puthrote -*/ - -/* - Syntax recommendation http://www.w3.org/TR/REC-CSS2/ -*/ - -/*font import*/ -@import url(https://fonts.googleapis.com/css?family=Cagliostro); - -root {margin: 0; padding: 0;display: block;} - -body {background-color:#d1e5e3; font-family: 'Cagliostro', Courier New; color:#393939; padding: 0 5px 0 5px;} - -textarea {background-color:#d1e5e3;font-family: 'Cagliostro',Courier New; height:100%; width: 100%;border:1px solid #255E6E;} - -h1 {padding: 0; margin: 0;} -ul {display:inline; padding: 0;} -li {list-style-type: none; display: inline;} - -#container {border: 0; height: 350px;} - -.sleek{margin:0 0 10px 0;} -.sleek h1{color:#fff;font-size:16px;font-weight:bold;background-color:#255e6e;background:-moz-linear-gradient(center top,'#629998','#405A6A');filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#629998',endColorstr='#405a6a');background:-webkit-gradient(linear,left top,left bottom,from(#629998),to(#405a6a));background:-moz-linear-gradient(top,#629998,#405a6a);background:-o-linear-gradient(top,#629998,#405a6a);border:1px solid #677c89;border-bottom-color:#6b808d;border-radius:5px 5px 5px 5px;-moz-border-radius:5px 5px 5px 5px;-webkit-border-radius:5px 5px 5px 5px;text-shadow:0 -1px 0 rgba(0,0,0,0.7);margin:0 0 10px 0;padding:8px 18px;position:relative;} -.sleek h1 a{color:#fff;text-decoration:none;} -.sleek h1 span{color:#e9f1f4;font-size:70%;font-weight:normal;text-shadow:none;} - -.sleek .sleek-body{overflow:hidden; padding: 0 0 0 150px;} - -.sleek ul{list-style-type:none;position:relative;} -.sleek ul li{color:#666;font-size:13px;font-weight:normal;background-color:#d1e5f3;background:-moz-linear-gradient(center top,'#d1e5f3','#255e6e');filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d1e5f3',endColorstr='#255e6e');background:-webkit-gradient(linear,left top,left bottom,from(#d1e5f3),to(#255e6e));background:-moz-linear-gradient(top,#d1e5f3,#255e6e);background:-o-linear-gradient(top,#d1e5f3,#255e6e);border:1px solid #255e6e;border-radius:5px 5px 5px 5px;-moz-border-radius:5px 5px 5px 5px;-webkit-border-radius:5px 5px 5px 5px;display:block;width:215px;height:100px;float:left;position:relative;margin:0 10px 0 0;-moz-box-shadow:0 1px 0 #fff;-webkit-box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 #fff;} -.sleek ul li a{color:#666;text-decoration:none;} - -.sleek .result{padding:10px 0 0 20px;display:block;position:relative;height:35px;border-bottom:1px solid #255e6e;background-repeat:no-repeat;background-position:center center;} -.sleek .result h2{margin:0;padding:0;font-size:32px;color:#393939;} - -.sleek .desc{padding:10px 0 15px 15px;display:block;height:45px;overflow:hidden;border-top:1px solid #fffae5;background-repeat:no-repeat;position:relative;z-index:2;} -.sleek .desc h2{margin:0;padding:0;font-size:14px;color:#ffffee;} -.sleek .desc p{margin:0;padding:0;line-height:1.2em;} diff --git a/public/images/logo.svg b/public/images/logo.svg new file mode 100644 index 0000000..6b60c10 --- /dev/null +++ b/public/images/logo.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/public/images/redux-spaces-avatar.png b/public/images/redux-spaces-avatar.png new file mode 100644 index 0000000..2110607 Binary files /dev/null and b/public/images/redux-spaces-avatar.png differ diff --git a/public/index.html b/public/index.html index 50f8555..c35e21b 100644 --- a/public/index.html +++ b/public/index.html @@ -1,62 +1,40 @@ - - - Copy & Paste, Word & Character counter using Javascript, JQuery - - - - - - - + - + + Copy & Paste, Word & Character counter and Statistics app React and Redux + + + + + + + + + + + + + + + + + +
+ + - - - - -

Word Counter using Javascript, jQuery

-
-

Paste or type your text to the textbox below to get the word and character count

-
- -
-
-
- -
-
- - diff --git a/public/manifest.json b/public/manifest.json new file mode 100644 index 0000000..a1543d4 --- /dev/null +++ b/public/manifest.json @@ -0,0 +1,15 @@ +{ + "short_name": "Word Count Plus", + "name": "Word Count and Statistics app", + "icons": [ + { + "src": "favicon.ico", + "sizes": "64x64 32x32 24x24 16x16", + "type": "image/x-icon" + } + ], + "start_url": "./index.html", + "display": "standalone", + "theme_color": "#000000", + "background_color": "#ffffff" +} diff --git a/src/App.js b/src/App.js new file mode 100644 index 0000000..9e94d02 --- /dev/null +++ b/src/App.js @@ -0,0 +1,70 @@ +import React from "react"; +import { + Footer, + Header, + TextArea, + TinyLineChart, + DisplayStatistic +} from "./components"; +import { connect } from "react-redux"; + +class App extends React.Component { + render() { + const { counts } = this.props; + + return ( +
+
+ +
+ Words + + Chars
(including trails) + + + Chars
(excluding trails) + + + Chars
(no spaces) + + + Alpbahets + + + Numbers + + + Non AlphaNumeric + + + Tweet - 280 max + +
+ + + +
+