webpack fixes, theme editor fixes

pull/778/head
Hunter Long 2020-08-06 00:58:00 -07:00
parent 8687e95a03
commit 9e62ba8fbe
20 changed files with 60 additions and 176 deletions

View File

@ -144,7 +144,6 @@ frontend-build:
cd frontend && yarn && yarn build
@cp -r frontend/dist source/
@cp -r frontend/src/assets/scss source/dist/
@cp -r frontend/public/main.scss source/dist/scss/
@cp frontend/public/favicon.ico source/dist/
@cp frontend/public/robots.txt source/dist/
@cp frontend/public/banner.png source/dist/
@ -159,9 +158,10 @@ yarn:
cd frontend && yarn
# compile assets using SASS and Rice. compiles scss -> css, and run rice embed-go
compile: generate frontend-build
compile: frontend-build
rm -f source/rice-box.go
cd source && rice embed-go
make generate
embed:
cd source && rice embed-go

View File

@ -43,11 +43,7 @@
<meta property="twitter:image" content="favicon/social.png">
{{if USE_CDN}}
<link rel="stylesheet" href="https://assets.statping.com/css/style.css">
<link rel="stylesheet" href="https://assets.statping.com/css/main.css">
{{else if USING_ASSETS }}
<link href="css/style.css" rel="stylesheet">
<link href="css/main.css" rel="stylesheet">
<link rel="stylesheet" href="https://assets.statping.com/css/vendor.css">
{{else}}
<% _.each(htmlWebpackPlugin.tags.headTags, function(headTag) { %>
<%= headTag %> <% }) %>
@ -62,14 +58,9 @@
{{if USE_CDN}}
<script src="https://assets.statping.com/js/bundle.js"></script>
<script src="https://assets.statping.com/js/style.chunk.js"></script>
<script src="https://assets.statping.com/js/vendor.chunk.js"></script>
<script src="https://assets.statping.com/js/polyfill.chunk.js"></script>
<script src="https://assets.statping.com/js/main.chunk.js"></script>
{{else if USING_ASSETS }}
<script src="js/bundle.js"></script>
<script src="js/style.chunk.js"></script>
<script src="js/polyfill.chunk.js"></script>
<script src="js/main.chunk.js"></script>
{{else}}
<% _.each(htmlWebpackPlugin.tags.bodyTags, function(bodyTag) { %>
<%= bodyTag %> <% }) %>

View File

@ -55,8 +55,5 @@
<style lang="scss">
@import "./assets/css/bootstrap.min.css";
@import "./assets/scss/base";
@import "./assets/scss/layout";
@import "./assets/scss/forms";
@import "./assets/scss/mobile";
@import "./assets/scss/index";
</style>

View File

@ -1,6 +1,6 @@
@import 'variables';
@import 'mixin';
@import 'layout';
@import 'base';
@import 'forms';
@import 'layout';
@import 'mobile';

View File

@ -1,5 +1,5 @@
/* Index Page */
$background-color: #f5f5f5;
$background-color: #bf1010;
$container-color: #ffffff;
$text-color: #2a2a2a;
$max-width: 860px;

View File

