saschas/basic_setup.sh

## basic_setup.sh
#!/bin/bash


mkdir assets


#__________ create index.html
cat <<EOF > index.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>basic setup</title>

	<link href="dist/css/stylesheet.min.css" rel="stylesheet">
</head>
<body>


<script src="dist/js/three_and_controls.min.js"></script>
<script src="dist/js/main.min.js"></script>
</body>
</html>
EOF


#__________ create folders

cd assets

	mkdir scss

  mkdir js
	mkdir external_js
  cd external_js
    curl http://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.min.js > three.min.js
    curl https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js > orbit_controls.js
  cd ..

  mkdir textures
	mkdir json


#__________ create stylesheet

cd scss
cat <<EOF > stylesheet.scss

*{
	box-sizing:border-box;
}

html,body{
	width:100%;
	height:100%;
}

body{
	margin:0;
}
EOF


#__________ create js
cd ..
cd js

cat <<EOF > main_script.js

/*
	Basic Setup
*/
(function(){

//__________ Variables

var main_color = 0xffffff;
var time = 0;
var canvas_height = window.innerHeight;
var canvas_width = window.innerWidth;
//__________ scene
var scene = new THREE.Scene();

//__________ camera
var camera = new THREE.PerspectiveCamera( 125, canvas_width/canvas_height, 0.1, 1000 );

  camera.position.set(0,50,200);
  camera.lookAt(new THREE.Vector3(0,50,0));
	scene.add(camera);
//__________ renderer

var renderer = new THREE.WebGLRenderer({
      alpha: true,
      antialias:true
    });
    renderer.setSize( canvas_width, canvas_height );
    renderer.shadowMap.enabled = true;
    renderer.shadowMap.type = THREE.PCFSoftShadowMap;
    renderer.setClearColor(main_color,1);

    document.body.appendChild( renderer.domElement );

//__________ resize

window.onresize = function(){
  canvas_height = window.innerHeight;
  canvas_width = window.innerWidth;
  camera.aspect = canvas_width / canvas_height;
  camera.updateProjectionMatrix();
  renderer.setSize( canvas_width, canvas_height );
}

//__________ controls

  controls = new THREE.OrbitControls( camera );

  controls.damping = 0.2;
  controls.maxPolarAngle = Math.PI/2;
  controls.minPolarAngle = 1;
  controls.minDistance = 100;
  controls.maxDistance = 220;


//__________ light

var spotLight = new THREE.SpotLight(0xffffff);
    spotLight.position.set( 0, 100, 100 );
    spotLight.intensity = 1;
    spotLight.castShadow = true;
    scene.add(spotLight);

//__________ cubes

var base_material = new THREE.MeshLambertMaterial( { color: 0xffffff } );
var box = new THREE.BoxGeometry( 5, 5, 5 );

for ( var i = 0; i < 500; i ++ ) {
  var mesh = new THREE.Mesh( box , base_material );
      mesh.position.x = ( Math.random() - 0.5 ) * 500;
      mesh.position.y = ( Math.random() - 0.5 ) * 500;
      mesh.position.z = ( Math.random() - 0.5 ) * 500;
      mesh.updateMatrix();
      mesh.matrixAutoUpdate = false;
      scene.add( mesh );
}

//__________ render
var render = function (time) {
  requestAnimationFrame( render );
  controls.update();
  animation(time);
  renderer.render(scene, camera);
};

//__________ animation

function animation(time){
  // scene.rotation.y  -= .0005;
};

//__________

render(time);


}()); //__eof

EOF

cd ../..


##################################################### GULP CONFIG

