herrhase
/
nano-buckets
1
0
Fork 0
Code Issues 3 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

adding

master
Björn 3 years ago
parent
b4de54af62
commit
67ad042736
19 changed files with 7470 additions and 4691 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      mix-manifest.json
  2. +7
    -3
      public/css/index.css
  3. +4556
    -0
      public/js/create-bucket.js
  4. +137
    -12
      public/js/critical.js
  5. +2587
    -8
      public/js/dashboard.js
  6. +8
    -4642
      public/js/index.js
  7. +108
    -0
      resources/js/components/field-error.riot
  8. +27
    -0
      resources/js/create-bucket.js
  9. +1
    -1
      resources/js/critical.js
  10. +3
    -7
      resources/js/dashboard.js
  11. +0
    -2
      resources/js/index.js
  12. +8
    -0
      resources/scss/components/_field.scss
  13. +3
    -3
      resources/scss/index.scss
  14. +8
    -2
      resources/views/bucket/form.html
  15. +3
    -1
      resources/views/index.html
  16. +1
    -4
      resources/views/layout.html
  17. +10
    -4
      src/http/api/bucket.ts
  18. +1
    -0
      src/http/bucket.ts
  19. +1
    -1
      webpack.mix.js

+ 1
- 1
mix-manifest.json View File

