gaertneran68755/MDT-Webapps-Gulp
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Compare commits

base: gaertneran68755:1630464f7939232d3c8c1096ee7ab64f43aed689
Branches Tags
gaertneran68755:master
..
compare: gaertneran68755:190061ea8708471008e08b717446e5478520f5b0
Branches Tags
gaertneran68755:master

2 Commits
1630464f79 ... 190061ea87

Author SHA1 Message Date
Andrea Gaertner
190061ea87 einkaufsliste erstellt 2020-05-27 14:36:04 +02:00
Andrea Gaertner
c52c2536db Praktikum 1/2 und gulp.js 2020-04-30 17:03:44 +02:00
17 changed files with 311 additions and 0 deletions
Show Stats Expand all files Collapse all files

6
code/exercise03/app/css/mobile.css Normal file
View File

@ -0,0 +1,6 @@

h2 small{
color: lightgray;
font-size: small;
}

BIN
code/exercise03/app/img/ohm.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 446 B

19
code/exercise03/app/index.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>New Project</title>
<link rel="icon" href="img/ohm.ico">
<link rel="stylesheet" href="css/mobile.css">
</head>
<body>
<h2>
New Project
<small>Ein Demoprojekt</small>
</h2>
<script src="lib/es6-shim.min.js"></script>
<script src="lib/jquery-2.2.4.min.js"></script>
<script src="scripts/landung.js"></script>
</body>
</html>

12
code/exercise03/app/lib/es6-shim.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

4
code/exercise03/app/lib/jquery-2.2.4.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

5
code/exercise03/app/sass/style.scss Normal file
View File

@ -0,0 +1,5 @@
$bgColor: #ff0000;
body{
background:$bgColor;
}

1
code/exercise03/app/scripts/app.js Normal file
View File

@ -0,0 +1 @@
alert("Hello World!");

61
code/exercise03/app/scripts/landung.js Normal file
View File

@ -0,0 +1,61 @@

function simulation() {
function switchOn() {
schub = true;
update();
}
function switchOff() {
schub = false;
update();
}
function a() {
if (schub == false || fuel <= 0)
return -1.63;
else {
fuel = fuel - 100;
return -1.63 + 12;
}
}
function setStartValues() {
var v = -1000;
var s = 50000;
var fuel = 10000;
var schub = false;
}
function update() {
v = v + a();
s = s + v;
if (s <= 0) {
s = 0;
gameOver();
}
$("#height").html("Höhe: " + s + "m");
$("#speed").html("Geschwindigkeit: " + v + "m/s");
$("#fuel").html("Treibstoffvorrat: " + fuel + "l");
}
function gameOver() {
if (v > -10)
alert("Mondlandung geglückt!!!");
else
alert("Mondlandung gescheitert ...");
setStartValues();
}
$("body").append("<div id='height'>Höhe: </div>");
$("body").append("<div id='speed'>Geschwindigkeit: </div>");
$("body").append("<div id='fuel'>Treibstoffvorrat: </div>");
$("body").append("<button id='energy'>Triebwerk an</button>");
$("body").append("<button id='no-energy'>Triebwerk aus</button>");
$("#energy").click(switchOn);
$("#no-energy").click(switchOff);
setStartValues();
}
$(document).ready(simulation);

62
code/exercise03/gulpfile.js Normal file
View File

