Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixing / Updating to total4 #7

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 6 additions & 2 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,2 +1,6 @@

tmp/
/tmp/
node_modules
index.js.*
index.pid
*.table
*.nosql
10 changes: 1 addition & 9 deletions controllers/default.js
Original file line number Diff line number Diff line change
@@ -1,16 +1,8 @@
exports.install = function() {

ROUTE('/');
ROUTE('/services/', view_services);
ROUTE('/contact/');
ROUTE('/references/');
ROUTE('/*');

// Enables a localization mechanism + compression for all client-side components
LOCALIZE('/components/*.html', ['compress']);

};

function view_services() {
var self = this;
self.view('services');
}
24 changes: 24 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

52 changes: 29 additions & 23 deletions public/components/contactform.html
Original file line number Diff line number Diff line change
@@ -1,52 +1,58 @@
<div data-jc-scope="?" class="hidden" data-jc-class="hidden">
<ui-plugin>

<div data-jc="visible" data-jc-path="response" data-jc-config="if:value && value.success === true" class="hidden">
<div class="message-success"><span class="fa fa-check-circle"></span>Thanks, the contact form has been sent successfully.</div>
<ui-component name="visible" path="response" config="if:value && value.success === true" class="hidden">
<div class="message-success"><span class="ti ti-check-circle"></span>Thanks, the contact form has been sent successfully.</div>
<br />
</div>

<div data-jc="visible" data-jc-path="response" data-jc-config="if:!value || !value.success">
</ui-component>
<ui-component name="visible" path="response" config="if:value">
<div class="row">
<div class="col-md-6 m">
<div data-jc="textbox" data-jc-path="firstname" data-jc-value="''" data-jc-config="required:true">First name</div>
<ui-component name="textbox" path="firstname" default="''" config="required:true">First name</ui-component>
</div>
<div class="col-md-6 m">
<div data-jc="textbox" data-jc-path="lastname" data-jc-value="''" data-jc-config="required:true">Last name</div>
<ui-component name="textbox" path="lastname" default="''" config="required:true">Last name</ui-component>
</div>
</div>
<div class="row">
<div class="col-md-6 m">
<div data-jc="textbox" data-jc-path="email" data-jc-value="'@'" data-jc-config="required:true;type:email">Email address</div>
<ui-component name="textbox" path="email" default="'@'" config="required:true;type:email">Email address</ui-component>
</div>
<div class="col-md-6 m">
<div data-jc="textbox" data-jc-path="phone" data-jc-value="''">Phone number</div>
<ui-component name="textbox" path="phone" default="''">Phone number</ui-component>
</div>
</div>
<br />
<div class="row">
<div class="col-md-12 m">
<div data-jc="textarea" data-jc-path="message" data-jc-value="''" data-jc-config="height:100;required:true">Message</div>
<ui-component name="textarea" path="message" default="''" config="height:100;required:true">Message</ui-component>
</div>
</div>
<div data-jc="error" data-jc-path="response"></div>
<ui-component name="error" path="response"></ui-component>
<br />
<div class="row">
<div class="col-md-6">
<div data-jc="validation" data-jc-path="?">
<ui-component name="validation" path="?">
<button class="button exec" name="submit" disabled="disabled" data-exec="contactformsubmit">SUBMIT FORM</button>
</div>
</ui-component>
</div>
</div>
</div>
</div>
</ui-component>

</ui-plugin>

