are0h
/
Fipamo
1
2
Fork 0
Code Issues 19 Pull Requests 1 Packages Projects 1 Releases 22 Wiki Activity

integrated date chooser with entry RTE

Browse Source
sql-version-freeze
Ro 6 years ago
parent 1584afc522
commit 5229db1668
11 changed files with 8438 additions and 33 deletions
Show Stats Download Patch File Download Diff File

8
brain/routes/back/index.js
Unescape Escape View File

@ -122,14 +122,14 @@ router.get('/entries/edit/:id', function (req, res) {
featured = featured_img[0].substr(7, featured_img[0].length);
let pretty = hljs.highlight('markdown', entry.entry_plaintext).value;
let newdate = new Date(entry.created_at);
let formattedDate = newdate.getFullYear()+"-"+newdate.getMonth()+"-"+newdate.getDate();
console.log(DateUtils.getDate('null', 'full'));
//let newdate = new Date(entry.created_at);
//let formattedDate = newdate.getFullYear()+"-"+newdate.getMonth()+"-"+newdate.getDate();
let sexydate = DateUtils.getDate('stamp', entry.created_at)
res.render('dash/entry-edit', {
title: 'Edit Entry',
mode: 'admin',
post: entry,
date:formattedDate,
date:sexydate,
colored: pretty,
html: entry.entry_plaintext,
feature: featured,

23
brain/utils/DateUtils.js
Unescape Escape View File

@ -1,5 +1,5 @@
module.exports = {
decodeHTML: function(string, quote_style) {
decodeHTML: function (string, quote_style) {
var optTemp = 0,
i = 0,
noquotes = false;
@ -41,8 +41,8 @@ module.exports = {
string = string.replace(/&/g, '&');
return string;
},
cleanString: function(str) {
return (str + '').replace(/\\(.?)/g, function(s, n1) {
cleanString: function (str) {
return (str + '').replace(/\\(.?)/g, function (s, n1) {
switch (n1) {
case '\\':
return '\\';
@ -55,25 +55,30 @@ module.exports = {
}
});
},
cleanString: function(string) {
cleanString: function (string) {
var clean = string.replace(/(^\-+|[^a-zA-Z0-9\/_| -]+|\-+$)/g, '').toLowerCase().replace(/[\/_| -]+/g, '-');
return clean;
},
getDate: function(type, rawdate) {
getDate: function (type, rawdate) {
var day = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCDate()) : String(new Date().getUTCDate()));
var month = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCMonth()+1) : String(new Date().getUTCMonth()+1));
var month = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCMonth() + 1) : String(new Date().getUTCMonth() + 1));
var year = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCFullYear()) : String(new Date().getUTCFullYear()));
var hour = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCHours()) : String(new Date().getUTCHours()));
var minute = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCMinutes()) : String(new Date().getUTCMinutes()));
var seconds = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCSeconds()) : String(new Date().getUTCSeconds()));
var millisecond = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getUTCMilliseconds()) : String(new Date().getUTCMilliseconds()));
var offset = ((rawdate != null || rawdate != '') ? String(new Date(rawdate).getTimezoneOffset()) : String(new Date().getTimezoneOffset()));
if (day.length == 1)
day = String("0" + day);
if (month.length == 1)
month = String("0" + month);
offset = String(offset / 60);
if (offset.length == 1)
offset = String("0" + offset);
switch (type) {
case "day":
return day;
@ -85,11 +90,11 @@ module.exports = {
return year;
break;
case "stamp":
return String(year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + seconds+"."+millisecond);
return String(year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + seconds + "." + millisecond + "-" + (offset));
break
default:
return String(year + "-" + month + "-" + day + " : " + hour + "-" + minute + "-" + seconds);
break;
}
}
};
};

6626
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
package.json
Unescape Escape View File