@ -1,7 +1,7 @@
{ {
"/public/js/spritemap.js": "/public/js/spritemap.js", "/public/js/spritemap.js": "/public/js/spritemap.js",
"/public/js/index.js": "/public/js/index.js",
"/public/js/critical.js": "/public/js/critical.js", "/public/js/critical.js": "/public/js/critical.js",
"/public/js/create-bucket.js": "/public/js/create-bucket.js",
"/public/js/dashboard.js": "/public/js/dashboard.js", "/public/js/dashboard.js": "/public/js/dashboard.js",
"/public/css/index.css": "/public/css/index.css", "/public/css/index.css": "/public/css/index.css",
"/public/css/demo.html": "/public/css/demo.html", "/public/css/demo.html": "/public/css/demo.html",


+ 7
- 3
public/css/index.css View File

@ -14919,15 +14919,19 @@ input[type=checkbox].field-choice:checked ~ .field-switch:after {
color: var(--text); color: var(--text);
} }
.field-error ul {
list-style: none;
padding: 0;
}
.container--app { .container--app {
max-width: 100%; max-width: 100%;
padding: 15px 30px; padding: 15px 30px;
} }
.turbolinks-progress-bar { .turbolinks-progress-bar {
width: 5px;
height: 100%;
background-color: blue;
height: 5px;
background-color: var(--danger);
} }
.app-header .logo { .app-header .logo {


+ 4556
- 0
public/js/create-bucket.js
File diff suppressed because it is too large
View File


+ 137
- 12
public/js/critical.js View File

@ -1,6 +1,32 @@
/******/ (() => { // webpackBootstrap /******/ (() => { // webpackBootstrap
/******/ var __webpack_modules__ = ({ /******/ var __webpack_modules__ = ({
/***/ "./resources/js/critical.js":
/*!**********************************!*\
!*** ./resources/js/critical.js ***!
\**********************************/
/***/ ((__unused_webpack_module, __unused_webpack_exports, __webpack_require__) => {
var Turbolinks = __webpack_require__(/*! turbolinks */ "./node_modules/turbolinks/dist/turbolinks.js");
Turbolinks.start();
Turbolinks.setProgressBarDelay(500);
/***/ }),
/***/ "./resources/scss/index.scss":
/*!***********************************!*\
!*** ./resources/scss/index.scss ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./node_modules/turbolinks/dist/turbolinks.js": /***/ "./node_modules/turbolinks/dist/turbolinks.js":
/*!****************************************************!*\ /*!****************************************************!*\
!*** ./node_modules/turbolinks/dist/turbolinks.js ***! !*** ./node_modules/turbolinks/dist/turbolinks.js ***!
@ -46,18 +72,117 @@ Copyright © 2018 Basecamp, LLC
/******/ return module.exports; /******/ return module.exports;
/******/ } /******/ }
/******/ /******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = __webpack_modules__;
/******/
/************************************************************************/ /************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
(() => {
/*!**********************************!*\
!*** ./resources/js/critical.js ***!
\**********************************/
var Turbolinks = __webpack_require__(/*! turbolinks */ "./node_modules/turbolinks/dist/turbolinks.js");
Turbolinks.start();
Turbolinks.setProgressBarDelay(500);
})();
/******/ /* webpack/runtime/chunk loaded */
/******/ (() => {
/******/ var deferred = [];
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/ if(chunkIds) {
/******/ priority = priority || 0;
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/ deferred[i] = [chunkIds, fn, priority];
/******/ return;
/******/ }
/******/ var notFulfilled = Infinity;
/******/ for (var i = 0; i < deferred.length; i++) {
/******/ var [chunkIds, fn, priority] = deferred[i];
/******/ var fulfilled = true;
/******/ for (var j = 0; j < chunkIds.length; j++) {
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
/******/ chunkIds.splice(j--, 1);
/******/ } else {
/******/ fulfilled = false;
/******/ if(priority < notFulfilled) notFulfilled = priority;
/******/ }
/******/ }
/******/ if(fulfilled) {
/******/ deferred.splice(i--, 1)
/******/ result = fn();
/******/ }
/******/ }
/******/ return result;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ (() => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "/public/js/critical": 0,
/******/ "public/css/index": 0
/******/ };
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var [chunkIds, moreModules, runtime] = data;
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
/******/ for(moduleId in moreModules) {
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(runtime) var result = runtime(__webpack_require__);
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ installedChunks[chunkId][0]();
/******/ }
/******/ installedChunks[chunkIds[i]] = 0;
/******/ }
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = self["webpackChunk"] = self["webpackChunk"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ __webpack_require__.O(undefined, ["public/css/index"], () => (__webpack_require__("./resources/js/critical.js")))
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["public/css/index"], () => (__webpack_require__("./resources/scss/index.scss")))
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/
/******/ })() /******/ })()
; ;

+ 2587
- 8
public/js/dashboard.js
File diff suppressed because it is too large
View File


+ 8
- 4642
public/js/index.js
File diff suppressed because it is too large
View File


+ 108
- 0
resources/js/components/field-error.riot View File

@ -0,0 +1,108 @@
<field-error>
<div class="field-error" if={ state.errors.length > 0 }>
<ul>
<li each={ error in state.errors }>
{ error }
</li>
</ul>
</div>
<script>
/**
* Shows errors of Validation and raise a element to
* trigger single validation of field
*
* <field-error name="name" nofieldupdate></field-error>
*
* @author Björn Hase, Tentakelfabrik, me@tentakelfabrik.de
*
*/
export default {
state: {
errors: [
],
},
/**
*
*
* @param {Object} props [description]
* @param {Object} state [description]
*
*/
onMounted(props, state)
{
// getting parent element for entire field
const parent = this.root.closest('.field-group')
// getting current element by name
const element = document.querySelector('[name="' + props.name + '"]')
// getting form
const form = element.closest('form')
// element, form are exists and nofieldupdate is not set
// each change of the element dispatch a event to form validation
if (element && form && !props.nofieldupdate) {
element.addEventListener('input', (event) => {
this.dispatchCustomEvent(event, form, props.name)
})
}
// add custom event to listen to form-validation
this.root.addEventListener('form-validation', (event) => {
this.onFormValidation(event, parent)
})
},
/**
* process form validation triggered by form
*
* @param {Event} event
* @param {Element} parent
*
*/
onFormValidation(event, parent)
{
// if detail is a value, set to errors
if (event.detail) {
this.state.errors = event.detail
parent.classList.add('field--error')
parent.classList.remove('field--valid')
} else {
this.state.errors = []
parent.classList.remove('field--error')
parent.classList.add('field--valid')
}
this.update()
},
/**
* create event to send to form validation
*
* @param {Event} event
* @param {Element} form
* @param {string} name
*
*/
dispatchCustomEvent(event, form, name)
{
const fieldUpdateEvent = new CustomEvent('field-update', {
'detail': {
'name': name,
'value': event.target.value
}
})
form.dispatchEvent(fieldUpdateEvent)
},
}
</script>
</field-error>

+ 27
- 0
resources/js/create-bucket.js View File

@ -0,0 +1,27 @@
import * as riot from 'riot'
import FieldError from './components/field-error.riot'
import FormValidator from './../../node_modules/@tentakelfabrik/tiny-validator/src/FormValidator'
riot.register('field-error', FieldError)
riot.mount('field-error')
const formValidation = new FormValidator('form', {
'title': {
'presence': true,
'length': {
'maximum': 255
}
},
'description': {
'length': {
'maximum': 255
}
},
'type': {
'presence': true
},
'visiblity': {
'presence': true
}
})

+ 1
- 1
resources/js/critical.js View File

@ -1,4 +1,4 @@
const Turbolinks = require('turbolinks') const Turbolinks = require('turbolinks')
Turbolinks.start() Turbolinks.start()
Turbolinks.setProgressBarDelay(500)
Turbolinks.setProgressBarDelay(500)

+ 3
- 7
resources/js/dashboard.js View File

@ -1,11 +1,7 @@
import AppBuckets from './components/buckets.riot'
import * as riot from 'riot'
/**
* Bucket
*
*
*/
import AppBuckets from './components/buckets.riot'
// register components
// register components for buckets
riot.register('app-buckets', AppBuckets) riot.register('app-buckets', AppBuckets)
riot.mount('app-buckets') riot.mount('app-buckets')

+ 0
- 2
resources/js/index.js View File

@ -1,2 +0,0 @@
window.axios = require('axios')
window.riot = require('riot')

+ 8
- 0
resources/scss/components/_field.scss View File

@ -0,0 +1,8 @@
.field {
&-error {
ul {
list-style: none;
padding: 0;
}
}
}

+ 3
- 3
resources/scss/index.scss View File

@ -2,12 +2,12 @@
'../../node_modules/@tentakelfabrik/plain-ui/src/scss/plain-ui', '../../node_modules/@tentakelfabrik/plain-ui/src/scss/plain-ui',
'components/buckets', 'components/buckets',
'components/field',
'container'; 'container';
.turbolinks-progress-bar { .turbolinks-progress-bar {
width: 5px;
height: 100%;
background-color: blue;
height: 5px;
background-color: var(--danger);
} }
.app-header { .app-header {


+ 8
- 2
resources/views/bucket/form.html View File

@ -8,18 +8,20 @@
</h1> </h1>
</div> </div>
<div class="col-12"> <div class="col-12">
<form action="/bucket/store" method="POST" novalidate>
<form id="form" action="/bucket/store" method="POST" novalidate >
<div class="field-group"> <div class="field-group">
<label class="field-label"> <label class="field-label">
title* title*
<input class="field-text" name="title" type="text" /> <input class="field-text" name="title" type="text" />
</label> </label>
<field-error name="title"></field-error>
</div> </div>
<div class="field-group"> <div class="field-group">
<label class="field-label"> <label class="field-label">
description* description*
<input class="field-text" name="description" type="text" /> <input class="field-text" name="description" type="text" />
</label> </label>
<field-error name="description"></field-error>
</div> </div>
<div class="field-group"> <div class="field-group">
<div class="m-top-4 m-bottom-3"> <div class="m-top-4 m-bottom-3">
@ -37,6 +39,7 @@
<%= type %> <%= type %>
</label> </label>
<% }) %> <% }) %>
<field-error name="type"></field-error>
</div> </div>
<div class="field-group"> <div class="field-group">
<div class="m-top-4 m-bottom-3"> <div class="m-top-4 m-bottom-3">
@ -54,6 +57,7 @@
<%= visiblity %> <%= visiblity %>
</label> </label>
<% }) %> <% }) %>
<field-error name="visiblity"></field-error>
</div> </div>
<div class="m-top-5"> <div class="m-top-5">
@ -67,4 +71,6 @@
</form> </form>
</div> </div>
</div> </div>
</div>
</div>
<script type="text/javascript" src="/js/create-bucket.js" defer></script>

+ 3
- 1
resources/views/index.html View File

@ -17,4 +17,6 @@
</section> </section>
</div> </div>
</div> </div>
</div>
</div>
<script type="text/javascript" src="/js/dashboard.js" defer></script>

+ 1
- 4
resources/views/layout.html View File

@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Nano Buckets</title> <title>Nano Buckets</title>
<link rel="stylesheet" href="/css/index.css" /> <link rel="stylesheet" href="/css/index.css" />
<script type="text/javascript" src="/js/critical.js" defer></script>
<script type="text/javascript" src="/js/critical.js"></script>
</head> </head>
<body> <body>
<header class="app-header"> <header class="app-header">
@ -35,8 +35,5 @@
<%~ it.body %> <%~ it.body %>
</main> </main>
<script type="text/javascript" src="/js/index.js" defer></script>
<script type="text/javascript" src="/js/dashboard.js" defer></script>
</body> </body>
</html> </html>

+ 10
- 4
src/http/api/bucket.ts View File

@ -36,7 +36,8 @@ router.get('/', async function(request, response)
* @param response * @param response
* @return * @return
*/ */
router.get('/:uuid', function(request, response) {
router.get('/:uuid', function(request, response)
{
}) })
@ -47,7 +48,8 @@ router.get('/:uuid', function(request, response) {
* @param response * @param response
* @return * @return
*/ */
router.post('/', function(request, response, next) {
router.post('/', function(request, response, next)
{
}) })
@ -58,12 +60,13 @@ router.post('/', function(request, response, next) {
* @param response * @param response
* @return * @return
*/ */
router.put('/:uuid', function(request, response, next) {
router.put('/:uuid', function(request, response, next)
{
}) })
/** /**
*
* delete single bucket
* *
* @param request * @param request
* @param response * @param response
@ -71,15 +74,18 @@ router.put('/:uuid', function(request, response, next) {
*/ */
router.delete('/:uuid', async function(request, response, next) router.delete('/:uuid', async function(request, response, next)
{ {
// check if uuid is valid
if (!v4.validate(request.params.uuid)) { if (!v4.validate(request.params.uuid)) {
response.setStatus(404) response.setStatus(404)
} }
let result = false let result = false
// getting database and search by uuid
const db = new Database<BucketSchema>('./storage/database/buckets.json') const db = new Database<BucketSchema>('./storage/database/buckets.json')
const bucket = await db.deleteOne({ _id: request.params.uuid }); const bucket = await db.deleteOne({ _id: request.params.uuid });
// check if bucket is deleted
if (bucket) { if (bucket) {
result = true result = true
} }


+ 1
- 0
src/http/bucket.ts View File

@ -56,6 +56,7 @@ router.post('/store', async function(request, response, next)
body.description = escapeHtml(body.description) body.description = escapeHtml(body.description)
} }
// validate
const [ valid, errors ] = await validate(body, { const [ valid, errors ] = await validate(body, {
title: [ required, maxLength(255) ], title: [ required, maxLength(255) ],
description: [ required, maxLength(255) ], description: [ required, maxLength(255) ],


+ 1
- 1
webpack.mix.js View File

@ -58,8 +58,8 @@ mix.options({
}) })
mix mix
.js('resources/js/index.js', 'public/js')
.js('resources/js/critical.js', 'public/js') .js('resources/js/critical.js', 'public/js')
.js('resources/js/create-bucket.js', 'public/js')
.js('resources/js/dashboard.js', 'public/js') .js('resources/js/dashboard.js', 'public/js')
.sass('resources/scss/index.scss', 'public/css') .sass('resources/scss/index.scss', 'public/css')
.copy( .copy(


Write Preview
Loading…
Cancel
Save