7x31
/
nginxconfig.io
mirror of https://github.com/digitalocean/nginxconfig.io.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Presets all work now with computed values

This commit is contained in:
MattIPv4 2020-04-28 17:13:44 +01:00
parent 6decf98b1d
commit 27ad3cbea2
4 changed files with 150 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/nginxconfig/scss/style.scss
View File

@ -16,3 +16,51 @@ limitations under the License.
$header: #0071fe;
@import "~do-bulma/src/style";
.do-bulma {
.tabs {
ul {
li {
&.is-before {
a {
color: mix($dark-grey, $primary);
&::after {
background: rgba($primary, .5);
}
&:hover {
color: $dark-blue;
&::after {
background: $dark-blue;
}
}
}
}
}
}
}
.panel {
margin-top: 0;
padding: 2rem 0;
.container {
padding: 0 1.5rem;
}
.tabs {
ul {
padding: 0 1rem;
}
}
}
.buttons-group {
align-items: center;
display: flex;
flex-direction: row;
justify-content: space-between;
}
}

11
src/nginxconfig/templates/domain.vue
View File

@ -15,10 +15,10 @@ limitations under the License.
-->
<template>
<div>
<div class="panel">
<div class="tabs">
<ul>
<li v-for="tab in tabs" :class="active === tab.key ? 'is-active' : undefined">
<li v-for="tab in tabs" :class="tabClass(tab.key)">
<a @click="active = tab.key">{{ tab.display }}{{ changes(tab.key) }}</a>
</li>
</ul>
@ -29,6 +29,7 @@ limitations under the License.
:key="tab.key"
:data="$props.data[tab.key]"
:style="{ display: active === tab.key ? 'block' : 'none' }"
class="container"
></component>
</div>
</template>
@ -67,6 +68,12 @@ limitations under the License.
resetValue(tab, key) {
this.setValue(tab, key, this.$props.data[tab][key].default);
},
tabClass(tab) {
if (tab === this.$data.active) return 'is-active';
const tabs = this.$data.tabs.map(t => t.key);
if (tabs.indexOf(tab) < tabs.indexOf(this.$data.active)) return 'is-before';
return undefined;
},
},
};
</script>

17
src/nginxconfig/templates/domain_sections/php.vue
View File

@ -40,5 +40,22 @@
};
},
computed: computedFromDefaults(defaults), // Getters & setters for the delegated data
watch: {
// If the Reverse proxy is enabled, PHP will be forced off
'$parent.$props.data.reverseProxy.reverseProxy.computed'() { this.checkPhpEnabled(); },
php() { this.checkPhpEnabled(); },
},
methods: {
checkPhpEnabled() {
const state = this.$parent.$props.data.reverseProxy.reverseProxy.computed;
if (state) {
this.$props.data.php.enabled = false;
this.$props.data.php.computed = false;
} else {
this.$props.data.php.enabled = true;
this.$props.data.php.computed = this.$props.data.php.value;
}
},
},
};
</script>

83
src/nginxconfig/templates/domain_sections/presets.vue
View File

@ -1,11 +1,13 @@
<template>
<div>
<a v-for="(preset, key) in $props.data"
:class="`button${preset.computed ? ' is-primary' : ''}`"
@click="setPreset(key)"
>
{{ preset.display }}
</a>
<div class="buttons-group">
<a v-for="(preset, key) in $props.data"
:class="`button${preset.computed ? ' is-primary' : ''}`"
@click="setPreset(key)"
>
{{ preset.display }}
</a>
</div>
</div>
</template>
@ -19,41 +21,95 @@
default: false,
display: 'Frontend',
enabled: true,
computedCheck (data) {
return !data.php.php.computed
&& !data.python.python.computed
&& !data.reverseProxy.reverseProxy.computed
&& data.routing.index.computed === 'index.html'
&& data.routing.fallbackHtml.computed;
},
},
php: {
default: true,
display: 'PHP',
enabled: true,
computedCheck (data) {
return data.php.php.computed
&& data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed
&& !data.php.wordPressRules.computed
&& !data.php.drupalRules.computed
&& !data.php.magentoRules.computed;
},
},
django: {
default: false,
display: 'Django',
enabled: true,
computedCheck (data) {
return data.python.python.computed
&& data.python.djangoRules.computed
&& !data.routing.root.computed;
},
},
nodejs: {
default: false,
display: 'Node.js',
enabled: true,
computedCheck (data) {
return data.reverseProxy.reverseProxy.computed
&& !data.routing.root.computed;
},
},
singlePageApplication: {
default: false,
display: 'Single-page application',
enabled: true,
computedCheck (data) {
return data.php.php.computed
&& data.routing.index.computed === 'index.html'
&& data.routing.fallbackHtml.computed;
},
},
wordPress: {
default: false,
display: 'WordPress',
enabled: true,
computedCheck (data) {
return data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed
&& data.php.wordPressRules.computed
&& !data.php.drupalRules.computed
&& !data.php.magentoRules.computed;
},
},
drupal: {
default: false,
display: 'Drupal',
enabled: true,
computedCheck (data) {
return data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed
&& !data.php.wordPressRules.computed
&& data.php.drupalRules.computed
&& !data.php.magentoRules.computed;
},
},
magento: {
default: false,
display: 'Magento',
enabled: true,
computedCheck (data) {
return data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed
&& !data.php.wordPressRules.computed
&& !data.php.drupalRules.computed
&& data.php.magentoRules.computed;
},
},
};
@ -71,6 +127,18 @@
};
},
computed: computedFromDefaults(defaults), // Getters & setters for the delegated data
watch: {
// When any data changes, check if it still matches a preset
'$parent.$props.data': {
handler(data) {
// This might cause recursion, but seems not to
Object.keys(this.$props.data).forEach(preset => {
this.$props.data[preset].computed = this.$props.data[preset].computedCheck(data);
});
},
deep: true,
},
},
methods: {
setPreset(key) {
// Set that we're using this preset
@ -88,6 +156,7 @@
this.$parent.resetValue('routing', 'root');
this.$parent.resetValue('routing', 'index');
this.$parent.resetValue('routing', 'fallbackHtml');
this.$parent.resetValue('routing', 'fallbackPhp');
switch (key) {
case 'frontend':
@ -97,7 +166,7 @@
break;
case 'php':
this.$parent.setValue('routing', 'index', 'index.php');
// Defaults should be PHP
break;
case 'django':