mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-25 10:09:20 +03:00
Added knockoutjs components
Added material design checkbox component Added lang changing animation
This commit is contained in:
parent
c2b7632c13
commit
1423b88839
48 changed files with 1213 additions and 256 deletions
|
|
@ -58,14 +58,14 @@
|
|||
<div class="control-group">
|
||||
<button type="submit" class="btn btn-large span4 buttonLogin" data-bind="command: submitCommand">
|
||||
<i class="icon-spinner animated" data-bind="visible: submitRequest"></i>
|
||||
<span class="i18n" data-i18n-text="LOGIN/BUTTON_SIGN_IN" data-bind="visible: !submitRequest()"></span>
|
||||
<span class="i18n i18n-animation" data-i18n-text="LOGIN/BUTTON_SIGN_IN" data-bind="visible: !submitRequest()"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="pull-left signMeLabel" data-bind="click: function () { signMe(!signMe()); }, visible: signMeVisibility">
|
||||
<i data-bind="css: signMe() ? 'checkboxSignMe icon-checkbox-checked' : 'checkboxSignMe icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="LOGIN/LABEL_SIGN_ME"></span>
|
||||
<span class="i18n i18n-animation" data-i18n-text="LOGIN/LABEL_SIGN_ME"></span>
|
||||
</label>
|
||||
<div class="pull-right">
|
||||
<div class="btn-group dropdown" data-bind="registrateBootstrapDropdown: true, visible: socialLoginEnabled() || allowLanguagesOnLogin()">
|
||||
|
|
|
|||
|
|
@ -69,21 +69,27 @@
|
|||
<label class="control-label">
|
||||
</label>
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { unseen(!unseen()); }">
|
||||
<i data-bind="css: unseen() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SEARCH/LABEL_ADV_UNSEEN"></span>
|
||||
</label>
|
||||
<label data-bind="click: function () { starred(!starred()); }">
|
||||
<i data-bind="css: starred() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SEARCH/LABEL_ADV_FLAGGED"></span>
|
||||
</label>
|
||||
<label data-bind="click: function () { hasAttachment(!hasAttachment()); }">
|
||||
<i data-bind="css: hasAttachment() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SEARCH/LABEL_ADV_HAS_ATTACHMENT"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SEARCH/LABEL_ADV_UNSEEN',
|
||||
value: unseen
|
||||
}
|
||||
}"></div>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SEARCH/LABEL_ADV_FLAGGED',
|
||||
value: starred
|
||||
}
|
||||
}"></div>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SEARCH/LABEL_ADV_HAS_ATTACHMENT',
|
||||
value: hasAttachment
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -15,16 +15,20 @@
|
|||
<br />
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { sign(!sign()); }">
|
||||
<i data-bind="css: sign() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="POPUPS_COMPOSE_OPEN_PGP/LABEL_SIGN"></span>
|
||||
</label>
|
||||
<label data-bind="click: function () { encrypt(!encrypt()); }">
|
||||
<i data-bind="css: encrypt() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="POPUPS_COMPOSE_OPEN_PGP/LABEL_ENCRYPT"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'POPUPS_COMPOSE_OPEN_PGP/LABEL_SIGN',
|
||||
value: sign
|
||||
}
|
||||
}"></div>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'POPUPS_COMPOSE_OPEN_PGP/LABEL_ENCRYPT',
|
||||
value: encrypt
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
|
|
|
|||
|
|
@ -41,17 +41,21 @@
|
|||
<hr />
|
||||
<div data-bind="template: {'name': actionTemplate()}"></div>
|
||||
|
||||
<label data-bind="visible: actionMarkAsReadVisiblity, click: function () { actionMarkAsRead(!actionMarkAsRead()); }">
|
||||
<i data-bind="css: actionMarkAsRead() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span>Mark as read</span>
|
||||
</label>
|
||||
<div data-bind="visible: actionMarkAsReadVisiblity, component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'Mark as read',
|
||||
value: actionMarkAsRead
|
||||
}
|
||||
}"></div>
|
||||
|
||||
<label data-bind="click: function () { actionSkipOtherFilters(!actionSkipOtherFilters()); }">
|
||||
<i data-bind="css: actionSkipOtherFilters() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span>Skip other filters</span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'Skip other filters',
|
||||
value: actionSkipOtherFilters
|
||||
actionSkipOtherFilters
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,11 +5,13 @@
|
|||
</div>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { contactsAutosave(!contactsAutosave()); }">
|
||||
<i data-bind="css: contactsAutosave() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_CONTACTS/LABEL_CONTACTS_AUTOSAVE"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SETTINGS_CONTACTS/LABEL_CONTACTS_AUTOSAVE',
|
||||
value: contactsAutosave
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -20,11 +22,13 @@
|
|||
</div>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { enableContactsSync(!enableContactsSync()); }">
|
||||
<i data-bind="css: enableContactsSync() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_CONTACTS/LABEL_CONTACTS_SYNC_ENABLE"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SETTINGS_CONTACTS/LABEL_CONTACTS_SYNC_ENABLE',
|
||||
value: enableContactsSync
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="b-settings-general g-ui-user-select-none">
|
||||
<div class="form-horizontal">
|
||||
<div class="legend">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LEGEND_GENERAL"></span>
|
||||
<span class="i18n i18n-animation" data-i18n-text="SETTINGS_GENERAL/LEGEND_GENERAL"></span>
|
||||
</div>
|
||||
<div class="control-group" data-bind="visible: allowLanguagesOnSettings">
|
||||
<label class="control-label">
|
||||
|
|
@ -26,24 +26,22 @@
|
|||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_EDITOR"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<label for="richTextEditorTypeID1">
|
||||
<input type="radio" id="richTextEditorTypeID1" name="richTextEditorType" value="Html" data-bind="checked: editorDefaultType" style="position: absolute; left: -10000px" />
|
||||
<i data-bind="css: 'Html' === editorDefaultType() ? ' icon-radio-checked' : 'icon-radio-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_EDITOR_HTML_AS_DEFAULT"></span>
|
||||
</label>
|
||||
<label for="richTextEditorTypeID2">
|
||||
<input type="radio" id="richTextEditorTypeID2" name="richTextEditorType" value="Plain" data-bind="checked: editorDefaultType" style="position: absolute; left: -10000px" />
|
||||
<i data-bind="css: 'Plain' === editorDefaultType() ? ' icon-radio-checked' : 'icon-radio-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_EDITOR_PLAIN_AS_DEFAULT"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Radio',
|
||||
params: {
|
||||
value: editorDefaultType,
|
||||
values: {
|
||||
'Html': 'SETTINGS_GENERAL/LABEL_EDITOR_HTML_AS_DEFAULT',
|
||||
'Plain': 'SETTINGS_GENERAL/LABEL_EDITOR_PLAIN_AS_DEFAULT'
|
||||
}
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-horizontal">
|
||||
<div class="legend">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_VIEW_OPTIONS"></span>
|
||||
<span class="i18n i18n-animation" data-i18n-text="SETTINGS_GENERAL/LABEL_VIEW_OPTIONS"></span>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
|
|
@ -102,17 +100,24 @@
|
|||
</div>
|
||||
<div class="form-horizontal" data-bind="visible: isDesktopNotificationsSupported()">
|
||||
<div class="legend">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_CHROME_NOTIFICATION"></span>
|
||||
<span class="i18n i18n-animation" data-i18n-text="SETTINGS_GENERAL/LABEL_CHROME_NOTIFICATION"></span>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<div data-bind="visible: isDesktopNotificationsSupported">
|
||||
<label data-bind="css: { 'denied-by-browser': isDesktopNotificationsDenied }, click: function () { if (!isDesktopNotificationsDenied()) { useDesktopNotifications(!useDesktopNotifications()); }}">
|
||||
<i data-bind="css: useDesktopNotifications() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n notification-desc" data-i18n-text="SETTINGS_GENERAL/LABEL_CHROME_NOTIFICATION_DESC"></span>
|
||||
<span class="i18n notification-desc-denied" data-i18n-text="SETTINGS_GENERAL/LABEL_CHROME_NOTIFICATION_DESC_DENIED"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SETTINGS_GENERAL/LABEL_CHROME_NOTIFICATION_DESC',
|
||||
value: useDesktopNotifications,
|
||||
disable: isDesktopNotificationsDenied,
|
||||
inline: true
|
||||
}
|
||||
}"></div>
|
||||
|
||||
<span data-bind="visible: isDesktopNotificationsDenied">
|
||||
<span class="i18n" style="color: #999" data-i18n-text="SETTINGS_GENERAL/LABEL_CHROME_NOTIFICATION_DESC_DENIED"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,9 +8,16 @@
|
|||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITIES/LABEL_DEFAULT"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<select data-bind="options: identitiesOptions, value: defaultIdentityID,
|
||||
optionsText: 'name', optionsValue: 'id', optionsAfterRender: $root.defautOptionsAfterRender, saveTrigger: defaultIdentityIDTrigger"></select>
|
||||
<div data-bind="saveTrigger: defaultIdentityIDTrigger"></div>
|
||||
<div data-bind="component: {
|
||||
name: 'Select',
|
||||
params: {
|
||||
options: identitiesOptions,
|
||||
value: defaultIdentityID,
|
||||
optionsText: 'name',
|
||||
optionsValue: 'id',
|
||||
trigger: defaultIdentityIDTrigger
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group g-ui-user-select-none">
|
||||
|
|
@ -18,38 +25,52 @@
|
|||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITIES/LABEL_DISPLAY_NAME"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<input type="text" class="input-xlarge"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-bind="value: displayName, saveTrigger: displayNameTrigger" />
|
||||
<div data-bind="saveTrigger: displayNameTrigger"></div>
|
||||
<div data-bind="component: {
|
||||
name: 'Input',
|
||||
params: {
|
||||
value: displayName,
|
||||
size: 4,
|
||||
trigger: displayNameTrigger
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group g-ui-user-select-none" style="display: none">
|
||||
<!-- <div class="control-group g-ui-user-select-none" style="display: none">
|
||||
<label class="control-label">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITIES/LABEL_REPLY_TO"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<input type="text" class="input-xlarge"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-bind="value: replyTo" />
|
||||
<div data-bind="component: {
|
||||
name: 'Input',
|
||||
params: {
|
||||
value: replyTo,
|
||||
size: 4
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
<div class="control-group">
|
||||
<label class="control-label g-ui-user-select-none">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITIES/LABEL_SIGNATURE"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<div class="e-signature-place" data-bind="initDom: signatureDom"></div>
|
||||
<div style="vertical-align: top;" data-bind="saveTrigger: signatureTrigger"></div>
|
||||
|
||||
<div data-bind="component: {
|
||||
name: 'SaveTrigger',
|
||||
params: { value: signatureTrigger, verticalAlign: 'top' }
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group g-ui-user-select-none">
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { signatureToAll(!signatureToAll()); }">
|
||||
<i data-bind="css: signatureToAll() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITIES/LABEL_ADD_SIGNATURE_TO_ALL"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SETTINGS_IDENTITIES/LABEL_ADD_SIGNATURE_TO_ALL',
|
||||
value: signatureToAll
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,38 +8,52 @@
|
|||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITY/LABEL_DISPLAY_NAME"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<input type="text" class="input-xlarge"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-bind="value: displayName, saveTrigger: displayNameTrigger" />
|
||||
<div data-bind="saveTrigger: displayNameTrigger"></div>
|
||||
<div data-bind="component: {
|
||||
name: 'Input',
|
||||
params: {
|
||||
value: displayName,
|
||||
size: 4,
|
||||
trigger: displayNameTrigger
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group g-ui-user-select-none" style="display: none">
|
||||
<!-- <div class="control-group g-ui-user-select-none" style="display: none">
|
||||
<label class="control-label">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITY/LABEL_REPLY_TO"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<input type="text" class="input-xlarge"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-bind="value: replyTo" />
|
||||
<div data-bind="component: {
|
||||
name: 'Input',
|
||||
params: {
|
||||
value: replyTo,
|
||||
size: 4
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
<div class="control-group">
|
||||
<label class="control-label g-ui-user-select-none">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITY/LABEL_SIGNATURE"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<div class="e-signature-place" data-bind="initDom: signatureDom"></div>
|
||||
<div style="vertical-align: top;" data-bind="saveTrigger: signatureTrigger"></div>
|
||||
|
||||
<div data-bind="component: {
|
||||
name: 'SaveTrigger',
|
||||
params: { value: signatureTrigger, verticalAlign: 'top' }
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group g-ui-user-select-none">
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { signatureToAll(!signatureToAll()); }">
|
||||
<i data-bind="css: signatureToAll() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_IDENTITIES/LABEL_ADD_SIGNATURE_TO_ALL"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SETTINGS_IDENTITIES/LABEL_ADD_SIGNATURE_TO_ALL',
|
||||
value: signatureToAll
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<a class="btn button-back" data-bind="click: backToMailBoxClick">
|
||||
<i class="icon-left"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_LABELS/BUTTON_BACK"></span>
|
||||
<span class="i18n i18n-animation" data-i18n-text="SETTINGS_LABELS/BUTTON_BACK"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,11 +5,13 @@
|
|||
</div>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<label data-bind="click: function () { viewEnable(!viewEnable()); }">
|
||||
<i data-bind="css: viewEnable() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
|
||||
|
||||
<span class="i18n" data-i18n-text="SETTINGS_SECURITY/LABEL_ENABLE_TWO_FACTOR"></span>
|
||||
</label>
|
||||
<div data-bind="component: {
|
||||
name: 'Checkbox',
|
||||
params: {
|
||||
label: 'SETTINGS_SECURITY/LABEL_ENABLE_TWO_FACTOR',
|
||||
value: viewEnable
|
||||
}
|
||||
}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue