began structure for front end theme, cleaned up watch script for theme development
Ro
6 years ago
parent
dc13a25bfb
commit
67f00e1342
@ -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
|
||||
});
|
||||
|
||||
}).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;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
router.get('/:page?', function(req, res) {
|
||||
res.render(config.theme + '/index', {
|
||||
theme: config.theme,
|
||||
title: config.title,
|
||||
user_status: 'What up, random person'
|
||||
});
|
||||
});
|
||||
return router;
|
||||
}
|
||||
};
|
||||
|
||||
File diff suppressed because one or more lines are too long
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
|
||||
|
||||
|
||||
@ -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 }
|
||||
@ -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);
|
||||
@ -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 }
|
||||
|
||||
@ -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
|
||||
}
|
||||
@ -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 New Issue