@ -0,0 +1,62 @@
const gulp = require('gulp');
const imagemin = require('gulp-imagemin');
const uglify = require('gulp-uglify');
const sass = require('gulp-sass');
const concat = require('gulp-concat');
/*
* Toplevelfunction
* gulp.task
* gulp.src
* gulp.dest
* gulp.watch
*/
// Logs Message
gulp.task('message', function () {
return console.log('Gulp is running...');
});
// Copy All HTML files
gulp.task('copyHtml', function () {
gulp.src('app/*.html')
.pipe(gulp.dest('dist'));
});
// Optimize Images
gulp.task('imageMin', () =>
gulp.src('app/img/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/images'))
);
// Minify JS
gulp.task('minify', function () {
gulp.src('app/scripts/*.js')
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
});
// Compile Sass
gulp.task('sass', function () {
gulp.src('app/sass/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('dist/css'));
});
// Scripts
gulp.task('scripts', function () {
gulp.src('app/scripts/*.js')
.pipe(concat('app.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
});
gulp.task('default', ['message', 'copyHtml', 'imageMin', 'sass', 'scripts']);
/*
gulp.task('watch', function () {
gulp.watch('app/scripts/*.js', ['scripts']);
gulp.watch('app/img/*', ['imageMin']);
gulp.watch('app/sass/*.scss', ['sass']);
gulp.watch('app/*.html', ['copyHtml']);
});*/

1
code/exercise04/README.txt Normal file
View File

@ -0,0 +1 @@
Hier entsteht die Lösung zu Praktikum 04

14
code/exercise04/app/css/style.css Normal file
View File

@ -0,0 +1,14 @@
body {
background-color: lightblue;
text-align: center;
}
div {
padding-top: 20px;
border-style: groove;
border-color: black;
background-image: url("../img/schriftrolle.png");
background-repeat: no-repeat;
background-position: center top;
margin-left: 300px;
margin-right: 300px;
}

22
code/exercise04/app/einkaufsliste.html Normal file
View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Einkaufsliste</title>
<link rel="icon" href="img/ohm.ico">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h2>
Einkaufsliste
<img src="img/kisspng-shopping-bag-grocery-store-shopping-cart-vegetable-bag2-myspeedyx-5cb7cce50fbf87.6493526215555494130645.png" id="einkaufstüte" width="50" height="50"/>
</h2>
<div id="liste">
</div>
<input type="text" id="element" ondblclick="onClick()" />
<input type="button" id="button" value="Hinzufügen" onclick="onClick()" />
<script src="scripts/einkaufsliste.js"></script>
</body>
</html>

BIN
code/exercise04/app/img/kisspng-shopping-bag-grocery-store-shopping-cart-vegetable-bag2-myspeedyx-5cb7cce50fbf87.6493526215555494130645.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 609 KiB

BIN
code/exercise04/app/img/ohm.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 446 B

BIN
code/exercise04/app/img/schriftrolle.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.4 KiB

25
code/exercise04/app/scripts/einkaufsliste.js Normal file
View File

@ -0,0 +1,25 @@

var counter = 0;
function onClick() {
var element = document.getElementById("element");
console.log(element.value);
add(element.value);
}
function add(input) {
counter++;
var liste = document.getElementById("liste");
var checkbox = document.createElement("input");
checkbox.setAttribute("type", "checkbox");
checkbox.setAttribute("id", "cb" + counter);
var label = document.createElement("label");
label.innerHTML = input;
label.setAttribute("for", "cb" + counter);
liste.appendChild(checkbox);
liste.appendChild(label);
liste.appendChild(document.createElement("br"));
}

79
gulpfile.js Normal file
View File

@ -0,0 +1,79 @@
const gulp = require('gulp');
const imagemin = require('gulp-imagemin');
const uglify = require('gulp-uglify');
const uglifycss = require('gulp-uglifycss');
const sass = require('gulp-sass');
const concat = require('gulp-concat');
/*
* Toplevelfunction
* gulp.task
* gulp.src
* gulp.dest
* gulp.watch
*/
// Logs Message
gulp.task('message', async function () {
return console.log('Gulp is running...');
});
// Copy All HTML files
gulp.task('copyHtml', async function () {
gulp.src('app/*.html')
.pipe(gulp.dest('dist'));
});
// Optimize Images
gulp.task('imageMin', async function () {
gulp.src('app/img/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/images'))
});
// Minify JS
gulp.task('minify', async function () {
gulp.src('app/scripts/*.js')
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
});
// Compile Sass
gulp.task('sass', async function () {
gulp.src('app/sass/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('app/css'));
});
// Minify CSS
gulp.task('css', async function () {
gulp.src('app/css/*.css')
.pipe(uglifycss({
"maxLineLen": 80,
"uglyComments": true
}))
.pipe(gulp.dest('./dist/css'));
});
// Scripts
gulp.task('scripts', async function () {
gulp.src('app/scripts/*.js')
.pipe(concat('landung.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
});
gulp.task('run', function(done) { // <--- Insert `done` as a parameter here...
gulp.series('message','sass', 'css', 'copyHtml', 'imageMin', 'scripts')
done(); // <--- ...and call it here.
})
/*
gulp.task('default', ['message', 'copyHtml', 'imageMin', 'sass', 'scripts']);
*/
gulp.task('watch', async function () {
gulp.watch('app/scripts/*.js', gulp.series('scripts'));
gulp.watch('app/img/*', gulp.series('imageMin'));
gulp.watch('app/sass/*.scss', gulp.series('sass'));
gulp.watch('app/css/*.css', gulp.series('css'));
gulp.watch('app/*.html', gulp.series('copyHtml'));
});