Skip to content

Commit 4bc68c1

Browse files
ozmosozmos
committed
build
1 parent c2e6a65 commit 4bc68c1

File tree

6 files changed

+86
-74
lines changed

6 files changed

+86
-74
lines changed

‎deploy.sh

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
#!/usr/bin/env sh
2+
3+
# abort on errors
4+
set -e
5+
6+
# build
7+
npm run build
8+
9+
# navigate into the build output directory
10+
cd dist
11+
12+
git init
13+
git add -A
14+
git commit -m 'deploy'
15+
16+
git push -f [email protected]:ozmos/flow-calc-v.git master:gh-pages
17+
18+
cd -

‎src/components/Calculator.vue

+21-6
Original file line numberDiff line numberDiff line change
@@ -2,46 +2,53 @@
22

33
<div class="card">
44
<CalcHeader :title="title" :subtitle="subtitle" />
5-
<FlowSettings v-show="!flowIsSet" :pressureRange="pressureRange" :flowRange="flowRange" :pressure="pressure" :flow="flow" @set="setFlow" />
6-
<DisplaySettings :flow="flow" :pressure="pressure" v-show="flowIsSet" @reset="showFlowSettings" />
5+
<article class="card-content has-background-light" id="flow-settings" v-show="!flowIsSet">
6+
<FlowSettings :pressureRange="pressureRange" :flowRange="flowRange" :pressure="pressure" :flow="flow" />
7+
</article>
8+
<DisplaySettings :flow="flow" :pressure="pressure" v-show="flowIsSet" @toggle="toggleMenu"/>
9+
<Sidebar v-show="showMenu" @toggle="toggleMenu" :pressureRange="pressureRange" :flowRange="flowRange" :pressure="pressure" :flow="flow" :info="{name: 'Rainbird 3500 series', description: 'gear drive sprinkler'}"/>
710

811
<NozzleDisplay :nozzles="currentNozzleData" :flow="flow" v-show="flowIsSet"/>
912

1013
</div>
1114
</template>
1215

1316
<script>
17+
import {bus} from '../main';
1418
import nozzleData from '@/data/nozzleData.js';
1519
import CalcHeader from './CalcHeader.vue';
1620
import FlowSettings from './FlowSettings.vue';
1721
import DisplaySettings from './DisplaySettings.vue';
22+
import Sidebar from './Sidebar.vue';
1823
import NozzleDisplay from './NozzleDisplay.vue';
1924
2025
export default {
2126
components: {
22-
CalcHeader, FlowSettings, DisplaySettings, NozzleDisplay
27+
CalcHeader, FlowSettings, DisplaySettings, NozzleDisplay, Sidebar
2328
},
2429
data() {
2530
return {
2631
title: "Flow Calculator",
2732
subtitle: "You pocket irrigation buddy",
2833
2934
flowIsSet: false,
30-
pressure: 0,
3135
flow: 20,
36+
pressure: 0,
3237
flowRange: {
3338
min: 2,
3439
max: null
3540
},
3641
nozzles: nozzleData,
3742
currentNozzleData: {},
43+
showMenu : false
3844
}
3945
},
4046
4147
computed: {
4248
pressureRange() {
4349
return Object.keys(this.nozzles);
44-
}
50+
},
51+
4552
},
4653
4754
methods: {
@@ -57,7 +64,15 @@
5764
this.flowIsSet = false;
5865
},
5966
60-
67+
toggleMenu() {
68+
this.showMenu = !this.showMenu;
69+
}
70+
},
71+
72+
created() {
73+
bus.$on('set', (flow, pressure) => {
74+
this.setFlow(flow, pressure);
75+
})
6176
},
6277
6378
}

‎src/components/DisplaySettings.vue

+5-18
Original file line numberDiff line numberDiff line change
@@ -14,27 +14,19 @@
1414
</div>
1515
|
1616
<div class="level-item">
17-
<button class="button is-small is-info is-uppercase has-text-weight-bold" @click="toggleMenu">info</button>
18-
</div>
19-
<div class="level-item">
20-
<button class="button is-small is-warning is-uppercase has-text-weight-bold" @click="$emit('reset')">
21-
change flow
22-
</button>
17+
<button class="button is-small is-info is-uppercase has-text-weight-bold" @click="$emit('toggle')">settings</button>
2318
</div>
19+
2420
</div>
2521
<!-- /.level -->
26-
<sidebar v-show="showMenu" @toggle="toggleMenu"/>
22+
2723
</div>
2824
</transition>
2925
</template>
3026