cat <<EOF > package.json
	{
  "name": "basic_setup",
  "version": "1.0.0",
  "description": "Basic Setup",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "boilerplate"
  ],
  "author": "Sascha Sigl",
  "license": "ISC",
  "devDependencies": {
    "del": "2.2.0",
    "gulp": "3.9.1",
    "gulp-autoprefixer": "3.1.0",
    "gulp-cache": "0.4.5",
    "gulp-concat": "2.6.0",
    "gulp-cssnano": "2.1.2",
    "gulp-documentation": "2.2.0",
    "gulp-imagemin": "3.0.1",
    "gulp-notify": "2.2.0",
    "gulp-rename": "1.2.2",
    "gulp-ruby-sass": "2.0.6",
    "gulp-uglify": "1.5.3"
  }
}


EOF
##################################################### GULP CONFIG


cat <<EOF > gulpfile.js

/*!
 * $ npm install
 * $ gulp
 * $ gulp watch
 */

// Load plugins
var gulp = require('gulp'),
    sass = require('gulp-ruby-sass'),
    autoprefixer = require('gulp-autoprefixer'),
    cssnano = require('gulp-cssnano'),
    uglify = require('gulp-uglify'),
    imagemin = require('gulp-imagemin'),
    rename = require('gulp-rename'),
    concat = require('gulp-concat'),
    notify = require('gulp-notify'),
    cache = require('gulp-cache'),
    documentation = require('gulp-documentation'),
    del = require('del');

// Styles
gulp.task('styles', function() {
  return sass('assets/scss/stylesheet.scss', { style: 'expanded' })
    .pipe(autoprefixer('last 2 version'))
    .pipe(gulp.dest('dist/css'))
    .pipe(rename({ suffix: '.min' }))
    .pipe(cssnano())
    .pipe(gulp.dest('dist/css'))
    .pipe(notify({ message: 'Styles task complete' }));
});


gulp.task('documentation', function () {
  return gulp.src([
      'assets/js/main_script.js'
    ])
    .pipe(concat('main_documentation.js'))
    .pipe(gulp.dest('documentation'))
    .pipe(documentation({ format: 'html' }))
    .pipe(gulp.dest('documentation'));

});


// Scripts
gulp.task('scripts', function() {
  return gulp.src([
      'assets/js/main_script.js'
    ])
    .pipe(concat('main.js'))
    .pipe(gulp.dest('dist/js'))
    .pipe(rename({ suffix: '.min' }))
    .pipe(uglify())
    .pipe(gulp.dest('dist/js'))
    .pipe(notify({ message: 'Scripts task complete' }));
});


gulp.task('external_scripts', function() {
  return gulp.src([
      'assets/external_js/three.min.js',
      'assets/external_js/orbit_controls.js'
    ])
    .pipe(concat('three_and_controls.js'))
    .pipe(gulp.dest('dist/js'))
    .pipe(rename({ suffix: '.min' }))
    .pipe(uglify())
    .pipe(gulp.dest('dist/js'))
    .pipe(notify({ message: 'External Scripts task complete' }));
});

// Images
gulp.task('images', function() {
  return gulp.src('assets/textures/**/*')
    .pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true })))
    .pipe(gulp.dest('dist/textures'))
    .pipe(notify({ message: 'Images task complete' }));
});


// Clean
gulp.task('clean', function() {
  return del(['dist/css', 'dist/js', 'dist/images']);
});

// Default task
gulp.task('default', ['clean'], function() {
  gulp.start('styles', 'external_scripts', 'scripts', 'images','documentation');
});

// Watch
gulp.task('watch', function() {

  // Watch .scss files
  gulp.watch('assets/scss/**/*.scss', ['styles']);

  // Watch .js files
  gulp.watch('assets/js/**/*.js', ['scripts','documentation']);

  gulp.watch('assets/external_js/**/*.js', ['external_scripts']);

  // Watch image files
  gulp.watch('assets/textures/**/*', ['images']);


});

EOF

####################################################################
########### SIMPLE HTTP SERVER ON PORT 8080


