sebse/kuerbiskern-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

List implemented

Browse Source
This commit is contained in:
Sebastian Seedorf
2019-01-11 16:57:22 +01:00
parent 62985d2e2a
commit fc582eb48c
11 changed files with 241 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

142
views/index.pug
View File

@@ -1,7 +1,7 @@
extends layout
mixin rangemaker(id)
.mdl-grid(style="width:100px;text-align:center;padding:0;margin:0", id=id)
mixin rangemaker(id, start)
.mdl-grid(style="width:100px;text-align:center;padding:0;margin:0", id=id, data-value=(start || "4"), data-dosend=(start !== undefined))
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.minus-arrow.mdl-list__item-secondary-action(href='#')
i.material-icons remove
@@ -12,36 +12,12 @@ mixin rangemaker(id)
a.plus-arrow.mdl-list__item-secondary-action(href='#')
i.material-icons add
script.
let m = null;
let rangediv = document.getElementById('#{id}');
rangediv.getElementsByClassName('mdl-progress')[0].addEventListener('mdl-componentupgraded', function () {
m = this.MaterialProgress;
this.MaterialProgress.setProgress(100 * 3 / 7);
});
rangediv.getElementsByClassName('mdl-list__item-secondary-info')[0].innerHTML = "3/7";
rangediv.getElementsByClassName('minus-arrow')[0].addEventListener('click', function () {
m.setProgress(100);
});
addProgressBarFunctionality('#{id}')
block content
style.
.demo-card-square.mdl-card {
width: 100%;
}
.demo-card-square > .mdl-card__title {
color: #fff;
background: #795548;
}
.mdl-selectfield__select option {
font-family: "Helvetica", "Arial", sans-serif;
}
script(src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.13.3/dist/tf.min.js", defer)
script(src="/js/neuralnet.js", defer)
//script(src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.13.3/dist/tf.min.js", defer)
//script(src="/js/neuralnet.js", defer)
.mdl-grid
.mdl-cell--3-offset-desktop
.mdl-cell.mdl-cell--6-col.mdl-cell--12-col-tablet
@@ -50,7 +26,7 @@ block content
h2.mdl-card__title-text Über diese Seite
.mdl-card__supporting-text
| Auf dieser Website kannst Du Deine Lieblingscocktails speichern und beim nächsten Mal wieder bestellen!
h3 Freiwillige Informationen
h4 Freiwillige Informationen
| Du kannst anonym Dein Alter und Geschlecht angeben, um die Cocktails weiter verbessern zu können.
.form
.mdl-selectfield.mdl-js-selectfield.mdl-selectfield--floating-label
@@ -76,83 +52,35 @@ block content
.mdl-card__title.mdl-card--expand
h2.mdl-card__title-text Lieblingscocktails
.mdl-card__supporting-text
ul.demo-list-two.mdl-list
li.mdl-list__item.mdl-list__item--two-line
span.mdl-list__item-primary-content
i.material-icons.mdl-list__item-avatar local_bar
span Bryan Cranston
span.mdl-list__item-sub-title 62 Episodes, 62 Episodes, 62 Episodes, 62 Episodes, 62 Episodes, 62 Episodes, 62 Episodes
span.mdl-list__item-secondary-content
.mdl-grid(style="width:100px;text-align:center;padding:0;margin:0")
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.mdl-list__item-secondary-action(href='#')
i.material-icons remove
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
#p1.mdl-progress.mdl-js-progress(style="text-align:center")
span.mdl-list__item-secondary-info 6/7
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.mdl-list__item-secondary-action(href='#')
i.material-icons add
script.
document.querySelector('#p1').addEventListener('mdl-componentupgraded', function () {
this.MaterialProgress.setProgress(100 * 6 / 7);
});
li.mdl-list__item.mdl-list__item--two-line
span.mdl-list__item-primary-content
i.material-icons.mdl-list__item-avatar local_bar
span Aaron Paul
span.mdl-list__item-sub-title 62 Episodes
span.mdl-list__item-secondary-content
.mdl-grid(style="width:100px;text-align:center;padding:0;margin:0")
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.mdl-list__item-secondary-action(href='#')
i.material-icons remove
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
#p2.mdl-progress.mdl-js-progress(style="text-align:center")
span.mdl-list__item-secondary-info 2/7
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.mdl-list__item-secondary-action(href='#')
i.material-icons add
script.
document.querySelector('#p2').addEventListener('mdl-componentupgraded', function () {
this.MaterialProgress.setProgress(100 * 2 / 7);
});
li.mdl-list__item.mdl-list__item--two-line
span.mdl-list__item-primary-content
i.material-icons.mdl-list__item-avatar local_bar
span Bob Odenkirk
span.mdl-list__item-sub-title 62 Episodes
span.mdl-list__item-secondary-content
.mdl-grid(style="width:100px;text-align:center;padding:0;margin:0")
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.mdl-list__item-secondary-action(href='#')
i.material-icons remove
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
#p3.mdl-progress.mdl-js-progress(style="text-align:center")
span.mdl-list__item-secondary-info 5/7
.mdl-cell(style="width:33.33333333%;margin-right:0px;margin-left:0px")
a.mdl-list__item-secondary-action(href='#')
i.material-icons add
script.
document.querySelector('#p3').addEventListener('mdl-componentupgraded', function () {
this.MaterialProgress.setProgress(100 * 5 / 7);
});
br
.form
.mdl-grid
.mdl-cell--6-col
.mdl-selectfield.mdl-js-selectfield.mdl-selectfield--floating-label
select#gender.mdl-selectfield__select
option(value='')
each val in cocktails
option(value=val[3])= val[2] + " - " + val[3]
label.mdl-selectfield__label(for='gender') New cocktail
span.mdl-selectfield__error Select a value
.mdl-cell--3-col
+rangemaker("pnew")
.mdl-cell--3-col
button.mdl-button.mdl-js-button.mdl-button--fab.mdl-js-ripple-effect
i.material-icons add
#cocktaillist.ul.demo-list-two.mdl-list
each cocktail in user.cocktails
- index = cocktailList.indexOf(cocktail.cocktail)
- cdetails = cocktails[index]
li.mdl-list__item.mdl-list__item--two-line
span.mdl-list__item-primary-content
i.material-icons.mdl-list__item-avatar local_bar
span= cocktail.cocktail
span.mdl-list__item-sub-title= cdetails[7].replace(/;/g, ', ')
span.mdl-list__item-secondary-content
+rangemaker(cocktail.cocktail, cocktail.level)
br
br
br
#newcocktail.form
.mdl-grid
.mdl-cell--6-col
.mdl-selectfield.mdl-js-selectfield.mdl-selectfield--floating-label
select#cocktails.mdl-selectfield__select
option(value='')
each val in cocktails
option(value=val[3])= val[2] + " - " + val[3]
label.mdl-selectfield__label(for='cocktails') New cocktail
span.mdl-selectfield__error Select a value
.mdl-cell--3-col
+rangemaker("pnew")
.mdl-cell--3-col
button.mdl-button.mdl-js-button.mdl-button--fab.mdl-js-ripple-effect(onclick="sendNewCocktail()")
i.material-icons add
//.mdl-card__actions.mdl-card--border
// a.mdl-button.mdl-button--colored.mdl-js-button.mdl-js-ripple-effect
// | View Updates