<script>
!window.contactformsubmit && (window.contactformsubmit = function(el) {
var component = el.closest('[data-jc-path]').component();
var scope = component.pathscope;
if (CAN(scope + '.*')) {
RESET(scope + '.*');
AJAX('POST /api/contact/', GET(scope), scope + '.response');
}

PLUGIN(function(exports) {
exports.contactformsubmit = function(el) {
var component = el.closest('[path]').component();
var scope = component.pathscope;
console.log('Scope: ', scope);
if (CAN(scope + '.*')) {
RESET(scope + '.*');
AJAX('POST /api/contact/', GET(scope), scope + '.response');
}
};
});

</script>
8 changes: 4 additions & 4 deletions public/components/newsletter.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div class="newsletter" data-jc="newsletter" data-success="Thanks, you have been added.">
<div class="newsletter-button"><button><span class="fa fa-envelope"></span>SUBMIT</button></div>
<div class="newsletter-input"><input type="text" placeholder="Join to our mailing list"></div>
</div>
<ui-component name="newsletter" data-success="Thanks, you have been added.">
<div class="newsletter-button"><button><span class="ti ti-envelope"></span>SUBMIT</button></div>
<div class="newsletter-input"><input type="text" placeholder="Join our mailing list"></div>
</ui-component>

<script>
COMPONENT('newsletter', function() {
Expand Down
11 changes: 11 additions & 0 deletions public/pages/contact.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
<div class="row">

<div class="col-md-2"></div>
<div class="col-md-8 m">
<ui-component name="part" path="common.page" config="if:contact;url:/components/contactform.html"></ui-component>
</div>

</div>

<script>
</script>
53 changes: 53 additions & 0 deletions public/pages/home.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<h1>Total.js Example - pages/home.html</h1>

<div class="row">
<div class="col-md-4 col-sm-4 m">
<a href="/services/"><img src="/img/001.jpg" border="0" alt="Eshop" class="img-responsive img-rounded" /></a>
</div>
<div class="col-md-4 col-sm-4 m">
<a href="/services/"><img src="/img/002.jpg" border="0" alt="Easy modifications" class="img-responsive img-rounded" /></a>
</div>
<div class="col-md-4 col-sm-4 m">
<a href="/services/"><img src="/img/003.jpg" border="0" alt="Redesign it" class="img-responsive img-rounded" /></a>
</div>
</div>
<br />
<div class="row">
<!-- NEWSLETTER COMPONENT -->
<div class="col-md-8 col-md-offset-2">
<ui-component name="part" path="common.page" config="if:home;url:/components/newsletter.html"></ui-component>
<!-- <ui-component name="part" path="common.page" config="if:contact;url:/components/newsletter.html"></ui-component> -->
</div>

</div>
<br />
<hr />
<br />
<div class="row">
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
</div>
<br />
<br />
<div class="row">
<div class="col-md-6 col-md-offset-3 m">
<a href="/contact/" class="linkbutton">CONTACT US</a>
</div>
</div>

<script>
</script>
6 changes: 5 additions & 1 deletion views/references.html → public/pages/references.html
Original file line number Diff line number Diff line change
Expand Up @@ -38,4 +38,8 @@ <h1>References</h1>
<div class="col-md-3 col-sm-6 col-xs-6 reference">
<a href="#"><img src="/img/reference.png" class="img-responsive" alt="" border="0" /><span class="reference-title"><b>Lorem Ipsum</b><span>Lorem Ipsum Alias</span></span></a>
</div>
</div>
</div>

<script>
</script>

6 changes: 5 additions & 1 deletion views/services.html → public/pages/services.html
Original file line number Diff line number Diff line change
Expand Up @@ -41,4 +41,8 @@ <h2>Lorem ipsum dolor sit</h2>
<h2>Lorem ipsum dolor sit</h2>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Exercitationem voluptate excepturi sunt ex tempora sit obcaecati consequatur asperiores doloremque assumenda dolorum totam possimus, ipsa eveniet, dolor temporibus magnam! Praesentium, maiores.
</div>
</div>
</div>

<script>
</script>

18 changes: 13 additions & 5 deletions views/contact.html
Original file line number Diff line number Diff line change
@@ -1,10 +1,18 @@
@{title('Contact')}

<ui-bind path="common.page" config="html:value"></ui-bind>
<ui-bind path="page" config="html:value"></ui-bind>

<div class="row">
<div class="col-md-2"></div>
<div class="col-md-2"></div>
<div class="col-md-8 m">
<h1>@{title}</h1>
<!-- CONTACTFORM COMPONENT -->
<div data-jc-url="/components/contactform.html"></div>
<h1>@{title}</h1>
<ui-component name="part" path="common.page" config="if:contact;url:/components/contactform.html"></ui-component>

</div>
</div>
</div>


<script>
</script>

104 changes: 57 additions & 47 deletions views/index.html
Original file line number Diff line number Diff line change
@@ -1,49 +1,59 @@
@{title('Full website example')}

<h1>Total.js Example</h1>
<div class="row">
<div class="col-md-4 col-sm-4 m">
<a href="/services/"><img src="/img/001.jpg" border="0" alt="Eshop" class="img-responsive img-rounded" /></a>
</div>
<div class="col-md-4 col-sm-4 m">
<a href="/services/"><img src="/img/002.jpg" border="0" alt="Easy modifications" class="img-responsive img-rounded" /></a>
</div>
<div class="col-md-4 col-sm-4 m">
<a href="/services/"><img src="/img/003.jpg" border="0" alt="Redesign it" class="img-responsive img-rounded" /></a>
</div>
</div>
<br />
<div class="row">
<div class="col-md-8 col-md-offset-2">
<!-- NEWSLETTER COMPONENT -->
<div data-jc-url="/components/newsletter.html"></div>
</div>
</div>
<br />
<hr />
<br />
<div class="row">
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
<div class="col-md-3 col-sm-3 m">
<h3>Lorem ipsum dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate vitae ipsam nesciunt officia, ipsa quo molestiae ex quibusdam praesentium odit.</p>
</div>
</div>
<br />
<br />
<div class="row">
<div class="col-md-6 col-md-offset-3 m">
<a href="/contact/" class="linkbutton">CONTACT US</a>
</div>
</div>
<ui-component name="importer" path="common.page" config="if:home;url:/pages/home.html"></ui-component>
<ui-component name="importer" path="common.page" config="if:pageservices;url:/services.html"></ui-component>
<ui-component name="importer" path="common.page" config="if:contact;url:/pages/contact.html"></ui-component>
<ui-component name="importer" path="common.page" config="if:services;url:/pages/services.html"></ui-component>
<ui-component name="importer" path="common.page" config="if:references;url:/pages/references.html"></ui-component>

<!-- @{view} -->

<script>

var form = {};
form.newsletter = true;

ON('ready', function() {
});


var common = {};

CACHEPATH('common.page', '1 week');
CACHEPATH('common.darkmode', '1 week');

common.page = 'home';
common.layout = '';


PLUGIN('common', function(exports) {

// SET('page', 'home');

exports.page = function(el) {
var id = typeof(el) === 'string' ? el : el.attrd('if');
exports.set('page', id);
};

ROUTE('/', function() {
SET('common.page', 'home');
});

ROUTE('/home/', function() {
SET('common.page', 'home');
});

ROUTE('/references/', function() {
SET('common.page', 'references');
});

ROUTE('/services/', function() {
SET('common.page', 'services');
});

ROUTE('/contact/', function() {
SET('common.page', 'contact');
});

});
</script>
13 changes: 9 additions & 4 deletions views/layout.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,18 @@
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="robots" content="all,follow" />
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Source+Sans+Pro:400,200,700&subset=latin,latin-ext" />
<link rel="stylesheet" href="//cdn.componentator.com/spa.min.css" />
<script src="//cdn.componentator.com/spa.min.js"></script>

<link href="//cdn.componentator.com/[email protected]" rel="stylesheet" />
<script src="//cdn.componentator.com/[email protected]"></script>

@{import('meta', 'head', 'default.css', 'default.js', 'favicon.ico')}
</head>
<body data-jc="exec">
<body>

<ui-component name="LAZY directory"></ui-component>

<div data-jc="cookie" class="hidden">This site uses cookies for visitor statistics. By continuing to browse the site you are agreeing to our use of cookies.</div>
<header>
<header>
<div class="container">
<a href="javascript:void(0)" class="mainmenu-button"><i class="fa fa-navicon"></i></a>
<a href="/"><img src="/img/logo.png" alt="@{config.name}" border="0" height="30" /></a>
Expand Down