python -m SimpleHTTPServer 8080
	#!/bin/bash


	mkdir assets



	#__________ create index.html
	cat <<EOF > index.html

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>basic setup</title>

	<link href="dist/css/stylesheet.min.css" rel="stylesheet">
	</head>
	<body>


	<script src="dist/js/three_and_controls.min.js"></script>
	<script src="dist/js/main.min.js"></script>
	</body>
	</html>
	EOF


	#__________ create folders

	cd assets

	mkdir scss

	mkdir js
	mkdir external_js
	cd external_js
	curl http://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.min.js > three.min.js
	curl https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js > orbit_controls.js
	cd ..

	mkdir textures
	mkdir json


	#__________ create stylesheet

	cd scss
	cat <<EOF > stylesheet.scss

	*{
	box-sizing:border-box;
	}

	html,body{
	width:100%;
	height:100%;
	}

	body{
	margin:0;
	}
	EOF


	#__________ create js
	cd ..
	cd js

	cat <<EOF > main_script.js

	/*
	Basic Setup
	*/
	(function(){

	//__________ Variables

	var main_color = 0xffffff;
	var time = 0;
	var canvas_height = window.innerHeight;
	var canvas_width = window.innerWidth;
	//__________ scene
	var scene = new THREE.Scene();

	//__________ camera
	var camera = new THREE.PerspectiveCamera( 125, canvas_width/canvas_height, 0.1, 1000 );

	camera.position.set(0,50,200);
	camera.lookAt(new THREE.Vector3(0,50,0));
	scene.add(camera);
	//__________ renderer

	var renderer = new THREE.WebGLRenderer({
	alpha: true,
	antialias:true
	});
	renderer.setSize( canvas_width, canvas_height );
	renderer.shadowMap.enabled = true;
	renderer.shadowMap.type = THREE.PCFSoftShadowMap;
	renderer.setClearColor(main_color,1);

	document.body.appendChild( renderer.domElement );

	//__________ resize

	window.onresize = function(){
	canvas_height = window.innerHeight;
	canvas_width = window.innerWidth;
	camera.aspect = canvas_width / canvas_height;
	camera.updateProjectionMatrix();
	renderer.setSize( canvas_width, canvas_height );
	}

	//__________ controls

	controls = new THREE.OrbitControls( camera );

	controls.damping = 0.2;
	controls.maxPolarAngle = Math.PI/2;
	controls.minPolarAngle = 1;
	controls.minDistance = 100;
	controls.maxDistance = 220;


	//__________ light

	var spotLight = new THREE.SpotLight(0xffffff);
	spotLight.position.set( 0, 100, 100 );
	spotLight.intensity = 1;
	spotLight.castShadow = true;
	scene.add(spotLight);

	//__________ cubes

	var base_material = new THREE.MeshLambertMaterial( { color: 0xffffff } );
	var box = new THREE.BoxGeometry( 5, 5, 5 );

	for ( var i = 0; i < 500; i ++ ) {
	var mesh = new THREE.Mesh( box , base_material );
	mesh.position.x = ( Math.random() - 0.5 ) * 500;
	mesh.position.y = ( Math.random() - 0.5 ) * 500;
	mesh.position.z = ( Math.random() - 0.5 ) * 500;
	mesh.updateMatrix();
	mesh.matrixAutoUpdate = false;
	scene.add( mesh );
	}

	//__________ render
	var render = function (time) {
	requestAnimationFrame( render );
	controls.update();
	animation(time);
	renderer.render(scene, camera);
	};

	//__________ animation

	function animation(time){
	// scene.rotation.y -= .0005;
	};

	//__________

	render(time);



	}()); //__eof

	EOF

	cd ../..


	##################################################### GULP CONFIG

	cat <<EOF > package.json
	{
	"name": "basic_setup",
	"version": "1.0.0",
	"description": "Basic Setup",
	"scripts": {
	"test": "echo \"Error: no test specified\" && exit 1"
	},
	"keywords": [
	"boilerplate"
	],
	"author": "Sascha Sigl",
	"license": "ISC",
	"devDependencies": {
	"del": "2.2.0",
	"gulp": "3.9.1",
	"gulp-autoprefixer": "3.1.0",
	"gulp-cache": "0.4.5",
	"gulp-concat": "2.6.0",
	"gulp-cssnano": "2.1.2",
	"gulp-documentation": "2.2.0",
	"gulp-imagemin": "3.0.1",
	"gulp-notify": "2.2.0",
	"gulp-rename": "1.2.2",
	"gulp-ruby-sass": "2.0.6",
	"gulp-uglify": "1.5.3"
	}
	}




	EOF
	##################################################### GULP CONFIG


	cat <<EOF > gulpfile.js

	/*!
	* $ npm install
	* $ gulp
	* $ gulp watch
	*/

	// Load plugins
	var gulp = require('gulp'),
	sass = require('gulp-ruby-sass'),
	autoprefixer = require('gulp-autoprefixer'),
	cssnano = require('gulp-cssnano'),
	uglify = require('gulp-uglify'),
	imagemin = require('gulp-imagemin'),
	rename = require('gulp-rename'),
	concat = require('gulp-concat'),
	notify = require('gulp-notify'),
	cache = require('gulp-cache'),
	documentation = require('gulp-documentation'),
	del = require('del');

	// Styles
	gulp.task('styles', function() {
	return sass('assets/scss/stylesheet.scss', { style: 'expanded' })
	.pipe(autoprefixer('last 2 version'))
	.pipe(gulp.dest('dist/css'))
	.pipe(rename({ suffix: '.min' }))
	.pipe(cssnano())
	.pipe(gulp.dest('dist/css'))
	.pipe(notify({ message: 'Styles task complete' }));
	});


	gulp.task('documentation', function () {
	return gulp.src([
	'assets/js/main_script.js'
	])
	.pipe(concat('main_documentation.js'))
	.pipe(gulp.dest('documentation'))
	.pipe(documentation({ format: 'html' }))
	.pipe(gulp.dest('documentation'));

	});


	// Scripts
	gulp.task('scripts', function() {
	return gulp.src([
	'assets/js/main_script.js'
	])
	.pipe(concat('main.js'))
	.pipe(gulp.dest('dist/js'))
	.pipe(rename({ suffix: '.min' }))
	.pipe(uglify())
	.pipe(gulp.dest('dist/js'))
	.pipe(notify({ message: 'Scripts task complete' }));
	});


	gulp.task('external_scripts', function() {
	return gulp.src([
	'assets/external_js/three.min.js',
	'assets/external_js/orbit_controls.js'
	])
	.pipe(concat('three_and_controls.js'))
	.pipe(gulp.dest('dist/js'))
	.pipe(rename({ suffix: '.min' }))
	.pipe(uglify())
	.pipe(gulp.dest('dist/js'))
	.pipe(notify({ message: 'External Scripts task complete' }));
	});

	// Images
	gulp.task('images', function() {
	return gulp.src('assets/textures/*/')
	.pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true })))
	.pipe(gulp.dest('dist/textures'))
	.pipe(notify({ message: 'Images task complete' }));
	});


	// Clean
	gulp.task('clean', function() {
	return del(['dist/css', 'dist/js', 'dist/images']);
	});

	// Default task
	gulp.task('default', ['clean'], function() {
	gulp.start('styles', 'external_scripts', 'scripts', 'images','documentation');
	});

	// Watch
	gulp.task('watch', function() {

	// Watch .scss files
	gulp.watch('assets/scss/*/.scss', ['styles']);

	// Watch .js files
	gulp.watch('assets/js/*/.js', ['scripts','documentation']);

	gulp.watch('assets/external_js/*/.js', ['external_scripts']);

	// Watch image files
	gulp.watch('assets/textures/*/', ['images']);


	});

	EOF

	####################################################################
	########### SIMPLE HTTP SERVER ON PORT 8080


	python -m SimpleHTTPServer 8080