Skip to content

Commit af3e01b

Browse files
Nazanin1369Nazanin1369
committed
Webpack integration + design improvements
1 parent e9285a9 commit af3e01b

7 files changed

Lines changed: 135 additions & 41 deletions

File tree

‎demo/main.css‎

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,10 @@
1+
body {
2+
color: #626262;
3+
font-family: "Segoe UI",Arial,sans-serif;
4+
font-size: 14px;
5+
font-weight: normal;
6+
letter-spacing: 0.01em;
7+
}
18
.validation-valid {
29
color: #0074D9;
310
}
@@ -23,6 +30,10 @@
2330
opacity: 1;
2431
}
2532

33+
.m-l-10 {
34+
margin-left: 10px;
35+
}
36+
2637
pre, pre code {
2738
font-size: 13px;
2839
}
@@ -53,6 +64,10 @@ pre {
5364
background: none;
5465
}
5566

67+
.container > nav {
68+
margin: 0px 40px;
69+
}
70+
5671
.navbar-default .navbar-brand {
5772
color: #0A7C71;
5873
}
@@ -83,21 +98,18 @@ pre {
8398
color: #fff;
8499
text-align: center;
85100
background-color: #0A7C71;
86-
background-image: -webkit-gradient(linear,left top,left bottom,from(#0A7C71),to(#10CFBD));
87-
background-image: -webkit-linear-gradient(top,#0A7C71
88-
0,#10CFBD 100%);
89-
background-image: -o-linear-gradient(top,#0A7C71
90-
0,#10CFBD 100%);
91-
background-image: linear-gradient(to bottom,#0A7C71
92-
0,#10CFBD 100%);
93-
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0A7C71', endColorstr='#10CFBD', GradientType=0);
101+
background-image: linear-gradient(to bottom,#0A7C78 0,#0A7C75 100%);
94102
background-repeat: repeat-x;
95103
}
96104

97105
.bs-docs-header .container {
98106
text-align: left;
99107
}
100108

109+
.bs-docs-header .container > p {
110+
color: #ccc;
111+
}
112+
101113
.bs-docs-decs {
102114
font-size: 16px;
103115
padding: 10px;

‎dist/bundle.js‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
/******/ (function(modules) { // webpackBootstrap
2+
/******/ // The module cache
3+
/******/ var installedModules = {};
4+
5+
/******/ // The require function
6+
/******/ function __webpack_require__(moduleId) {
7+
8+
/******/ // Check if module is in cache
9+
/******/ if(installedModules[moduleId])
10+
/******/ return installedModules[moduleId].exports;
11+
12+
/******/ // Create a new module (and put it into the cache)
13+
/******/ var module = installedModules[moduleId] = {
14+
/******/ exports: {},
15+
/******/ id: moduleId,
16+
/******/ loaded: false
17+
/******/ };
18+
19+
/******/ // Execute the module function
20+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21+
22+
/******/ // Flag the module as loaded
23+
/******/ module.loaded = true;
24+
25+
/******/ // Return the exports of the module
26+
/******/ return module.exports;
27+
/******/ }
28+
29+
30+
/******/ // expose the modules object (__webpack_modules__)
31+
/******/ __webpack_require__.m = modules;
32+
33+
/******/ // expose the module cache
34+
/******/ __webpack_require__.c = installedModules;
35+
36+
/******/ // __webpack_public_path__
37+
/******/ __webpack_require__.p = "";
38+
39+
/******/ // Load entry module and return exports
40+
/******/ return __webpack_require__(0);
41+
/******/ })
42+
/************************************************************************/
43+
/******/ ([
44+
/* 0 */
45+
/***/ function(module, exports, __webpack_require__) {
46+
47+
module.exports = __webpack_require__(1);
48+
49+
50+
/***/ },
51+
/* 1 */
52+
/***/ function(module, exports) {
53+
54+
'use strict';
55+
56+
angular.module('validation', ['validation.provider', 'validation.directive']);
57+
angular.module('validation.provider', []);
58+
angular.module('validation.directive', ['validation.provider']);
59+
60+
/***/ }
61+
/******/ ]);

‎index.html‎

Lines changed: 22 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -30,21 +30,21 @@
3030

3131
<title>Angular Validation</title>
3232
<!-- Bootstrap core CSS -->
33-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css"/>
33+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css"/>
3434
<!-- Bootstrap theme -->
35-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css"/>
35+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css"/>
3636
<!-- AngularJs ui-select CSS-->
37-
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.13.2/select.min.css"/>
37+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.13.2/select.min.css"/>
3838

3939
<!-- Highlight CSS-->
40-
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.5/styles/color-brewer.min.css"/>
40+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.5/styles/color-brewer.min.css"/>
4141

4242
<link rel="stylesheet" href="demo/main.css"/>
4343

4444
</head>
4545

4646
<body role="document" ng-controller="index">
47-
47+
<div class="container" style="padding-bottom: 20px;">
4848
<!-- Fixed navbar -->
4949
<nav class="navbar navbar-default navbar-fixed-top">
5050
<div class="container">
@@ -67,34 +67,27 @@
6767
<div class="hidden-xs" style="height: 40px;"></div>
6868
<div class="container">
6969
<h1>Angular Validation</h1>
70-
<div class="bs-docs-decs">
71-
<p> Client-side Validation should be simple and clean. </p>
72-
<p>Don't let Client-side Validation dirty your controller. </p>
73-
74-
<p>Setup your Validation on config phase by using some rules (example) <p>
75-
<p>If you prefer schema over html attributes , try angular-validation-schema (Demo)
76-
And add Validation in your view only.
77-
</p>
78-
</div>
70+
<p> Client-side Validation should be simple and clean. </p>
7971
</div>
8072
</header>
8173
<div class="container theme-showcase" role="main">
8274
<section id="getting_started">
8375
<div class="hidden-xs" style="height: 40px;"></div>
8476
<div class="page-header">
85-
<h1>Getting Started</h1>
77+
<h2>Getting Started</h2>
8678
</div>
8779
<h3>Requirements</h3>
8880
<br/>
8981
<p><strong> AngularJS 1.2.x </strong>(for angular-validation 1.2.x)</p>
9082
<p><strong> AngularJS 1.3.x </strong>(for angular-validation 1.3.x)</p>
91-
9283
<h3>Installation</h3>
9384
<br/>
85+
<div>
9486
<p>Install with npm</p>
9587
<pre><code>npm install angular-validation </code></pre>
9688
<p>Or with Bower</p>
9789
<pre><code>bower install angular-validation </code></pre>
90+
</div>
9891
<br/>
9992
<h3>Files to download</h3>
10093
<br/>
@@ -133,7 +126,7 @@ <h3>Writing your first code</h3>
133126
<section id="style_guide">
134127
<div class="hidden-xs" style="height: 40px;"></div>
135128
<div class="page-header">
136-
<h1>Style Guide</h1>
129+
<h2>Style Guide</h2>
137130
</div>
138131
<p>You can style different states of your form elements using the following selectors</p>
139132
<span class="label label-danger" style="margin-left: 2px;">Invalid Selectors</span>
@@ -165,7 +158,7 @@ <h1>Style Guide</h1>
165158
<section id="examples">
166159
<div class="hidden-xs" style="height: 40px;"></div>
167160
<div class="page-header">
168-
<h1>Examples</h1>
161+
<h2>Examples</h2>
169162
</div>
170163
<!--- Form1 -->
171164
<div class="page-header">
@@ -444,17 +437,18 @@ <h1>Examples</h1>
444437

445438
</section>
446439
</div>
440+
</div>
447441

448442
<a href="https://github.com/huei90/angular-validation" target="_blank"><img src="demo/iconmonstr-github-10-icon-128.png" id="github-link" alt="Fork me on Github"/></a>
449-
<script src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
450-
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.5/highlight.min.js"></script>
451-
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
452-
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
453-
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-sanitize.min.js"></script>
454-
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.min.js"></script>
455-
<script src="//maxcdn.bootstrapcdn.com/bootstrap/latest/js/bootstrap.min.js"></script>
456-
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap.min.js"></script>
457-
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.13.2/select.min.js"></script>
443+
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
444+
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.5/highlight.min.js"></script>
445+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
446+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
447+
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-sanitize.min.js"></script>
448+
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.min.js"></script>
449+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/latest/js/bootstrap.min.js"></script>
450+
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap.min.js"></script>
451+
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.13.2/select.min.js"></script>
458452

459453
<script src="dist/angular-validation.js"></script>
460454
<script src="dist/angular-validation-rule.js"></script>
@@ -474,7 +468,7 @@ <h1>Examples</h1>
474468
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
475469
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
476470
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
477-
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
471+
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
478472

479473
ga('create', 'UA-62825613-1', 'auto');
480474
ga('send', 'pageview');

‎package.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,9 @@
2929
"main": "./dist/angular-validation.js",
3030
"bugs": "https://github.com/huei90/angular-validation/issues",
3131
"devDependencies": {
32+
"babel-core": "^6.7.7",
33+
"babel-loader": "^6.2.4",
34+
"babel-preset-es2015": "^6.6.0",
3235
"grunt": "~0.4.4",
3336
"grunt-browser-sync": "~2.2.0",
3437
"grunt-contrib-clean": "~0.7.0",
@@ -53,5 +56,8 @@
5356
"load-grunt-tasks": "~3.4.0",
5457
"requirejs": "~2.1.14",
5558
"time-grunt": "~1.3.0"
59+
},
60+
"dependencies": {
61+
"webpack": "^1.13.0"
5662
}
5763
}

‎src/main.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
var angular = require('./node_modules/angular/angular.js');
2+
var validationApp = require('./module.js');

‎src/module.js‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
(function() {
2-
angular.module('validation', ['validation.provider', 'validation.directive']);
3-
angular.module('validation.provider', []);
4-
angular.module('validation.directive', ['validation.provider']);
5-
}).call(this);
1+
2+
3+
angular.module('validation', ['validation.provider', 'validation.directive']);
4+
angular.module('validation.provider', []);
5+
angular.module('validation.directive', ['validation.provider']);
6+

‎webpack.config.js‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
module.exports = {
2+
entry: ['./src/module.js'],
3+
output: {
4+
filename: 'dist/bundle.js'
5+
},
6+
module: {
7+
loaders: [
8+
{
9+
test: /\.jsx?$/,
10+
exclude: /(node_modules|bower_components)/,
11+
loader: 'babel',
12+
query: {
13+
presets: ['es2015']
14+
}
15+
}
16+
]
17+
}
18+
}

0 commit comments

Comments
 (0)