wbuezas
/
hedera-web-mindshore
forked from verdnatura/hedera-web
0
1
Fork 0
Code Pull Requests Activity

Checkpoint

This commit is contained in:
Juan Ferrer 2022-05-26 08:08:31 +02:00
parent f515249329
commit 614038470d
146 changed files with 2031 additions and 2163 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
forms/account/address-list/style.css
View File

@ -1,15 +1,4 @@
.address-list {
padding: 1em;
}
.address-list .box {
max-width: 420px;
}
.address-list .form {
margin: 0 auto;
max-width: 25em;
padding: 2em;
}
.address-list .htk-list .side {
padding-right: 16px;
}

2
forms/account/address-list/ui.xml
View File

@ -28,7 +28,7 @@
on-click="this.onAddAddressClick()"/>
</div>
<div id="form" class="address-list">
<div class="box">
<div class="box vn-w-sm">
<htk-radio-group
id="default-address"
column="defaultAddressFk"

8
forms/account/address/style.css
View File

@ -1,8 +0,0 @@
.address {
padding: 1em;
}
.address .box {
max-width: 420px;
padding: 3em;
}

110
forms/account/address/ui.xml
View File

@ -36,61 +36,61 @@
on-click="this.onAcceptClick()"/>
</div>
<div id="form" class="address">
<div class="box">
<div class="form">
<h2><t>AddEditAddress</t></h2>
<div class="form-group">
<htk-entry
placeholder="_Name"
column="nickname" form="iter"/>
</div>
<div class="form-group">
<htk-entry
placeholder="_Address"
column="street" form="iter"/>
</div>
<div class="form-group">
<htk-entry
placeholder="_City"
column="city" form="iter"/>
</div>
<div class="form-group">
<htk-entry
placeholder="_ZipCode"
column="postalCode" form="iter"/>
</div>
<div class="form-group">
<htk-combo
placeholder="_Country">
<db-param
id="country"
property="param"
form="iter"
column="countryFk"
one-way="true"/>
<db-model property="model">
SELECT id, country FROM vn.country
ORDER BY country
</db-model>
</htk-combo>
</div>
<div class="form-group">
<htk-combo
placeholder="_Province"
column="provinceFk"
form="iter">
<db-model property="model">
SELECT id, name FROM vn.province
WHERE countryFk = #country
ORDER BY name
<sql-batch property="batch">
<custom>
<item name="country" param="country"/>
</custom>
</sql-batch>
</db-model>
</htk-combo>
</div>
<div class="form box vn-w-sm vn-pa-lg">
<h5 class="vn-mb-md">
<t>AddEditAddress</t>
</h5>
<div class="form-group">
<htk-entry
placeholder="_Name"
column="nickname" form="iter"/>
</div>
<div class="form-group">
<htk-entry
placeholder="_Address"
column="street" form="iter"/>
</div>
<div class="form-group">
<htk-entry
placeholder="_City"
column="city" form="iter"/>
</div>
<div class="form-group">
<htk-entry
placeholder="_ZipCode"
column="postalCode" form="iter"/>
</div>
<div class="form-group">
<htk-combo
placeholder="_Country">
<db-param
id="country"
property="param"
form="iter"
column="countryFk"
one-way="true"/>
<db-model property="model">
SELECT id, country FROM vn.country
ORDER BY country
</db-model>
</htk-combo>
</div>
<div class="form-group">
<htk-combo
placeholder="_Province"
column="provinceFk"
form="iter">
<db-model property="model">
SELECT id, name FROM vn.province
WHERE countryFk = #country
ORDER BY name
<sql-batch property="batch">
<custom>
<item name="country" param="country"/>
</custom>
</sql-batch>
</db-model>
</htk-combo>
</div>
</div>
</div>

1
forms/account/conf/conf.js
View File