3127
<script>
32-
import Sidebar from './Sidebar.vue';
28+
3329
export default {
34-
components: {
35-
Sidebar
36-
},
37-
// name: 'DisplaySettings',
3830
props: {
3931
pressure: {
4032
type: Number
@@ -46,15 +38,10 @@
4638
4739
data() {
4840
return {
49-
showMenu : false
41+
//
5042
}
5143
},
5244
53-
methods: {
54-
toggleMenu() {
55-
this.showMenu = !this.showMenu;
56-
}
57-
},
5845
5946
6047
}

‎src/components/FlowSettings.vue

+10-6
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
enter-active-class="slideInDown"
55
leave-active-class="zoomUp"
66
> -->
7-
<article class="card-content has-background-light" id="flow-settings">
8-
7+
8+
<div>
99
<div class="field" id="flow">
10-
<label class="label">Enter your flow in litres per minute</label>
10+
<label class="label">Flow rate</label>
1111
<div class="control is-flex is-align-items-center" id="flow">
1212
<!-- <input type="number" v-model="localFlow" :min="flowRange.min" :max="flowRange.max"> -->
1313
<NumberInput v-model="localFlow" :min="flowRange.min" :max="flowRange.max" @changeCount="updateFlow" :value="flow"/>
@@ -16,7 +16,7 @@
1616
</div>
1717
<!-- ./field -->
1818
<div class="field" id="pressure">
19-
<label class="label">Select your working pressure in kilopascals</label>
19+
<label class="label">Pressure</label>
2020
<div class="control has-icons-right is-flex is-align-items-center">
2121
<div class="select">
2222
<select v-model="localPressure">
@@ -31,15 +31,16 @@
3131
<!-- /.field -->
3232
<div class="field">
3333
<div class="control">
34-
<button class="button is-link" @click="$emit('set', localFlow, localPressure)">Set pressure and flow</button>
34+
<button class="button is-link" @click="set">Set</button>
3535
</div>
3636

3737
</div>
38-
</article>
38+
</div>
3939
<!-- </transition> -->
4040
</template>
4141

4242
<script>
43+
import { bus } from '../main';
4344
import NumberInput from './NumberInput.vue';
4445
export default {
4546
components: {
@@ -67,6 +68,9 @@
6768
methods: {
6869
updateFlow(count) {
6970
this.localFlow = count;
71+
},
72+
set() {
73+
bus.$emit('set', this.localFlow, this.localPressure)
7074
}
7175
}
7276

‎src/components/Sidebar.vue

+29-44
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,35 @@
11
<template>
22
<transition name="slideLeft">
3-
<aside id="sidebar" class="menu is-overlay has-background-white is-active">
4-
<span class="is-size-3 is-pulled-right m-2" aria-label="close" @click="$emit('toggle')">&#10005;</span>
3+
<aside id="sidebar" class="is-overlay has-background-white is-active box">
4+
<!-- <span class="is-size-3 is-pulled-right has-line-height-1" aria-label="close" @click="$emit('toggle')">&#10005;</span> -->
5+
<article class="block">
6+
<button class="delete is-large is-pulled-right" @click="$emit('toggle')"></button>
7+
<p class="menu-label">Flow Settings</p>
8+
9+
<FlowSettings :pressureRange="pressureRange" :flowRange="flowRange" :pressure="pressure" :flow="flow" />
10+
</article>
11+
<article class="block">
12+
513
<p class="menu-label">
6-
General
14+
Sprinkler info
715
</p>
8-
<div class="field" id="flow">
9-
<label class="label">Enter your flow in litres per minute</label>
10-
<div class="control is-flex is-align-items-center" id="flow">
11-
<!-- <input type="number" v-model="localFlow" :min="flowRange.min" :max="flowRange.max"> -->
12-
<NumberInput v-model="localFlow" :min="flowRange.min" :max="flowRange.max" @changeCount="updateFlow" :value="flow"/>
13-
<span class="is-right ml-1">Lpm</span>
14-
</div>
15-
</div>
16-
<!-- ./field -->
17-
<div class="field" id="pressure">
18-
<label class="label">Select your working pressure in kilopascals</label>
19-
<div class="control has-icons-right is-flex is-align-items-center">
20-
<div class="select">
21-
<select v-model="localPressure">
22-
23-
<option v-for="(pressure, index) in pressureRange" :key="index" >{{ pressure }}</option>
24-
</select>
25-
</div>
26-
27-
<span class="is-right ml-1">kpa</span>
28-
</div>
29-
</div>
30-
<!-- /.field -->
31-
<div class="field">
32-
<div class="control">
33-
<button class="button is-link" @click="$emit('set', localFlow, localPressure)">Set pressure and flow</button>
34-
</div>
16+
<ul>
17+
<li v-show="info.name"><a href="#">Name: {{ info.name }}</a></li>
18+
<li v-show="info.description"><a href="#">Description: {{ info.description }}</a></li>
19+
</ul>
20+
</article>
3521

36-
</div>
3722
</aside>
3823
</transition>
3924
</template>
4025

4126
<script>
42-
import NumberInput from './NumberInput.vue';
27+
import FlowSettings from './FlowSettings.vue';
4328
export default {
44-
45-
46-
4729
components: {
48-
NumberInput
30+
FlowSettings
4931
},
32+
5033
props: {
5134
flow: {
5235
type: Number
@@ -56,22 +39,17 @@
5639
},
5740
flowRange: {
5841
type: Object
59-
}
42+
},
43+
pressure: Number,
44+
info: Object
6045
},
6146
6247
data() {
6348
return {
6449
isActive: false,
65-
localFlow: this.flow,
66-
localPressure: this.pressureRange[0]
6750
}
6851
},
6952
70-
methods: {
71-
updateFlow(count) {
72-
this.localFlow = count;
73-
}
74-
}
7553
7654
7755
}
@@ -81,7 +59,14 @@
8159
<style lang="scss" scoped>
8260
@import "./../assets/animation-variables.scss";
8361
#sidebar {
62+
max-width: 90%;
8463
z-index: 9999;
8564
animation-duration: $animate-duration;
65+
.has-line-height-1 {
66+
line-height: 1
67+
}
68+
// .message {
69+
// border-radius: 0px;
70+
// }
8671
}
8772
</style>

‎vue.config.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
publicPath: '/flow-calc-v/'
3+
}

0 commit comments

Comments
 (0)