@@ -2,8 +2,11 @@ var bs = require('browser-sync').create(),
2
2
gulp = require ( 'gulp' ) ,
3
3
autoprefixer = require ( 'gulp-autoprefixer' ) ,
4
4
jshint = require ( 'gulp-jshint' ) ,
5
- sass = require ( 'gulp-sass' ) ,
5
+ sass = require ( 'gulp-sass' ) ( require ( 'sass' ) ) ,
6
6
imagemin = require ( 'gulp-imagemin' ) ,
7
+ modernizr = require ( 'gulp-modernizr' ) ,
8
+ imwebp = require ( 'imagemin-webp' ) ,
9
+ webp = require ( 'gulp-webp' ) ,
7
10
rename = require ( 'gulp-rename' ) ,
8
11
uglify = require ( 'gulp-uglify' ) ,
9
12
notify = require ( 'gulp-notify' ) ,
@@ -49,7 +52,7 @@ var paths = {
49
52
dest : './dist/js/'
50
53
} ,
51
54
images : {
52
- src : './src/images/**/*.{jpg,jpeg,png,gif,svg}' ,
55
+ src : './src/images/**/*.{jpg,jpeg,png,gif,svg,webp }' ,
53
56
dest : './dist/images/'
54
57
} ,
55
58
styles : {
@@ -79,7 +82,7 @@ var paths = {
79
82
dest : './temp/'
80
83
} ,
81
84
zipelse : {
82
- src : [ './menus/**/*' , './partials/*' , '*.{ascx,xml,html,htm}' ] ,
85
+ src : [ './menus/**/*' , './partials/*' , '*.{ascx,xml,html,htm}' , 'koi.json' ] ,
83
86
zipfile : 'else.zip' ,
84
87
dest : './temp/'
85
88
} ,
@@ -104,28 +107,28 @@ var paths = {
104
107
function fontsInit ( ) {
105
108
return gulp . src ( paths . fonts . src )
106
109
. pipe ( gulp . dest ( paths . fonts . dest ) )
107
- . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'fontsInit' , sound : false } ) ) ;
110
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'fontsInit' } ) ) ;
108
111
}
109
112
110
113
// Copy fontawesome-free fonts from node_modules to dist/fonts
111
114
function faFontsInit ( ) {
112
115
return gulp . src ( paths . faFonts . src )
113
116
. pipe ( gulp . dest ( paths . faFonts . dest ) )
114
- . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'faFontsInit' , sound : false } ) ) ;
117
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'faFontsInit' } ) ) ;
115
118
}
116
119
117
120
// Copy fontawesome-free CSS from node_modules to dist/css/fontawesome-free
118
121
function faCssInit ( ) {
119
122
return gulp . src ( paths . faCss . src )
120
123
. pipe ( gulp . dest ( paths . faCss . dest ) )
121
- . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'faCssInit' , sound : false } ) ) ;
124
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'faCssInit' } ) ) ;
122
125
}
123
126
124
127
// Copy jquery.slimmenu.min.js from src/assets to dist/js
125
128
function slimMenuInit ( ) {
126
129
return gulp . src ( paths . slimMenu . src )
127
130
. pipe ( gulp . dest ( paths . slimMenu . dest ) )
128
- . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'slimMenuInit' , sound : false } ) ) ;
131
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'slimMenuInit' } ) ) ;
129
132
}
130
133
131
134
// Compile normalize.css from node_modules and copy to dist/js
@@ -136,15 +139,33 @@ function normalizeInit() {
136
139
. pipe ( rename ( { suffix : '.min' } ) )
137
140
. pipe ( autoprefixer ( ) )
138
141
. pipe ( gulp . dest ( paths . normalize . dest , { sourcemaps : '.' } ) )
139
- . pipe ( notify ( { message : '<%= file.relative %> compiled and distributed!' , title : 'normalizeInit' , sound : false } ) ) ;
142
+ . pipe ( notify ( { message : '<%= file.relative %> compiled and distributed!' , title : 'normalizeInit' } ) ) ;
140
143
}
141
144
142
145
// Copy bootstrap JS from node_modules to dist/js
143
146
function bsJsInit ( ) {
144
147
return gulp . src ( paths . bsJs . src )
145
148
. pipe ( gulp . dest ( paths . bsJs . dest ) )
146
- . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'bsJsInit' , sound : false } ) ) ;
149
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'bsJsInit' } ) ) ;
147
150
}
151
+
152
+ // modernizr Init
153
+ function modernizrInit ( ) {
154
+ return gulp . src ( paths . scripts . src )
155
+ . pipe ( modernizr ( {
156
+ 'options' : [
157
+ 'setClasses'
158
+ ] ,
159
+ 'tests' : [
160
+ 'webp'
161
+ ]
162
+ } ) )
163
+ . pipe ( uglify ( ) )
164
+ . pipe ( rename ( { suffix : '-custom.min' } ) )
165
+ . pipe ( gulp . dest ( paths . scripts . dest ) )
166
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'modernizrInit' , sound : false } ) ) ;
167
+ }
168
+
148
169
/*------------------------------------------------------*/
149
170
/* END INIT TASKS --------------------------------------*/
150
171
/*------------------------------------------------------*/
@@ -154,17 +175,34 @@ function bsJsInit() {
154
175
/* IMAGE TASKS -----------------------------------------*/
155
176
/*------------------------------------------------------*/
156
177
// Optimize images and copy to dist/images
157
- function images ( ) {
178
+ function optimize ( ) {
158
179
return gulp . src ( paths . images . src , { since : gulp . lastRun ( images ) } )
159
- . pipe ( imagemin ( {
160
- interlaced : true ,
161
- progressive : true ,
162
- optimizationLevel : 5 ,
163
- svgoPlugins : [ { removeViewBox : true } ]
164
- } ) )
180
+ . pipe ( imagemin ( [
181
+ imagemin . gifsicle ( { interlaced : true } ) ,
182
+ imagemin . mozjpeg ( { quality : 75 , progressive : true } ) ,
183
+ imagemin . optipng ( { optimizationLevel : 5 } ) ,
184
+ imagemin . svgo ( {
185
+ plugins : [
186
+ { removeViewBox : true } ,
187
+ { cleanupIDs : false }
188
+ ]
189
+ } )
190
+ ] , {
191
+ plugins : imwebp ( { quality :75 } )
192
+ }
193
+ ) )
165
194
. pipe ( gulp . dest ( paths . images . dest ) )
166
- . pipe ( notify ( { message : '<%= file.relative %> optimized!' , title : 'images' , sound : false } ) ) ;
195
+ . pipe ( notify ( { message : '<%= file.relative %> optimized!' , title : 'images' } ) ) ;
167
196
}
197
+
198
+ // Make WebP versions of all images
199
+ function convert ( ) {
200
+ return gulp . src ( paths . images . src , { since : gulp . lastRun ( images ) } )
201
+ . pipe ( webp ( ) )
202
+ . pipe ( gulp . dest ( paths . images . dest ) )
203
+ . pipe ( notify ( { message : '<%= file.relative %> converted to webp!' , title : 'images' } ) ) ;
204
+ }
205
+
168
206
/*------------------------------------------------------*/
169
207
/* END IMAGE TASKS -------------------------------------*/
170
208
/*------------------------------------------------------*/
@@ -181,7 +219,7 @@ function styles() {
181
219
. pipe ( rename ( { suffix : '.min' } ) )
182
220
. pipe ( autoprefixer ( ) )
183
221
. pipe ( gulp . dest ( paths . styles . dest , { sourcemaps : '.' } ) )
184
- . pipe ( notify ( { message : '<%= file.relative %> compiled and distributed!' , title : 'styles' , sound : false } ) ) ;
222
+ . pipe ( notify ( { message : '<%= file.relative %> compiled and distributed!' , title : 'styles' } ) ) ;
185
223
}
186
224
/*------------------------------------------------------*/
187
225
/* END STYLES TASKS ------------------------------------*/
@@ -200,7 +238,7 @@ function scripts() {
200
238
. pipe ( gulp . dest ( paths . scripts . dest , { sourcemaps : '.' } ) )
201
239
. pipe ( jshint . reporter ( 'default' ) )
202
240
. pipe ( jshint . reporter ( 'fail' ) )
203
- . pipe ( notify ( { message : '<%= file.relative %> minified!' , title : "scripts" , sound : false } ) ) ;
241
+ . pipe ( notify ( { message : '<%= file.relative %> minified!' , title : "scripts" } ) ) ;
204
242
}
205
243
/*------------------------------------------------------*/
206
244
/* END SCRIPTS TASKS -----------------------------------*/
@@ -214,7 +252,7 @@ function scripts() {
214
252
function containers ( ) {
215
253
return gulp . src ( paths . containers . src )
216
254
. pipe ( gulp . dest ( paths . containers . dest ) )
217
- . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'containers' , sound : false } ) ) ;
255
+ . pipe ( notify ( { message : '<%= file.relative %> distributed!' , title : 'containers' } ) ) ;
218
256
}
219
257
220
258
// Update manifest.dnn
@@ -232,7 +270,7 @@ function manifest() {
232
270
. pipe ( replace ( / ( \\ S k i n s \\ ) ( .* ?) (? = \\ ) / g, '\\Skins\\' + project ) )
233
271
. pipe ( replace ( / ( \\ C o n t a i n e r s \\ ) ( .* ?) (? = \\ ) / g, '\\Containers\\' + project ) )
234
272
. pipe ( gulp . dest ( paths . manifest . dest ) )
235
- . pipe ( notify ( { message : '<%= file.relative %> updated!' , title : 'manifest' , sound : false } ) ) ;
273
+ . pipe ( notify ( { message : '<%= file.relative %> updated!' , title : 'manifest' } ) ) ;
236
274
}
237
275
/*------------------------------------------------------*/
238
276
/* END DNN TASKS ---------------------------------------*/
@@ -246,7 +284,7 @@ function manifest() {
246
284
function cleandist ( ) {
247
285
return gulp . src ( paths . cleandist . src , { allowEmpty : true } )
248
286
. pipe ( clean ( ) )
249
- . pipe ( notify ( { message : 'dist folder cleaned up!' , title : 'cleandist' , sound : false } ) ) ;
287
+ . pipe ( notify ( { message : 'dist folder cleaned up!' , title : 'cleandist' } ) ) ;
250
288
}
251
289
/*------------------------------------------------------*/
252
290
/* END MAINTENANCE TASKS -------------------------------*/
@@ -261,26 +299,26 @@ function zipdist() {
261
299
return gulp . src ( paths . zipdist . src )
262
300
. pipe ( zip ( paths . zipdist . zipfile ) )
263
301
. pipe ( gulp . dest ( paths . zipdist . dest ) )
264
- . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipdist' , sound : false } ) ) ;
302
+ . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipdist' } ) ) ;
265
303
}
266
304
267
305
// ZIP contents of containers folder
268
306
function zipcontainers ( ) {
269
307
return gulp . src ( paths . zipcontainers . src )
270
308
. pipe ( zip ( paths . zipcontainers . zipfile ) )
271
309
. pipe ( gulp . dest ( paths . zipcontainers . dest ) )
272
- . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipcontainers' , sound : false } ) ) ;
310
+ . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipcontainers' } ) ) ;
273
311
}
274
312
275
313
// ZIP everything else
276
314
function zipelse ( ) {
277
315
return gulp . src ( paths . zipelse . src , { base : '.' } )
278
316
. pipe ( gulp . dest ( paths . zipelse . dest ) )
279
- . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipcontainers' , sound : false } ) )
317
+ . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipcontainers' } ) )
280
318
. pipe ( replace ( 'dist/' , '' ) )
281
319
. pipe ( zip ( paths . zipelse . zipfile ) )
282
320
. pipe ( gulp . dest ( paths . zipelse . dest ) )
283
- . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipcontainers' , sound : false } ) ) ;
321
+ . pipe ( notify ( { message : '<%= file.relative %> temporarily created!' , title : 'zipcontainers' } ) ) ;
284
322
}
285
323
286
324
// git ziptemp
@@ -291,14 +329,14 @@ function zippackage() {
291
329
return gulp . src ( paths . zippackage . src )
292
330
. pipe ( zip ( paths . zippackage . zipfile ) )
293
331
. pipe ( gulp . dest ( paths . zippackage . dest ) )
294
- . pipe ( notify ( { message : '<%= file.relative %> created!' , title : 'zippackage' , sound : false } ) ) ;
332
+ . pipe ( notify ( { message : '<%= file.relative %> created!' , title : 'zippackage' } ) ) ;
295
333
}
296
334
297
335
// Clean temp folder
298
336
function cleantemp ( ) {
299
337
return gulp . src ( paths . cleantemp . src )
300
338
. pipe ( clean ( ) )
301
- . pipe ( notify ( { message : 'temp folder cleaned up!' , title : 'cleantemp' , sound : false } ) ) ;
339
+ . pipe ( notify ( { message : 'temp folder cleaned up!' , title : 'cleantemp' } ) ) ;
302
340
}
303
341
/*------------------------------------------------------*/
304
342
/* END PACKAGING TASKS ---------------------------------*/
@@ -327,8 +365,11 @@ function watch() {
327
365
gulp . watch ( paths . containers . src , containers ) ;
328
366
}
329
367
368
+ // gulp images
369
+ var images = gulp . series ( optimize , convert ) ;
370
+
330
371
// gulp init
331
- var init = gulp . series ( fontsInit , faFontsInit , faCssInit , slimMenuInit , normalizeInit , bsJsInit ) ;
372
+ var init = gulp . series ( fontsInit , faFontsInit , faCssInit , slimMenuInit , normalizeInit , bsJsInit , modernizrInit ) ;
332
373
333
374
// gulp build
334
375
var build = gulp . series ( cleandist , init , styles , scripts , images , containers , manifest ) ;
@@ -350,7 +391,10 @@ exports.faCssInit = faCssInit;
350
391
exports . slimMenuInit = slimMenuInit ;
351
392
exports . normalizeInit = normalizeInit ;
352
393
exports . bsJsInit = bsJsInit ;
394
+ exports . convert = convert ;
395
+ exports . optimize = optimize ;
353
396
exports . images = images ;
397
+ exports . modernizrInit = modernizrInit ;
354
398
exports . styles = styles ;
355
399
exports . scripts = scripts ;
356
400
exports . containers = containers ;
0 commit comments