Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix and refactor gulp for branch v1.5 #36

Open
wants to merge 2 commits into
base: v1.5
Choose a base branch
from
Open

Fix and refactor gulp for branch v1.5 #36

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
622f2f5
Fix and refactor gulp
dunkelziffer Feb 7, 2022
f8132f7
Refactor gulp some more
dunkelziffer Feb 12, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,4 +22,4 @@
/local

# Idea project stuff
.idea
.idea
1 change: 1 addition & 0 deletions .nvmrc
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
lts/gallium
25 changes: 15 additions & 10 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ Roofpig is an animated, programmable and interactive Rubik's Cube for the modern
It should work on most [any modern browser](http://caniuse.com/canvas).

## 1. Usage
All you need is one file and a web server. Put [`roofpig_and_three.min.js`](https://raw.githubusercontent.com/larspetrus/Roofpig/master/roofpig_and_three.min.js) on your server. Include it, and jQuery 3.1.1 in your HTML:
All you need is one file and a web server. Put [`roofpig_and_three.min.js`](https://raw.githubusercontent.com/larspetrus/Roofpig/v1.5/roofpig_and_three.min.js) on your server. Include it, and jQuery 3.1.1 in your HTML:

```html
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
Expand All @@ -26,7 +26,7 @@ CubeAnimation.create_in_dom('#show-alg', "alg=R U R' U R U2 R'", "class='my-roof


## 2. data-config
In `data-config` you set values to properties. The format is `property1=value|prop2=other value | prop99=you get the idea`.
In `data-config` you set values to properties. The format is `property1=value|prop2=other value|prop99=you get the idea`.

This is a fully configured example cube:

Expand Down Expand Up @@ -140,22 +140,27 @@ To share between pages, you can for example put **"ROOFPIG_CONF_"**'s in a commo

### 3. Working with the code
1. Install Node and NPM - https://docs.npmjs.com/getting-started/installing-node
2. Clone/download this Github repository, and `cd` to the resulting directory
3. `npm install`
4. `sudo npm install -g gulp`
2. Install nvm - https://github.com/nvm-sh/nvm
3. Clone/download this Github repository, and `cd` to the resulting directory
4. `nvm install lts/gallium`
5. `nvm use`
6. `npm install`
7. `sudo npm install -g gulp`

Now the gulp task below should work. Let me know if it doesn't.

#### Building it
#### Running the prebuilt release version

The `demo.html` in the root directory shows multiple examples using the current release version.

`gulp build` on the command line creates a `roofpig_and_three.min.js` file in `local/build/`
#### Building it

`misc/demo_local.html` is a demo page using the built file. `misc/demo.html` is the same demo using the official release file.
Running `gulp build` or simply `gulp` on the command line creates a `roofpig_and_three.min.js` and a `local_demo.html` file in `local/build/`.

#### Testing it

#### Testing
Running `gulp test` creates everything needed for testing in `local/test/`. Open `mocha.html` in a browser to run the tests suite.

`gulp test` makes the `rptest.html` file for running the tests in a browser. `open rptest.html` is one way.

## 4. What's a Roofpig anyway?
[**"Most unexpected!"**](https://www.youtube.com/watch?v=PtO0diaiZEE&t=14m57s)
8 changes: 4 additions & 4 deletions misc/demo.html → demo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
</script>
</head>

<h1>RoofPig sample cubes.</h1>
<h1>RoofPig sample zoo.</h1>
<h3>Official release version</h3>

<body>
Expand All @@ -37,14 +37,14 @@ <h3>Official release version</h3>
<div style="height:235px; width: 190px;" class="roofpig" data-config="alg=M M' x y2 z' E E' S S' M E S M E S|flags=showalg"></div>
</td>
<td>
<div class="roofpig rp160" data-config="hover=none|speed=200|alg=L2 D U2 B2 L B> U'+U> F U' F U' F' L> U2 U' F2 UZ R2 U F R' F' R F' R2 F R' F R F' R2 F D R2 D' R' D R D' R' D R' D' R2"></div>
<div class="roofpig rp250" data-config="hover=far|setupmoves=D' U L' F D2 U B F' L U2 F2 B2 L2 F B D' L2 U2 F' D2"></div>
</td>
<td><div style="height:125px; width: 100px;" class="roofpig" data-config="base=F4|setupmoves=R' U R U|alg=R' U R U' R U2 R U2 R2"></div></td>
</tr>
</table>
</div>

<script src="../lib/jquery-3.1.1.min.js"></script>
<script src="../roofpig_and_three.min.js"></script>
<script src="lib/jquery-3.1.1.min.js"></script>
<script src="roofpig_and_three.min.js"></script>

</body>
78 changes: 46 additions & 32 deletions gulpfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,42 +9,51 @@ var uglify = require('gulp-uglify');

var dateFormat = require('dateformat');
var del = require('del');
var filenames = require('gulp-filenames');
var replace = require('gulp-replace');


// ------------- BUILD -----

var build_dir = 'local/build/';
var rp_js_file = 'roofpig.js';
var roofpig_file = 'roofpig.js';
var extras_file = '3extras.js';
var release_file = 'roofpig_and_three.min.js';

// ------------- BUILD -----

gulp.task('clean-build', function() {
function cleanBuild() {
return del(build_dir +'**/*');
});
}

gulp.task('build-rp', ['clean-build'], function() {
function roofpig() {
return gulp.src('src/**/*.coffee')
.pipe(cofcon('roofpig.coffee'))
.pipe(coffee({bare: true}).on('error', gutil.log))
.pipe(replace('@@BUILT_WHEN@@', dateFormat(new Date(), "yyyy-mm-dd HH:MM")))
.pipe(uglify())
.pipe(gulp.dest(build_dir));
});
}

gulp.task('build-3x', ['clean-build'], function() {
function extras() {
return gulp.src(['lib/Projector.js', 'lib/CanvasRenderer.js'])
.pipe(uglify())
.pipe(concat(extras_file))
.pipe(gulp.dest(build_dir));
}

async function createDemo() {
return gulp.src('demo.html')
.pipe(replace('Official release version', 'Local build version'))
.pipe(replace('src="lib/jquery-3.1.1.min.js"', 'src="../../lib/jquery-3.1.1.min.js"'))
.pipe(rename('local_demo.html'))
.pipe(gulp.dest(build_dir));
});
}

gulp.task('build', ['build-rp', 'build-3x'], function() {
gulp.src(['lib/three.min.js', build_dir + extras_file, build_dir + rp_js_file])
async function combine() {
return gulp.src(['lib/three.min.js', build_dir + extras_file, build_dir + roofpig_file])
.pipe(concat(release_file))
.pipe(gulp.dest(build_dir));
});
}

exports.default = exports.build = gulp.series(cleanBuild, gulp.parallel(roofpig, extras, createDemo), combine);


// ------------- TEST -----
Expand All @@ -53,37 +62,42 @@ var rename = require("gulp-rename");
var glob = require("glob");
//var sourcemaps = require('gulp-sourcemaps');

var js_dir = 'local/test_js/';
var test_js_dir = js_dir+'test/';
var test_dir = 'local/test/';
var rel_source_dir = 'src/';
var source_dir = test_dir + rel_source_dir;
var rel_spec_dir = 'specs/';
var spec_dir = test_dir + rel_spec_dir;

gulp.task('clean-js', function() {
return del(js_dir+'**/*');
});
function cleanTest() {
return del(test_dir + '**/*');
}

gulp.task('compile-test', ['clean-js'], function() {
function compileSpecs() {
return gulp.src('test/**/*.coffee')
// .pipe(sourcemaps.init())
.pipe(coffee({bare: true}).on('error', gutil.log))
// .pipe(sourcemaps.write())
.pipe(gulp.dest(test_js_dir));
});
.pipe(gulp.dest(spec_dir));
}

gulp.task('compile-src', ['clean-js'], function() {
function compileTestSource() {
return gulp.src('src/**/*.coffee')
.pipe(coffee({bare: true}).on('error', gutil.log))
.pipe(gulp.dest(js_dir+'src'));
});
.pipe(gulp.dest(source_dir));
}

gulp.task('test', ['compile-test', 'compile-src'], function(){
function renderMochaTemplate() {
var test_html = '';
glob.sync(test_js_dir+'**/*.js', {}).forEach(function(test_file){
test_html += '<script src="'+test_file+'"></script>\n';
glob.sync('**/*.js', {cwd: spec_dir}).forEach(function(test_file) {
test_html += '<script src="' + rel_spec_dir + test_file + '"></script>\n';
});

console.log("\nTests generated. `open rptest.html` can run them!\n")
console.log("\nTests generated. `open local/test/mocha.html` can run them!\n")

return gulp.src('misc/rptest_template.html')
return gulp.src('test/mocha.html')
.pipe(replace('@@TEST_FILES_GO_HERE@@', test_html))
.pipe(rename('rptest.html'))
.pipe(gulp.dest('.'));
});
.pipe(rename('mocha.html'))
.pipe(gulp.dest(test_dir));
}

exports.test = gulp.series(cleanTest, gulp.parallel(compileSpecs, compileTestSource), renderMochaTemplate);
50 changes: 0 additions & 50 deletions misc/demo_local.html
View file
Open in desktop

This file was deleted.

58 changes: 0 additions & 58 deletions misc/rptest_template.html
View file
Open in desktop

This file was deleted.

Loading