began structure for front end theme, cleaned up watch script for theme development
This commit is contained in:
Ro
parent
dc13a25bfb
commit
67f00e1342
49 changed files with 106 additions and 4322 deletions
|
|
@ -1,66 +1,17 @@
|
|||
var express = require('express');
|
||||
var router = express.Router();
|
||||
var Models = require('../../models');
|
||||
//var Models = require('../../models');
|
||||
var config = require('../../../config/site-settings.json');
|
||||
module.exports = function (session) {
|
||||
module.exports = function() {
|
||||
//--------------------------
|
||||
// Index
|
||||
//--------------------------
|
||||
router.get('/:page?', function(req, res) {
|
||||
|
||||
if (req.params.page == null || req.params.page == "") {
|
||||
Models.FolioProject.findAll({
|
||||
limit: 5,
|
||||
order: [
|
||||
['id', 'DESC']
|
||||
]
|
||||
}).then(entries => {
|
||||
Models.Post.findAll({
|
||||
limit: 5,
|
||||
order: [
|
||||
['id', 'DESC']
|
||||
]
|
||||
}).then(posts => {
|
||||
Models.Bookmark.findAll({
|
||||
limit: 5,
|
||||
order: [
|
||||
['id', 'DESC']
|
||||
]
|
||||
}).then(saved => {
|
||||
res.render(config.theme + '/index', {
|
||||
theme: config.theme,
|
||||
title: 'The Twelfth House | Home of creative technologist, beat maker and over-thinker, Ro',
|
||||
user_status: "What up, random person",
|
||||
mode: 'index',
|
||||
folio: entries,
|
||||
posts: posts,
|
||||
bookmarks: saved
|
||||
title: config.title,
|
||||
user_status: 'What up, random person'
|
||||
});
|
||||
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
}).then(function (value) {
|
||||
//console.log(value);
|
||||
}).catch(function (err) {
|
||||
console.log(err);
|
||||
})
|
||||
} else {
|
||||
switch (req.params.page) {
|
||||
case "dashboard":
|
||||
console.log('here')
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(req.params.page)
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
return router;
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -4,13 +4,13 @@
|
|||
"private": true,
|
||||
"description": "The most chill blog framework ever.",
|
||||
"repository": "https://code.playvicio.us/Are0h/Fipamo",
|
||||
"theme": "default-light",
|
||||
"theme": "default-dark",
|
||||
"scripts": {
|
||||
"start": "pm2 --node-args='-r esm' start init.js",
|
||||
"stop": "pm2 stop init.js",
|
||||
"dev": "nodemon -r esm init.js --ignore node_modules/ -e js",
|
||||
"watch-front-scripts": "parcel watch themes/$npm_package_theme/src/com/Start.jsx --out-dir themes/$npm_package_theme/assets/js --out-file start.min.js --public-url /$npm_package_theme/assets/js",
|
||||
"watch-front-styles": "stylus -w -m -o themes/$npm_package_theme/assets/css themes/$npm_package_theme/src/styles/base.styl",
|
||||
"debug": "nodemon inspect -r esm init.js --ignore node_modules/ -e js",
|
||||
"watch-front": "stylus -w -m -o themes/$npm_package_theme/assets/css themes/$npm_package_theme/src/styles/base.styl & parcel watch themes/$npm_package_theme/src/com/Start.js --out-dir themes/$npm_package_theme/assets/js --out-file start.min.js --public-url /$npm_package_theme/assets/js",
|
||||
"build-front-kit": "uglifyjs node_modules/scramble-text/dist/ScrambleText.min.js node_modules/animejs/anime.min.js node_modules/reframe.js/dist/reframe.min.js -c -o themes/$npm_package_theme/assets/js/toolkit.min.js",
|
||||
"watch-back": "stylus -w -m -o themes/dash/assets/css themes/dash/src/styles/dash.styl & parcel watch themes/dash/src/com/Start.js --out-dir themes/dash/assets/js --out-file dash.min.js --public-url /dash/assets/js",
|
||||
"build-back-kit": "uglifyjs themes/dash/src/libraries/highlight.pack.js node_modules/sortablejs/Sortable.min.js node_modules/scramble-text/dist/ScrambleText.min.js node_modules/animejs/anime.min.js node_modules/reframe.js/dist/reframe.min.js -c -o themes/dash/assets/js/dashkit.min.js"
|
||||
|
|
|
|||
2
themes/dash/assets/js/dash.min.js
vendored
2
themes/dash/assets/js/dash.min.js
vendored
|
|
@ -9020,7 +9020,7 @@ var parent = module.bundle.parent;
|
|||
if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
|
||||
var hostname = "" || location.hostname;
|
||||
var protocol = location.protocol === 'https:' ? 'wss' : 'ws';
|
||||
var ws = new WebSocket(protocol + '://' + hostname + ':' + "54198" + '/');
|
||||
var ws = new WebSocket(protocol + '://' + hostname + ':' + "57611" + '/');
|
||||
|
||||
ws.onmessage = function (event) {
|
||||
var data = JSON.parse(event.data);
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -25,7 +25,6 @@ export default class Base {
|
|||
.request('/api/post/json', DataEvent.SETTINGS_LOADED)
|
||||
.then(response => {
|
||||
let posts = JSON.parse(response.request['response']);
|
||||
|
||||
let list = [];
|
||||
for (let index = 0; index < posts.length; index++) {
|
||||
list.push({ id: posts[index].id, post: posts[index].post });
|
||||
|
|
|
|||
1874
themes/default-dark/assets/js/start.min.js
vendored
1874
themes/default-dark/assets/js/start.min.js
vendored
File diff suppressed because it is too large
Load diff
File diff suppressed because one or more lines are too long
|
|
@ -1,16 +0,0 @@
|
|||
extends frame
|
||||
block main-content
|
||||
-var featureUrl
|
||||
if(feature_image.length != 0)
|
||||
-featureUrl = feature_image[0].substr(7, feature_image[0].length)
|
||||
else
|
||||
-featureUrl = ''
|
||||
section.content#post-content
|
||||
#header-post
|
||||
#header-one
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
span#post-title= title
|
||||
img#featured-img(src=featureUrl)
|
||||
#post-display
|
||||
#post-text !{entry}
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
extends frame
|
||||
block main-content
|
||||
section.content#blog-content
|
||||
header.columns#header
|
||||
#header-one.column
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
#header-two.column
|
||||
label Thoughts and other weirdness.
|
||||
#blog-display
|
||||
.blog-list#blog-list
|
||||
- var index = 0
|
||||
- for ( index; index < items.length; index++)
|
||||
-var image = JSON.parse(items[index].feature_image)[0]
|
||||
-var featured = String(image).substr(7, String(image).length)
|
||||
a(href= "/blog/"+items[index].slug)
|
||||
.blog-entry(id=items[index].id style="background-image:url("+featured+")")
|
||||
label= items[index].title
|
||||
#paginate
|
||||
- var prev = page_index-1
|
||||
if prev < 1
|
||||
- prev = page_count
|
||||
- var next = ++page_index
|
||||
if next > page_count
|
||||
- next = 1
|
||||
a(href="/blog/page/"+prev)
|
||||
i.fa.fa-chevron-left
|
||||
label= "page "+String(page_index-1)+" of "+page_count
|
||||
a(href="/blog/page/"+next)
|
||||
i.fa.fa-chevron-right
|
||||
|
||||
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
extends frame
|
||||
block main-content
|
||||
section.content#bm-content
|
||||
header.columns#header
|
||||
#header-one.column
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
#header-two.column
|
||||
| Fipamo means to save.
|
||||
#bookmark-display
|
||||
.bookmark-list#bookmark-list
|
||||
- var index = 0;
|
||||
- for ( index; index < items.length; index++)
|
||||
.bookmark-entry(id=items[index]._id style="background-image:url("+items[index].image+")")
|
||||
a(target='_blank' href= items[index].url)
|
||||
.bookmark-info#bookmark-info
|
||||
- var bmlabel = items[index].title
|
||||
if bmlabel == "" || bmlabel == null
|
||||
- bmlabel = items[index].url
|
||||
label= bmlabel
|
||||
|
||||
#paginate-control
|
||||
#paginate
|
||||
- var prev = page_index-1
|
||||
if prev < 1
|
||||
- prev = page_count
|
||||
- var next = ++page_index
|
||||
if next > page_count
|
||||
- next = 1
|
||||
a(href="/fipamo/"+prev)
|
||||
i.fa.fa-chevron-left.fa-2x
|
||||
label= "Page "+String(page_index-1)+" of "+page_count
|
||||
a(href="/fipamo/"+next)
|
||||
i.fa.fa-chevron-right.fa-2x
|
||||
|
||||
|
||||
|
|
@ -11,8 +11,6 @@ html(xmlns='http://www.w3.org/1999/xhtml', lang='en', xml:lang="en")
|
|||
link(rel='stylesheet', href='/'+theme+'/assets/css/base.css', type='text/css')
|
||||
link(rel='stylesheet', href='/'+theme+'/assets/css/gruvbox-dark.css', type='text/css')
|
||||
body
|
||||
#loader
|
||||
i.fa.fa-cog.fa-spin.fa-4x.fa-fw
|
||||
.main-container#main-content
|
||||
block main-content
|
||||
script(src='/'+theme+'/assets/js/toolkit.min.js' type="text/javascript")
|
||||
|
|
|
|||
|
|
@ -2,48 +2,5 @@ extends frame
|
|||
|
||||
block main-content
|
||||
section#index-content
|
||||
header.columns#header
|
||||
#float-bg
|
||||
img(src=theme+'/assets/images/eye-beamz.png')
|
||||
#header-one.column
|
||||
#header-two.column
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
#the-intro
|
||||
| I'm Ro. I am a
|
||||
a(href='/work') freelancer
|
||||
|,
|
||||
a(href='/blog/page/1') thinker
|
||||
|,
|
||||
a(href='https://playvicious.social' target="_blank") masto admin
|
||||
|,
|
||||
a(href='/fipamo') a pack rat
|
||||
|, and I'm kinda trying to
|
||||
a(href="https://www.patreon.com/Are0h" target="_blank") save the world.
|
||||
#index-display
|
||||
#recent-title.index-block
|
||||
| "Boards do not hit back" © Bruce Lee
|
||||
//svg(viewBox="0 0 20 20" class="icons")
|
||||
use(xlink:href='/'+theme+'/assets/images/sprite.svg#entypo-air')
|
||||
#works.index-block
|
||||
h3 Works
|
||||
-var index = 0;
|
||||
-for (index; index<folio.length; index++)
|
||||
a(href='/work/'+folio[index].slug)
|
||||
span= folio[index].title
|
||||
br
|
||||
#bookmarks.index-block
|
||||
h3 Saved
|
||||
-var index = 0;
|
||||
-for (index; index<bookmarks.length; index++)
|
||||
a(href=bookmarks[index].url)
|
||||
span= bookmarks[index].title
|
||||
br
|
||||
#posts.index-block
|
||||
h3 Posts
|
||||
-var index = 0;
|
||||
-for (index; index<posts.length; index++)
|
||||
a(href='/blog/'+posts[index].slug)
|
||||
span= posts[index].title
|
||||
br
|
||||
| hello
|
||||
|
||||
|
|
|
|||
|
|
@ -1,23 +1,21 @@
|
|||
import EventEmitter from '../events/EventEmitter.jsx';;
|
||||
|
||||
class Animate extends EventEmitter {
|
||||
export default class Base {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
|
||||
//TODO: Flip to unified structure defined in BMG, brah
|
||||
constructor() {
|
||||
super();
|
||||
var self = this;
|
||||
this.start();
|
||||
}
|
||||
start() {
|
||||
console.log('FEEL TEH BASE');
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
object(properties) {
|
||||
var animation = anime(
|
||||
properties
|
||||
);
|
||||
//animation.start(properties);
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default Animate
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import DataUtils, { REQUEST_TYPE_GET, REQUEST_TYPE_PUT, REQUEST_TYPE_POST, REQUEST_TYPE_DELETE, CONTENT_TYPE_JSON, CONTENT_TYPE_FORM } from './tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from './tools/events/DataEvent.jsx';
|
||||
import DisplayManager from './controllers/DisplayManager.jsx';
|
||||
|
||||
class Base {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
|
||||
//TODO: Flip to unified structure defined in BMG, brah
|
||||
constructor() {
|
||||
var self = this;
|
||||
var admin = [];
|
||||
var folio = [];
|
||||
var displayManager = [];
|
||||
this.dataUtils = new DataUtils();
|
||||
this.settings = [];
|
||||
this.start();
|
||||
}
|
||||
start() {
|
||||
this.displayManager = new DisplayManager();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
loadSettings() {
|
||||
var self = this;
|
||||
this.dataUtils.request('/base-assets/data/settings.json', DataEvent.SETTINGS_LOADED)
|
||||
.then((response) => {
|
||||
this.settings = JSON.parse(response['request'].response);
|
||||
this.start();
|
||||
//transfer
|
||||
|
||||
})
|
||||
.catch((err) => {
|
||||
//console.log(err);
|
||||
});
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
export { Base as default }
|
||||
9
themes/default-dark/src/com/Start.js
Normal file
9
themes/default-dark/src/com/Start.js
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
import Base from './Base';
|
||||
|
||||
document.addEventListener(
|
||||
'DOMContentLoaded',
|
||||
function() {
|
||||
var base = new Base();
|
||||
},
|
||||
false
|
||||
);
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
import Base from './Base.jsx'
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
var base = new Base();
|
||||
}, false);
|
||||
21
themes/default-dark/src/com/actions/Post.js
Normal file
21
themes/default-dark/src/com/actions/Post.js
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
export default class Post {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
|
||||
//TODO: Flip to unified structure defined in BMG, brah
|
||||
constructor() {
|
||||
var self = this;
|
||||
this.start();
|
||||
}
|
||||
start() {
|
||||
console.log('YAAAAASSSS');
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
|
|
@ -1,77 +0,0 @@
|
|||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import ProjectFolio from '../tasks/ProjectFolio.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import DisplayAdminBlog from './DisplayAdminBlog.jsx'
|
||||
import DisplayAdminFipamo from './DisplayAdminFipamo.jsx';
|
||||
|
||||
class DisplayAdmin {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor(section, page) {
|
||||
this.section = section;
|
||||
this.page = page;
|
||||
this.current = null;
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
let self = this;
|
||||
new Animate().object({
|
||||
targets: document.getElementById('loader'),
|
||||
duration: 300,
|
||||
opacity: 0,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
document.getElementById('loader').style.display = 'none';
|
||||
document.getElementById('loader').style.visibility = 'hidden';
|
||||
new Animate().object({
|
||||
targets: document.getElementById('header'),
|
||||
duration: 10,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
new TextEffects().scramble(document.getElementById('the-title'), 50, function () {
|
||||
document.getElementById('loader').style.display = 'none';
|
||||
document.getElementById('loader').style.visibility = 'hidden';
|
||||
console.log(self.page)
|
||||
switch(self.page)
|
||||
{
|
||||
case "fipamo":
|
||||
self.current = new DisplayAdminFipamo();
|
||||
break;
|
||||
case "blog":
|
||||
self.current = new DisplayAdminBlog();
|
||||
break
|
||||
default:
|
||||
console.log("ADMIN INDEX");
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
DisplayAdmin.uploadFiles = [];
|
||||
export {
|
||||
DisplayAdmin as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,156 +0,0 @@
|
|||
//TOOLS
|
||||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
import BlogPost from '../tasks/BlogPost.jsx';
|
||||
class DisplayAdminBlog {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
reframe('iframe');
|
||||
this.uploadFiles;
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
new Animate().object({
|
||||
targets: document.getElementById('loader'),
|
||||
duration: 300,
|
||||
opacity: 0,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function() {
|
||||
document.getElementById('loader').style.display = 'none';
|
||||
document.getElementById('loader').style.visibility = 'hidden';
|
||||
new Animate().object({
|
||||
targets: document.getElementById('header'),
|
||||
duration: 10,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function() {
|
||||
new TextEffects().scramble(document.getElementById('the-title'), 50, function() {
|
||||
|
||||
if (document.getElementById('the-intro'))
|
||||
document.getElementById('the-intro').style.opacity = 1;
|
||||
if (document.getElementById('blog-entry'))
|
||||
document.getElementById('blog-entry').style.opacity = 1;
|
||||
//START SEcTION
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
if (document.getElementById('featured-image-drop')) {
|
||||
console.log("HERE");
|
||||
document.getElementById('featured-image-drop').addEventListener('dragover', this.handleDragOver, false);
|
||||
document.getElementById('featured-image-drop').addEventListener('drop', this.handleDrop, false);
|
||||
document.getElementById('featured-click').addEventListener('change', this.handleClicked, false);
|
||||
document.getElementById("post-sumbit-btn").addEventListener('click', f => {
|
||||
f.preventDefault();
|
||||
let edit = false;
|
||||
if (f.target.getAttribute('data-action') == 'blog-update')
|
||||
edit = true;
|
||||
console.log('clicked')
|
||||
new BlogPost().submitPost(edit, DisplayAdminBlog.uploadFiles).then((response) => {
|
||||
let note = JSON.parse(response['response']['request'].response);
|
||||
console.log(note.message);
|
||||
}).catch((err) => {
|
||||
console.log(err)
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
handleDragOver(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
e.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
|
||||
}
|
||||
handleClicked(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
console.log("IMAGES " + e.target.files);
|
||||
DisplayAdminBlog.uploadFiles = e.target.files;
|
||||
for (var i = 0, f; f = DisplayAdminBlog.uploadFiles[i]; i++) {
|
||||
// Only process image files.
|
||||
if (!f.type.match('image.*')) {
|
||||
continue;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
// Closure to capture the file information.
|
||||
reader.onload = (function(theFile) {
|
||||
return function(f) {
|
||||
// Render thumbnail.
|
||||
var span = document.createElement('span');
|
||||
span.innerHTML = [
|
||||
'<img src="',
|
||||
f.target.result,
|
||||
'" title="',
|
||||
escape(theFile.name),
|
||||
'"/>'
|
||||
].join('');
|
||||
//document.getElementById('featured-image-drop').insertBefore(span, null);
|
||||
document.getElementById('featured-image-drop').innerHTML = '';
|
||||
document.getElementById('featured-image-drop').appendChild(span);
|
||||
};
|
||||
})(f);
|
||||
// Read in the image file as a data URL.
|
||||
reader.readAsDataURL(f);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
handleDrop(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
DisplayBlog.uploadFiles = e.dataTransfer.files;
|
||||
//console.log(MemberArea.uploadFiles.length);
|
||||
for (var i = 0, f; f = DisplayBlog.uploadFiles[i]; i++) {
|
||||
// Only process image files.
|
||||
if (!f.type.match('image.*')) {
|
||||
continue;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
// Closure to capture the file information.
|
||||
reader.onload = (function(theFile) {
|
||||
return function(f) {
|
||||
// Render thumbnail.
|
||||
var span = document.createElement('span');
|
||||
span.innerHTML = [
|
||||
'<img src="',
|
||||
f.target.result,
|
||||
'" title="',
|
||||
escape(theFile.name),
|
||||
'"/>'
|
||||
].join('');
|
||||
//document.getElementById('featured-image-drop').insertBefore(span, null);
|
||||
document.getElementById('featured-image-drop').innerHTML = '';
|
||||
document.getElementById('featured-image-drop').appendChild(span);
|
||||
};
|
||||
})(f);
|
||||
// Read in the image file as a data URL.
|
||||
reader.readAsDataURL(f);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
DisplayAdminBlog.uploadFiles = [];
|
||||
export {
|
||||
DisplayAdminBlog as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,56 +0,0 @@
|
|||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
import TaskFipamo from '../tasks/TaskFipamo.jsx';
|
||||
class DisplayAdminFipamo {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
||||
start() {
|
||||
document.getElementById("saved-sumbit-btn").addEventListener('click', f => {
|
||||
console.log('CLICKED');
|
||||
let edit = false;
|
||||
if (f.target.getAttribute('data-action') == 'saved-edit')
|
||||
edit = true;
|
||||
|
||||
new TaskFipamo().submitLink(edit).then((response) => {
|
||||
let note = JSON.parse(response['response']['request'].response);
|
||||
if(note.message == 'link added' || note.message == 'bookmark updated')
|
||||
{
|
||||
switch(note.message)
|
||||
{
|
||||
case 'link added':
|
||||
document.getElementById('saved_text').value = ''
|
||||
break
|
||||
|
||||
case 'bookmark updated':
|
||||
document.getElementById('saved_text').value = 'updated'
|
||||
|
||||
break
|
||||
}
|
||||
}else{
|
||||
console.log(note);
|
||||
}
|
||||
}).catch((err) => {
|
||||
//console.log(err)
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
|
||||
export {
|
||||
DisplayAdminFipamo as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,75 +0,0 @@
|
|||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import ProjectFolio from '../tasks/ProjectFolio.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
class DisplayAdminFolio {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
var self = this;
|
||||
this.uploadFiles;
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
let self = this;
|
||||
new Animate().object({
|
||||
targets: document.getElementById('loader'),
|
||||
duration: 300,
|
||||
opacity: 0,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
document.getElementById('loader').style.display = 'none';
|
||||
document.getElementById('loader').style.visibility = 'hidden';
|
||||
if (document.getElementById('project-list')) {
|
||||
sortable('.project-list', {
|
||||
handle: '.drag-handle'
|
||||
})[0].addEventListener('sortupdate', function (e) {
|
||||
let sortList = [];
|
||||
let sortItems = document.getElementById('project-list').children;
|
||||
for (var i = 0; i < sortItems.length; i++) {
|
||||
sortList.push({
|
||||
'sortIndex': i,
|
||||
'sortID': sortItems[i].getAttribute('data-id')
|
||||
});
|
||||
}
|
||||
new DataUtils().request('/api/folio/sort', DataEvent.PROJECTS_SORTED, REQUEST_TYPE_POST, CONTENT_TYPE_JSON, sortList)
|
||||
.then((response) => {
|
||||
console.log(JSON.parse(response.request))
|
||||
}).catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
});
|
||||
}
|
||||
new Animate().object({
|
||||
targets: document.getElementById('header'),
|
||||
duration: 10,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
DisplayAdminFolio.uploadFiles = [];
|
||||
export {
|
||||
DisplayAdminFolio as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
//TOOLS
|
||||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
class DisplayBlog {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
reframe('iframe');
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
console.log("START BLOG");
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
export {
|
||||
DisplayBlog as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
//TOOLS
|
||||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
//Client-side Pages
|
||||
import DisplayIndex from './DisplayIndex.jsx';
|
||||
import DisplayWork from './DisplayWork.jsx';
|
||||
import DisplayBlog from './DisplayBlog.jsx';
|
||||
import DisplayFi from './DisplayFi.jsx';
|
||||
|
||||
class DisplayClient {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor(section, page) {
|
||||
this.section = section;
|
||||
this.page = page;
|
||||
this.current = null;
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
let self = this;
|
||||
new Animate().object({
|
||||
targets: document.getElementById('loader'),
|
||||
duration: 300,
|
||||
opacity: 0,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
document.getElementById('loader').style.display = 'none';
|
||||
document.getElementById('loader').style.visibility = 'hidden';
|
||||
new Animate().object({
|
||||
targets: document.getElementById('header'),
|
||||
duration: 10,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
new TextEffects().scramble(document.getElementById('the-title'), 50, function () {
|
||||
switch(self.section){
|
||||
case "blog":
|
||||
self.current = new DisplayBlog();
|
||||
break
|
||||
case "work":
|
||||
self.current = new DisplayWork();
|
||||
break
|
||||
case "fipamo":
|
||||
self.current = new DisplayFi();
|
||||
break
|
||||
default:
|
||||
self.current = new DisplayIndex();
|
||||
break
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
export {
|
||||
DisplayClient as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
export const DisplayID = "Display-Fi";
|
||||
import DataUtils, { REQUEST_TYPE_GET, REQUEST_TYPE_PUT, REQUEST_TYPE_POST, REQUEST_TYPE_DELETE, CONTENT_TYPE_JSON, CONTENT_TYPE_FORM } from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
class DisplayFi {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
this.dataUtils = new DataUtils();
|
||||
//this.mailer = new Mailer();
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
let self = this;
|
||||
console.log("START BOOKMARKS");
|
||||
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
export { DisplayFi as default }
|
||||
|
||||
21
themes/default-dark/src/com/controllers/DisplayIndex.js
Normal file
21
themes/default-dark/src/com/controllers/DisplayIndex.js
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
export default class DisplayIndex {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
|
||||
//TODO: Flip to unified structure defined in BMG, brah
|
||||
constructor() {
|
||||
var self = this;
|
||||
this.start();
|
||||
}
|
||||
start() {
|
||||
console.log('YAAAAASSSS');
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
|
|
@ -1,65 +0,0 @@
|
|||
//TOOLS
|
||||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
class DisplayIndex {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
document.getElementById('the-intro').style.opacity = 1;
|
||||
|
||||
new Animate().object({
|
||||
targets: document.getElementById('recent-work'),
|
||||
duration: 200,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
new Animate().object({
|
||||
targets: document.getElementById('recent-blog'),
|
||||
duration: 500,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
new Animate().object({
|
||||
targets: document.getElementById('float-bg'),
|
||||
duration: 2000,
|
||||
opacity: 1,
|
||||
easing: 'easeInQuad',
|
||||
complete: function () {
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
export {
|
||||
DisplayIndex as
|
||||
default
|
||||
}
|
||||
21
themes/default-dark/src/com/controllers/DisplayManager.js
Normal file
21
themes/default-dark/src/com/controllers/DisplayManager.js
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
export default class DisplayManager {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
|
||||
//TODO: Flip to unified structure defined in BMG, brah
|
||||
constructor() {
|
||||
var self = this;
|
||||
this.start();
|
||||
}
|
||||
start() {
|
||||
console.log('YAAAAASSSS');
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
//TOOLS
|
||||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import DisplayAdmin from './DisplayAdmin.jsx';
|
||||
import DisplayClient from './DisplayClient.jsx';
|
||||
class DisplayManager
|
||||
{
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor()
|
||||
{
|
||||
this.dataUtils = new DataUtils();
|
||||
this.currentDisplay = '';
|
||||
this.urlPieces = document.URL.split("/");
|
||||
//grab url so system knows what to display
|
||||
this.chooseDisplay(this.urlPieces[3], this.urlPieces[4]);
|
||||
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start()
|
||||
{}
|
||||
|
||||
chooseDisplay(section, page)
|
||||
{
|
||||
this.currentDisplay = '';
|
||||
switch (section) {
|
||||
case 'admin':
|
||||
this.currentDisplay = new DisplayAdmin(section, page);
|
||||
break
|
||||
|
||||
default:
|
||||
this.currentDisplay = new DisplayClient(section, page);
|
||||
break;
|
||||
}
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}
|
||||
export {DisplayManager as default}
|
||||
|
|
@ -1,130 +0,0 @@
|
|||
export const DisplayID = "Display-Work";
|
||||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import * as Ease from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
import Mailer from '../tasks/Mailer.jsx'
|
||||
class DisplayWork {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
this.dataUtils = new DataUtils();
|
||||
this.mailer = new Mailer();
|
||||
this.start();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {
|
||||
let self = this;
|
||||
if (document.getElementById('work-display')) {
|
||||
new Animate().object({
|
||||
targets: document.getElementById('work-display'),
|
||||
duration: 500,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
self.sortItemList();
|
||||
new Animate().object({
|
||||
targets: document.getElementById('float-bg'),
|
||||
duration: 2000,
|
||||
opacity: 1,
|
||||
easing: 'easeInQuad',
|
||||
complete: function () {
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
new Animate().object({
|
||||
targets: document.getElementById('work-header'),
|
||||
duration: 500,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
|
||||
}
|
||||
});
|
||||
} else {
|
||||
new Animate().object({
|
||||
targets: document.getElementById('folio-header'),
|
||||
duration: 500,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
self.showFolioImages();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
sortItemList() {
|
||||
let workItems = document.getElementById('work-list').children;
|
||||
let trans = 300;
|
||||
let self = this;
|
||||
for (var i = 0; i < workItems.length; i++) {
|
||||
//item.addEventListener('click', f => this.handleWorkList(f))
|
||||
|
||||
new Animate().object({
|
||||
targets: workItems[i],
|
||||
duration: trans,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
//self.showFolioImages();
|
||||
}
|
||||
});
|
||||
|
||||
trans = trans + 200;
|
||||
if (i == workItems.length - 1) {
|
||||
|
||||
new Animate().object({
|
||||
targets: document.getElementById('contact'),
|
||||
duration: 300,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
//self.showFolioImages();
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
showFolioImages() {
|
||||
let images = document.getElementById('project-images').children;
|
||||
let trans = 300;
|
||||
let self = this;
|
||||
for (var i = 0; i < images.length; i++) {
|
||||
//item.addEventListener('click', f => this.handleWorkList(f))
|
||||
|
||||
new Animate().object({
|
||||
targets: images[i],
|
||||
duration: trans,
|
||||
opacity: 1,
|
||||
easing: 'easeInOutQuad',
|
||||
complete: function () {
|
||||
//self.showFolioImages();
|
||||
}
|
||||
});
|
||||
trans = trans + 200
|
||||
}
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export {
|
||||
DisplayWork as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
import DataUtils, { REQUEST_TYPE_GET, REQUEST_TYPE_PUT, REQUEST_TYPE_POST, REQUEST_TYPE_DELETE, CONTENT_TYPE_JSON, CONTENT_TYPE_FORM } from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import StringUtils from '../tools/utilities/StringUtils.jsx';
|
||||
class BlogPost {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
var folio = [];
|
||||
this.dataUtils = new DataUtils();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {}
|
||||
|
||||
submitPost(edit, uploadFiles) {
|
||||
let self = this;
|
||||
return new Promise(function(resolve, reject) {
|
||||
//collect form data
|
||||
//if(!this.validateForm())
|
||||
var postData = new FormData();
|
||||
//let projectImages = document.getElementById('projectImages');
|
||||
//var fileSelect = projectImages;
|
||||
var files = uploadFiles;
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
var file = files[i];
|
||||
// Check the file type.
|
||||
if (!file.type.match('image.*')) {
|
||||
continue;
|
||||
}
|
||||
// Add the file to the request.
|
||||
postData.append('feature_image', file, file.name);
|
||||
}
|
||||
//var category = document.getElementById("content_category");
|
||||
//let project_form = document.forms.namedItem("folio-project");
|
||||
var txt = document.createElement("textarea");
|
||||
txt.innerHTML = document.getElementById('entry_text').innerHTML;
|
||||
console.log(txt);
|
||||
postData.append("title", document.getElementById('entry_title').value);
|
||||
postData.append('slug', new StringUtils().cleanString(document.getElementById('entry_title').value));
|
||||
postData.append("entry_plaintext", txt.value);
|
||||
postData.append("tags", document.getElementById('entry_tags').value);
|
||||
let postURL;
|
||||
let postEventType;
|
||||
if (edit) {
|
||||
let postID = document.getElementById('post-sumbit-btn').getAttribute('data-id');
|
||||
console.log("POST ID: "+postID);
|
||||
postURL = "/api/blog/update/" + postID;
|
||||
postEventType = DataEvent.POST_UPDATED;
|
||||
|
||||
} else {
|
||||
postURL = "/api/blog/add";
|
||||
postEventType = DataEvent.POST_ADDED;
|
||||
}
|
||||
self.dataUtils.request(postURL, postEventType, REQUEST_TYPE_POST, CONTENT_TYPE_FORM, postData)
|
||||
.then((response) => {
|
||||
resolve({
|
||||
response
|
||||
})
|
||||
}).catch((err) => {
|
||||
reject({
|
||||
err
|
||||
});
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
validateForm() {
|
||||
let valid = false;
|
||||
if (this.entry_form.title.value == "" || this.entry_form.price.value == "" || this.entry_form.description == "") {
|
||||
return valid;
|
||||
} else {
|
||||
valid = true;
|
||||
return valid;
|
||||
}
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export { BlogPost as default }
|
||||
|
|
@ -1,69 +0,0 @@
|
|||
import Animate from '../tools/effects/Animate.jsx';
|
||||
import TextEffects from '../tools/effects/TextEffects.jsx';
|
||||
|
||||
class Mailer {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor(element) {
|
||||
this.response = element
|
||||
if (document.getElementById('request-btn')) {
|
||||
document.getElementById('request-btn').addEventListener("click", f => {
|
||||
f.preventDefault();
|
||||
this.sendMail()
|
||||
})
|
||||
}
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
sendMail()
|
||||
{
|
||||
|
||||
var self = this;
|
||||
//if(!this.validateForm())
|
||||
var mailData = []
|
||||
|
||||
let requestForm = document.forms.namedItem("request-form");
|
||||
let serviceType = document.getElementById('service_type')
|
||||
//console.log(serviceType.options[serviceType.selectedIndex].text);
|
||||
|
||||
mailData = {
|
||||
"email": requestForm.email.value,
|
||||
"client": requestForm.client.value,
|
||||
"description": requestForm.description.value,
|
||||
"type": serviceType.options[serviceType.selectedIndex].text
|
||||
|
||||
};
|
||||
|
||||
var request = new XMLHttpRequest();
|
||||
request.open("POST", "/mailer", true);
|
||||
request.setRequestHeader("Content-type", "application/json")
|
||||
request.onload = function(oEvent) {
|
||||
if (request.status == 200) {
|
||||
let response = JSON.parse(request.response);
|
||||
if (response.message == "message sent") {
|
||||
|
||||
requestForm.reset();
|
||||
self.response.innerHTML = "HEY. THANKS FOR REACHING OUT. YOU'RE AWESOME"
|
||||
new TextEffects().scramble(self.response, 50, function () {
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
//console.log(response.detail);
|
||||
}
|
||||
|
||||
} else {
|
||||
//console.log(request);
|
||||
}
|
||||
};
|
||||
request.send(JSON.stringify(mailData));
|
||||
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export {Mailer as default}
|
||||
|
|
@ -1,101 +0,0 @@
|
|||
import DataUtils, { REQUEST_TYPE_GET, REQUEST_TYPE_PUT, REQUEST_TYPE_POST, REQUEST_TYPE_DELETE, CONTENT_TYPE_JSON, CONTENT_TYPE_FORM } from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import StringUtils from '../tools/utilities/StringUtils.jsx';
|
||||
class ProjectFolio {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
var folio = [];
|
||||
this.dataUtils = new DataUtils();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {}
|
||||
|
||||
submitProject(edit, uploadFiles) {
|
||||
let self = this;
|
||||
return new Promise(function(resolve, reject) {
|
||||
//collect form data
|
||||
//if(!this.validateForm())
|
||||
var projectData = new FormData();
|
||||
//let projectImages = document.getElementById('projectImages');
|
||||
//var fileSelect = projectImages;
|
||||
var files = uploadFiles;
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
var file = files[i];
|
||||
// Check the file type.
|
||||
if (!file.type.match('image.*')) {
|
||||
continue;
|
||||
}
|
||||
// Add the file to the request.
|
||||
projectData.append('folioImages', file, file.name);
|
||||
}
|
||||
var category = document.getElementById("content_category");
|
||||
let project_form = document.forms.namedItem("folio-project");
|
||||
projectData.append("title", project_form.title.value);
|
||||
projectData.append('slug', new StringUtils().cleanString(project_form.title.value));
|
||||
projectData.append("tools", project_form.tools.value);
|
||||
projectData.append("url", project_form.url.value);
|
||||
projectData.append("description", project_form.description.value);
|
||||
projectData.append("type", type.options[type.selectedIndex].text);
|
||||
|
||||
let postURL
|
||||
let postEventType
|
||||
|
||||
if (edit) {
|
||||
let postID = document.getElementById('btn-submit').getAttribute('data-id');
|
||||
postURL = "/api/folio/update/" + postID;
|
||||
postEventType = DataEvent.PROJECT_UPDATED;
|
||||
} else {
|
||||
postURL = "/api/folio/add";
|
||||
postEventType = DataEvent.PROJECT_ADDED;
|
||||
}
|
||||
|
||||
self.dataUtils.request(postURL, postEventType, REQUEST_TYPE_POST, CONTENT_TYPE_FORM, projectData)
|
||||
.then((response) => {
|
||||
resolve({
|
||||
response
|
||||
})
|
||||
}).catch((err) => {
|
||||
reject({
|
||||
err
|
||||
});
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
addNewProject(uploadFiles) {
|
||||
|
||||
var request = new XMLHttpRequest();
|
||||
request.open("POST", "/folio", true);
|
||||
request.onload = function(oEvent) {
|
||||
if (request.status == 200) {
|
||||
let response = JSON.parse(request.response);
|
||||
if (response.message == "New Content Entered") {
|
||||
console.log("SET");
|
||||
project_form.reset();
|
||||
} else {
|
||||
console.log(response.message);
|
||||
}
|
||||
} else {
|
||||
//console.log(request);
|
||||
}
|
||||
};
|
||||
request.send(projectData);
|
||||
}
|
||||
validateForm() {
|
||||
let valid = false;
|
||||
if (this.entry_form.title.value == "" || this.entry_form.price.value == "" || this.entry_form.description == "") {
|
||||
return valid;
|
||||
} else {
|
||||
valid = true;
|
||||
return valid;
|
||||
}
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export { ProjectFolio as default }
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
import DataUtils, {
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
} from '../tools/utilities/DataUtils.jsx';
|
||||
import * as DataEvent from '../tools/events/DataEvent.jsx';
|
||||
import StringUtils from '../tools/utilities/StringUtils.jsx';
|
||||
class TaskFipamo {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
var folio = [];
|
||||
this.dataUtils = new DataUtils();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start() {}
|
||||
|
||||
submitLink(edit) {
|
||||
let self = this;
|
||||
return new Promise(function (resolve, reject) {
|
||||
let link_data = '';
|
||||
let postURL;
|
||||
let postEventType;
|
||||
console.log('EDIT: '+edit);
|
||||
if (edit) {
|
||||
|
||||
//TODO: FIX TAGS,NEEDS TO BE SUBMITTED AS AN ARRAY
|
||||
|
||||
link_data = {
|
||||
"title": document.getElementById('saved_title').value,
|
||||
"tags": document.getElementById('saved_tags').value,
|
||||
"image": document.getElementById('saved_image').value
|
||||
};
|
||||
let savedID = document.getElementById('saved-sumbit-btn').getAttribute('data-id');
|
||||
postURL = "/api/bookmarks/update/" + savedID;
|
||||
postEventType = DataEvent.LINK_UPDATED;
|
||||
console.log('url'+postURL);
|
||||
} else {
|
||||
link_data = {
|
||||
"url": document.getElementById('saved_text').value
|
||||
};
|
||||
|
||||
postURL = "/api/bookmarks/add";
|
||||
postEventType = DataEvent.LINK_ADDED;
|
||||
}
|
||||
console.log('POSTING');
|
||||
self.dataUtils.request(postURL, postEventType, REQUEST_TYPE_POST, CONTENT_TYPE_JSON, link_data)
|
||||
.then((response) => {
|
||||
resolve({
|
||||
response
|
||||
})
|
||||
}).catch((err) => {
|
||||
reject({
|
||||
err
|
||||
});
|
||||
})
|
||||
});
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export {
|
||||
TaskFipamo as
|
||||
default
|
||||
}
|
||||
|
|
@ -1,137 +0,0 @@
|
|||
class UserAuthentication {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
var self = this;
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start()
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
handleUserSignUp(userSignupForm)
|
||||
{
|
||||
//e.preventDefault();
|
||||
let signup_form = document.forms.namedItem(userSignupForm);
|
||||
|
||||
let social_preferences = {"social":[
|
||||
{"service":"twitter", "url":""},
|
||||
{"service":"fb", "url":""},
|
||||
{"service":"instagram", "url":""},
|
||||
{"service":"pinterest", "url":""}
|
||||
]};
|
||||
|
||||
let mail_preferences = {"mail":[
|
||||
{"category":"video", "enabled":"false"},
|
||||
{"category":"books", "enabled":"false"},
|
||||
{"category":"graphic_novels", "enabled":"false"},
|
||||
{"category":"comics", "enabled":"false"}
|
||||
]};
|
||||
|
||||
//var oOutput = document.querySelector("div"),
|
||||
let signup_handle = signup_form.handle.value;
|
||||
let signup_firstname = signup_form.firstname.value;
|
||||
let signup_lastname = signup_form.lastname.value;
|
||||
let signup_email = signup_form.email.value;
|
||||
let signup_password = signup_form.password.value;
|
||||
let social = JSON.stringify(social_preferences);
|
||||
let mail = JSON.stringify(mail_preferences);
|
||||
|
||||
//oData.append("CustomField", "This is some extra data");
|
||||
var request = new XMLHttpRequest();
|
||||
request.open("POST", "/signup", true);
|
||||
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
||||
request.setRequestHeader('Cache-Control', 'max-age=0');
|
||||
request.setRequestHeader('Upgrade-Insecure-Requests', '1');
|
||||
request.onload = function(oEvent) {
|
||||
if (request.status == 200) {
|
||||
let response = JSON.parse(request.response);
|
||||
if(response.message == "USER ADDED")
|
||||
{
|
||||
document.body.dispatchEvent( new CustomEvent(USER_STATUS,
|
||||
{
|
||||
'detail':
|
||||
{
|
||||
type:"USER_ADDED",
|
||||
data:response.message
|
||||
}
|
||||
}) );
|
||||
}else{
|
||||
document.body.dispatchEvent( new CustomEvent(USER_STATUS,
|
||||
{
|
||||
'detail':
|
||||
{
|
||||
type:"USER_NOT_ADDED",
|
||||
data:response.message
|
||||
}
|
||||
}) );
|
||||
}
|
||||
|
||||
} else {
|
||||
console.log(request);
|
||||
}
|
||||
};
|
||||
|
||||
request.send('handle='+signup_handle+'&firstname='+signup_firstname+'&lastname='+signup_lastname+'&email='+signup_email+'&password='+signup_password+"&social="+social+"&preferences="+mail);
|
||||
}
|
||||
|
||||
handleUserLogin(userLoginForm)
|
||||
{
|
||||
//e.preventDefault();
|
||||
let login_form = document.forms.namedItem(userLoginForm);
|
||||
|
||||
//var oOutput = document.querySelector("div"),
|
||||
let login_handle = login_form.handle.value;
|
||||
let login_password = login_form.password.value;
|
||||
|
||||
//oData.append("CustomField", "This is some extra data");
|
||||
var request = new XMLHttpRequest();
|
||||
request.open("POST", "/login", true);
|
||||
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
||||
request.setRequestHeader('Cache-Control', 'max-age=0');
|
||||
request.setRequestHeader('Upgrade-Insecure-Requests', '1');
|
||||
request.onload = function(oEvent) {
|
||||
if (request.status == 200) {
|
||||
let response = JSON.parse(request.response);
|
||||
if(response.message == "USER FOUND")
|
||||
{
|
||||
document.body.dispatchEvent( new CustomEvent(USER_STATUS,
|
||||
{
|
||||
'detail':
|
||||
{
|
||||
type:"USER_LOGIN_GOOD",
|
||||
data:login_handle
|
||||
}
|
||||
}) );
|
||||
}else{
|
||||
document.body.dispatchEvent( new CustomEvent(USER_STATUS,
|
||||
{
|
||||
'detail':
|
||||
{
|
||||
type:"USER_LOGIN_BAD",
|
||||
data:response.message
|
||||
}
|
||||
}) );
|
||||
}
|
||||
|
||||
} else {
|
||||
console.log(request);
|
||||
}
|
||||
};
|
||||
|
||||
request.send('handle='+login_handle+'&password='+login_password);
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
|
||||
}
|
||||
export {UserAuthentication as default}
|
||||
export const USER_STATUS = "userStatus"
|
||||
|
|
@ -1,70 +0,0 @@
|
|||
class TexEffects {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
scramble(obj, offset, complete)
|
||||
{
|
||||
var scrambleText = new ScrambleText(obj, {
|
||||
timeOffset: offset,
|
||||
chars: [
|
||||
'安',
|
||||
'以',
|
||||
'宇',
|
||||
'衣',
|
||||
'於',
|
||||
'加',
|
||||
'幾',
|
||||
'久',
|
||||
'計',
|
||||
'己',
|
||||
'左',
|
||||
'之',
|
||||
'寸',
|
||||
'世',
|
||||
'曽',
|
||||
'太',
|
||||
'知',
|
||||
'川',
|
||||
'天',
|
||||
'止',
|
||||
'奈',
|
||||
'仁',
|
||||
'奴',
|
||||
'称',
|
||||
'乃',
|
||||
'波',
|
||||
'比',
|
||||
'不',
|
||||
'部',
|
||||
'保',
|
||||
'末',
|
||||
'美',
|
||||
'武',
|
||||
'女',
|
||||
'毛',
|
||||
'也',
|
||||
'為',
|
||||
'由',
|
||||
'恵',
|
||||
'与',
|
||||
'良',
|
||||
'利',
|
||||
'留',
|
||||
'礼',
|
||||
'呂',
|
||||
'和',
|
||||
'遠',
|
||||
'无'
|
||||
],
|
||||
callback: complete
|
||||
}).start();
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default TexEffects
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
export const MEMBER_STATUS = "memberStatus";
|
||||
export const LOGIN_STATUS = 'loginStatus';
|
||||
export const SUPPORTER_FOUND = 'SUPPORTER FOUND';
|
||||
export const SUPPORTER_LISTED = 'SUPPORTER LISTED';
|
||||
export const SUPPORTER_NOT_FOUND = 'SUPPORTER NOT FOUND';
|
||||
export const MEMBER_ADDED = 'MEMBER ADDED';
|
||||
export const MEMBER_NOT_ADDED = 'MEMBER NOT ADDED';
|
||||
export const MEMBER_LOGIN_GOOD = 'MEMBER LOGIN GOOD';
|
||||
export const MEMBER_LOGIN_LAME = 'MEMBER LOGIN LAME';
|
||||
export const MEMBER_EXISTS = 'USER ALREADY EXISTS';
|
||||
export const MEMBER_LOGIN_MISSING = 'Missing credentials';
|
||||
|
||||
|
||||
|
||||
class AuthEvent
|
||||
{
|
||||
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
||||
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default new AuthEvent
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
export const REQUEST_GOOD = 'requestGood';
|
||||
export const REQUEST_LAME = 'requestLame';
|
||||
export const IMG_REQUEST_GOOD = 'imgRequestGood';
|
||||
export const IMG_REQUEST_LAME = 'imgRequestLame';
|
||||
export const SETTINGS_LOADED = 'dataLoaded';
|
||||
export const HTML_LOADED = 'htmlLoaded';
|
||||
export const ARCHIVES_JSON_LOADED = 'archivesJSONLoaded';
|
||||
export const ARCHIVES_PAGE_LOADED = 'archivesPAGELoaded';
|
||||
export const ARCHIVES_ENTRY_LOADED = 'archivesEntryLoaded';
|
||||
export const PROJECT_UPDATED = 'projectUpdated';
|
||||
export const PROJECT_ADDED = 'projectAdded';
|
||||
export const PROJECTS_SORTED = 'projectsSorted';
|
||||
|
||||
class DataEvent
|
||||
{
|
||||
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
||||
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default new DataEvent
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
class EventEmitter
|
||||
{
|
||||
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor()
|
||||
{
|
||||
this.listeners = new Map();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
addListener(label, callback) {
|
||||
this.listeners.has(label) || this.listeners.set(label, []);
|
||||
this.listeners.get(label).push(callback);
|
||||
}
|
||||
|
||||
removeListener(label, callback) {
|
||||
var isFunction = function(obj) {
|
||||
return typeof obj == 'function' || false;
|
||||
};
|
||||
|
||||
var listeners = this.listeners.get(label),
|
||||
index;
|
||||
|
||||
if (listeners && listeners.length) {
|
||||
index = listeners.reduce((i, listener, index) => {
|
||||
return (isFunction(listener) && listener === callback)
|
||||
? i = index
|
||||
: i;
|
||||
}, -1);
|
||||
|
||||
if (index > -1) {
|
||||
listeners.splice(index, 1);
|
||||
this.listeners.set(label, listeners);
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
emitEvent(label, ...args) {
|
||||
var listeners = this.listeners.get(label);
|
||||
if (listeners && listeners.length) {
|
||||
listeners.forEach((listener) => {
|
||||
listener(...args);
|
||||
});
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default EventEmitter
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
import TransformEffects from './TransformEffects.jsx';
|
||||
|
||||
class Slideshow{
|
||||
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor(slides)
|
||||
{
|
||||
this.slides = slides;
|
||||
var timer = null;
|
||||
this.slideIndex = 0;
|
||||
for(let i of slides)
|
||||
{
|
||||
new TransformEffects().rotateY(i, 0, 90, "top right");
|
||||
i.style.opacity = 1;
|
||||
}
|
||||
|
||||
this.start();
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start()
|
||||
{
|
||||
new TransformEffects().rotateY(this.slides[this.slideIndex], 1, 0, "top right");
|
||||
this.startTimer()
|
||||
}
|
||||
|
||||
startTimer()
|
||||
{
|
||||
var self = this;
|
||||
this.timer = setTimeout(f=>
|
||||
{
|
||||
self.slideTranstion();
|
||||
}, 4000);
|
||||
}
|
||||
|
||||
slideTranstion()
|
||||
{
|
||||
new TransformEffects().rotateY(this.slides[this.slideIndex], 1, 90, "top right");
|
||||
++this.slideIndex;
|
||||
if(this.slideIndex > this.slides.length-1)
|
||||
this.slideIndex = 0;
|
||||
new TransformEffects().rotateY(this.slides[this.slideIndex], 1, 0, "top right");
|
||||
this.startTimer();
|
||||
}
|
||||
|
||||
setDisplayType()
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// eventhandlers
|
||||
//--------------------------
|
||||
}
|
||||
export {Slideshow as default}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
class DOMUtils
|
||||
{
|
||||
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor()
|
||||
{}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
getWindowXY()
|
||||
{
|
||||
var w = window,
|
||||
d = document,
|
||||
e = d.documentElement,
|
||||
g = d.getElementsByTagName('body')[0],
|
||||
x = w.innerWidth || e.clientWidth || g.clientWidth,
|
||||
y = w.innerHeight || e.clientHeight || g.clientHeight;
|
||||
|
||||
var dimensions = {
|
||||
windowHeight: y,
|
||||
windowWidth: x
|
||||
}
|
||||
return dimensions;
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default DOMUtils
|
||||
|
|
@ -1,114 +0,0 @@
|
|||
export const REQUEST_TYPE_POST = "POST";
|
||||
export const REQUEST_TYPE_GET = "GET";
|
||||
export const REQUEST_TYPE_PUT = "PUT";
|
||||
export const REQUEST_TYPE_DELETE = "DELETE";
|
||||
export const CONTENT_TYPE_JSON = 'json';
|
||||
export const CONTENT_TYPE_FORM = 'x-www-form-urlencoded';
|
||||
import EventEmitter from '../events/EventEmitter.jsx';
|
||||
import * as DataEvent from '../events/DataEvent.jsx';
|
||||
class DataUtils extends EventEmitter {
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
super();
|
||||
var self = this;
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
request(requestURL, eventType, requestType = REQUEST_TYPE_GET, contentType = CONTENT_TYPE_JSON, requestData = null) {
|
||||
var self = this;
|
||||
return new Promise(function(resolve, reject) {
|
||||
var request = new XMLHttpRequest();
|
||||
request.upload.onprogress = self.handleLoadProgress;
|
||||
request.open(requestType, requestURL, true);
|
||||
request.onload = function(e) {
|
||||
if (request.status == 200) {
|
||||
resolve({
|
||||
request,
|
||||
eventType
|
||||
});
|
||||
} else {
|
||||
reject({
|
||||
request,
|
||||
eventType
|
||||
});
|
||||
}
|
||||
;
|
||||
};
|
||||
if (requestType == REQUEST_TYPE_PUT || requestType == REQUEST_TYPE_POST) {
|
||||
switch (contentType) {
|
||||
case CONTENT_TYPE_JSON:
|
||||
request.setRequestHeader("Content-type", "application/" + contentType);
|
||||
request.send(JSON.stringify(requestData));
|
||||
break;
|
||||
case CONTENT_TYPE_FORM:
|
||||
request.send(requestData);
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
request.send();
|
||||
}
|
||||
})
|
||||
}
|
||||
imgLoad(url) {
|
||||
'use strict';
|
||||
// Create new promise with the Promise() constructor;
|
||||
// This has as its argument a function with two parameters, resolve and reject
|
||||
return new Promise(function(resolve, reject) {
|
||||
// Standard XHR to load an image
|
||||
var request = new XMLHttpRequest();
|
||||
request.open('GET', url);
|
||||
request.responseType = 'blob';
|
||||
// When the request loads, check whether it was successful
|
||||
request.onload = function() {
|
||||
if (request.status === 200) {
|
||||
// If successful, resolve the promise by passing back the request response
|
||||
resolve(request.response);
|
||||
} else {
|
||||
// If it fails, reject the promise with a error message
|
||||
reject(new Error('Image didn\'t load successfully; error code:' + request.statusText));
|
||||
}
|
||||
};
|
||||
request.onerror = function() {
|
||||
// Also deal with the case when the entire request fails to begin with
|
||||
// This is probably a network error, so reject the promise with an appropriate message
|
||||
reject(new Error('There was a network error.'));
|
||||
};
|
||||
// Send the request
|
||||
request.send();
|
||||
});
|
||||
}
|
||||
loadImage(src) {
|
||||
'use strict';
|
||||
let self = this;
|
||||
return new Promise(function(resolve, reject) {
|
||||
// Get a reference to the body element, and create a new image object
|
||||
var body = document.querySelector('body'),
|
||||
myImage = new Image();
|
||||
myImage.crossOrigin = ""; // or "anonymous"
|
||||
// Call the function with the URL we want to load, but then chain the
|
||||
// promise then() method on to the end of it. This contains two callbacks
|
||||
self.imgLoad(src).then(function(response) {
|
||||
// The first runs when the promise resolves, with the request.reponse specified within the resolve() method.
|
||||
var imageURL = window.URL.createObjectURL(response);
|
||||
resolve(imageURL);
|
||||
//$('background-content').setStyle('background-image', 'url('+imageURL+')') //myImage.src = imageURL;
|
||||
//console.log(imageURL);
|
||||
//body.appendChild(myImage);
|
||||
// The second runs when the promise is rejected, and logs the Error specified with the reject() method.
|
||||
}, function(Error) {
|
||||
reject(Error)
|
||||
});
|
||||
});
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
handleLoadProgress(e) {
|
||||
var percentComplete = Math.ceil((e.loaded / e.total) * 100);
|
||||
//console.log(percentComplete);
|
||||
}
|
||||
}
|
||||
export default DataUtils;
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
class DateUtils
|
||||
{
|
||||
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor()
|
||||
{}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
getMKtime()
|
||||
{
|
||||
var time = new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate(), new Date().getHours(), new Date().getMinutes(), new Date().getSeconds(), 0).getTime() / 1000;
|
||||
return time;
|
||||
}
|
||||
|
||||
convertMKtime(seconds)
|
||||
{
|
||||
var date = new Date(seconds * 1000);
|
||||
return date;
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default DateUtils
|
||||
|
|
@ -1,65 +0,0 @@
|
|||
class StringUtils
|
||||
{
|
||||
|
||||
//--------------------------
|
||||
// constructor
|
||||
//--------------------------
|
||||
constructor()
|
||||
{}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
cleanString(string)
|
||||
{
|
||||
var clean = string.replace(/(^\-+|[^a-zA-Z0-9\/_| -]+|\-+$)/g, '').toLowerCase().replace(/[\/_| -]+/g, '-');
|
||||
return clean;
|
||||
}
|
||||
|
||||
decodeHTML(string, quote_style) {
|
||||
var optTemp = 0,
|
||||
i = 0,
|
||||
noquotes = false;
|
||||
if (typeof quote_style === 'undefined') {
|
||||
quote_style = 2;
|
||||
}
|
||||
string = string.toString().replace(/</g, '<').replace(/>/g, '>');
|
||||
var OPTS = {
|
||||
'ENT_NOQUOTES': 0,
|
||||
'ENT_HTML_QUOTE_SINGLE': 1,
|
||||
'ENT_HTML_QUOTE_DOUBLE': 2,
|
||||
'ENT_COMPAT': 2,
|
||||
'ENT_QUOTES': 3,
|
||||
'ENT_IGNORE': 4
|
||||
};
|
||||
if (quote_style === 0) {
|
||||
noquotes = true;
|
||||
}
|
||||
if (typeof quote_style !== 'number') { // Allow for a single string or an array of string flags
|
||||
quote_style = [].concat(quote_style);
|
||||
for (i = 0; i < quote_style.length; i++) {
|
||||
// Resolve string input to bitwise e.g. 'PATHINFO_EXTENSION' becomes 4
|
||||
if (OPTS[quote_style[i]] === 0) {
|
||||
noquotes = true;
|
||||
} else if (OPTS[quote_style[i]]) {
|
||||
optTemp = optTemp | OPTS[quote_style[i]];
|
||||
}
|
||||
}
|
||||
quote_style = optTemp;
|
||||
}
|
||||
if (quote_style & OPTS.ENT_HTML_QUOTE_SINGLE) {
|
||||
string = string.replace(/�*39;/g, "'"); // PHP doesn't currently escape if more than one 0, but it should
|
||||
// string = string.replace(/'|�*27;/g, "'"); // This would also be useful here, but not a part of PHP
|
||||
}
|
||||
if (!noquotes) {
|
||||
string = string.replace(/"/g, '"');
|
||||
}
|
||||
// Put this in last place to avoid escape being double-decoded
|
||||
string = string.replace(/&/g, '&');
|
||||
return string;
|
||||
}
|
||||
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
}
|
||||
export default StringUtils
|
||||
|
|
@ -1,197 +0,0 @@
|
|||
#admin-index-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
|
||||
#admin-index-display
|
||||
padding 20px
|
||||
width 100%
|
||||
max-width 1024px
|
||||
z-index 10
|
||||
position relative
|
||||
#admin-login
|
||||
width 300px
|
||||
#admin-index-title
|
||||
color $white
|
||||
font 400 2em $titleType
|
||||
vertical-align top
|
||||
.admin-menu-main
|
||||
.admin-nav
|
||||
span
|
||||
display inline-block
|
||||
padding 0 0 0 5px
|
||||
.index-block
|
||||
width 50%
|
||||
display inline-block
|
||||
vertical-align top
|
||||
margin-bottom 50px
|
||||
|
||||
#blog-edit
|
||||
label
|
||||
font 600 1em $titleType
|
||||
color $white
|
||||
textarea#entry_title
|
||||
width 100%
|
||||
background none
|
||||
color $tertiary
|
||||
font 500 2em $titleType
|
||||
textarea#entry_text
|
||||
width 100%
|
||||
height 600px
|
||||
padding 10px
|
||||
|
||||
#blog-meta
|
||||
label
|
||||
font 600 1em $titleType
|
||||
color $white
|
||||
input, button
|
||||
width 100%
|
||||
input
|
||||
color $secondary
|
||||
background $black
|
||||
#featured-click
|
||||
display none
|
||||
|
||||
#blog-index-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
#blog-hub-display
|
||||
#blog-hub-title
|
||||
font 400 2em $titleType
|
||||
color $white
|
||||
|
||||
#saved-index-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
#saved-hub-display
|
||||
#saved-hub-title, #saved-hub-main
|
||||
label
|
||||
font 400 2em $titleType
|
||||
color $white
|
||||
textarea
|
||||
width 90%
|
||||
button
|
||||
padding 5px
|
||||
|
||||
|
||||
|
||||
#post-edit-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
header#header
|
||||
#header-one
|
||||
#blog-edit
|
||||
margin 100px 0 0 0
|
||||
position relative
|
||||
label
|
||||
font 600 1em $titleType
|
||||
color $white
|
||||
display block
|
||||
#entry_title
|
||||
width 90%
|
||||
background none
|
||||
font 400 2em $titleType
|
||||
color $tertiary
|
||||
#entry_text
|
||||
width 90%
|
||||
height 500px
|
||||
padding 10px
|
||||
pre
|
||||
background $black
|
||||
code
|
||||
white-space pre-wrap
|
||||
color $tertiary
|
||||
#header-two
|
||||
label
|
||||
font 600 1em $titleType
|
||||
color $white
|
||||
#featured-image-drop
|
||||
border-radius 3px
|
||||
border 1px dashed $white
|
||||
width 100%
|
||||
font 600 .5em $titleType
|
||||
height 100px
|
||||
text-align center
|
||||
vertical-align middle
|
||||
line-height 100px
|
||||
overflow hidden
|
||||
img
|
||||
width 100%
|
||||
|
||||
#blog-meta
|
||||
margin 100px 0 0 0
|
||||
position relative
|
||||
#featured-click
|
||||
display none
|
||||
#entry_tags, button
|
||||
width 100%
|
||||
|
||||
|
||||
.folio-project-form
|
||||
display inline-block
|
||||
width 56%
|
||||
|
||||
input[type=email], input[type=password], input[type=text], select
|
||||
width 400px
|
||||
select
|
||||
margin: 10px 0 0 0
|
||||
|
||||
textarea
|
||||
width 400px
|
||||
height 133px
|
||||
|
||||
.folio-hub
|
||||
padding 20px
|
||||
|
||||
span
|
||||
margin 10px 10px 0 0
|
||||
.btn-add-project span
|
||||
font 20px $bodyType
|
||||
margin: -35px 0 0 40px;
|
||||
display block
|
||||
height: 50px
|
||||
|
||||
.project-list
|
||||
width 95%
|
||||
span.drag-handle
|
||||
padding: 10px;
|
||||
color $tertiary
|
||||
cursor pointer
|
||||
.project-item
|
||||
width: 100%;
|
||||
display: inline-block
|
||||
background lightness($primary, 20%)
|
||||
padding: 5px
|
||||
margin-bottom 10px
|
||||
border-radius: 5px;
|
||||
object-transitions(.3s)
|
||||
.project-item:hover
|
||||
background lightness($primary, 30%)
|
||||
|
||||
.upload-list
|
||||
color lightness($primary, 80%)
|
||||
display inline-block
|
||||
vertical-align top
|
||||
width 260px
|
||||
height 330px
|
||||
margin 45px 0 0
|
||||
|
||||
.thumb
|
||||
height 50px
|
||||
overflow hidden
|
||||
border-radius 3px
|
||||
margin 10px 5px 0 0
|
||||
|
||||
.upload-drop
|
||||
width 400px
|
||||
height 70px
|
||||
background $form-background
|
||||
color lightness($primary, 80%)
|
||||
text-align center
|
||||
padding 40px 0 0
|
||||
font-size 12px
|
||||
text-transform uppercase
|
||||
border-radius 3px
|
||||
|
|
@ -1,65 +0,0 @@
|
|||
#blog-content
|
||||
|
||||
#blog-display
|
||||
#blog-list
|
||||
.blog-entry
|
||||
display inline-block
|
||||
height 500px;
|
||||
width 50%
|
||||
background-size cover
|
||||
background $black
|
||||
position relative
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
line-height: 250px;
|
||||
label
|
||||
background $secondary
|
||||
padding 5px
|
||||
border-radius 3px
|
||||
|
||||
|
||||
#post-content
|
||||
width 100%
|
||||
margin -10px 0 0 0
|
||||
#header-post
|
||||
width 100%
|
||||
min-height 350px
|
||||
background $black
|
||||
position relative
|
||||
padding 0
|
||||
margin 0
|
||||
img
|
||||
padding 0
|
||||
margin 0
|
||||
position relative
|
||||
display block
|
||||
width 100%
|
||||
#header-one
|
||||
position relative
|
||||
width 80%
|
||||
margin 0 auto
|
||||
padding 30px 0 0 0
|
||||
|
||||
label#the-title a
|
||||
font 500 2em $titleType
|
||||
width 97px
|
||||
height 115px
|
||||
color $secondary
|
||||
text-decoration none
|
||||
display block
|
||||
word-break: break-all
|
||||
margin 10px 0 0 10px
|
||||
span#post-title
|
||||
font 200 4.5em/1em $titleType
|
||||
color $white
|
||||
margin 20px 0 0 10px
|
||||
padding 20px 0 80px 0
|
||||
display block
|
||||
|
||||
|
||||
#post-display
|
||||
color $tertiary
|
||||
width 80%
|
||||
margin 50px auto
|
||||
font 400 1.5em $bodyType
|
||||
padding-bottom 50px
|
||||
|
|
@ -1,71 +0,0 @@
|
|||
#bm-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
#header-one, #header-two
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
#header-two
|
||||
font 400 1.5em $bodyType
|
||||
#bookmark-display
|
||||
padding 0
|
||||
.bookmark-list
|
||||
.bookmark-entry
|
||||
background lightness($primary, 15%)
|
||||
width 50%
|
||||
height 500px
|
||||
background-size cover
|
||||
overflow hidden
|
||||
display inline-block
|
||||
vertical-align top
|
||||
//border-radius 3px
|
||||
padding 10px
|
||||
.bookmark-info
|
||||
display flex
|
||||
align-items center
|
||||
justify-content center
|
||||
width 100%
|
||||
height 100%
|
||||
label
|
||||
display block
|
||||
font-size .5em
|
||||
padding 10px
|
||||
background $primary
|
||||
border-radius 5px
|
||||
#paginate-control
|
||||
width 100%
|
||||
height 300px
|
||||
background lightness($primary, 30%)
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
#paginate
|
||||
|
||||
margin 0 auto
|
||||
a, label
|
||||
display inline-block
|
||||
vertical-align top
|
||||
label
|
||||
padding 5px
|
||||
color $tertiary
|
||||
font-size 2.2em
|
||||
a
|
||||
padding 20px
|
||||
margin-top 4px
|
||||
|
||||
|
||||
/**
|
||||
-------------------------------
|
||||
-- Responsive
|
||||
-------------------------------
|
||||
**/
|
||||
|
||||
@media only screen and (max-width: 768px)
|
||||
#bm-content
|
||||
#bookmark-display
|
||||
.bookmark-list
|
||||
.bookmark-entry
|
||||
width 100%
|
||||
|
||||
|
||||
|
|
@ -1,96 +0,0 @@
|
|||
#work-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
#header
|
||||
#header-two
|
||||
p
|
||||
font 400 1.5em $bodyType
|
||||
span
|
||||
color $secondary
|
||||
#work-display
|
||||
padding 0
|
||||
margin 0 0 40px 0
|
||||
opacity 0
|
||||
|
||||
|
||||
#work-list
|
||||
|
||||
.work-item
|
||||
width 50%
|
||||
height 300px
|
||||
display inline-block
|
||||
vertical-align top
|
||||
background-size cover
|
||||
background-color $tertiary
|
||||
color $tertiary
|
||||
span
|
||||
font 600 .7em $titleType
|
||||
|
||||
#work-contact
|
||||
#contact-form
|
||||
opacity 1
|
||||
label
|
||||
font 600 .8em $titleType
|
||||
color $highlight
|
||||
margin 0 0 15px 0
|
||||
display block
|
||||
#request-form
|
||||
input[type=email], input[type=password], input[type=text]
|
||||
width 100%
|
||||
margin 0 10px 10px 0
|
||||
|
||||
select
|
||||
width 100%
|
||||
margin-bottom: 10px;
|
||||
|
||||
textarea
|
||||
width: 100%
|
||||
#contact-info
|
||||
label#request-status
|
||||
font 600 .8em $titleType
|
||||
color $highlight
|
||||
margin 0 0 15px 0
|
||||
display block
|
||||
text-transform uppercase
|
||||
p
|
||||
font 400 1em $bodyType
|
||||
color $tertiary
|
||||
i
|
||||
color $highlight
|
||||
|
||||
|
||||
#project-content
|
||||
width 100%
|
||||
max-width 1024px
|
||||
margin 0 auto
|
||||
#project-display
|
||||
padding: 0 20px 20px 20px
|
||||
|
||||
#project-info
|
||||
span
|
||||
font 400 2em $titleType
|
||||
color $white
|
||||
#project-desc
|
||||
font 300 1.2em $bodyType
|
||||
color $tertiary
|
||||
#project-images
|
||||
margin 10px 0 0 0
|
||||
opacity 1
|
||||
.folio-image
|
||||
width 100%
|
||||
margin 0 0 50px 0
|
||||
opacity 0
|
||||
|
||||
/**
|
||||
-------------------------------
|
||||
-- Responsive
|
||||
-------------------------------
|
||||
**/
|
||||
|
||||
@media screen and (max-width: 768px)
|
||||
#work-content
|
||||
#work-list
|
||||
.work-item
|
||||
width 100%
|
||||
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
extends frame
|
||||
|
||||
block main-content
|
||||
section.content#project-content
|
||||
header.columns#header
|
||||
#header-one.column
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
#header-two.column
|
||||
a(href="/work") back to work
|
||||
#project-display.columns
|
||||
#project-info.column
|
||||
span= title
|
||||
#project-desc.column
|
||||
=desc
|
||||
#project-images
|
||||
each val in images
|
||||
- console.log(val)
|
||||
- var path = String(val.path).substring(7, val.path.length)
|
||||
img.folio-image(src=path)
|
||||
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
extends frame
|
||||
block main-content
|
||||
section.content#work-content
|
||||
header.columns#header
|
||||
#header-one.column
|
||||
label#the-title
|
||||
a(href="/") thetwelfthhouse
|
||||
#header-two.column
|
||||
p
|
||||
| I am an independent graphic designer and web developer that loves using my formidable talents to create cool stuff.
|
||||
br
|
||||
span I am currently available for new work.
|
||||
#work-display
|
||||
#work-list
|
||||
h2 Recent Projects
|
||||
each project, index in projects
|
||||
- var image = JSON.parse(project.images)[0]
|
||||
a(href='/work/'+project.slug)
|
||||
div.work-item(style="background-image:url("+image.path.substring(7, image.path.length)+")")
|
||||
//label.project-label#project-label= project.title
|
||||
//br
|
||||
//span= project.type
|
||||
#work-contact.columns
|
||||
#contact-form.column
|
||||
label#form-response GIMME YOUR DATAZ
|
||||
#request-form
|
||||
form(class='request-form', name="request-form", enctype="multipart/form-data")
|
||||
input(type='text', name='email' class='', placeholder='Email', required, autofocus)
|
||||
input(type='text', id="client" name='client' class='', placeholder='Name', required, autofocus)
|
||||
select(id="service_type", name="service_type", form="service-type'")
|
||||
option(value="option00") Select Service Type
|
||||
option(value="option01") Design and Development
|
||||
option(value="option02") Graphic Design
|
||||
option(value="option03") Web Development
|
||||
option(value="option04") Logo/Branding
|
||||
option(value="option05") Hosting
|
||||
option(value="option05") A little of everything
|
||||
textarea(rows="9" cols="52" name='description' class='', placeholder='Project Details', required, autofocus)
|
||||
button(id="request-btn", class='request-btn', type='submit') SEND_INQUIRY
|
||||
#contact-info.column
|
||||
label#request-status Got a project idea? Let's talk.
|
||||
p
|
||||
i.fa.fa-exclamation-triangle
|
||||
br
|
||||
|A standard $200 fee will be charged for project consultation. Serious inquiries only. Thanks.
|
||||
br
|
||||
br
|
||||
|Consultation requests will be responded to within 48 hours.
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in a new issue