@ -3,7 +3,7 @@
"version": "0.0.5",
"private": true,
"description": "The most chill blog framework ever.",
"repository": "https://code.playvicio.us/Are0h/thetwelfthhouse",
"repository": "https://code.playvicio.us/Are0h/Fipamo",
"theme": "default",
"scripts": {
"start": "forever start init.js",
@ -49,6 +49,7 @@
"scrape-metadata": "^2.0.0",
"sequelize": "^4.37.6",
"serve-favicon": "latest",
"tiny-date-picker": "^3.2.6",
"uuid": "^3.2.1"
},
"devDependencies": {

310
themes/dash/assets/css/dash.css
Unescape Escape View File

@ -2268,6 +2268,7 @@ select {
padding: 5px;
border-radius: 5px;
background: rgba(137,126,113,0.75);
z-index: 2000;
}
#edit-control button {
margin: 5px;
@ -2325,6 +2326,315 @@ select {
text-decoration: line-through;
font-style: italic;
}
.dp-modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(46,42,38,0.75);
z-index: 2000;
}
.dp {
position: relative;
background: #968c80;
box-shadow: 2px 2px 16px rgba(0,0,0,0.25);
line-height: 1.4;
border-radius: 4px;
max-height: 400px;
z-index: 5000;
padding-top: 6px;
overflow: hidden;
-webkit-tap-highlight-color: transparent;
}
.dp:before {
content: ' ';
height: 6px;
position: absolute;
top: 0;
left: 0;
right: 0;
background: #cd898d;
}
.dp-permanent .dp {
padding-top: 0;
border: 1px solid #eee;
box-shadow: none;
}
.dp-permanent .dp:before {
display: none;
}
.dp-cal {
min-height: 300px;
}
.dp-below {
position: absolute;
font-size: 0.8em;
width: 400px;
max-width: 100vw;
}
.dp-permanent {
position: relative;
font-size: 0.8em;
width: 400px;
max-width: 100vw;
}
.dp-permanent .dp {
z-index: 0;
}
.dp-modal .dp {
position: absolute;
top: 50%;
left: 50%;
max-width: 600px;
width: calc(100% - 4em);
transform: translate(-50%, -50%);
animation: slide-up 0.3s forwards;
}
.dp-months {
padding: 24px;
}
.dp-years {
box-sizing: border-box;
max-height: 400px;
padding: 8px 0;
overflow: auto !important /* HACK for Chrome on Android */;
}
.dp-cal-month,
.dp-cal-year,
.dp-day,
.dp-month,
.dp-year {
box-sizing: border-box;
text-align: center;
text-decoration: none;
position: relative;
color: #eee;
border-radius: 2px;
border: 0;
background: transparent;
}
.dp-cal-header {
position: relative;
text-align: center;
padding-bottom: 16px;
background: #897e71;
}
.dp-next,
.dp-prev {
position: absolute;
width: 30px;
height: 30px;
overflow: hidden;
top: 14px;
color: #4c463f;
border-radius: 2px;
border: 0;
background: transparent;
}
.dp-next:focus,
.dp-prev:focus,
.dp-next:hover,
.dp-prev:hover {
outline: none;
color: inherit;
}
.dp-prev {
left: 24px;
}
.dp-next {
right: 24px;
}
.dp-prev:before,
.dp-next:before {
content: '';
border: 2px solid;
width: 10px;
height: 10px;
display: inline-block;
transform: rotate(-45deg);
transition: border-color 0.2s;
margin: 9px 0 40px 4px;
}
.dp-prev:before {
border-right: 0;
border-bottom: 0;
}
.dp-next:before {
border-left: 0;
border-top: 0;
margin-left: 0;
margin-right: 4px;
}
.dp-cal-month,
.dp-cal-year {
display: inline-block;
font-size: 1.4em;
padding: 16px 8px 8px;
outline: none;
}
.dp-cal-footer {
text-align: center;
background: #897e71;
}
.dp-day-today:after {
content: '';
height: 0;
width: 0;
border: 7px solid #cd898d;
border-bottom-color: transparent;
border-left-color: transparent;
position: absolute;
top: 0;
right: 0;
}
.dp-close,
.dp-clear,
.dp-today {
box-sizing: border-box;
display: inline-block;
width: 33%;
padding: 8px;
text-decoration: none;
color: #4c463f;
border: 0;
background: transparent;
}
.dp-permanent .dp-close,
.dp-permanent .dp-clear {
display: none;
}
.dp-close:active,
.dp-clear:active,
.dp-today:active,
.dp-next:active,
.dp-prev:active,
.dp-cal-month:active,
.dp-cal-year:active {
background: #cd898d;
color: #eee;
}
@media screen and (min-device-width: 1200px) {
.dp-close:hover,
.dp-close:focus,
.dp-clear:hover,
.dp-clear:focus,
.dp-today:hover,
.dp-today:focus,
.dp-next:hover,
.dp-next:focus,
.dp-prev:hover,
.dp-prev:focus,
.dp-cal-month:focus,
.dp-cal-month:hover,
.dp-cal-year:hover,
.dp-cal-year:focus {
background: #cd898d;
color: #eee;
}
}
.dp-col-header,
.dp-day {
width: 14.28571429%;
display: inline-block;
padding: 8px;
text-align: center;
}
.dp-col-header {
color: #aaa;
text-transform: uppercase;
font-weight: 300;
font-size: 0.8em;
padding: 8px 0;
}
.dp-month {
width: 33%;
display: inline-block;
padding: 8px;
}
.dp-year {
display: block;
padding: 8px 40px;
width: 100%;
}
.dp-edge-day {
color: #aaa;
}
.dp-day:hover,
.dp-month:hover,
.dp-year:hover,
.dp-current:focus,
.dp-current,
.dp-day:focus,
.dp-month:focus,
.dp-year:focus {
outline: none;
background: #7c4a3e;
color: #eee;
}
.dp-selected:hover,
.dp-selected:focus,
.dp-selected {
background: #643c32;
color: #eee;
}
.dp-day-disabled {
background: transparent;
color: #ddd;
}
.dp-day-disabled:focus,
.dp-day-disabled:hover {
background: #ddd;
}
.dp-focuser {
position: absolute;
z-index: 0;
top: 50%;
left: 50%;
}
@media (max-width: 480px), (max-height: 480px) {
.dp-modal .dp {
font-size: 0.9em;
width: auto;
width: 100%;
}
.dp-day-of-week,
.dp-day {
padding: 8px;
}
}
@-moz-keyframes slide-up {
0% {
transform: translate(-50%, 100%);
}
100% {
transform: translate(-50%, -50%);
}
}
@-webkit-keyframes slide-up {
0% {
transform: translate(-50%, 100%);
}
100% {
transform: translate(-50%, -50%);
}
}
@-o-keyframes slide-up {
0% {
transform: translate(-50%, 100%);
}
100% {
transform: translate(-50%, -50%);
}
}
@keyframes slide-up {
0% {
transform: translate(-50%, 100%);
}
100% {
transform: translate(-50%, -50%);
}
}
.hljs {
display: block;
overflow-x: auto;

2
themes/dash/assets/css/dash.css.map
View File

File diff suppressed because one or more lines are too long

1222
themes/dash/assets/js/dash.min.js vendored
View File

File diff suppressed because it is too large Load Diff

2
themes/dash/assets/js/dash.min.map
View File

File diff suppressed because one or more lines are too long

3
themes/dash/entry-edit.pug
Unescape Escape View File

@ -63,7 +63,8 @@ block main-content
button#option-image.content-editor-btn-icon(for="post-image")
svg#option-link(viewBox="0 0 20 20" class="icons")
use(xlink:href='/dash/assets/images/sprite.svg#entypo-image')
button#option-date.editor-button
input(id="option-date" type="text" value=post_date)
//button#option-date.editor-button
svg#option-date(viewBox="0 0 20 20" class="icons")
use(xlink:href='/dash/assets/images/sprite.svg#entypo-calendar')
=post_date

4
themes/dash/src/com/tools/utilities/TextEditor.jsx
Unescape Escape View File

@ -7,6 +7,7 @@ import DataUtils, {
CONTENT_TYPE_FORM
} from './DataUtils';
import * as DataEvent from '../events/DataEvent';
import TinyDatePicker from 'tiny-date-picker';
import {
position,
offset
@ -22,6 +23,9 @@ class TextEditor {
hljs.initHighlightingOnLoad();
this.dataUtils = new DataUtils();
this.url = '';
TinyDatePicker(document.getElementById('option-date', {
mode: 'dp-modal'
}));
window.addEventListener("scroll", f => {
var fixLimit = document.getElementById('header').offsetHeight + document.getElementById('entry-header').offsetHeight + document.getElementById('entry-feature').offsetHeight
if (window.pageYOffset >= fixLimit) {

268
themes/dash/src/styles/main/_editor.styl
Unescape Escape View File

@ -1,25 +1,28 @@
#edit-control
margin 10px 0 0 0
top 1px
padding: 5px
border-radius: 5px
background-opacity($primary - 10%, .75)
padding 5px
border-radius 5px
background-opacity($primary - 10%, 0.75)
z-index 2000
button
margin 5px
#post-sumbit-btn
height 30px
background: #65b16c
background #65b16c
color #65b16c - 30%
//float right
// float right
#option-date
height 30px
padding-top: 6px;
padding-top 6px
svg
margin -13px 5px 0 0
display: inline-block;
vertical-align: top;
margin -13px 5px 0 0
display inline-block
vertical-align top
fill $white
.content-editor-btn-icon
@ -58,4 +61,247 @@
#option-strikethrough
font-weight bold
text-decoration line-through
font-style italic
font-style italic
// TINY DATE
.dp-modal
position fixed
top 0
left 0
right 0
bottom 0
//background rgba(255, 255, 255, 0.75)
background-opacity($primary - 70%, .75);
z-index 2000
.dp
position relative
background $primary //#FFF
box-shadow 2px 2px 16px rgba(0, 0, 0, 0.25)
line-height 1.4
border-radius 4px
max-height 400px
z-index 5000
padding-top 6px
overflow hidden
-webkit-tap-highlight-color transparent
.dp:before
content ' '
height 6px
position absolute
top 0
left 0
right 0
background $highlight
//background linear-gradient(-90deg, #3B99FC 0%, #8AEFC8 100%)
.dp-permanent .dp
padding-top 0
border 1px solid #EEE
box-shadow none
.dp-permanent .dp:before
display none
.dp-cal
min-height 300px
.dp-below
position absolute
font-size 0.8em
width 400px
max-width 100vw
.dp-permanent
position relative
font-size 0.8em
width 400px
max-width 100vw
.dp-permanent .dp
z-index 0
.dp-modal .dp
position absolute
top 50%
left 50%
max-width 600px
width calc(100% - 4em)
transform translate(-50%, -50%)
animation slide-up 0.3s forwards
.dp-months
padding 24px
.dp-years
box-sizing border-box
max-height 400px
padding 8px 0
overflow auto !important /* HACK for Chrome on Android */
.dp-cal-month, .dp-cal-year, .dp-day, .dp-month, .dp-year
box-sizing border-box
text-align center
text-decoration none
position relative
color $white
border-radius 2px
border 0
background transparent
.dp-cal-header
position relative
text-align center
padding-bottom 16px
background $primary - 10%
.dp-next, .dp-prev
position absolute
width 30px
height 30px
overflow hidden
top 14px
color $primary - 50%
border-radius 2px
border 0
background transparent
.dp-next:focus, .dp-prev:focus, .dp-next:hover, .dp-prev:hover
outline none
color inherit
.dp-prev
left 24px
.dp-next
right 24px
.dp-prev:before, .dp-next:before
content ''
border 2px solid
width 10px
height 10px
display inline-block
transform rotate(-45deg)
transition border-color 0.2s
margin 9px 0 40px 4px
.dp-prev:before
border-right 0
border-bottom 0
.dp-next:before
border-left 0
border-top 0
margin-left 0
margin-right 4px
.dp-cal-month, .dp-cal-year
display inline-block
font-size 1.4em
padding 16px 8px 8px
outline none
.dp-cal-footer
text-align center
background $primary - 10%
.dp-day-today:after
content ''
height 0
width 0
border 7px solid $highlight
border-bottom-color transparent
border-left-color transparent
position absolute
top 0
right 0
.dp-close, .dp-clear, .dp-today
box-sizing border-box
display inline-block
width 33%
padding 8px
text-decoration none
color $primary - 50%
border 0
background transparent
.dp-permanent .dp-close, .dp-permanent .dp-clear
display none
.dp-close:active, .dp-clear:active, .dp-today:active, .dp-next:active, .dp-prev:active, .dp-cal-month:active, .dp-cal-year:active
background $highlight
color $white
@media screen and (min-device-width: 1200px)
.dp-close:hover, .dp-close:focus, .dp-clear:hover, .dp-clear:focus, .dp-today:hover, .dp-today:focus, .dp-next:hover, .dp-next:focus, .dp-prev:hover, .dp-prev:focus, .dp-cal-month:focus, .dp-cal-month:hover, .dp-cal-year:hover, .dp-cal-year:focus
background $highlight
color $white
.dp-col-header, .dp-day
width 14.28571429%
display inline-block
padding 8px
text-align center
.dp-col-header
color #AAA
text-transform uppercase
font-weight 300
font-size 0.8em
padding 8px 0
.dp-month
width 33%
display inline-block
padding 8px
.dp-year
display block
padding 8px 40px
width 100%
.dp-edge-day
color #AAA
.dp-day:hover, .dp-month:hover, .dp-year:hover, .dp-current:focus, .dp-current, .dp-day:focus, .dp-month:focus, .dp-year:focus
outline none
background $secondary + 10%
color $white
.dp-selected:hover, .dp-selected:focus, .dp-selected
background $secondary
color $white
.dp-day-disabled
background transparent
color #DDD
.dp-day-disabled:focus, .dp-day-disabled:hover
background #DDD
.dp-focuser
position absolute
z-index 0
top 50%
left 50%
/* Responsive overrides */
@media (max-width: 480px), (max-height: 480px)
.dp-modal .dp
font-size 0.9em
width auto
width 100%
.dp-day-of-week, .dp-day
padding 8px
@keyframes slide-up
0%
transform translate(-50%, 100%)
100%
transform translate(-50%, -50%)
Write Preview
Loading…
Cancel
Save