@ -163,10 +163,3 @@ export default {
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.sm {
font-size: 8pt;
}
</style>

View File

@ -173,10 +173,3 @@ export default {
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.sm {
font-size: 8pt;
}
</style>

View File

@ -50,8 +50,9 @@
</template>
<script>
import Api from "../../API";
const FormIncidentUpdates = () => import(/* webpackChunkName: "dashboard" */ '@/forms/IncidentUpdates')
import Api from "../../API";
const FormIncidentUpdates = () => import(/* webpackChunkName: "dashboard" */ '@/forms/IncidentUpdates')
export default {
name: 'Incidents',
@ -112,10 +113,3 @@
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.sm {
font-size: 8pt;
}
</style>

View File

@ -75,6 +75,7 @@
const ServiceFailures = () => import(/* webpackChunkName: "dashboard" */ '../Service/ServiceFailures');
const ServiceSparkLine = () => import(/* webpackChunkName: "dashboard" */ "./ServiceSparkLine");
import Api from "../../API";
const ServiceEvents = () => import(/* webpackChunkName: "dashboard" */ "@/components/Dashboard/ServiceEvents");
export default {
@ -167,16 +168,3 @@
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.offline-card {
background-color: #fff5f5;
}
.fade-enter-active, .fade-leave-active {
transition: opacity .75s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
</style>

View File

@ -57,15 +57,16 @@
</template>
<script>
import Api from "../../API";
import Api from "../../API";
// require component
import { codemirror } from 'vue-codemirror'
import 'codemirror/mode/css/css.js'
// require component
import {codemirror} from 'vue-codemirror'
import 'codemirror/lib/codemirror.css'
import 'codemirror-colorpicker/dist/codemirror-colorpicker.css'
import 'codemirror-colorpicker'
import('codemirror/mode/css/css.js')
import('codemirror/lib/codemirror.css')
import('codemirror-colorpicker/dist/codemirror-colorpicker.css')
import('codemirror-colorpicker')
export default {
name: 'ThemeEditor',
@ -191,9 +192,3 @@
}
}
</script>
<style scoped>
.CodeMirror {
border: 1px solid #eee;
height: 550px;
}
</style>

View File

@ -173,15 +173,19 @@
</template>
<script>
import Api from "../API";
import Api from "../API";
/* webpackChunkName: "codemirror" */
import {codemirror} from 'vue-codemirror'
/* webpackChunkName: "codemirror" */
import 'codemirror/mode/javascript/javascript.js'
/* webpackChunkName: "codemirror" */
import 'codemirror/lib/codemirror.css'
/* webpackChunkName: "codemirror" */
import 'codemirror/theme/neat.css'
/* webpackChunkName: "codemirror" */
import '../codemirror_json'
const beautify = require('js-beautify').js
/* webpackChunkName: "codemirror" */ import { codemirror } from 'vue-codemirror'
/* webpackChunkName: "codemirror" */ import 'codemirror/mode/javascript/javascript.js'
/* webpackChunkName: "codemirror" */ import 'codemirror/lib/codemirror.css'
/* webpackChunkName: "codemirror" */ import 'codemirror/theme/neat.css'
/* webpackChunkName: "codemirror" */ import '../codemirror_json'
const beautify = require('js-beautify').js
export default {
name: 'Notifier',
@ -325,10 +329,3 @@ export default {
}
}
</script>
<style scoped>
.CodeMirror {
border: 1px solid #eee;
height: 550px;
font-size: 9pt;
}
</style>

View File

@ -8,10 +8,11 @@ import VueI18n from 'vue-i18n'
import router from './routes'
import "./mixin"
import "./icons"
const App = () => import('@/App.vue')
import store from './store'
import language from './languages'
const App = () => import(/* webpackChunkName: "index" */ '@/App.vue')
Vue.component('apexchart', VueApexCharts)
Vue.use(VueClipboard);

View File

@ -87,10 +87,3 @@ export default {
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.sm {
font-size: 8pt;
}
</style>

View File

@ -84,14 +84,30 @@ func apiThemeSaveHandler(w http.ResponseWriter, r *http.Request) {
sendErrorJson(err, w, r)
return
}
defer r.Body.Close()
fmt.Println(themes.Variables)
if err := source.SaveAsset([]byte(themes.Base), "scss/base.scss"); err != nil {
sendErrorJson(err, w, r)
return
}
if err := source.SaveAsset([]byte(themes.Layout), "scss/layout.scss"); err != nil {
sendErrorJson(err, w, r)
return
}
if err := source.SaveAsset([]byte(themes.Variables), "scss/variables.scss"); err != nil {
sendErrorJson(err, w, r)
return
}
if err := source.SaveAsset([]byte(themes.Forms), "scss/forms.scss"); err != nil {
sendErrorJson(err, w, r)
return
}
if err := source.SaveAsset([]byte(themes.Mixins), "scss/mixin.scss"); err != nil {
sendErrorJson(err, w, r)
return
}
if err := source.SaveAsset([]byte(themes.Mobile), "scss/mobile.scss"); err != nil {
sendErrorJson(err, w, r)
return

View File

@ -1,4 +1,4 @@
// DO NOT EDIT ** This file was generated with go generate on 2020-08-06 04:13:25.078006 +0000 UTC ** DO NOT EDIT //
// DO NOT EDIT ** This file was generated with go generate on 2020-08-06 07:54:20.364299 +0000 UTC ** DO NOT EDIT //
package notifiers
const emailSuccess = `<!doctype html><html xmlns=http://www.w3.org/1999/xhtml xmlns:v=urn:schemas-microsoft-com:vml xmlns:o=urn:schemas-microsoft-com:office:office><title>Statping Service Notification</title><meta http-equiv=x-ua-compatible content="IE=edge"><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><style type=text/css>
@ -52,3 +52,4 @@ const emailFailure = `<!doctype html><html xmlns=http://www.w3.org/1999/xhtml xm
<a class=footer-link href=https://github.com/statping/statping>Github</a>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;
<a class=footer-link href=https://statping.com/privacy>Privacy</a>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;
<a class=footer-link href="https://news.statping.com/delete?email={{.Email}}">Unsubscribe</a></div></table></table></div></div></table></div></table></div></table></div></div>`

View File

@ -10,7 +10,7 @@ import (
"time"
)
//go:generate go run generate/main.go
//go:generate go run generate.go
var log = utils.Log.WithField("type", "notifier")

View File

@ -1,77 +0,0 @@
// +build ignore
package main
import (
"github.com/statping/statping/utils"
"io/ioutil"
"log"
"os"
"strings"
"text/template"
"time"
)
const (
wikiUrl = "http://assets.statping.com/wiki/"
)
func replaceDash(s string) string {
return strings.Replace(s, "-", " ", -1)
}
func main() {
var compiled string
utils.InitLogs()
utils.Command("git clone https://github.com/statping/statping.wiki.git")
pages := []string{"Types-of-Monitoring", "Features", "Start-Statping", "Linux", "Mac", "Windows", "AWS-EC2", "Docker", "Mobile-App", "Heroku", "API", "Makefile",
"Notifiers", "Notifier-Events", "Notifier-Example", "Prometheus-Exporter", "SSL", "Config-with-.env-File", "Static-Export", "Statping-Plugins", "Statuper", "Build-and-Test", "Contributing", "PGP-Signature", "Testing", "Deployment"}
newPages := map[string]string{}
for k, v := range pages {
compiled += "<a class=\"scrollclick\" href=\"#\" data-id=\"page_" + utils.ToString(k) + "\">" + replaceDash(v) + "</a><br>"
}
for k, v := range pages {
sc, _ := ioutil.ReadFile("statping.wiki/" + v + ".md")
newPages[v] = string(sc)
compiled += "\n\n<div class=\"mt-5\" id=\"page_" + utils.ToString(k) + "\"><h1>" + replaceDash(v) + "</h1></div>\n" + string(sc)
}
utils.DeleteDirectory("./statping.wiki")
utils.DeleteDirectory("./logs")
f, err := os.Create("../frontend/src/pages/Help.vue")
die(err)
defer f.Close()
packageTemplate.Execute(f, struct {
Timestamp time.Time
URL string
Compiled string
Pages map[string]string
}{
Timestamp: utils.Now(),
URL: "ok",
Compiled: compiled,
Pages: newPages,
})
}
func die(err error) {
if err != nil {
log.Fatal(err)
}
}
var packageTemplate = template.Must(template.New("").Parse(`<template>
<div class="col-12 p-4" v-html={{printf "%q" .Compiled}}></div>
</template>
<script>
export default {
name: 'Help',
}
</script>`))

View File

@ -1,7 +1,5 @@
package source
//go:generate go run generate_wiki.go
import (
"fmt"
"github.com/GeertJohan/go.rice"
@ -19,8 +17,8 @@ var (
RequiredFiles = []string{
"css/style.css",
"css/style.css.gz",
"css/main.css",
"scss/main.scss",
"css/index.css",
"scss/index.scss",
"scss/base.scss",
"scss/forms.scss",
"scss/layout.scss",
@ -44,6 +42,10 @@ func Assets() error {
}
var err error
TmplBox, err = rice.FindBox("dist")
if err != nil {
return err
}
return err
}
@ -67,7 +69,7 @@ func CompileSASS() error {
sassBin = bin
}
scssFile := filepath.Join(utils.Params.GetString("STATPING_DIR"), "assets", "scss", "main.scss")
scssFile := filepath.Join(utils.Params.GetString("STATPING_DIR"), "assets", "scss", "index.scss")
log.Infoln(fmt.Sprintf("Compiling SASS %v into %v", scssFile, scssRendered(scssFile)))
stdout, stderr, err := utils.Command(sassBin, scssFile, scssRendered(scssFile))

View File

@ -80,7 +80,7 @@ func TestSaveAndCompileAsset(t *testing.T) {
require.Nil(t, err)
assertFiles(t, true)
themeCSS, err := utils.OpenFile(dir + "/assets/css/main.css")
themeCSS, err := utils.OpenFile(dir + "/assets/css/index.css")
require.Nil(t, err)
assert.Contains(t, themeCSS, `color: #b1b2b3;`)