@ -4,6 +4,7 @@ Hedera.Conf = new Class({
,activate: function() {
this.$('user-model').setInfo('c', 'myClient', 'hedera');
this.$('user-model').setInfo('u', 'myUser', 'account');
if (this.hash.get('verificationToken'))
this.onPassChangeClick();

14
forms/account/conf/style.css
View File

@ -1,18 +1,4 @@
.conf {
padding: 1em;
}
.conf .box {
max-width: 420px;
padding: 3em;
}
.pass-change {
max-width: 15em;
padding: 2.5em;
}
.pass-info {
width: 15em;
}
.pass-info ul {
list-style-type: none;
}

20
forms/account/conf/ui.xml
View File

@ -34,9 +34,10 @@
on-click="this.onPassChangeClick()"/>
</div>
<div id="form" class="conf">
<div class="box">
<div class="form">
<h2><t>Personal information</t></h2>
<div class="form box vn-w-sm vn-pa-lg">
<h5 class="vn-mb-md">
<t>Personal information</t>
</h5>
<div class="form-group">
<htk-entry
placeholder="_Username"
@ -76,14 +77,15 @@
</label>
</div>
</div>
</div>
</div>
<htk-popup
id="change-password"
modal="true">
<div property="child-node" class="htk-dialog pass-change">
<div property="child-node" class="htk-dialog vn-w-xs vn-pa-lg">
<div class="form">
<h2><t>Change password</t></h2>
<h5 class="vn-mb-md">
<t>Change password</t>
</h5>
<input
id="old-password"
type="password"
@ -111,10 +113,10 @@
<htk-popup
id="password-info"
modal="true">
<div property="child-node" class="htk-dialog pass-info">
<h3>
<div property="child-node" class="htk-dialog pass-info vn-w-xs vn-pa-lg">
<h5 class="vn-mb-md">
<t>Password requirements</t>
</h3>
</h5>
<ul>
<li>
<htk-text form="password-form" column="length"/>

23
forms/admin/access-log/style.css
View File

@ -1,13 +1,4 @@
.access-log {
padding: 1em;
}
.access-log .box {
max-width: 25em;
margin: 0 auto;
}
.access-log .form {
padding: 2em;
}
.access-log .form > p {
font-size: 1.2em;
margin: .1em 0;
@ -15,15 +6,7 @@
/* List */
.access-log .list {
margin-top: 1em;
}
.access-log .item {
display: block;
padding: 1em;
border-bottom: 1px solid #DDD;
}
.access-log .item > p {
margin: .1em 0;
.access-log .htk-list {
margin-top: 16px;
}

62
forms/admin/access-log/ui.xml
View File

@ -22,7 +22,7 @@
<h1><t>AccessLog</t></h1>
</div>
<div id="form" class="access-log">
<div class="box">
<div class="box vn-w-xs vn-pa-lg">
<div class="form">
<p>#{{$.userForm.id}}</p>
<p>{{$.userForm.nickname}}</p>
@ -30,39 +30,35 @@
<p>{{$.userForm.phone}}</p>
</div>
</div>
<div class="list box">
<div>
<htk-repeater form-id="iter">
<db-model property="model">
<custom>
SELECT u.stamp, a.platform, a.browser, a.version, a.javascript, a.cookies
FROM visitUser u
JOIN visitAccess c ON c.id = u.accessFk
JOIN visitAgent a ON a.id = c.agentFk
WHERE u.userFk = #user
ORDER BY u.stamp DESC
LIMIT 8
</custom>
<sql-batch property="batch">
<custom>
<item name="user" param="user"/>
</custom>
</sql-batch>
</db-model>
<htk-repeater form-id="iter" class="box vn-w-xs htk-list vn-mt-md">
<db-model property="model">
<custom>
SELECT u.stamp, a.platform, a.browser, a.version, a.javascript, a.cookies
FROM visitUser u
JOIN visitAccess c ON c.id = u.accessFk
JOIN visitAgent a ON a.id = c.agentFk
WHERE u.userFk = #user
ORDER BY u.stamp DESC
LIMIT 8
</custom>
<sql-batch property="batch">
<custom>
<div class="item">
<p>
{{Vn.Value.format(iter.stamp, _('%a, %e %b %Y at %T'))}}
</p>
<p>
{{iter.platform}} -
{{iter.browser}}
{{iter.version}}
</p>
</div>
<item name="user" param="user"/>
</custom>
</htk-repeater>
</div>
</div>
</sql-batch>
</db-model>
<custom>
<div class="item">
<div class="content">
<p>
{{Vn.Value.format(iter.stamp, _('%a, %e %b %Y at %T'))}}
</p>
<p>
{{iter.platform}} - {{iter.browser}} {{iter.version}}
</p>
</div>
</div>
</custom>
</htk-repeater>
</div>
</vn>

11
forms/admin/connections/style.css
View File

@ -1,13 +1,6 @@
.connections {
padding: 1em;
}
.connections .box {
max-width: 420px;
margin: 0 auto;
}
.action-bar .connections-sum {
padding: .4em;
background-color: #1e88e5;
border-radius: 0.1em;
box-shadow: 0 0 0.4em rgba(255, 255, 255, .1);
border-radius: .1em;
}

84
forms/admin/connections/ui.xml
View File

@ -18,50 +18,48 @@
</div>
</div>
<div id="form" class="connections">
<div class="box">
<htk-repeater form-id="iter" class="htk-list">
<db-model
property="model"
id="sessions"
on-status-changed="this.onModelStatusChange()">
<custom>
SELECT vu.userFk userId, vu.stamp, u.nickname, s.lastUpdate,
a.platform, a.browser, a.version, u.name user
FROM userSession s
JOIN visitUser vu ON vu.id = s.userVisitFk
JOIN visitAccess ac ON ac.id = vu.accessFk
JOIN visitAgent a ON a.id = ac.agentFk
JOIN visit v ON v.id = a.visitFk
JOIN account.user u ON u.id = vu.userFk
ORDER BY lastUpdate DESC
</custom>
</db-model>
<htk-repeater form-id="iter" class="box htk-list vn-w-xs">
<db-model
property="model"
id="sessions"
on-status-changed="this.onModelStatusChange()">
<custom>
<a class="item"
href="{{`#!form=admin/access-log&amp;user=${iter.userId}`}}"
title="_Access log">
<div class="content">
<p class="important">
{{iter.nickname}}
</p>
<p>
{{Vn.Value.format(iter.stamp, '%a, %T')}} -
{{Vn.Value.format(iter.lastUpdate, '%T')}}
</p>
<p>
{{iter.platform}} - {{iter.browser}} {{iter.version}}
</p>
</div>
<div class="actions"
on-click="$event.preventDefault()">
<htk-button
tip="_Supplant user"
icon="supervisor_account"
on-click="this.onChangeUserClick(iter.user)"/>
</div>
</a>
SELECT vu.userFk userId, vu.stamp, u.nickname, s.lastUpdate,
a.platform, a.browser, a.version, u.name user
FROM userSession s
JOIN visitUser vu ON vu.id = s.userVisitFk
JOIN visitAccess ac ON ac.id = vu.accessFk
JOIN visitAgent a ON a.id = ac.agentFk
JOIN visit v ON v.id = a.visitFk
JOIN account.user u ON u.id = vu.userFk
ORDER BY lastUpdate DESC
</custom>
</htk-repeater>
</div>
</db-model>
<custom>
<a class="item"
href="{{`#!form=admin/access-log&amp;user=${iter.userId}`}}"
title="_Access log">
<div class="content">
<p class="important">
{{iter.nickname}}
</p>
<p>
{{Vn.Value.format(iter.stamp, '%a, %T')}} -
{{Vn.Value.format(iter.lastUpdate, '%T')}}
</p>
<p>
{{iter.platform}} - {{iter.browser}} {{iter.version}}
</p>
</div>
<div class="actions"
on-click="$event.preventDefault()">
<htk-button
tip="_Supplant user"
icon="supervisor_account"
on-click="this.onChangeUserClick(iter.user)"/>
</div>
</a>
</custom>
</htk-repeater>
</div>
</vn>

10
forms/admin/items/style.css
View File

@ -1,15 +1,5 @@
.items {
padding: 1em;
}
.items .box {
max-width: 420px;
margin: 0 auto;
}
/* Row */
.items .item .photo {
margin-right: 1em;
border-radius: 50%;
height: 80px;
width: 80px;

101
forms/admin/items/ui.xml
View File

@ -10,56 +10,57 @@
<htk-search-entry param="filter"/>
</div>
<div id="form" class="items">
<div class="rows box">
<htk-repeater form-id="iter" class="htk-list" empty-message="_Enter a search term">
<db-model property="model" id="items">
SELECT i.id, i.longName, i.size, i.category,
i.value5, i.value6, i.value7,
i.image, im.updated
FROM vn.item i
LEFT JOIN image im
ON im.collectionFk = 'catalog'
AND im.name = i.image
WHERE i.longName LIKE CONCAT('%', #filter, '%')
OR i.id = #filter
ORDER BY i.longName LIMIT 50
<sql-batch property="batch">
<custom>
<item name="filter" param="filter"/>
</custom>
</sql-batch>
</db-model>
<custom>
<div class="item">
<div class="side">
<htk-image
form="iter"
column="image"
stamp-column="updated"
class="photo"
directory="catalog"
subdir="200x200"
full-dir="1600x900"
editable="true"
conn="conn"/>
</div>
<div class="content">
<p class="important">
{{iter.longName}}
</p>
<p class="tags">
{{iter.value5}} {{iter.value6}} {{iter.value7}}
</p>
<p>
{{iter.id}}
</p>
<p>
{{iter.image}}
</p>
</div>
<htk-repeater
class="htk-list rows box vn-w-xs"
form-id="iter"
empty-message="_Enter a search term">
<db-model property="model" id="items">
SELECT i.id, i.longName, i.size, i.category,
i.value5, i.value6, i.value7,
i.image, im.updated
FROM vn.item i
LEFT JOIN image im
ON im.collectionFk = 'catalog'
AND im.name = i.image
WHERE i.longName LIKE CONCAT('%', #filter, '%')
OR i.id = #filter
ORDER BY i.longName LIMIT 50
<sql-batch property="batch">
<custom>
<item name="filter" param="filter"/>
</custom>
</sql-batch>
</db-model>
<custom>
<div class="item">
<div class="side vn-mr-md">
<htk-image
form="iter"
column="image"
stamp-column="updated"
class="photo"
directory="catalog"
subdir="200x200"
full-dir="1600x900"
editable="true"
conn="conn"/>
</div>
</custom>
</htk-repeater>
</div>
<div class="content">
<p class="important">
{{iter.longName}}
</p>
<p class="tags">
{{iter.value5}} {{iter.value6}} {{iter.value7}}
</p>
<p>
{{iter.id}}
</p>
<p>
{{iter.image}}
</p>
</div>
</div>
</custom>
</htk-repeater>
</div>
</vn>

20
forms/admin/links/style.css
View File

@ -1,19 +1,10 @@
.cpanel {
padding: 1em;
}
.cpanel .box {
max-width: 420px;
}
/* Items */
.cpanel .items > div {
max-width: 800px;
max-width: 900px;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 12px;
gap: 16px;
margin: 0 auto;
}
.cpanel .item {
@ -21,7 +12,7 @@
flex-direction: column;
align-items: center;
margin: 0;
width: 120px;
width: 140px;
padding: 15px;
text-align: center;
transition: background-color 250ms ease-out;
@ -42,7 +33,7 @@
max-width: 60px;
padding: 0;
}
.cpanel .item > h3 {
.cpanel .item > h6 {
flex: none;
margin: .1em 0;
font-size: .9rem;
@ -50,11 +41,10 @@
white-space: nowrap;
overflow: hidden;
}
.cpanel .item > .secondary {
.cpanel .item > .text-secondary {
flex: none;
margin: 0;
font-size: .8rem;
color: #666;
height: 40px;
overflow: hidden;
}

6
forms/admin/links/ui.xml
View File

@ -18,10 +18,10 @@
value="{{iter.image}}"
directory="link"
subdir="full"/>
<h3>
<h6>
{{iter.name}}
</h3>
<p class="secondary">
</h6>
<p class="text-secondary">
{{iter.description}}
</p>
</a>

23
forms/admin/photos/photos.js
View File

@ -6,8 +6,7 @@ var Status = {
,UPLOADED : 3
};
Hedera.Photos = new Class
({
Hedera.Photos = new Class({
Extends: Hedera.Form
,filesData: []
,uploadCount: 0
@ -54,21 +53,22 @@ Hedera.Photos = new Class
statusNode.className = 'status';
li.appendChild(statusNode);
var button = new Htk.Button({
tip: 'Remove',
icon: 'delete'
});
button.on('click', this.onFileRemove, this);
li.appendChild(button.node);
var fileData = {
li: li,
file: file,
name: name,
statusNode: statusNode
};
var button = new Htk.Button({
tip: 'Remove',
icon: 'delete'
});
button.node.addEventListener('click',
() => this.onFileRemove(fileData));
li.appendChild(button.node);
this.filesData.push(fileData);
button.value = fileData;
this.$('file-list').appendChild(li);
this.setImageStatus(fileData, Status.NONE, 'add', _('Pending upload'));
@ -151,8 +151,7 @@ Hedera.Photos = new Class
statusNode.title = title ? title : '';
}
,onFileRemove: function(button) {
var fileData = button.value;
,onFileRemove: function(fileData) {
this.$('file-list').removeChild(fileData.li);
for (var i = 0; i < this.filesData.length; i++)

8
forms/admin/photos/style.css
View File

@ -1,12 +1,4 @@
.photos {
padding: 1em;
}
.photos .box {
max-width: 420px;
padding: 3em;
}
/* Dropzone */
.photos .dropzone {

2
forms/admin/photos/ui.xml
View File

@ -3,7 +3,7 @@
<h1><t>Images</t></h1>
</div>
<div id="form" class="photos">
<div class="box">
<div class="box form vn-w-sm vn-pa-lg">
<div class="form-group">
<label><t>Collection</t></label>
<htk-combo id="schema">

18
forms/admin/users/style.css
View File

@ -1,10 +1,4 @@
.users {
padding: 1em;
}
.users .box {
max-width: 420px;
margin: 0 auto;
}
.users-box.item > .actions {
display: flex;
}
@ -12,14 +6,6 @@
color: white;
background-color: #F66;
border-radius: .2em;
padding: .2em;
margin: .3em;
padding: .3em;
font-size: .8em;
}
/* Topbar */
.action-bar .htk-search-entry {
margin: .8em .6em;
}

82
forms/admin/users/ui.xml
View File

@ -11,49 +11,47 @@
param="user-name"/>
</div>
<div id="form" class="users">
<div class="box">
<htk-repeater form-id="iter" renderer="rendererFunc" class="htk-list">
<db-model property="model">
<custom>
SELECT u.id, u.name, u.nickname, u.active
FROM account.user u
WHERE u.name LIKE CONCAT('%', #user, '%')
OR u.nickname LIKE CONCAT('%', #user, '%')
OR u.id = #user
ORDER BY u.name LIMIT 200
</custom>
<sql-batch property="batch">
<custom>
<item name="user" param="user-name"/>
</custom>
</sql-batch>
</db-model>
<htk-repeater form-id="iter" renderer="rendererFunc" class="htk-list box vn-w-xs">
<db-model property="model">
<custom>
<a class="users-box item"
href="{{`#!form=admin/access-log&amp;user=${iter.id}`}}"
title="_Access log">
<div class="content">
<p class="important">
{{iter.nickname}}
</p>
<p>
#{{iter.id}} - {{iter.name}}
</p>
</div>
<div class="actions"
on-click="$event.preventDefault()">
<span id="disabled" class="disabled">
<t>Disabled</t>
</span>
<htk-button
id="impersonate"
icon="supervisor_account"
tip="_Impersonate user"
on-click="this.onChangeUserClick(iter.name)"/>
</div>
</a>
SELECT u.id, u.name, u.nickname, u.active
FROM account.user u
WHERE u.name LIKE CONCAT('%', #user, '%')
OR u.nickname LIKE CONCAT('%', #user, '%')
OR u.id = #user
ORDER BY u.name LIMIT 200
</custom>
</htk-repeater>
</div>
<sql-batch property="batch">
<custom>
<item name="user" param="user-name"/>
</custom>
</sql-batch>
</db-model>
<custom>
<a class="users-box item"
href="{{`#!form=admin/access-log&amp;user=${iter.id}`}}"
title="_Access log">
<div class="content">
<p class="important">
{{iter.nickname}}
</p>
<p>
#{{iter.id}} - {{iter.name}}
</p>
</div>
<div class="actions"
on-click="$event.preventDefault()">
<span id="disabled" class="disabled">
<t>Disabled</t>
</span>
<htk-button
id="impersonate"
icon="supervisor_account"
tip="_Impersonate user"
on-click="this.onChangeUserClick(iter.name)"/>
</div>
</a>
</custom>
</htk-repeater>
</div>
</vn>

11
forms/admin/visits/style.css
View File

@ -1,17 +1,10 @@
.visits {
padding: 1em;
}
.visits .box {
max-width: 420px;
margin-bottom: 1em;
margin-bottom: 16px;
}
.visits .box:last-child {
margin-bottom: 0;
}
.visits .summary {
padding: 3em;
box-sizing: border-box;
}
.visits .summary p {
font-size: 1.4em;
margin: 0;

47
forms/admin/visits/ui.xml
View File

@ -13,8 +13,8 @@
on-click="this.onSessionsClick()"/>
</div>
<div id="form" class="visits">
<div class="summary box">
<div class="form">
<div class="vn-w-xs">
<div class="form vn-pa-lg box">
<div class="form-group">
<label><t>From</t></label>
<htk-date-chooser>
@ -28,27 +28,28 @@
</htk-date-chooser>
</div>
</div>
</div>
<div class="summary box">
<p>
<htk-text>
<db-calc-sum
property="param"
model="visits"
column-name="visits"/>
</htk-text>
<t>visits</t>,
<htk-text>
<db-calc-sum
property="param"
model="visits"
column-name="newVisits"/>
</htk-text>
<t>news</t>
</p>
</div>
<div class="list box">
<htk-repeater form-id="iter" empty-message="_Select date interval" class="htk-list">
<div class="summary vn-pa-lg box">
<p>
<htk-text>
<db-calc-sum
property="param"
model="visits"
column-name="visits"/>
</htk-text>
<t>visits</t>,
<htk-text>
<db-calc-sum
property="param"
model="visits"
column-name="newVisits"/>
</htk-text>
<t>news</t>
</p>
</div>
<htk-repeater
class="box htk-list"
form-id="iter"
empty-message="_Select date interval">
<db-model property="model" id="visits">
<custom>
SELECT browser,

9
forms/agencies/packages/style.css
View File

@ -1,9 +0,0 @@
.packages
{
padding: 1em;
}
.packages .box
{
max-width: 600px;
margin: 0 auto;
}

2
forms/agencies/packages/ui.xml
View File

@ -3,7 +3,7 @@
<h1><t>ListByAgency</t></h1>
</div>
<div id="form" class="packages">
<div class="box">
<div class="box vn-w-sm">
<htk-grid>
<db-model property="model">
<custom>

9
forms/agencies/provinces/style.css
View File

@ -1,9 +0,0 @@
.provinces
{
padding: 1em;
}
.provinces .box
{
max-width: 600px;
margin: 0 auto;
}

4
forms/agencies/provinces/ui.xml
View File

@ -6,12 +6,12 @@
<div id="title">
<h1><t>ByProvince</t></h1>
</div>
<div id="form" class="provinces">
<div id="form" class="provinces vn-w-sm">
<div class="box">
<htk-grid>
<db-model property="model">
<custom>
CALL vn2008.desglose_volume (#agency)
CALL vn2008.desglose_volume(#agency)
</custom>
<sql-batch property="batch">
<custom>

48
forms/cms/about/style.css
View File

@ -1,15 +1,5 @@
.about
{
padding: 1em;
}
.about .cols
{
max-width: 85em;
margin: 0 auto;
}
@media screen and (min-width: 1000px) /* and (max-width: 1399px) */
{
@media screen and (min-width: 1000px) /* and (max-width: 1399px) */ {
.about .cols
{
column-count: 2;
@ -17,8 +7,7 @@
-webkit-column-count: 2;
}
}/*
@media screen and (min-width: 1400px)
{
@media screen and (min-width: 1400px) {
.about .cols
{
column-count: 3;
@ -26,8 +15,7 @@
-webkit-column-count: 3;
}
}
@media screen and (min-width: 2000px)
{
@media screen and (min-width: 2000px) {
.about .cols
{
column-count: 4;
@ -35,39 +23,33 @@
-webkit-column-count: 4;
}
}*/
.about .box
{
.about .box {
margin-bottom: 1em;
padding: 2em;
}
.about h1
{
.about h1 {
padding: 0;
margin: 0;
font-weight: normal;
font-size: 1.6em;
}
.about h2
{
.about h2 {
text-align: center;
font-size: 1.2em;
font-weight: normal;
margin: 1em;
}
.about h3
{
.about h3 {
text-align: center;
font-size: 1.2em;
font-weight: normal;
padding: 1em;
color: #00796B;
}
.about p
{
.about p {
margin: 1em 0;
}
.about p.summary
{
.about p.summary {
max-width: 26em;
text-align: center;
background-color: #FF8;
@ -79,8 +61,7 @@
/* Images */
.about img
{
.about img {
max-width: 90%;
text-align: center;
padding: 1em;
@ -90,16 +71,13 @@
.about img[alt="producers"],
.about img[alt="4_control"],
.about img[alt="dealer"],
.about img[alt="goods_transport"]
{
.about img[alt="goods_transport"] {
float: right;
}
.about img[alt="2_control"]
{
.about img[alt="2_control"] {
float: left;
}
.about img[alt="glass"]
{
.about img[alt="glass"] {
display: inline;
padding: 0;
padding-left: 0.9em;

2
forms/cms/about/ui.xml
View File

@ -3,7 +3,7 @@
<h1><t>About</t></h1>
</div>
<div id="form" class="about">
<div class="cols">
<div class="cols vn-w-lg">
<div class="box">
<h1>
<t>QualityAndVariety</t>

33
forms/cms/contact/style.css
View File

@ -1,55 +1,38 @@
.contact
{
padding: 1em;
}
.contact .box
{
max-width: 420px;
padding: 2em;
}
.contact .form
{
.contact .form {
position: relative;
text-align: left;
max-width: 25em;
margin: 0 auto;
}
.contact form
{
.contact form {
margin: 0 auto;
}
.contact form p
{
.contact form p {
margin: 1em auto;
display: block;
margin-top: 2em;
}
.contact textarea
{
.contact textarea {
height: 5em;
}
.contact button
{
.contact button {
display: block;
margin: 0 auto;
margin-top: 1em;
padding: 0.6em;
}
.contact .mandatory-message
{
.contact .mandatory-message {
font-size: .9em;
}
/* Captcha */
.captcha img
{
.captcha img {
vertical-align: middle;
margin-left: 1em;
}
.captcha input
{
.captcha input {
max-width: 8em;
}

87
forms/cms/contact/ui.xml
View File

@ -3,54 +3,47 @@
<h1><t>IWantCustomer</t></h1>
</div>
<div id="form" class="contact">
<div class="box">
<div class="form">
<p>
<t>FillFormData</t>
<div class="box form vn-w-xs vn-pa-lg">
<p><t>FillFormData</t></p>
<p><t>OrCallUs</t></p>
<form id="contact-form">
<input type="hidden" name="srv" value="json:misc/contact"/>
<div class="form-group">
<label><t>Name</t></label>
<input type="text" name="name"/>
</div>
<div class="form-group">
<label><t>City</t></label>
<input type="text" name="city"/>
</div>
<div class="form-group">
<label><t>PC</t></label>
<input type="text" name="pc"/>
</div>
<div class="form-group">
<label><t>Phone</t></label>
<input type="text" name="phone"/>
</div>
<div class="form-group">
<label><t>EMail</t></label>
<input type="text" name="email"/>
</div>
<div class="form-group">
<label><t>Message</t></label>
<textarea name="message"/>
</div>
<div class="form-group captcha">
<label><t>Anti-Spam</t></label>
<input type="text" name="captcha"/>
<img alt="Captcha" id="captcha-img"/>
</div>
<p class="mandatory-message">
<t>AllFieldsMandatory</t>
</p>
<p>
<t>OrCallUs</t>
</p>
<form
id="contact-form">
<input type="hidden" name="srv" value="json:misc/contact"/>
<div class="form-group">
<label><t>Name</t></label>
<input type="text" name="name"/>
</div>
<div class="form-group">
<label><t>City</t></label>
<input type="text" name="city"/>
</div>
<div class="form-group">
<label><t>PC</t></label>
<input type="text" name="pc"/>
</div>
<div class="form-group">
<label><t>Phone</t></label>
<input type="text" name="phone"/>
</div>
<div class="form-group">
<label><t>EMail</t></label>
<input type="text" name="email"/>
</div>
<div class="form-group">
<label><t>Message</t></label>
<textarea name="message"/>
</div>
<div class="form-group captcha">
<label><t>Anti-Spam</t></label>
<input type="text" name="captcha"/>
<img alt="Captcha" id="captcha-img"/>
</div>
<p class="mandatory-message">
<t>AllFieldsMandatory</t>
</p>
<button class="thin">
<t>Send</t>
</button>
</form>
</div>
<button>
<t>Send</t>
</button>
</form>
</div>
</div>
</vn>

8
forms/cms/home/style.css
View File

@ -1,4 +1,8 @@
.home {
padding: 0 !important;
}
/* News panel */
.column {
@ -9,7 +13,7 @@
border: 1px solid white;
}
.action-bar button.start-order:hover {
background-color: white;
background-color: white !important;
color: black;
}
@ -39,7 +43,7 @@
font-size: 0.9em;
color: #444;
text-align: right;
margin: 0.8em 0;
margin: .8em 0;
}
.new-text {
margin: 1.5em 0;

1
forms/cms/training/locale/ca.yml
View File

@ -1 +0,0 @@
{}

1
forms/cms/training/locale/en.yml
View File

@ -1 +0,0 @@
{}

1
forms/cms/training/locale/es.yml
View File

@ -1 +0,0 @@
{}

1
forms/cms/training/locale/fr.yml
View File

@ -1 +0,0 @@
{}

1
forms/cms/training/locale/pt.yml
View File

@ -1 +0,0 @@
{}

59
forms/cms/training/style.css
View File

@ -1,59 +0,0 @@
/* News panel */
.column
{
margin: .5em;
max-width: 120em;
}
/* New */
.new
{
text-align: left;
background-color: white;
color: #222;
border: none;
border-radius: 0.1em;
box-shadow: 0 0.2em 0.2em rgba(1, 1, 1, 0.2);
margin: .5em;
}
.new img
{
display: block;
margin: auto;
width: 100%;
}
.new .top
{
padding: 1.5em;
padding-bottom: 1px;
}
.new h2
{
font-size: 1.6em;
color: black;
font-weight: normal;
padding: 0;
}
.new-info
{
font-size: 0.9em;
color: #444;
text-align: right;
margin: 0.8em 0;
}
.new-text
{
margin: 1.5em 0;
}
.new-text a
{
color: blue;
text-decoration: underline;
}
.new-text li
{
margin: 0.4em 0;
}

5
forms/cms/training/training.js
View File

@ -1,5 +0,0 @@
Hedera.Training = new Class
({
Extends: Hedera.Form
});

41
forms/cms/training/ui.xml
View File

@ -1,41 +0,0 @@
<vn>
<div id="title">
<h1><t>Training</t></h1>
</div>
<div id="form" class="training">
<div class="column mansonry" id="news-column">
<htk-repeater form-id="new">
<db-model property="model">
<custom>
SELECT title, created, text, image, id FROM news
WHERE tag = 'course'
ORDER BY priority, created DESC
</custom>
</db-model>
<custom>
<div class="masonry-box">
<div class="new">
<htk-image
directory="news"
subdir="full"
form="new"
column="image"
editable="false"
full-dir="full"/>
<div class="top">
<h2><htk-text form="new" column="title"/></h2>
<p class="new-info">
<htk-text format="_%a, %e %b %Y" form="new" column="created"/>
</p>
<div class="new-text">
<htk-html form="new" column="text"/>
</div>
</div>
</div>
</div>
</custom>
</htk-repeater>
<div class="clear"/>
</div>
</div>
</vn>

26
forms/cms/why/style.css
View File

@ -1,27 +1,13 @@
.why
{
padding: 1em;
}
.why .box
{
max-width: 600px;
margin: 0 auto;
}
.why ul
{
.why ul {
list-style-type: none;
padding: 0 1em;
padding-bottom: 1em;
max-width: 36em;
margin: 0 auto;
padding: 0;
margin-top: 0;
}
.why li
{
padding: 0.5em 0;
.why li {
padding-bottom: 16px;
}
.why img
{
.why img {
display: block;
margin: 0 auto;
max-width: 95%;

26
forms/cms/why/ui.xml
View File

@ -3,20 +3,18 @@
<h1><t>AboutCompany</t></h1>
</div>
<div id="form" class="why">
<div class="box">
<div class="body">
<ul>
<li><t>BecauseOurBigCatalog</t></li>
<li><t>BecauseThisWeb</t></li>
<li><t>BecauseOurShoppingDep</t></li>
<li><t>BecauseOrderIsEasy</t></li>
<li><t>BecauseOurPlant</t></li>
<li><t>BecauseOurSalesDep</t></li>
<li><t>BecauseOurWorkShop</t></li>
<li><t>BecauseWeHaveWhatYouNeed</t></li>
</ul>
<img src="forms/cms/why/store.png" alt="Store photo"/>
</div>
<div class="box vn-w-sm vn-pa-lg">
<ul class="vn-mb-lg">
<li><t>BecauseOurBigCatalog</t></li>
<li><t>BecauseThisWeb</t></li>
<li><t>BecauseOurShoppingDep</t></li>
<li><t>BecauseOrderIsEasy</t></li>
<li><t>BecauseOurPlant</t></li>
<li><t>BecauseOurSalesDep</t></li>
<li><t>BecauseOurWorkShop</t></li>
<li><t>BecauseWeHaveWhatYouNeed</t></li>
</ul>
<img src="forms/cms/why/store.png" alt="Store photo"/>
</div>
</div>
</vn>

13
forms/ecomerce/basket/basket.js
View File

@ -1,6 +1,5 @@
Hedera.Basket = new Class
({
Hedera.Basket = new Class({
Extends: Hedera.Form
,open: function() {
@ -25,15 +24,7 @@ Hedera.Basket = new Class
this.hash.set({form: 'ecomerce/checkout'});
}
,onCatalogClick: function() {
this.hash.set({form: 'ecomerce/catalog'});
}
,onCheckoutClick: function() {
this.hash.set({form: 'ecomerce/confirm'});
}
,onDeleteClick: function(button, form) {
,onDeleteClick: function(form) {
if (confirm(_('ReallyDelete')))
form.deleteRow();
}

23
forms/ecomerce/basket/style.css
View File

@ -1,20 +1,5 @@
.basket {
padding: 1em;
}
.basket .box {
max-width: 420px;
margin: 0 auto;
padding: 30px;
}
.basket .form > p {
margin: 0;
font-size: 1.4em;
color: white;
text-align: right;
}
.basket .head {
padding-bottom: 30px;
margin: 0;
border-bottom: 1px solid #DDD;
}
.basket .head p {
@ -24,6 +9,12 @@
font-size: 1.4em;
text-align: right;
}
.basket .form > p {
margin: 0;
font-size: 1.4em;
color: white;
text-align: right;
}
/* Lines */

14
forms/ecomerce/basket/ui.xml
View File

@ -6,19 +6,19 @@
<htk-bar-button
icon="settings"
tip="_ConfigureOrder"
on-click="onConfigureClick"/>
on-click="this.onConfigureClick()"/>
<htk-bar-button
icon="local_florist"
tip="_Catalog"
on-click="onCatalogClick"/>
on-click="this.hash.set({form: 'ecomerce/catalog'})"/>
<htk-bar-button
icon="shopping_cart_checkout"
tip="_Checkout"
on-click="onCheckoutClick"/>
on-click="this.hash.set({form: 'ecomerce/confirm'})"/>
</div>
<div id="form" class="basket">
<div class="box">
<div class="head">
<div class="box vn-w-sm vn-pa-lg">
<div class="head vn-pb-lg">
<p>
<t>Total</t>
<htk-text format="%.2d€">
@ -41,12 +41,10 @@
<custom>
<div class="line">
<htk-button
form="iter"
column="id"
class="delete"
tip="_Remove"
icon="delete"
on-click="onDeleteClick"/>
on-click="this.onDeleteClick($.iter)"/>
<htk-image
form="iter"
column="image"

252
forms/ecomerce/catalog/style.css
View File

@ -1,19 +1,17 @@
.catalog
{
.catalog {
padding: 0 !important;
margin-right: 18em;
}
/* Topbar */
.catalog-actions > .htk-search-entry
{
.catalog-actions > .htk-search-entry {
margin-right: .4em;
}
/* Right panel */
.right-panel
{
.right-panel {
position: fixed;
top: 4.4em;
bottom: 0;
@ -22,8 +20,7 @@
overflow: auto;
background-color: #fafafa;
}
.right-panel .basket-info
{
.right-panel .basket-info {
background-color: #8cc63f;
color: white;
padding: 1.2em 2em;
@ -31,20 +28,17 @@
margin: 1em;
text-align: center;
}
.right-panel .basket-info > button
{
.right-panel .basket-info > button {
color: white;
margin: 0 auto;
display: block;
margin-top: .4em;
}
.right-panel .basket-info > button:hover
{
.right-panel .basket-info > button:hover {
background-color: white;
color: #60872c;
}
.right-panel .basket-info > p
{
.right-panel .basket-info > p {
margin: 0;
padding: .4em 0;
font-size: 1.1em;
@ -52,77 +46,64 @@
white-space: nowrap;
overflow: hidden;
}
.right-panel .filter
{
.right-panel .filter {
margin: 1em;
}
.right-panel .categories,
.right-panel .filters,
.right-panel .order
{
.right-panel .order {
margin: 1.5em 0;
}
.right-panel .filters,
.right-panel .order
{
.right-panel .order {
display: none;
}
.right-panel .realm-msg
{
.right-panel .realm-msg {
margin-top: 1em;
}
.right-panel .realm-msg > h1
{
.right-panel .realm-msg > h5 {
font-weight: normal;
text-align: center;
padding: 2.5em 0;
color: #777;
}
.right-panel h2
{
.right-panel h2 {
font-weight: normal;
color: #777;
font-size: 1.1em;
}
.right-panel .realms > div > div
{
.right-panel .realms > div > div {
text-align: center;
}
.right-panel .realms a
{
.right-panel .realms a {
display: inline-block;
width: 25%;
padding: .6em;
box-sizing: border-box;
}
.right-panel .realms a:hover
{
.right-panel .realms a:hover {
background-color: rgba(1, 1, 1, .05);
border-radius: .15em;
}
.right-panel .realms a > img
{
.right-panel .realms a > img {
display: block;
padding: 0;
width: 100%;
}
.right-panel .vn-filter,
.right-panel select
{
.right-panel select {
margin: 0 auto;
margin-bottom: .7em;
display: block;
}
.vn-filter > ul
{
.vn-filter > ul {
margin: 0;
list-style-type: none;
text-align: left;
color: #666;
padding-left: .8em;
}
.vn-filter li
{
.vn-filter li {
margin: 0;
margin-top: .3em;
line-height: 2em;
@ -131,16 +112,17 @@
white-space: nowrap;
overflow: hidden;
}
.vn-filter li > button
{
.vn-filter li > button {
vertical-align: middle;
text-align: center;
padding: .2em;
margin: 0;
margin-right: .2em;
}
.right-panel .filters > button
{
.vn-filter li > button > span {
display: block;
}
.right-panel .filters > button {
display: block;
margin: 0 auto;
margin-top: 1em;
@ -148,41 +130,34 @@
/* Items */
.item-box
{
.item-box {
transition: background-color 200ms ease-in;
}
.item-box:hover
{
.item-box:hover {
cursor: pointer;
background-color: #eee;
}
.item-info
{
.item-info {
position: relative;
}
.item-info .second-category
{
.item-info .second-category {
font-weight: bold;
color: orange;
}
.item-info .third-category
{
.item-info .third-category {
font-weight: bold;
color: red;
}
.item-info > h2
{
.item-info > h2 {
padding: 0;
margin-bottom: .15em;
font-weight: normal;
font-size: 1em;
text-overflow: ellipsis;
overflow: hidden;
max-height: 3.8em;
max-height: 2.8em;
}
.item-info > p
{
.item-info > p {
margin: 0;
padding: 0;
color: #777;
@ -191,24 +166,20 @@
white-space: nowrap;
overflow: hidden;
}
.item-info .sub-name
{
.item-info .sub-name {
text-transform: uppercase;
padding: 0;
margin-bottom: .2em;
font-size: .9em;
}
.item-info > .htk-button
{
.item-info > .htk-button {
margin: -0.3em;
padding: .3em;
}
.item-info > .htk-button > img
{
.item-info > .htk-button > img {
vertical-align: middle;
}
.item-info .available-price
{
.item-info .available-price {
white-space: nowrap;
font-size: .95em;
text-align: right;
@ -216,32 +187,27 @@
column-gap: .2em;
display: flex;
}
.item-info .available-price > *
{
.item-info .available-price > * {
border-radius: .2em;
padding: .3em;
padding: .1em .3em;
border: .1em transparent solid;
background-color: white;
}
.item-info .grouping
{
.item-info .grouping {
width: 2em;
background-color: #ddd;
}
.item-info .available
{
.item-info .available {
width: 3.3em;
border-color: #bbb;
color: #777;
}
.item-info .price
{
.item-info .price {
width: 4em;
border-color: #9cbc28;
color: #748c1e;
}
.tags
{
.tags {
font-size: .8em;
display: table;
color: #333;
@ -256,14 +222,12 @@
/* List view */
.list-view
{
.list-view {
max-width: 420px;
margin: 0 auto;
padding: 1em;
}
.list-view .item-box
{
.list-view .item-box {
display: block;
position: relative;
width: 100%;
@ -272,20 +236,17 @@
overflow: visible;
border-bottom: 1px solid #DDD;
}
.list-view .item-box > .htk-image
{
.list-view .item-box > .htk-image {
margin: 1em;
width: 3.5em;
height: 3.5em;
float: left;
overflow: hidden;
}
.list-view .item-box > .htk-image > img
{
.list-view .item-box > .htk-image > img {
border-radius: 50%;
}
.list-view .item-info
{
.list-view .item-info {
position: absolute;
left: 5.5em;
right: 0;
@ -294,59 +255,49 @@
margin: .8em;
margin-left: 0;
}
.list-view .item-info > h2
{
.list-view .item-info > h2 {
font-size: 1em;
white-space: nowrap;
}
.list-view .item-info > .color
{
.list-view .item-info > .color {
display: none;
}
.list-view .item-info > .htk-button
{
.list-view .item-info > .htk-button {
float: right;
}
.list-view .item-info .available-price
{
.list-view .item-info .available-price {
clear: both;
float: right;
position:absolute;
bottom: 0;
right: 0;
}
.list-view .item-info .tags
{
.list-view .item-info .tags {
display: block;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.list-view .item-info .tags > tr
{
.list-view .item-info .tags > tr {
display: inline-block;
}
.list-view .item-info .tags td
{
.list-view .item-info .tags td {
display: inline-block;
padding-right: .5em;
}
.list-view .item-info .tags td:first-child
{
.list-view .item-info .tags td:first-child {
display: none;
}
/* Grid view */
.grid-view
{
.grid-view {
padding: 1em;
padding-right: .2em;
padding-bottom: .4em;
text-align: center;
}
.grid-view .item-box
{
.grid-view .item-box {
text-align: left;
position: relative;
display: inline-block;
@ -357,14 +308,12 @@
height: 11em;
overflow: hidden;
}
.grid-view .item-box > .htk-image
{
.grid-view .item-box > .htk-image {
width: 11em;
height: 100%;
float: left;
}
.grid-view .item-info
{
.grid-view .item-info {
position: absolute;
left: 11.4em;
right: 0;
@ -372,8 +321,7 @@
bottom: 0;
margin: .6em;
}
.grid-view .item-info .available-price
{
.grid-view .item-info .available-price {
position: absolute;
bottom: 0;
right: 0;
@ -389,107 +337,79 @@
/* Card */
.card-popup
{
.card-popup {
overflow: auto;
}
.item-card
{
.item-card {
font-size: .9em;
width: 20em;
}
.item-card .top
{
.item-card .top {
padding: 1em;
}
.item-card .item-info
{
.item-card .item-info {
margin-left: 9em;
height: 8em;
}
.item-card .htk-image
{
.item-card .htk-image {
height: 8em;
width: 8em;
float: left;
border-radius: .3em;
}
.item-card .desc
{
.item-card .desc {
clear: both;
margin-top: 1em 0;
font-size: .9em;
}
.item-card .lots-grid
{
.item-card .lots-grid {
border-top: 1px solid #DDD;
}
.item-card .lots-grid tr
{
.item-card .lots-grid tr {
height: 3em;
}
.item-card .lots-grid .cell-spin
{
.item-card .lots-grid .cell-spin {
max-width: initial;
width: 3em;
}
.item-card .lots-grid .price-kg
{
.item-card .lots-grid .price-kg {
font-size: .8em;
color: #999;
width: 1px;
}
.item-card .lots-grid .cell-text
{
.item-card .lots-grid .cell-text {
max-width: initial;
width: auto;
}
.item-card .lots-grid .cell-button
{
.item-card .lots-grid .cell-button {
max-width: initial;
width: 1em;
}
.item-card .footer
{
text-align: center;
.item-card .footer {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #1a1a1a;
color: white;
line-height: 2em;
padding: .4em;
padding: 10px;
}
.item-card .footer > button
{
margin: 0;
.item-card .footer > button:hover {
background-color: rgba(255, 255, 255, .1);
}
.item-card .erase
{
float: left;
}
.item-card .confirm
{
float: right;
}
.item-card .erase > img,
.item-card .confirm > img
{
.item-card .footer > button > .htk-icon {
display: block;
height: 1em;
}
/* Mobile */
.catalog-actions > button.menu
{
.catalog-actions > button.menu {
display: none;
padding: 1.1em .5em;
}
.catalog-actions > button.menu > img
{
height: 1.8em;
.catalog-actions > button.menu > .htk-icon {
display: block;
}
@media (max-width: 960px)
{
@media (max-width: 960px) {
.catalog-actions > button.menu
{
display: block;

15
forms/ecomerce/catalog/ui.xml
View File

@ -108,7 +108,7 @@
<button
class="menu"
on-click="onShowMenuClick">
<htk-icon name="menu"/>
<htk-icon name="menu" alt="_Menu"/>
</button>
</div>
<div id="form" class="catalog">
@ -213,7 +213,7 @@
</div>
</div>
<div id="realm-msg" class="realm-msg">
<h1><t>Choose a realm</t></h1>
<h5><t>Choose a realm</t></h5>
</div>
<div id="filters" class="filters">
<h2><t>Filter by</t></h2>
@ -467,20 +467,25 @@
on-clicked="onAddLotClick"/>
</htk-grid>
<div class="footer">
<button on-click="onEraseClick" title="_Erase" class="erase">
<button
title="_Erase"
on-click="this.onEraseClick()"
class="erase">
<htk-icon
name="delete"
theme="dark"
alt="_Erase"/>
</button>
<htk-text id="amount"/>
<button on-click="onConfirmClick" title="_Confirm" class="confirm">
<button
title="_Confirm"
on-click="this.onConfirmClick()"
class="confirm">
<htk-icon
name="done"
theme="dark"
alt="_Confirm"/>
</button>
<div class="clear"/>
</div>
</div>
</htk-popup>

12
forms/ecomerce/checkout/style.css
View File

@ -1,14 +1,6 @@
.checkout {
padding: 1em;
max-width: 600px;
margin: 0 auto;
}
.checkout .bar {
margin-bottom: 1em;
}
.checkout .form {
max-width: 600px;
padding: 4em 2em;
margin-bottom: 16px;
}
/* Step */

274
forms/ecomerce/checkout/ui.xml
View File

@ -68,144 +68,146 @@
on-click="onCancelClick"/>
</div>
<div id="form" class="checkout">
<div class="box bar">
<htk-assistant-bar
id="assistant-bar"
assistant="assistant"/>
</div>
<div class="box">
<div class="form">
<htk-assistant id="assistant"
endFunc="onConfirmClick">
<htk-step
name="method"
validate-func="methodValidate">
<h2><t>DeliveryOrPickupQuestion</t></h2>
<div class="answers radio">
<htk-radio-group
id="rg-method"
param="method"
on-changed="onMethodChange"/>
<div>
<label>
<htk-radio radio-group="rg-method" value="AGENCY"/>
<t>Receive the order</t>
</label>
<div class="vn-w-sm">
<div class="box bar">
<htk-assistant-bar
id="assistant-bar"
assistant="assistant"/>
</div>
<div class="box vn-px-lg vn-py-xl">
<div class="form">
<htk-assistant id="assistant"
endFunc="onConfirmClick">
<htk-step
name="method"
validate-func="methodValidate">
<h2><t>DeliveryOrPickupQuestion</t></h2>
<div class="answers radio">
<htk-radio-group
id="rg-method"
param="method"
on-changed="onMethodChange"/>
<div>
<label>
<htk-radio radio-group="rg-method" value="AGENCY"/>
<t>Receive the order</t>
</label>
</div>
<div>
<label>
<htk-radio radio-group="rg-method" value="PICKUP"/>
<t>PickupInStore</t>
</label>
</div>
</div>
<div>
<label>
<htk-radio radio-group="rg-method" value="PICKUP"/>
<t>PickupInStore</t>
</label>
</htk-step>
<htk-step
name="date"
show-func="dateShow"
validate-func="dateValidate">
<h2 id="date-question"/>
<div class="answers">
<htk-calendar
id="calendar"
class="thin-calendar"
param="date"
restrict-func="calendarRestrict"
on-changed="onFieldChange"/>
</div>
</div>
</htk-step>
<htk-step
name="date"
show-func="dateShow"
validate-func="dateValidate">
<h2 id="date-question"/>
<div class="answers">
<htk-calendar
id="calendar"
class="thin-calendar"
param="date"
restrict-func="calendarRestrict"
on-changed="onFieldChange"/>
</div>
</htk-step>
<htk-step
name="address"
show-func="addressShow"
validate-func="addressValidate">
<h2 id="address-question"/>
<div class="answers target">
<db-form id="address-form" model="addresses"/>
<htk-repeater
id="repeater"
form-id="iter"
on-change="onAddressChange"
renderer="addressRenderer">
<db-model property="model" id="addresses">
SELECT a.id, a.nickname, p.name province, a.city, a.street, a.isActive, c.country
FROM myAddress a
LEFT JOIN vn.province p ON p.id = a.provinceFk
JOIN vn.country c ON c.id = p.countryFk
WHERE a.isActive
</db-model>
<custom>
<div class="address" id="address">
<p class="consignee">
<htk-text form="iter" column="nickname"/>
</p>
<p>
<htk-text form="iter" column="street"/>
</p>
</div>
</custom>
</htk-repeater>
</div>
</htk-step>
<htk-step
name="agency"
show-func="agencyShow"
validate-func="agencyValidate">
<h2><t>AgencyQuestion</t></h2>
<div class="answers target">
<htk-combo
id="agency-combo"
param="agency"
on-changed="onFieldChange"
model="agencies"/>
</div>
</htk-step>
<htk-step
name="pickup"
show-func="pickupShow"
validate-func="pickupValidate">
<h2><t>PickupWarehouseQuestion</t></h2>
<div class="answers target">
<htk-combo
id="warehouse-combo"
param="agency"
on-changed="onFieldChange"
model="warehouses"/>
</div>
</htk-step>
<htk-step
name="confirm-delivery">
<h2><t>ConfirmData</t></h2>
<div class="answers target">
<p>
<t>Arrival</t>
<htk-text format="%D" param="date"/>
</p>
<p>
<htk-text form="address-form" column="street"/>
</p>
<p>
<t>Agency</t>
<htk-text form="agency-combo" column="description"/>
</p>
<div class="clear"/>
</div>
</htk-step>
<htk-step
name="confirm-pickup">
<h2><t>ConfirmData</t></h2>
<div class="answers target">
<p>
<t>Pickup</t>
<htk-text format="%D" param="date"/>
</p>
<p>
<t>Warehouse</t>
<htk-text form="warehouse-combo" column="description"/>
</p>
<div class="clear"/>
</div>
</htk-step>
</htk-assistant>
</htk-step>
<htk-step
name="address"
show-func="addressShow"
validate-func="addressValidate">
<h2 id="address-question"/>
<div class="answers target">
<db-form id="address-form" model="addresses"/>
<htk-repeater
id="repeater"
form-id="iter"
on-change="onAddressChange"
renderer="addressRenderer">
<db-model property="model" id="addresses">
SELECT a.id, a.nickname, p.name province, a.city, a.street, a.isActive, c.country
FROM myAddress a
LEFT JOIN vn.province p ON p.id = a.provinceFk
JOIN vn.country c ON c.id = p.countryFk
WHERE a.isActive
</db-model>
<custom>
<div class="address" id="address">
<p class="consignee">
<htk-text form="iter" column="nickname"/>
</p>
<p>
<htk-text form="iter" column="street"/>
</p>
</div>
</custom>
</htk-repeater>
</div>
</htk-step>
<htk-step
name="agency"
show-func="agencyShow"
validate-func="agencyValidate">
<h2><t>AgencyQuestion</t></h2>
<div class="answers target">
<htk-combo
id="agency-combo"
param="agency"
on-changed="onFieldChange"
model="agencies"/>
</div>
</htk-step>
<htk-step
name="pickup"
show-func="pickupShow"
validate-func="pickupValidate">
<h2><t>PickupWarehouseQuestion</t></h2>
<div class="answers target">
<htk-combo
id="warehouse-combo"
param="agency"
on-changed="onFieldChange"
model="warehouses"/>
</div>
</htk-step>
<htk-step
name="confirm-delivery">
<h2><t>ConfirmData</t></h2>
<div class="answers target">
<p>
<t>Arrival</t>
<htk-text format="%D" param="date"/>
</p>
<p>
<htk-text form="address-form" column="street"/>
</p>
<p>
<t>Agency</t>
<htk-text form="agency-combo" column="description"/>
</p>
<div class="clear"/>
</div>
</htk-step>
<htk-step
name="confirm-pickup">
<h2><t>ConfirmData</t></h2>
<div class="answers target">
<p>
<t>Pickup</t>
<htk-text format="%D" param="date"/>
</p>
<p>
<t>Warehouse</t>
<htk-text form="warehouse-combo" column="description"/>
</p>
<div class="clear"/>
</div>
</htk-step>
</htk-assistant>
</div>
</div>
</div>
</div>

83
forms/ecomerce/confirm/style.css
View File

@ -1,24 +1,11 @@
.confirm
{
padding: 1em;
max-width: 420px;
margin: 0 auto;
color: #555;
.confirm .summary {
margin-bottom: 16px;
}
.confirm .box
{
padding: 2.2em 2.5em;
}
.confirm .summary
{
margin-bottom: 1em;
}
.confirm .address
{
.confirm .address {
margin-top: .8em;
}
.confirm h2
{
.confirm h2 {
font-size: 1.1em;
font-weight: normal;
padding: 0;
@ -26,61 +13,48 @@
margin-bottom: .5em;
color: #333;
}
.confirm button
{
.confirm button {
font-size: 1.4em;
}
.confirm p
{
.confirm p {
margin: .2em 0;
}
.confirm .modify-order
{
.confirm .modify-order {
float: left;
}
.confirm .confirm-order
{
.confirm .confirm-order {
float: right;
}
.confirm .payment > div
{
.confirm .payment > div {
margin-bottom: 1.4em;
}
.confirm .payment > .button-bar
{
.confirm .payment > .button-bar {
margin: 0;
margin-top: 1.8em;
}
/* Table */
.confirm .debt-info
{
.confirm .debt-info {
padding: 0;
}
.confirm .debt-info > table
{
.confirm .debt-info > table {
border-collapse: collapse;
}
.confirm td
{
.confirm td {
padding: .15em 0;
}
.confirm .sum-total > td
{
.confirm .sum-total > td {
border-top: solid 1px #DDD;
font-weight: bold;
}
.confirm .currency
{
.confirm .currency {
text-align: right;
}
.confirm .credit-info
{
.confirm .credit-info {
display: none;
}
.confirm .exceeded-info
{
.confirm .exceeded-info {
display: none;
color: #E53935;
}
@ -88,34 +62,27 @@
/* Pay */
.confirm .amount-selector,
.confirm .pay-methods > div
{
.confirm .pay-methods > div {
display: none;
}
.confirm .pay-methods > div
{
.confirm .pay-methods > div {
margin: .3em 0;
}
.confirm .pay-methods > div > label > input[type=radio]
{
.confirm .pay-methods > div > label > input[type=radio] {
margin: 0;
margin-right: .5em;
vertical-align: middle;
}
.confirm .pay-methods > div > div
{
.confirm .pay-methods > div > div {
padding: .5em 1.5em;
display: none;
}
.confirm .pay-methods > div.selected > div
{
.confirm .pay-methods > div.selected > div {
display: block;
}
.confirm .transfer-account
{
.confirm .transfer-account {
margin-top: .5em;
}
.confirm .transfer-account > p
{
.confirm .transfer-account > p {
margin: .1em 0;
}

332
forms/ecomerce/confirm/ui.xml
View File

@ -30,181 +30,183 @@
<h1><t>Order summary</t></h1>
</div>
<div id="form" class="confirm">
<div class="box summary">
<div>
<div class="delivery">
<p>
<t>Delivery at</t>
<htk-text format="%D" form="order-form" column="sent"/>
</p>
<p>
<span id="method"><t>Agency</t></span>
<htk-text form="order-form" column="agency"/>
</p>
</div>
<div id="address" class="address">
<p>
<htk-text form="order-form" column="nickname"/>
</p>
<p>
<htk-text form="order-form" column="street"/>
</p>
<p>
<htk-text form="order-form" column="postalCode"/>,
<htk-text form="order-form" column="city"/>
</p>
</div>
</div>
</div>
<div class="box payment">
<div>
<table class="debt-info">
<tbody>
<tr>
<td>
<t>Previous balance</t>
</td>
<td class="currency">
<htk-text format="%.2d€" id="debt"/>
</td>
</tr>
<tr>
<td>
<t>Order total</t>
</td>
<td class="currency">
<htk-text format="%.2d€" form="order-form" column="taxableBase"/>
</td>
</tr>
<tr>
<td>
<t>Order VAT</t>
</td>
<td class="currency">
<htk-text format="%.2d€" form="order-form" column="tax"/>
</td>
</tr>
<tr class="total-debt sum-total">
<td>
<t>Total debt</t>
</td>
<td class="currency">
<htk-text format="%.2d€" id="total-debt"/>
</td>
</tr>
<tr id="credit-info" class="credit-info">
<td>
<t>Credit</t>
</td>
<td class="currency">
<htk-text format="%.2d€" form="order-form" column="credit"/>
</td>
</tr>
<tr id="exceeded-info" class="exceeded-info sum-total">
<td>
<t>Exceeded credit</t>
</td>
<td class="currency">
<htk-text format="%.2d€" id="credit-excess"/>
</td>
</tr>
</tbody>
</table>
</div>
<div id="amount-selector" class="amount-selector">
<h2>
<t>Amount to pay</t>
</h2>
<div class="radio">
<htk-radio-group
id="pay-amount"/>
<div>
<htk-radio radio-group="pay-amount" value="ALL"/>
<label>
<t>Total debt</t>,
<htk-text format="%.2d€" id="total-amount"/>
</label>
<div class="vn-w-sm">
<div class="box vn-pa-lg summary">
<div>
<div class="delivery">
<p>
<t>Delivery at</t>
<htk-text format="%D" form="order-form" column="sent"/>
</p>
<p>
<span id="method"><t>Agency</t></span>
<htk-text form="order-form" column="agency"/>
</p>
</div>
<div>
<htk-radio radio-group="pay-amount" value="EXCEEDED"/>
<label>
<t>Exceeded credit</t>,
<htk-text format="%.2d€" id="excess-amount"/>
</label>
<div id="address" class="address">
<p>
<htk-text form="order-form" column="nickname"/>
</p>
<p>
<htk-text form="order-form" column="street"/>
</p>
<p>
<htk-text form="order-form" column="postalCode"/>,
<htk-text form="order-form" column="city"/>
</p>
</div>
</div>
</div>
<div>
<h2>
<t>Pay method</t>
</h2>
<div class="pay-methods">
<htk-radio-group
id="pay-method"
on-changed="onPayMethodChange"/>
<div id="balance-method">
<label>
<htk-radio radio-group="pay-method" value="BALANCE"/>
<t>Use my balance</t>
</label>
<div class="box vn-pa-lg payment">
<div>
<table class="debt-info">
<tbody>
<tr>
<td>
<t>Previous balance</t>
</td>
<td class="currency">
<htk-text format="%.2d€" id="debt"/>
</td>
</tr>
<tr>
<td>
<t>Order total</t>
</td>
<td class="currency">
<htk-text format="%.2d€" form="order-form" column="taxableBase"/>
</td>
</tr>
<tr>
<td>
<t>Order VAT</t>
</td>
<td class="currency">
<htk-text format="%.2d€" form="order-form" column="tax"/>
</td>
</tr>
<tr class="total-debt sum-total">
<td>
<t>Total debt</t>
</td>
<td class="currency">
<htk-text format="%.2d€" id="total-debt"/>
</td>
</tr>
<tr id="credit-info" class="credit-info">
<td>
<t>Credit</t>
</td>
<td class="currency">
<htk-text format="%.2d€" form="order-form" column="credit"/>
</td>
</tr>
<tr id="exceeded-info" class="exceeded-info sum-total">
<td>
<t>Exceeded credit</t>
</td>
<td class="currency">
<htk-text format="%.2d€" id="credit-excess"/>
</td>
</tr>
</tbody>
</table>
</div>
<div id="amount-selector" class="amount-selector">
<h2>
<t>Amount to pay</t>
</h2>
<div class="radio">
<htk-radio-group
id="pay-amount"/>
<div>
<t>You have a favorable balance.</t>
<htk-radio radio-group="pay-amount" value="ALL"/>
<label>
<t>Total debt</t>,
<htk-text format="%.2d€" id="total-amount"/>
</label>
</div>
</div>
<div id="credit-method">
<label>
<htk-radio radio-group="pay-method" value="CREDIT"/>
<t>Use my credit</t>
</label>
<div>
<t>You have a favorable credit.</t>
<htk-radio radio-group="pay-amount" value="EXCEEDED"/>
<label>
<t>Exceeded credit</t>,
<htk-text format="%.2d€" id="excess-amount"/>
</label>
</div>
</div>
<div id="card-method">
<label>
<htk-radio radio-group="pay-method" value="CARD"/>
<t>Credit card</t>
</label>
<div>
<t>You will be redirected to the payment.</t>
</div>
</div>
<div id="transfer-method">
<label>
<htk-radio radio-group="pay-method" value="TRANSFER"/>
<t>Bank Transfer</t>
</label>
<div>
<t>Make a transfer to one account.</t>
<htk-repeater form-id="iter">
<db-model property="model">
SELECT name, iban FROM mainAccountBank
</db-model>
<custom>
<div class="transfer-account">
<p><htk-text form="iter" column="name"/></p>
<p><htk-text form="iter" column="iban"/></p>
</div>
</custom>
</htk-repeater>
</div>
</div>
<div id="later-method">
<label>
<htk-radio radio-group="pay-method" value="LATER"/>
<t>Pay later</t>
</label>
</div>
</div>
</div>
<div class="button-bar">
<button on-click="onModifyClick" id="modify" class="thin modify-order">
<t>Modify</t>
</button>
<button on-click="onConfirmClick" id="confirm" class="thin confirm-order">
<t>Confirm</t>
</button>
<div class="clear"/>
<div>
<h2>
<t>Pay method</t>
</h2>
<div class="pay-methods">
<htk-radio-group
id="pay-method"
on-changed="onPayMethodChange"/>
<div id="balance-method">
<label>
<htk-radio radio-group="pay-method" value="BALANCE"/>
<t>Use my balance</t>
</label>
<div>
<t>You have a favorable balance.</t>
</div>
</div>
<div id="credit-method">
<label>
<htk-radio radio-group="pay-method" value="CREDIT"/>
<t>Use my credit</t>
</label>
<div>
<t>You have a favorable credit.</t>
</div>
</div>
<div id="card-method">
<label>
<htk-radio radio-group="pay-method" value="CARD"/>
<t>Credit card</t>
</label>
<div>
<t>You will be redirected to the payment.</t>
</div>
</div>
<div id="transfer-method">
<label>
<htk-radio radio-group="pay-method" value="TRANSFER"/>
<t>Bank Transfer</t>
</label>
<div>
<t>Make a transfer to one account.</t>
<htk-repeater form-id="iter">
<db-model property="model">
SELECT name, iban FROM mainAccountBank
</db-model>
<custom>
<div class="transfer-account">
<p><htk-text form="iter" column="name"/></p>
<p><htk-text form="iter" column="iban"/></p>
</div>
</custom>
</htk-repeater>
</div>
</div>
<div id="later-method">
<label>
<htk-radio radio-group="pay-method" value="LATER"/>
<t>Pay later</t>
</label>
</div>
</div>
</div>
<div class="button-bar">
<button on-click="onModifyClick" id="modify" class="thin modify-order">
<t>Modify</t>
</button>
<button on-click="onConfirmClick" id="confirm" class="thin confirm-order">
<t>Confirm</t>
</button>
<div class="clear"/>
</div>
</div>
</div>
</div>

7
forms/ecomerce/invoices/style.css
View File

@ -1,7 +0,0 @@
.invoices {
padding: 1em;
}
.invoices .box {
max-width: 600px;
}

8
forms/ecomerce/invoices/ui.xml
View File

@ -3,9 +3,9 @@
<h1><t>Invoices</t></h1>
</div>
<div id="form" class="invoices">
<div class="box">
<div>
<htk-grid show-header="false">
<htk-grid
class="box vn-w-sm"
show-header="false">
<db-model property="model" id="tickets">
SELECT id, ref, issued, amount, hasPdf
FROM myInvoice
@ -19,7 +19,5 @@
renderer="donwloadRenderer"
target="_blank"/>
</htk-grid>
</div>
</div>
</div>
</vn>

8
forms/ecomerce/orders/style.css
View File

@ -1,11 +1,3 @@
.orders {
padding: 1em;
}
.orders .box {
max-width: 25em;
}
/* Balance */
.balance {
margin-right: .5em;

45
forms/ecomerce/orders/ui.xml
View File

@ -38,30 +38,31 @@
on-click="onBasketClick"/>
</div>
<div id="form" class="orders">
<div class="box confirmed">
<htk-repeater form-id="iter" renderer="repeaterFunc" class="htk-list">
<db-model property="model" id="tickets">
<custom>
CALL myTicket_list (NULL, NULL);
</custom>
</db-model>
<htk-repeater
class="htk-list box confirmed vn-w-sm"
form-id="iter"
renderer="repeaterFunc">
<db-model property="model" id="tickets">
<custom>
<a id="link" class="item" title="{{_('SeeOrder')}}">
<div class="content">
<p class="important total">
{{Vn.Value.format(iter.total, '%.2d€')}}
</p>
<p class="important">
{{Vn.Value.format(iter.landed, '%D')}}
</p>
<p>#{{iter.id}}</p>
<p>{{iter.nickname}}</p>
<p>{{iter.agency}}</p>
</div>
</a>
CALL myTicket_list (NULL, NULL);
</custom>
</htk-repeater>
</div>
</db-model>
<custom>
<a id="link" class="item" title="{{_('SeeOrder')}}">
<div class="content">
<p class="important total">
{{Vn.Value.format(iter.total, '%.2d€')}}
</p>
<p class="important">
{{Vn.Value.format(iter.landed, '%D')}}
</p>
<p>#{{iter.id}}</p>
<p>{{iter.nickname}}</p>
<p>{{iter.agency}}</p>
</div>
</a>
</custom>
</htk-repeater>
</div>
<htk-dialog
id="error-dialog"

9
forms/ecomerce/ticket/style.css
View File

@ -1,12 +1,3 @@
.ticket {
padding: 1em;
}
.ticket .box {
max-width: 420px;
margin: 0 auto;
padding: 2em;
color: #333;
}
/* Header */

12
forms/ecomerce/ticket/ui.xml
View File

@ -23,15 +23,11 @@
on-click="onPrintClick"/>
</div>
<div id="form" class="ticket">
<div class="box">
<div class="box vn-w-sm vn-pa-lg">
<htk-loader class="head" form="ticket">
<h5>#<htk-text column="id" form="ticket"/></h5>
<div>
<p class="important ticket-id">
#<htk-text column="id" form="ticket"/>
</p>
</div>
<div>
<h3><t>ShippingInformation</t></h3>
<h6><t>ShippingInformation</t></h6>
<p>
<t>Preparation</t> <htk-text form="ticket" column="shipped" format="%D"/>
</p>
@ -43,7 +39,7 @@
</p>
</div>
<div class="address">
<h3><t>DeliveryAddress</t></h3>
<h6><t>DeliveryAddress</t></h6>
<p>
<htk-text form="ticket" column="nickname"/>
</p>

15
forms/news/new/style.css
View File

@ -1,19 +1,4 @@
.new {
padding: 1em;
}
.new .box {
max-width: 38em;
padding: 2em;
}
/* Form */
.new textarea {
min-height: 500px;
}
.new .foot {
text-align: center;
margin-top: 1em;
}

48
forms/news/new/ui.xml
View File

@ -35,31 +35,29 @@
on-click="this.onAcceptClick()"/>
</div>
<div id="form" class="new">
<div class="box">
<div class="form">
<div class="form-group">
<label><t>Title</t></label>
<htk-entry form="iter" column="title"/>
</div>
<div class="form-group">
<label><t>Tag</t></label>
<htk-combo form="iter" column="tag">
<db-model property="model">
<custom>
SELECT name, description FROM newsTag
ORDER BY description
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Priority</t></label>
<htk-entry form="iter" column="priority"/>
</div>
<div class="form-group">
<label><t>NewBody</t></label>
<textarea id="html-editor"/>
</div>
<div class="box form vn-w-sm vn-pa-lg">
<div class="form-group">
<label><t>Title</t></label>
<htk-entry form="iter" column="title"/>
</div>
<div class="form-group">
<label><t>Tag</t></label>
<htk-combo form="iter" column="tag">
<db-model property="model">
<custom>
SELECT name, description FROM newsTag
ORDER BY description
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Priority</t></label>
<htk-entry form="iter" column="priority"/>
</div>
<div class="form-group">
<label><t>NewBody</t></label>
<textarea id="html-editor"/>
</div>
</div>
</div>

11
forms/news/news/style.css
View File

@ -1,16 +1,5 @@
.news {
padding: 1em;
}
.news .box {
max-width: 420px;
margin: 0 auto;
}
/* Items */
.news .item .photo {
float: left;
margin-right: 1em;
height: 80px;
width: 80px;
border-radius: 50%;

82
forms/news/news/ui.xml
View File

@ -9,49 +9,47 @@
on-click="this.onAddClick()"/>
</div>
<div id="form" class="news">
<div class="box">
<htk-repeater form-id="iter" class="htk-list">
<db-model property="model" id="news-model" updatable="true">
<custom>
SELECT n.id, u.nickname, n.priority, n.image, n.title
FROM news n
JOIN account.user u ON u.id = n.userFk
ORDER BY priority, n.created DESC
</custom>
</db-model>
<htk-repeater form-id="iter" class="box htk-list vn-w-sm">
<db-model property="model" id="news-model" updatable="true">
<custom>
<a class="item"
href="{{`#!form=news/new&amp;new=${iter.id}`}}"
title="_EditNew">
<div class="side">
<htk-image
form="iter"
column="image"
class="photo"
directory="news"
subdir="200x200"
full-dir="full"
editable="true"
conn="conn"/>
</div>
<div class="content">
<p class="important">
{{iter.title}}
</p>
<p>{{iter.nickname}}</p>
<p>{{iter.priority}}</p>
</div>
<div
class="actions"
on-click="$event.preventDefault()">
<htk-button
tip="_Remove"
icon="delete"
on-click="this.onDeleteClick($.iter)"/>
</div>
</a>
SELECT n.id, u.nickname, n.priority, n.image, n.title
FROM news n
JOIN account.user u ON u.id = n.userFk
ORDER BY priority, n.created DESC
</custom>
</htk-repeater>
</div>
</db-model>
<custom>
<a class="item"
href="{{`#!form=news/new&amp;new=${iter.id}`}}"
title="_EditNew">
<div class="side vn-mr-md">
<htk-image
form="iter"
column="image"
class="photo"
directory="news"
subdir="200x200"
full-dir="full"
editable="true"
conn="conn"/>
</div>
<div class="content">
<p class="important">
{{iter.title}}
</p>
<p>{{iter.nickname}}</p>
<p>{{iter.priority}}</p>
</div>
<div
class="actions"
on-click="$event.preventDefault()">
<htk-button
tip="_Remove"
icon="delete"
on-click="this.onDeleteClick($.iter)"/>
</div>
</a>
</custom>
</htk-repeater>
</div>
</vn>

19
forms/reports/items-form/style.css
View File

@ -1,19 +0,0 @@
.items {
padding: 1em;
}
.items .box {
max-width: 420px;
padding: 3em;
}
/* Footer */
.items .footer {
text-align: center;
margin-top: 1.5em;
}
.items .footer > button {
margin: 0 .2em;
}

66
forms/reports/items-form/ui.xml
View File

@ -9,40 +9,38 @@
on-click="this.onPreviewClick()"/>
</div>
<div id="form" class="items">
<div class="box">
<div class="form">
<div class="form-group">
<label><t>Store</t></label>
<htk-combo>
<vn-param property="param" id="warehouse"/>
<db-model property="model">
<custom>
SELECT id, name FROM vn2008.warehouse
WHERE reserve ORDER BY name
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Realm</t></label>
<htk-combo not-null="false">
<vn-param property="param" id="realm"/>
<db-model property="model">
<custom>
SELECT id, reino FROM vn2008.reinos
WHERE display != FALSE ORDER BY reino
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Rate</t></label>
<select id="rate">
<option>3</option>
<option>2</option>
<option>1</option>
</select>
</div>
<div class="form box vn-w-sm vn-pa-lg">
<div class="form-group">
<label><t>Store</t></label>
<htk-combo>
<vn-param property="param" id="warehouse"/>
<db-model property="model">
<custom>
SELECT id, name FROM vn2008.warehouse
WHERE reserve ORDER BY name
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Realm</t></label>
<htk-combo not-null="false">
<vn-param property="param" id="realm"/>
<db-model property="model">
<custom>
SELECT id, reino FROM vn2008.reinos
WHERE display != FALSE ORDER BY reino
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Rate</t></label>
<select id="rate">
<option>3</option>
<option>2</option>
<option>1</option>
</select>
</div>
</div>
</div>

8
forms/reports/shelves/style.css
View File

@ -1,8 +0,0 @@
.shelves {
padding: 1em;
}
.shelves .box {
max-width: 420px;
padding: 3em;
}

180
forms/reports/shelves/ui.xml
View File

@ -19,99 +19,97 @@
on-click="this.onPreviewClick()"/>
</div>
<div id="form" class="shelves">
<div class="box">
<div class="form">
<div class="form-group">
<label><t>Configuration</t></label>
<htk-combo
id="config"
placeholder="_Select config"
model="configs-model"
on-changed="this.onConfigChange()"
on-ready="this.onConfigChange()"/>
</div>
<div class="form-group">
<label><t>Date</t></label>
<htk-date-chooser id="date"/>
</div>
<div class="form-group">
<label><t>Reign</t></label>
<htk-combo id="realm">
<db-model property="model" id="realms">
<div class="form box vn-w-sm vn-pa-lg">
<div class="form-group">
<label><t>Configuration</t></label>
<htk-combo
id="config"
placeholder="_Select config"
model="configs-model"
on-changed="this.onConfigChange()"
on-ready="this.onConfigChange()"/>
</div>
<div class="form-group">
<label><t>Date</t></label>
<htk-date-chooser id="date"/>
</div>
<div class="form-group">
<label><t>Reign</t></label>
<htk-combo id="realm">
<db-model property="model" id="realms">
<custom>
SELECT id, reino FROM vn2008.reinos
WHERE display != FALSE ORDER BY reino
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Family</t></label>
<htk-combo id="family">
<db-model property="model">
<custom>
SELECT tipo_id, Tipo FROM vn2008.Tipos
WHERE reino_id = #realm ORDER BY Tipo
</custom>
<sql-batch property="batch">
<custom>
SELECT id, reino FROM vn2008.reinos
WHERE display != FALSE ORDER BY reino
<item name="realm" param="realm"/>
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Family</t></label>
<htk-combo id="family">
<db-model property="model">
<custom>
SELECT tipo_id, Tipo FROM vn2008.Tipos
WHERE reino_id = #realm ORDER BY Tipo
</custom>
<sql-batch property="batch">
<custom>
<item name="realm" param="realm"/>
</custom>
</sql-batch>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Store</t></label>
<htk-combo id="warehouse">
<db-model property="model" id="warehouses">
<custom>
SELECT id, name FROM vn2008.warehouse
WHERE reserve ORDER BY name
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Shelf</t></label>
<htk-combo id="shelf">
<db-model property="model" id="shelves">
<custom>
SELECT id, name FROM shelf
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Name prefix</t></label>
<htk-entry id="namePrefix"/>
</div>
<div class="form-group">
<label><t>Limit amount per item</t></label>
<htk-entry id="maxAmount"/>
</div>
<div class="form-group">
<label><t>Title</t></label>
<htk-entry id="reportTitle"/>
</div>
<div class="form-group">
<label>
<htk-check id="showPacking"/>
<t>Show packing</t>
</label>
</div>
<div class="form-group">
<label>
<htk-check id="stack"/>
<t>Stack different items</t>
</label>
</div>
<div class="form-group">
<label>
<htk-check id="useIds"/>
<t>Use ids instead of names</t>
</label>
</div>
</sql-batch>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Store</t></label>
<htk-combo id="warehouse">
<db-model property="model" id="warehouses">
<custom>
SELECT id, name FROM vn2008.warehouse
WHERE reserve ORDER BY name
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Shelf</t></label>
<htk-combo id="shelf">
<db-model property="model" id="shelves">
<custom>
SELECT id, name FROM shelf
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Name prefix</t></label>
<htk-entry id="namePrefix"/>
</div>
<div class="form-group">
<label><t>Limit amount per item</t></label>
<htk-entry id="maxAmount"/>
</div>
<div class="form-group">
<label><t>Title</t></label>
<htk-entry id="reportTitle"/>
</div>
<div class="form-group">
<label>
<htk-check id="showPacking"/>
<t>Show packing</t>
</label>
</div>
<div class="form-group">
<label>
<htk-check id="stack"/>
<t>Stack different items</t>
</label>
</div>
<div class="form-group">
<label>
<htk-check id="useIds"/>
<t>Use ids instead of names</t>
</label>
</div>
</div>
</div>

2
js/db/calc-sum.js
View File

@ -3,7 +3,7 @@ var Calc = require ('./calc');
/**
* Computes a sum of data in the model.
**/
*/
module.exports = new Class
({
Extends: Calc

10
js/db/calc.js
View File

@ -4,7 +4,7 @@ var SimpleIterator = require ('./simple-iterator');
/**
* Interface for handle foreach operations on the model.
**/
*/
module.exports = new Class
({
Extends: Vn.Param
@ -132,23 +132,23 @@ module.exports = new Class
* You don't need to define it if model isn't updatable.
*
* @param {integer} row The row number
**/
*/
,before: function (row) {}
/**
* Called after each update or insert row operation.
*
* @param {integer} row The row number
**/
*/
,after: function (row) {}
/**
* Called before each model refresh.
**/
*/
,init: function () {}
/**
* Called when an operation in the model is complete.
**/
*/
,done: function () {}
});

8
js/db/form.js
View File

@ -11,7 +11,7 @@ module.exports = new Class
{
/**
* The model associated to this form.
**/
*/
model:
{
type: Model
@ -30,7 +30,7 @@ module.exports = new Class
},
/**
* The row where the form positioned, has -1 if the row is unselected.
**/
*/
row:
{
type: Number
@ -51,7 +51,7 @@ module.exports = new Class
},
/**
* The number of rows in the form.
**/
*/
numRows:
{
type: Number
@ -65,7 +65,7 @@ module.exports = new Class
},
/**
* Checks if the form data is ready.
**/
*/
ready:
{
type: Boolean

6
js/db/param.js
View File

@ -10,7 +10,7 @@ module.exports = new Class
{
/**
* The form field referenced by this param.
**/
*/
column:
{
type: String
@ -26,7 +26,7 @@ module.exports = new Class
},
/**
* The form referenced by this param.
**/
*/
form:
{
type: Form
@ -48,7 +48,7 @@ module.exports = new Class
/**
* Determines whether the link to the form is unidirectional, ie, a
* change in the form updates the parameter but not vice versa.
**/
*/
oneWay:
{
type: Boolean

10
js/db/query.js
View File

@ -9,7 +9,7 @@ module.exports = new Class
{
/**
* The connection used to execute the statement.
**/
*/
conn:
{
type: Connection
@ -25,7 +25,7 @@ module.exports = new Class
},
/**
* The model query.
**/
*/
query:
{
type: String
@ -41,7 +41,7 @@ module.exports = new Class
},
/**
* The model select statement.
**/
*/
stmt:
{
type: Sql.Stmt
@ -57,7 +57,7 @@ module.exports = new Class
},
/**
* The batch used to execute the statement.
**/
*/
batch:
{
type: Sql.Batch
@ -73,7 +73,7 @@ module.exports = new Class
},
/**
* Wether to execute automatically de query que it's ready.
**/
*/
autoLoad:
{
type: Boolean,

10
js/db/result.js
View File

@ -1,11 +1,11 @@
/**
* This class stores a database result.
**/
*/
module.exports = new Class
({
/**
* Initilizes the result object.
**/
*/
initialize: function (result)
{
this.data = result.data;
@ -29,7 +29,7 @@ module.exports = new Class
*
* @param {String} columnName The column name
* @return {Object} The cell value
**/
*/
,get: function (columnName)
{
var columnIndex = this.columnMap[columnName];
@ -38,7 +38,7 @@ module.exports = new Class
/**
* Resets the result iterator.
**/
*/
,reset: function ()
{
this.row = -1;
@ -46,7 +46,7 @@ module.exports = new Class
/**
* Moves the internal iterator to the next row.
**/
*/
,next: function ()
{
this.row++;

2
js/hedera/form.js
View File

@ -33,7 +33,7 @@ module.exports = new Class({
builder.compileFile('forms/'+ this.formInfo.path +'/ui.xml');
var scope = this.builder = builder.load(null, this);
scope.link({conn: this.conn});
scope.link(null, {conn: this.conn});
this.node = scope.$('form');

10
js/hedera/gui.js
View File

@ -35,11 +35,6 @@ module.exports = new Class({
this.$('background').onclick = function() {};
this.$('menu-button').addEventListener('click', function(event) {
event.stopPropagation();
this.showMenu();
}.bind(this));
this.$('left-panel').addEventListener('click', function(event) {
event.stopPropagation();
});
@ -264,6 +259,11 @@ module.exports = new Class({
}
}
,onMenuClick(event) {
event.stopPropagation();
this.showMenu();
}
,showMenu: function() {
this.showBackground();
Vn.Node.addClass(this.$('left-panel'), 'show');

207
js/hedera/gui.scss
View File

@ -1,3 +1,6 @@
@import "../htk/style/classes";
.vn-gui {
height: inherit;
@ -20,72 +23,71 @@
overflow: hidden;
height: 64px;
color: white;
display: flex;
align-items: center;
transition-property: left, background-color, transform;
transition-duration: 200ms;
transition-timing-function: ease-in-out;
}
.menu-button {
position: absolute;
left: 0;
display: none;
border: none;
background-color: transparent;
padding: 0 1em;
margin: 0;
height: 100%;
&:hover {
background-color: rgba(0, 0, 0, .2);
& > .menu-button {
flex: none;
display: none;
border: none;
&:hover {
background-color: rgba(255, 255, 255, .1);
}
& > .htk-icon {
display: block;
}
}
img {
vertical-align: middle;
height: 1.8em;
& > .title-wraper {
flex: auto;
display: flex;
align-items: center;
gap: 15px;
overflow: hidden;
& > .title {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
h1 {
font-weight: normal;
font-size: 1.4em;
padding-left: 8px;
margin: 0;
}
}
}
}
.title {
float: left;
h1 {
font-weight: normal;
font-size: 1.4em;
padding: .8em .6em;
padding-right: .3em;
margin: 0;
}
}
.navbar > .htk-spinner {
float: left;
margin: 1.05em .8em;
}
/* Action bar */
.action-bar {
float: right;
padding: 0;
margin: 0;
height: 100%;
& > div {
& > .action-bar {
flex: none;
padding: 0;
margin: 0;
height: 100%;
display: flex;
align-items: center;
padding: 0 1em;
gap: .5em;
& > * {
float: right;
& > div {
padding: 0;
margin: 0;
height: 100%;
display: flex;
align-items: center;
padding: 0 1em;
gap: .5em;
& > * {
float: right;
}
}
}
button {
margin: 0;
padding: 10px 15px;
button {
margin: 0;
padding: 10px 15px;
&:hover {
background-color: rgba(2550, 255, 255, .2);
&:hover {
background-color: rgba(2550, 255, 255, .2);
}
}
}
}
@ -141,40 +143,44 @@
width: 160px;
margin-left: 37px;
}
.user-info > div {
display: flex;
justify-content: space-between;
align-items: center;
overflow: hidden;
font-weight: bold;
border: 1px solid #eaeaea;
.user-info {
margin: 25px;
& > span {
padding: 10px;
& > div {
display: flex;
justify-content: space-between;
align-items: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.logout {
display: block;
margin: 0;
text-align: left;
border-radius: 0;
font-weight: bold;
border: 1px solid #eaeaea;
&:hover {
background-color: #1a1a1a;
color: white;
& > span {
padding: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
& > .htk-icon {
.logout {
display: block;
}
}
&.supplant {
display: none;
margin: 0;
text-align: left;
border-radius: 0;
&.show {
display: flex;
&:hover {
background-color: #1a1a1a;
color: white;
}
& > .htk-icon {
display: block;
}
}
&.supplant {
display: none;
border-top: none;
&.show {
display: flex;
}
}
}
}
@ -283,35 +289,40 @@
transition-property: opacity, transform;
transition-duration: 200ms;
transition-timing-function: ease-out;
}
.form-holder.show {
opacity: 1;
transform: translateZ(0) translateX(0em);
-webkit-transform: translateZ(0) translateX(0em);
&.show {
opacity: 1;
transform: translateZ(0) translateX(0em);
-webkit-transform: translateZ(0) translateX(0em);
}
& > * {
padding: $spacing-md;
}
}
/* Mobile */
@media (max-width: 960px) {
.action-bar {
span.label,
.htk-button > .text {
display: none;
}
.htk-button {
padding: 10px;
}
}
& > .navbar {
padding-left: 2.8em;
padding-left: 16px;
left: 0;
& > .menu-button {
display: block;
}
& > .action-bar {
button {
padding: 10px;
}
span.label,
button > .text {
display: none;
}
}
}
& > .body {
margin-left: 0;
}
.menu-button {
display: block;
}
.left-panel {
top: 0;
left: -250px;

13
js/hedera/gui.xml
View File

@ -1,12 +1,17 @@
<vn>
<div id="main" class="vn-gui">
<div id="top-bar" class="navbar">
<div id="action-bar" class="action-bar"/>
<button id="menu-button" class="menu-button">
<button
id="menu-button"
class="menu-button"
on-click="onMenuClick">
<htk-icon name="menu" alt="_Menu"/>
</button>
<div id="title" class="title"/>
<htk-spinner id="loader" class="loader dark"/>
<div class="title-wraper">
<div id="title" class="title"/>
<htk-spinner id="loader" class="loader dark"/>
</div>
<div id="action-bar" class="action-bar"/>
</div>
<div id="left-panel" class="left-panel">
<div class="menu-overflow">

2
js/hedera/report.js
View File

@ -82,7 +82,7 @@ module.exports = new Class({
builder.compileFile('reports/'+ this.info.path +'/ui.xml');
var scope = this.scope = builder.load(this.doc, this);
scope.link({
scope.link(null, {
batch: this.batch,
conn: this.conn
});

13
js/hedera/style.scss
View File

@ -62,16 +62,6 @@ a img {
a img:hover {
opacity: 0.9;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: .2em 0;
}
h1 {
font-size: 1.5em;
}
h2 {
font-size: 1.2em;
}
p {
margin: 0.8em 0;
}
@ -153,7 +143,7 @@ input[type=radio] {
}
select {
@extend %clickable;
background-color: white;
background-color: transparent;
-moz-appearance: none;
appearance: none;
line-height: 1em;
@ -211,6 +201,7 @@ img.editable {
.box {
@extend %box;
margin: 0 auto;
box-sizing: border-box;
.header {
padding: 0.6em 0.8em;

43
js/htk/column.js
View File

@ -1,10 +1,10 @@
var NodeBuilder = require ('./node-builder');
var NodeBuilder = require('./node-builder');
/**
* Represents a grid column. This is an abstract class and should not be
* instantiated directly.
**/
*/
module.exports = new Class
({
Extends: NodeBuilder
@ -44,8 +44,7 @@ module.exports = new Class
class:
{
type: String
,set: function (x)
{
,set: function(x) {
this._userCssClass = x;
if (this._cssClass)
@ -53,8 +52,7 @@ module.exports = new Class
else
this._cssClass = x;
}
,get: function ()
{
,get: function() {
return this._userCssClass;
}
}
@ -65,19 +63,17 @@ module.exports = new Class
/**
* Initializes the column.
**/
,initialize: function (props)
{
this.parent (props);
this.td = this.createElement ('td');
*/
,initialize: function(props) {
this.parent(props);
this.td = this.createElement('td');
}
,renderHeader: function ()
{
var th = this.createElement ('th');
,renderHeader: function() {
var th = this.createElement('th');
if (this.title)
th.appendChild (this.createTextNode (this.title));
th.appendChild(this.createTextNode(this.title));
return th;
}
@ -86,10 +82,9 @@ module.exports = new Class
* Draws the cell and returns its associated td.
*
* @return {HTMLTableData} the rendered cell
**/
,render: function ()
{
var td = this.td.cloneNode (true);
*/
,render: function() {
var td = this.td.cloneNode(true);
if (this._cssClass)
td.className = this._cssClass;
@ -97,15 +92,13 @@ module.exports = new Class
return td;
}
,updateColumnIndex: function (model)
{
,updateColumnIndex: function(model) {
if (this.column)
this.columnIndex = model.getColumnIndex (this.column);
this.columnIndex = model.getColumnIndex(this.column);
}
,changed: function (tr, newValue)
{
this.signalEmit ('changed', tr.rowIndex - 1, newValue);
,changed: function(tr, newValue) {
this.signalEmit('changed', tr.rowIndex - 1, newValue);
}
});

22
js/htk/column/date.js
View File

@ -7,16 +7,14 @@ module.exports = new Class
{
/**
* Format that applies to the value.
**/
*/
format:
{
type: String
,set: function (x)
{
,set: function(x) {
this._format = _(x);
}
,get: function ()
{
,get: function() {
return this._format;
}
}
@ -24,18 +22,16 @@ module.exports = new Class
,_format: _('%a, %e %b %Y')
,initialize: function (props)
{
,initialize: function(props) {
this._cssClass = 'cell-date';
this.parent (props);
this.parent(props);
}
,render: function (tr)
{
var text = Vn.Date.strftime (this.value, this._format);
,render: function(tr) {
var text = Vn.Date.strftime(this.value, this._format);
var td = this.parent (tr);
td.appendChild (this.createTextNode (text));
var td = this.parent(tr);
td.appendChild(this.createTextNode(text));
return td;
}

22
js/htk/column/image.js
View File

@ -7,7 +7,7 @@ module.exports = new Class
{
/**
* The directory where the images are allocated.
**/
*/
directory:
{
type: String
@ -15,7 +15,7 @@ module.exports = new Class
},
/**
* The subdirectory where the images are allocated.
**/
*/
subdir:
{
type: String
@ -23,7 +23,7 @@ module.exports = new Class
},
/**
* Subdirectory where full images are allocated.
**/
*/
fullDir:
{
type: String
@ -31,22 +31,20 @@ module.exports = new Class
},
/**
* The REST connection used to upload the image.
**/
*/
conn:
{
type: Vn.JsonConnection
}
}
,initialize: function (props)
{
,initialize: function(props) {
this._cssClass = 'cell-image';
this.parent (props);
this.parent(props);
}
,render: function (tr)
{
var image = new Htk.Image ({
,render: function(tr) {
var image = new Htk.Image({
directory: this.directory
,subdir: this.subdir
,fullDir: this.fullDir
@ -55,8 +53,8 @@ module.exports = new Class
,doc: this.doc
});
var td = this.parent (tr);
td.appendChild (image.node);
var td = this.parent(tr);
td.appendChild(image.node);
return td;
}
});

15
js/htk/column/link.js
View File

@ -7,7 +7,7 @@ module.exports = new Class
{
/**
* The link url.
**/
*/
href:
{
type: String
@ -15,7 +15,7 @@ module.exports = new Class
},
/**
* the target where the link is opened.
**/
*/
target:
{
type: String
@ -23,17 +23,16 @@ module.exports = new Class
}
}
,render: function (tr)
{
var link = this.createElement ('a');
,render: function(tr) {
var link = this.createElement('a');
link.href = this.href;
link.appendChild (this.createTextNode (this.value));
link.appendChild(this.createTextNode(this.value));
if (this.target)
link.target = this.target;
var td = this.parent (tr);
td.appendChild (link);
var td = this.parent(tr);
td.appendChild(link);
return td;
}
});

43
js/htk/column/spin.js
View File

@ -7,7 +7,7 @@ module.exports = new Class
{
/**
* The text to append to the number.
**/
*/
unit:
{
type: String
@ -15,59 +15,52 @@ module.exports = new Class
},
/**
* The number of decimal places to display.
**/
*/
digits: {
type: Number
,value: 0
}
}
,initialize: function (props)
{
,initialize: function(props) {
this._cssClass = 'cell-spin';
this.parent (props);
this.parent(props);
}
,renderHeader: function ()
{
var th = this.parent ();
,renderHeader: function() {
var th = this.parent();
th.className = 'cell-spin';
return th;
}
,render: function (tr)
{
var td = this.parent (tr);
,render: function(tr) {
var td = this.parent(tr);
var valueString = null;
if (this.value !== null && this.value !== undefined)
valueString = new Number (this.value).toFixed (this.digits);
valueString = new Number(this.value).toFixed(this.digits);
if (this.editable)
{
var entry = this.createElement ('input');
if (this.editable) {
var entry = this.createElement('input');
entry.type = 'text';
entry.addEventListener ('change', this.inputChanged.bind (this, tr, entry));
td.appendChild (entry);
entry.addEventListener('change', this.inputChanged.bind(this, tr, entry));
td.appendChild(entry);
if (valueString)
entry.value = valueString;
}
else if (valueString)
{
} else if (valueString) {
if (this.unit)
valueString = valueString + this.unit;
var text = this.createTextNode (valueString);
td.appendChild (text);
var text = this.createTextNode(valueString);
td.appendChild(text);
}
return td;
}
,inputChanged: function (tr, entry)
{
this.changed (tr, parseInt (entry.value));
,inputChanged: function(tr, entry) {
this.changed(tr, parseInt(entry.value));
}
});

41
js/htk/column/text.js
View File

@ -7,16 +7,14 @@ module.exports = new Class
{
/**
* Format that applies to the value.
**/
*/
format:
{
type: String
,set: function (x)
{
,set: function(x) {
this._format = _(x);
}
,get: function ()
{
,get: function() {
return this._format;
}
}
@ -24,37 +22,32 @@ module.exports = new Class
,_format: null
,initialize: function (props)
{
,initialize: function(props) {
this._cssClass = 'cell-text';
this.parent (props);
this.parent(props);
}
,render: function (tr)
{
,render: function(tr) {
var node;
if (this.editable)
{
if (this.editable) {
var value = this.value ? this.value : '';
node = this.createElement ('input');
node = this.createElement('input');
node.type = 'text';
node.value = value;
node.addEventListener ('changed',
this.inputChanged.bind (this, tr, node));
}
else
node = this.createTextNode (
Vn.Value.format (this.value, this._format));
node.addEventListener('changed',
this.inputChanged.bind(this, tr, node));
} else
node = this.createTextNode(
Vn.Value.format(this.value, this._format));
var td = this.parent (tr);
td.appendChild (node);
var td = this.parent(tr);
td.appendChild(node);
return td;
}
,inputChanged: function (tr, node)
{
this.changed (tr, node.value);
,inputChanged: function(tr, node) {
this.changed(tr, node.value);
}
});

8
js/htk/dialog.js
View File

@ -3,7 +3,7 @@ var Popup = require('./popup');
/**
* Class to show message dialogs with buttons.
**/
*/
var Dialog = new Class();
module.exports = Dialog;
@ -53,7 +53,7 @@ Dialog.implement({
{
/**
* The message displayed to the user.
**/
*/
message:
{
type: String
@ -66,7 +66,7 @@ Dialog.implement({
}
/**
* The dialog icon.
**/
*/
,icon:
{
type: String
@ -79,7 +79,7 @@ Dialog.implement({
}
/**
* The dialog buttons.
**/
*/
,buttons:
{
enumType: Button

6
js/htk/field.js
View File

@ -99,7 +99,7 @@ module.exports = new Class({
* editable.
*
* @param {Boolean} editable Whether the user is allowed to edit the entry
**/
*/
,setEditable: function(editable) {}
/**
@ -107,7 +107,7 @@ module.exports = new Class({
* on the associated entry.
*
* @param {Object} value The new value for the entry
**/
*/
,putValue: function(value) {}
/**
@ -115,7 +115,7 @@ module.exports = new Class({
* on the associated entry changes.
*
* @param {Object} value The new entry value
**/
*/
,valueChanged: function(value) {
this._value = value;

12
js/htk/field/image.js
View File

@ -1,6 +1,6 @@
/**
* Class to display or edit an image. Also it allows to show it's full version.
**/
*/
module.exports = new Class({
Extends: Htk.Field
,Tag: 'htk-image'
@ -8,7 +8,7 @@ module.exports = new Class({
{
/**
* The directory where the images are allocated.
**/
*/
directory: {
type: String
,set: function(x) {
@ -21,7 +21,7 @@ module.exports = new Class({
},
/**
* The subdirectory where the images are allocated.
**/
*/
subdir: {
type: String
,set: function(x) {
@ -34,7 +34,7 @@ module.exports = new Class({
},
/**
* The timestamp field of the last update, used for caching purposes.
**/
*/
stampColumn: {
type: String
,set: function(x) {
@ -47,7 +47,7 @@ module.exports = new Class({
},
/**
* Whether to show the full image when mouse hover.
**/
*/
fullDir: {
type: String
,set: function(x) {
@ -60,7 +60,7 @@ module.exports = new Class({
},
/**
* The REST connection used to upload the image.
**/
*/
conn: {
type: Vn.JsonConnection
}

22
js/htk/field/label.js
View File

@ -7,17 +7,15 @@ module.exports = new Class
{
/**
* Format that applies to the value.
**/
*/
format:
{
type: String
,set: function (x)
{
,set: function(x) {
this._format = _(x);
this.putValue (this._value);
this.putValue(this._value);
}
,get: function ()
{
,get: function() {
return this._format;
}
}
@ -25,14 +23,12 @@ module.exports = new Class
,_format: null
,render: function ()
{
this.createRoot ('label');
,render: function() {
this.createRoot('label');
}
,putValue: function (value)
{
Vn.Node.setText (this.node,
Vn.Value.format (value, this._format));
,putValue: function(value) {
Vn.Node.setText(this.node,
Vn.Value.format(value, this._format));
}
});

20
js/htk/field/text.js
View File

@ -7,17 +7,15 @@ module.exports = new Class
{
/**
* Format that applies to the value.
**/
*/
format:
{
type: String
,set: function (x)
{
,set: function(x) {
this._format = _(x);
this.putValue (this._value);
this.putValue(this._value);
}
,get: function ()
{
,get: function() {
return this._format;
}
}
@ -25,13 +23,11 @@ module.exports = new Class
,_format: null
,render: function ()
{
this._node = this.createTextNode ('');
,render: function() {
this._node = this.createTextNode('');
}
,putValue: function (value)
{
this._node.nodeValue = Vn.Value.format (value, this._format);
,putValue: function(value) {
this._node.nodeValue = Vn.Value.format(value, this._format);
}
});

66
js/htk/full-image.js
View File

@ -1,6 +1,6 @@
var Popup = require ('./popup');
var Spinner = require ('./spinner');
var Popup = require('./popup');
var Spinner = require('./spinner');
module.exports = new Class
({
@ -9,81 +9,71 @@ module.exports = new Class
{
/**
* Subdirectory where full images are allocated.
**/
*/
fullDir:
{
type: String
,set: function (x)
{
,set: function(x) {
this._fullDir = x;
}
,get: function ()
{
,get: function() {
return this._fullDir;
}
}
}
,show: function (src)
{
var popup = new Popup ({class: 'htk-full-image', modal: true});
,show: function(src) {
var popup = new Popup({class: 'htk-full-image', modal: true});
var img = document.createElement ('img');
var img = document.createElement('img');
img.className = 'htk-full-image';
img.addEventListener ('click', this._onImageClick.bind (this, popup));
img.addEventListener('click', this._onImageClick.bind(this, popup));
//img.addEventListener ('error', this._onImageError.bind (this, popup));
img.src = src;
if (!img.complete)
{
img.addEventListener ('load', this._onImageLoad.bind (this, popup, img));
if (!img.complete) {
img.addEventListener('load', this._onImageLoad.bind(this, popup, img));
var spinner = new Spinner ();
spinner.start ();
var spinner = new Spinner();
spinner.start();
popup.child = spinner;
}
else
this._onImageLoad (popup, img);
} else
this._onImageLoad(popup, img);
popup.open ();
popup.open();
}
,_onImageLoad: function (popup, img)
{
,_onImageLoad: function(popup, img) {
var scale = null;
var width = img.width;
var height = img.height;
var innerWidth = Vn.Browser.getInnerWidth () - 50;
var innerHeight = Vn.Browser.getInnerHeight () - 50;
var innerWidth = Vn.Browser.getInnerWidth() - 50;
var innerHeight = Vn.Browser.getInnerHeight() - 50;
if (width > innerWidth)
{
if (width > innerWidth) {
scale = width / innerWidth;
height = parseInt (height / scale);
height = parseInt(height / scale);
width = innerWidth;
}
if (height > innerHeight)
{
if (height > innerHeight) {
scale = height / innerHeight;
width = parseInt (width / scale);
width = parseInt(width / scale);
height = innerHeight;
}
if (scale !== null)
{
if (scale !== null) {
img.style.width = width +'px';
img.style.height = height +'px';
}
popup.childNode = img;
popup.reset ();
popup.reset();
}
,_onImageClick: function (popup)
{
popup.hide ();
,_onImageClick: function(popup) {
popup.hide();
}
,_onImageError: function (popup) {}
,_onImageError: function(popup) {}
});

6
js/htk/grid.js
View File

@ -9,7 +9,7 @@ module.exports = new Class({
{
/**
* The source data model.
**/
*/
model:
{
type: Db.Model
@ -35,7 +35,7 @@ module.exports = new Class({
},
/**
* Message that should be displayed when source model is not ready.
**/
*/
emptyMessage:
{
type: String
@ -43,7 +43,7 @@ module.exports = new Class({
},
/**
* Wether to display the header with column titles.
**/
*/
showHeader:
{
type: Boolean

3
js/htk/htk.js
View File

@ -1,7 +1,6 @@
require('db/db');
require('./style/classes.scss');
require('./style/main.scss');
require('./style/index.scss');
Htk = module.exports = {
NodeBuilder : require('./node-builder')

4
js/htk/image-editor.js
View File

@ -6,13 +6,13 @@ var Tpl = require('./image-editor.xml').default;
/**
* A form to handle the image database, it allows to add new images or
* replace it.
**/
*/
module.exports = new Class({
Extends: Component,
Properties: {
/**
* The REST connection used to upload the image.
**/
*/
conn: {
type: Vn.JsonConnection
}

155
js/htk/popup.js
View File

@ -1,9 +1,9 @@
var Widget = require ('./widget');
var Widget = require('./widget');
/**
* Class to handle popups.
**/
*/
module.exports = new Class
({
Extends: Widget
@ -12,48 +12,42 @@ module.exports = new Class
{
/**
* The popup child.
**/
*/
child:
{
type: Widget
,set: function (x)
{
,set: function(x) {
this._child = x;
this._setChildNode (x.node);
this._setChildNode(x.node);
}
,get: function ()
{
,get: function() {
return this._child;
}
}
/**
* The popup child Node.
**/
*/
,childNode:
{
type: Object
,set: function (x)
{
,set: function(x) {
this._child = null;
this._setChildNode (x);
this._setChildNode(x);
}
,get: function ()
{
,get: function() {
return this.node.firstChild;
}
}
/**
* Indicates how the dialog must be displayed.
**/
*/
,modal:
{
type: Boolean
,set: function (x)
{
,set: function(x) {
this._modal = x;
}
,get: function ()
{
,get: function() {
return this._modal;
}
}
@ -64,82 +58,69 @@ module.exports = new Class
,_isOpen: false
,_child: null
,initialize: function (props)
{
this._bgMouseDownHandler = this._bgMouseDown.bind (this);
this.parent (props);
,initialize: function(props) {
this._bgMouseDownHandler = this._bgMouseDown.bind(this);
this.parent(props);
}
,render: function ()
{
var div = this.createRoot ('div');
,render: function() {
var div = this.createRoot('div');
div.className = 'htk-popup';
}
,_setChildNode: function (childNode)
{
Vn.Node.removeChilds (this.node);
this.node.appendChild (childNode);
,_setChildNode: function(childNode) {
Vn.Node.removeChilds(this.node);
this.node.appendChild(childNode);
}
,show: function (parent)
{
,show: function(parent) {
this._parent = parent;
this.open ();
this.open();
}
,isModal: function ()
{
return this._modal || Vn.isMobile ();
,isModal: function() {
return this._modal || Vn.isMobile();
}
,open: function ()
{
if (this._isOpen)
{
this.reset ();
,open: function() {
if (this._isOpen) {
this.reset();
return;
}
this.node.addEventListener ('mousedown', this._onMouseDown.bind (this));
this.node.addEventListener('mousedown', this._onMouseDown.bind(this));
if (this.isModal ())
{
var bg = this._bg = this.createElement ('div');
if (this.isModal()) {
var bg = this._bg = this.createElement('div');
bg.className = 'htk-background';
bg.addEventListener ('mousedown', this._bgMouseDownHandler);
Htk.Toast.pushTop (bg);
bg.addEventListener('mousedown', this._bgMouseDownHandler);
Htk.Toast.pushTop(bg);
Vn.Node.addClass (this.node, 'modal');
bg.appendChild (this.node);
Vn.Node.addClass(this.node, 'modal');
bg.appendChild(this.node);
this.doc.body.appendChild (bg);
setTimeout (this._onOpacityTimeout.bind (this), 0);
}
else
{
this.doc.addEventListener ('mousedown', this._bgMouseDownHandler);
this.doc.body.appendChild (this.node);
this.doc.body.appendChild(bg);
setTimeout(this._onOpacityTimeout.bind(this), 0);
} else {
this.doc.addEventListener('mousedown', this._bgMouseDownHandler);
this.doc.body.appendChild(this.node);
}
this._isOpen = true;
this.reset ();
setTimeout (this._onResetTimeout.bind (this), 0);
this.reset();
setTimeout(this._onResetTimeout.bind(this), 0);
}
,_onOpacityTimeout: function ()
{
,_onOpacityTimeout: function() {
if (this._bg)
this._bg.style.opacity = 1;
}
,_onResetTimeout: function ()
{
this.reset ();
,_onResetTimeout: function() {
this.reset();
}
,reset: function ()
{
,reset: function() {
if (!this._isOpen)
return;
@ -156,26 +137,21 @@ module.exports = new Class
var innerWidth = window.innerWidth;
var innerHeight = window.innerHeight;
if (width + dblMargin > innerWidth)
{
if (width + dblMargin > innerWidth) {
width = innerWidth - dblMargin;
style.width = width +'px';
}
if (height + dblMargin > innerHeight)
{
if (height + dblMargin > innerHeight) {
height = innerHeight - dblMargin;
style.height = height +'px';
}
if (this.isModal ())
{
if (this.isModal()) {
style.marginLeft = (-node.offsetWidth / 2) +'px';
style.marginTop = (-node.offsetHeight / 2) +'px';
}
else
{
} else {
var spacing = 4;
var rect = this._parent.getBoundingClientRect ();
var rect = this._parent.getBoundingClientRect();
var left = rect.left;
var top = rect.top + spacing + this._parent.offsetHeight;
@ -194,37 +170,32 @@ module.exports = new Class
}
}
,hide: function ()
{
,hide: function() {
if (!this._isOpen)
return;
if (this._bg)
{
Htk.Toast.popTop ();
Vn.Node.remove (this._bg);
Vn.Node.removeClass (this._node, 'modal');
if (this._bg) {
Htk.Toast.popTop();
Vn.Node.remove(this._bg);
Vn.Node.removeClass(this._node, 'modal');
this._bg = null;
}
else
this.doc.removeEventListener ('mousedown', this._bgMouseDownHandler);
} else
this.doc.removeEventListener('mousedown', this._bgMouseDownHandler);
Vn.Node.remove (this._node);
Vn.Node.remove(this._node);
this._parent = null;
this._isOpen = false;
this.signalEmit ('closed');
this.signalEmit('closed');
}
,_bgMouseDown: function (e)
{
,_bgMouseDown: function(e) {
if (e !== this._lastEvent)
this.hide ();
this.hide();
this._lastEvent = null;
}
,_onMouseDown: function (e)
{
,_onMouseDown: function(e) {
this._lastEvent = e;
}
});

6
js/htk/style/main.scss → js/htk/style/components.scss
View File

@ -1,6 +1,5 @@
@import "variables";
@import "classes";
@import "./variables";
/* Icon */
@ -220,6 +219,7 @@ td.cell-image .htk-image {
}
& > .content {
flex: 1;
overflow: hidden;
& > .important {
font-weight: bold;
@ -228,6 +228,8 @@ td.cell-image .htk-image {
}
& > p {
margin: .1em 0;
text-overflow: ellipsis;
white-space: nowrap;
}
}
& > .actions {

7
js/htk/style/index.scss Normal file
View File

@ -0,0 +1,7 @@
@import "./variables";
@import "./classes";
@import "./spacing";
@import "./text";
@import "./width";
@import "./components";

355
js/htk/style/spacing.scss Normal file
View File

@ -0,0 +1,355 @@
/**
* CSS spacing classes
*
* vn-[p|m][t|r|b|l|a|x|y]-[none|auto|xs|sm|md|lg|xl]
* T D S
*
* T - type
* - values: p (padding), m (margin)
*
* D - direction
* - values:
* t (top), r (right), b (bottom), l (left),
* a (all), x (both left & right), y (both top & bottom)
*
* S - size
* - values:
* none,
* auto (ONLY for specific margins: vn-ml-*, vn-mr-*, vn-mx-*),
* xs (extra small),
* sm (small),
* md (medium),
* lg (large),
* xl (extra large)
*/
@import "./variables";
//++++++++++++++++++++++++++++++++++++++++++++++++ Padding
// None
.vn-pa-none {
padding: 0;
}
.vn-pl-none {
padding-left: 0;
}
.vn-pr-none {
padding-right: 0;
}
.vn-pt-none {
padding-top: 0;
}
.vn-pb-none {
padding-bottom: 0;
}
.vn-py-none {
padding-top: 0;
padding-bottom: 0;
}
.vn-px-none {
padding-left: 0;
padding-right: 0;
}
// Extra small
.vn-pa-xs {
padding: $spacing-xs;
}
.vn-pl-xs {
padding-left: $spacing-xs;
}
.vn-pr-xs {
padding-right: $spacing-xs;
}
.vn-pt-xs {
padding-top: $spacing-xs;
}
.vn-pb-xs {
padding-bottom: $spacing-xs;
}
.vn-py-xs {
padding-top: $spacing-xs;
padding-bottom: $spacing-xs;
}
.vn-px-xs {
padding-left: $spacing-xs;
padding-right: $spacing-xs;
}
// Small
.vn-pa-sm {
padding: $spacing-sm;
}
.vn-pl-sm {
padding-left: $spacing-sm;
}
.vn-pr-sm {
padding-right: $spacing-sm;
}
.vn-pt-sm {
padding-top: $spacing-sm;
}
.vn-pb-sm {
padding-bottom: $spacing-sm;
}
.vn-py-sm {
padding-top: $spacing-sm;
padding-bottom: $spacing-sm;
}
.vn-px-sm {
padding-left: $spacing-sm;
padding-right: $spacing-sm;
}
// Medium
.vn-pa-md {
padding: $spacing-md;
}
.vn-pl-md {
padding-left: $spacing-md;
}
.vn-pr-md {
padding-right: $spacing-md;
}
.vn-pt-md {
padding-top: $spacing-md;
}
.vn-pb-md {
padding-bottom: $spacing-md;
}
.vn-py-md {
padding-top: $spacing-md;
padding-bottom: $spacing-md;
}
.vn-px-md {
padding-left: $spacing-md;
padding-right: $spacing-md;
}
// Large
.vn-pa-lg {
padding: $spacing-lg;
}
.vn-pl-lg {
padding-left: $spacing-lg;
}
.vn-pr-lg {
padding-right: $spacing-lg;
}
.vn-pt-lg {
padding-top: $spacing-lg;
}
.vn-pb-lg {
padding-bottom: $spacing-lg;
}
.vn-py-lg {
padding-top: $spacing-lg;
padding-bottom: $spacing-lg;
}
.vn-px-lg {
padding-left: $spacing-lg;
padding-right: $spacing-lg;
}
// Extra large
.vn-pa-xl {
padding: $spacing-xl;
}
.vn-pl-xl {
padding-left: $spacing-xl;
}
.vn-pr-xl {
padding-right: $spacing-xl;
}
.vn-pt-xl {
padding-top: $spacing-xl;
}
.vn-pb-xl {
padding-bottom: $spacing-xl;
}
.vn-py-xl {
padding-top: $spacing-xl;
padding-bottom: $spacing-xl;
}
.vn-px-xl {
padding-left: $spacing-xl;
padding-right: $spacing-xl;
}
//++++++++++++++++++++++++++++++++++++++++++++++++ Margin
// None
.vn-ma-none {
padding: 0;
}
.vn-ml-none {
padding-left: 0;
}
.vn-mr-none {
padding-right: 0;
}
.vn-mt-none {
padding-top: 0;
}
.vn-mb-none {
padding-bottom: 0;
}
.vn-my-none {
padding-top: 0;
padding-bottom: 0;
}
.vn-mx-none {
padding-left: 0;
padding-right: 0;
}
// Auto
.vn-ml-none {
padding-left: auto;
}
.vn-mr-none {
padding-right: auto;
}
.vn-mx-none {
padding-left: auto;
padding-right: auto;
}
// Extra small
.vn-ma-xs {
margin: $spacing-xs;
}
.vn-mt-xs {
margin-top: $spacing-xs;
}
.vn-ml-xs {
margin-left: $spacing-xs;
}
.vn-mr-xs {
margin-right: $spacing-xs;
}
.vn-mb-xs {
margin-bottom: $spacing-xs;
}
.vn-my-xs {
margin-top: $spacing-xs;
margin-bottom: $spacing-xs;
}
.vn-mx-xs {
margin-left: $spacing-xs;
margin-right: $spacing-xs;
}
// Small
.vn-ma-sm {
margin: $spacing-sm;
}
.vn-mt-sm {
margin-top: $spacing-sm;
}
.vn-ml-sm {
margin-left: $spacing-sm;
}
.vn-mr-sm {
margin-right: $spacing-sm;
}
.vn-mb-sm {
margin-bottom: $spacing-sm;
}
.vn-my-sm {
margin-top: $spacing-sm;
margin-bottom: $spacing-sm;
}
.vn-mx-sm {
margin-left: $spacing-sm;
margin-right: $spacing-sm;
}
// Medium
.vn-ma-md {
margin: $spacing-md;
}
.vn-mt-md {
margin-top: $spacing-md;
}
.vn-ml-md {
margin-left: $spacing-md;
}
.vn-mr-md {
margin-right: $spacing-md;
}
.vn-mb-md {
margin-bottom: $spacing-md;
}
.vn-my-md {
margin-top: $spacing-md;
margin-bottom: $spacing-md;
}
.vn-mx-md {
margin-left: $spacing-md;
margin-right: $spacing-md;
}
// Large
.vn-ma-lg {
margin: $spacing-lg;
}
.vn-mt-lg {
margin-top: $spacing-lg;
}
.vn-ml-lg {
margin-left: $spacing-lg;
}
.vn-mr-lg {
margin-right: $spacing-lg;
}
.vn-mb-lg {
margin-bottom: $spacing-lg;
}
.vn-my-lg {
margin-top: $spacing-lg;
margin-bottom: $spacing-lg;
}
.vn-mx-lg {
margin-left: $spacing-lg;
margin-right: $spacing-lg;
}
/* Extra large */
.vn-ma-xl {
margin: $spacing-xl;
}
.vn-mt-xl {
margin-top: $spacing-xl;
}
.vn-ml-xl {
margin-left: $spacing-xl;
}
.vn-mr-xl {
margin-right: $spacing-xl;
}
.vn-mb-xl {
margin-bottom: $spacing-xl;
}
.vn-my-xl {
margin-top: $spacing-xl;
margin-bottom: $spacing-xl;
}
.vn-mx-xl {
margin-left: $spacing-xl;
margin-right: $spacing-xl;
}

70
js/htk/style/text.scss Normal file
View File

@ -0,0 +1,70 @@
@import "./variables";
/* Headings */
.text-h1, h1 {
font-size: 2.3rem;
}
.text-h2, h2 {
font-size: 2.25rem;
}
.text-h3, h3 {
font-size: 2rem;
}
.text-h4, h4 {
font-size: 1.6rem;
}
.text-h5, h5 {
font-size: 1.3rem;
}
.text-h6, h6 {
font-size: 1.125rem;
}
.text-subtitle1 {
font-size: 1.06rem;
}
.text-subtitle2 {
font-size: 1rem;
}
.text-body1 {
font-size: .875rem;
}
.text-body2 {
font-size: .875rem;
}
.text-caption {
font-size: .875rem;
}
.text-overline {
font-size: .8rem;
}
h1, h2, h3, h4, h5, h6 {
padding: 0;
margin-top: 0;
margin-bottom: 4px;
}
/* Colors */
.text-primary {
color: $color-main;
}
.text-secondary {
color: $color-font-light;
}
/* Helpers */
.text-uppercase {
text-transform: uppercase;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.text-left {
text-align: left;
}

20
js/htk/style/variables.scss
View File

@ -1,3 +1,23 @@
// Width
$width-xs: 400px;
$width-sm: 544px;
$width-md: 800px;
$width-lg: 1280px;
$width-xl: 1600px;
// Spacing
$spacing-xs: 4px;
$spacing-sm: 8px;
$spacing-md: 16px;
$spacing-lg: 32px;
$spacing-xl: 70px;
// Light theme
$color-primary: #8cc63f;
$color-hover-cd: rgba(0, 0, 0, .05);
$color-main: #333;
$color-font-light: #666;

26
js/htk/style/width.scss Normal file
View File

@ -0,0 +1,26 @@
@import "./variables";
%margin-auto {
margin-left: auto;
margin-right: auto;
}
.vn-w-xs {
@extend %margin-auto;
max-width: $width-xs;
}
.vn-w-sm {
@extend %margin-auto;
max-width: $width-sm;
}
.vn-w-md {
@extend %margin-auto;
max-width: $width-md;
}
.vn-w-lg {
@extend %margin-auto;
max-width: $width-lg;
}
.vn-w-xl {
@extend %margin-auto;
max-width: $width-xl;
}

122
js/htk/toast.js
View File

@ -1,6 +1,6 @@
/**
* Class to show toast messages.
**/
*/
module.exports =
{
maxMessages: 6
@ -13,60 +13,52 @@ module.exports =
* Shows a normal toast message.
*
* @param {String} message The message text
**/
,showMessage: function (message)
{
this._showText (message, 'message');
*/
,showMessage: function(message) {
this._showText(message, 'message');
}
/**
* Shows a warning toast message.
*
* @param {String} message The message text
**/
,showWarning: function (message)
{
this._showText (message, 'warning');
*/
,showWarning: function(message) {
this._showText(message, 'warning');
}
/**
* Shows an error toast message.
*
* @param {String} message The message text
**/
,showError: function (message)
{
this._showText (message, 'error');
*/
,showError: function(message) {
this._showText(message, 'error');
}
,pushTop: function (top)
{
this._topHeap.push (top);
this._refreshPosition ();
,pushTop: function(top) {
this._topHeap.push(top);
this._refreshPosition();
}
,popTop: function ()
{
var top = this._topHeap.pop ();
this._refreshPosition ();
,popTop: function() {
var top = this._topHeap.pop();
this._refreshPosition();
return top;
}
,_refreshPosition: function ()
{
,_refreshPosition: function() {
if (!this._container)
return;
var left;
var heapLen = this._topHeap.length;
if (heapLen > 0)
{
if (heapLen > 0) {
var top = this._topHeap[heapLen - 1];
var rect = top.getBoundingClientRect ();
left = (rect.left + parseInt (rect.width / 2) - window.pageXOffset) +'px';
}
else
var rect = top.getBoundingClientRect();
left = (rect.left + parseInt(rect.width / 2) - window.pageXOffset) +'px';
} else
left = '';
this._container.style.left = left;
@ -74,87 +66,79 @@ module.exports =
/**
* Hides all currently displayed toast messages.
**/
,hide: function ()
{
*/
,hide: function() {
if (!this._container)
return;
if (this._timeouts)
for (var i = 0; i < this._timeouts.length; i++)
clearTimeout (this._timeouts[i]);
clearTimeout(this._timeouts[i]);
this._timeouts = null;
document.removeEventListener ('mousedown', this.hideHandler);
Vn.Node.remove (this._container);
document.removeEventListener('mousedown', this.hideHandler);
Vn.Node.remove(this._container);
this._container = null;
this.nodes = [];
}
,_createContainer: function ()
{
if (!this._container)
{
var container = document.createElement ('div');
,_createContainer: function() {
if (!this._container) {
var container = document.createElement('div');
container.className = 'htk-toast';
document.body.appendChild (container);
document.body.appendChild(container);
this.hideHandler = this.hide.bind (this);
document.addEventListener ('mousedown', this.hideHandler);
this.hideHandler = this.hide.bind(this);
document.addEventListener('mousedown', this.hideHandler);
this._timeouts = [];
this._container = container;
}
this._refreshPosition ();
this._refreshPosition();
}
,_showText: function (message, className)
{
this._createContainer ();
,_showText: function(message, className) {
this._createContainer();
if (this._timeouts.length >= this.maxMessages)
this._onMessageTimeout ();
this._onMessageTimeout();
var toast = document.createElement ('div');
var toast = document.createElement('div');
toast.className = className;
toast.addEventListener ('mousedown', this._onMessageMouseDown);
toast.addEventListener('mousedown', this._onMessageMouseDown);
var textNode = document.createTextNode (message);
toast.appendChild (textNode);
var textNode = document.createTextNode(message);
toast.appendChild(textNode);
this._container.appendChild (toast);
this._container.appendChild(toast);
var timeoutId = setTimeout (this._onMessageTimeout.bind (this), this.timeout * 1000);
this._timeouts.push (timeoutId);
var timeoutId = setTimeout(this._onMessageTimeout.bind(this), this.timeout * 1000);
this._timeouts.push(timeoutId);
setTimeout (this._onShowToastTimeout.bind (this, toast), 50);
setTimeout(this._onShowToastTimeout.bind(this, toast), 50);
}
,_onShowToastTimeout: function (toast)
{
Vn.Node.addClass (toast, 'show');
,_onShowToastTimeout: function(toast) {
Vn.Node.addClass(toast, 'show');
}
,_onMessageTimeout: function ()
{
,_onMessageTimeout: function() {
if (!this._container)
return;
var nodes = this._container.childNodes;
if (nodes.length > 0)
{
clearTimeout (this._timeouts.shift ());
Vn.Node.remove (nodes[0]);
if (nodes.length > 0) {
clearTimeout(this._timeouts.shift());
Vn.Node.remove(nodes[0]);
}
if (nodes.length == 0)
this.hide ();
this.hide();
}
,_onMessageMouseDown: function (event)
{
event.stopPropagation ();
,_onMessageMouseDown: function(event) {
event.stopPropagation();
}
};

2
js/sql/batch.js
View File

@ -4,7 +4,7 @@ var Value = require('./value');
/**
* A map container for many Sql.Object
**/
*/
module.exports = new Class
({
Extends: Object

Some files were not shown because too many files have changed in this diff Show More