octo/citra-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

PR #45 rebased (#46)

Browse Source 
* Initial checkin of refactoring gulp / scss

* Updated gitignore.

* Removing build directory.

* Updated package.json, removed downloads script.

* Removed assets_backup. Added back travis. Added back github pages dependency. Changed assets to src.

* Updated javascript rendering.

* Removing citra-theme button overrides in favor of scss.

* Refactored hyperlinks underline color

* Replacing manual string concat with backtick.
This commit is contained in:
Weiyi Wang
2017-08-29 21:16:03 -05:00
committed by Flame Sage
parent 869cd0a87d
commit 2ff764f331
57 changed files with 8025 additions and 9159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

256
gulpfile.js
View File

@ -1,135 +1,165 @@
const gulp = require('gulp');
const fs = require('fs');
const util = require('gulp-util');
const merge = require('merge-stream');
const runSequence = require('run-sequence');
const exec = require('child_process').exec;
const rimraf = require('rimraf');
const browsersync = require('browser-sync');
const ghPages = require('gulp-gh-pages');
const md5 = require("gulp-md5-plus");
const sass = require('gulp-sass');
const postcss = require('gulp-postcss');
const cssImport = require('postcss-import');
const cssnext = require('postcss-cssnext');
const cleanCSS = require('gulp-clean-css');
const cssnano = require('cssnano');
const browserSync = require('browser-sync').create();
const ghPages = require('gulp-gh-pages');
const concat = require('gulp-concat');
const minify = require('gulp-minify');
const imageResize = require('gulp-image-resize');
const htmlmin = require('gulp-htmlmin');
const hugoPath = './site';
const distPath = './public';
const cname = 'citra-emu.org';
const deployOptions = {
remoteUrl: "git@github.com:CitraBotWeb/CitraBotWeb.github.io.git",
branch: "master"
};
var finalCommand = null;
gulp.task("default", ['setup', 'serve']);
// PHASE 1 - Setup
gulp.task('setup', function(cb) {
if (util.env.production) {
process.env.HUGO_ENV = 'PRD';
} else {
process.env.HUGO_ENV = 'DEV';
}
process.env.GULP = 'true';
util.log(`process.env.HUGO_ENV = '${process.env.HUGO_ENV}'`);
util.log(`process.env.GULP = '${process.env.GULP}'`);
rimraf(`${distPath}`, cb);
// Gulp Run Tasks
gulp.task('default', ['start:setup'], function(callback) {
runSequence('hugo', finalCommand, callback);
});
gulp.task('all', ['start:setup'], function(callback) {
runSequence(['scripts:games', 'scripts:twitter', 'scripts:wiki'],
['assets:js', 'assets:fonts', 'assets:scss'],
'hugo',
'assets:images',
finalCommand,
callback);
});
gulp.task('games', ['start:setup'], function(callback) {
runSequence('scripts:games', 'hugo', finalCommand, callback);
});
gulp.task('twitter', ['start:setup'], function(callback) {
runSequence('scripts:twitter', 'hugo', finalCommand, callback);
});
gulp.task('wiki', ['start:setup'], function(callback) {
runSequence('scripts:wiki', 'hugo', finalCommand, callback);
});
gulp.task('assets', ['start:setup'], function(callback) {
runSequence(['assets:js', 'assets:fonts', 'assets:scss'], 'hugo', 'assets:images', finalCommand, callback);
});
// Gulp Pipeline
gulp.task('start:setup', function() {
if (util.env.production) {
process.env.HUGO_ENV = 'PRD';
process.env.HUGO_BASEURL = 'https://citra-emu.org';
finalCommand = 'final:publish';
} else {
process.env.HUGO_ENV = 'DEV';
process.env.HUGO_BASEURL = 'http://localhost:3000';
finalCommand = 'final:serve';
}
util.log(`process.env.HUGO_ENV = '${process.env.HUGO_ENV}'`);
util.log(`process.env.HUGO_BASEURL = '${process.env.HUGO_BASEURL}'`);
});
gulp.task('scripts:games', function (callback) {
exec(`cd ./scripts/games/ && npm install && node app.js`, function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
callback(err);
});
});
gulp.task('scripts:twitter', function (callback) {
exec(`cd ./scripts/twitter/ && npm install && node app.js`, function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
callback(err);
});
});
gulp.task('scripts:wiki', function (callback) {
exec(`cd ./scripts/wiki/ && npm install && node app.js`, function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
callback(err);
});
});
gulp.task('assets:images', function() {
var baseImages = gulp.src(`build/images/*`, {base: './'})
.pipe(gulp.dest('./'));
var jumbotronImages = gulp.src(`build/images/jumbotron/*`, {base: './'})
.pipe(imageResize({ width: 786, height: 471, crop: true }))
.pipe(gulp.dest('./'));
var bannerImages = gulp.src(`build/images/banners/*`, {base: './'})
.pipe(imageResize({ width: 824, height: 306, crop: false }))
.pipe(gulp.dest('./'));
var boxartImages = gulp.src(`build/images/game/boxart/*`, {base: './'})
.pipe(imageResize({ width: 328, height: 300, crop: true }))
.pipe(gulp.dest('./'));
var iconImages = gulp.src(`build/images/game/icons/*`, {base: './'})
.pipe(imageResize({ width: 48, height: 48, crop: true }))
.pipe(gulp.dest('./'));
var screenshotImages = gulp.src(`build/images/screenshots/*`)
.pipe(imageResize({ width: 400, height: 240, crop: false }))
.pipe(gulp.dest(`build/images/screenshots/thumbs`));
return merge(baseImages, jumbotronImages, bannerImages, boxartImages, iconImages, screenshotImages);
});
gulp.task('assets:js', function() {
return gulp.src(['src/js/**/*.js'])
.pipe(concat('script.js'))
.pipe(gulp.dest('build/js'));
});
gulp.task('assets:fonts', function(){
return gulp.src('./node_modules/bootstrap-sass/assets/fonts/**/*')
.pipe(gulp.dest('build/fonts/'))
});
gulp.task('assets:scss', function () {
var postCssOptions = [ cssnano ];
return gulp.src('src/scss/style.scss')
.pipe(sass().on('error', sass.logError))
.pipe(postcss(postCssOptions))
.pipe(gulp.dest('build/css'))
.pipe(browserSync.stream());
});
// PHASE 2 - Building
gulp.task('hugo', function (cb) {
exec('hugo -s ./site/ -d ../public/ -v', function (err, stdout, stderr) {
exec('hugo -s ./site/ -d ../build/ -v', function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
cb(err);
});
});
gulp.task("css", ['hugo'], () => (
gulp.src(`${distPath}/css/**/*.css`, {base: './'})
.pipe(postcss([cssnext(), cssImport({from: `${distPath}/css/main.css`})]))
.pipe(gulp.dest('./'))
));
function fileChange(x) {
console.log(`[FileChange] File changed: ${x.path}`);
browserSync.reload(x);
}
gulp.task('images', ['hugo'], () => (
gulp.src(`${distPath}/images/*`, {base: './'})
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/images/jumbotron/*`, {base: './'})
.pipe(imageResize({ width: 786, height: 471, crop: true }))
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/images/banners/*`, {base: './'})
.pipe(imageResize({ width: 824, height: 306, crop: false }))
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/images/game/boxart/*`, {base: './'})
.pipe(imageResize({ width: 328, height: 300, crop: true }))
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/images/game/icons/*`, {base: './'})
.pipe(imageResize({ width: 48, height: 48, crop: true }))
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/images/screenshots/*`)
.pipe(imageResize({ width: 400, height: 240, crop: false }))
.pipe(gulp.dest(`${distPath}/images/screenshots/thumbs`))
));
gulp.task('repogen', ['hugo'], function (cb) {
exec('node app.js', {
cwd: "scripts/downloads"
}, function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
cb(err);
gulp.task('final:serve', function() {
browserSync.init({
open: false,
server: {
baseDir: 'build'
}
});
gulp.watch('src/js/**/*', ['assets:js']);
gulp.watch('src/scss/**/*', ['assets:scss']);
gulp.watch('site/**/*.html', ['hugo']);
gulp.watch('build/**/*').on('change', fileChange);
});
gulp.task('repo', ['repogen'], () => (
gulp.src(`scripts/downloads/build/**`)
.pipe(gulp.dest(`${distPath}/repository`))
));
// This task ensures all phases up to PHASE 2 are completed.
gulp.task('build', ['hugo', 'css', 'images', 'repo'], function (done) {
browsersync.reload();
done();
});
// STAGE 3 - Optimization
gulp.task('compress', ['build'], () => (
gulp.src(`${distPath}/js/**/*.js`, {base: './'})
.pipe(md5(10, `${distPath}/**/*.html`))
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/**/*.html`, {base: './'})
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest('./')),
gulp.src(`${distPath}/css/**/*.css`, {base: './'})
.pipe(cleanCSS())
.pipe(md5(10, `${distPath}/**/*.html`))
.pipe(gulp.dest('./'))
));
// STAGE 4 - Deploy
// Used for Development
gulp.task('serve', ['build'], () => {
// Serve files from the root of this project
browsersync({
server: {
baseDir: distPath
},
open: false
});
gulp.watch('./site/**/*', ['build']);
});
// Used for Production
gulp.task('deploy', ['setup', 'build', 'compress'], () => {
require('fs').writeFileSync(`${distPath}/CNAME`, `${cname}`);
require('fs').writeFileSync(`${distPath}/robots.txt`, `Sitemap: https://${cname}/sitemap.xml\n\nUser-agent: *`);
return gulp.src(`${distPath}/**/*`).pipe(ghPages(deployOptions));
gulp.task('final:publish', function(){
fs.writeFileSync(`build/CNAME`, `${cname}`);
fs.writeFileSync(`build/robots.txt`, `Sitemap: https://${cname}/sitemap.xml\n\nUser-agent: *`);
return gulp.src(`build/**/*`).pipe(ghPages({
remoteUrl: "git@github.com:CitraBotWeb/CitraBotWeb.github.io.git",
branch: "master"
}));
});