Sieve Filters (Interface first look)

Code refactoring
Small fixes

dev/Common/Enums.js

@@ -303,9 +303,10 @@ Enums.FilterConditionType = {
  * @enum {string}
  */
 Enums.FiltersAction = {
+	'None': 'None',
 	'Move': 'Move',
-	'Delete': 'Delete',
-	'Forward': 'Forward'
+	'Discard': 'Discard',
+	'Forward': 'Forward',
 };
 
 /**
@@ -313,8 +314,7 @@ Enums.FiltersAction = {
  */
 Enums.FilterRulesType = {
 	'And': 'And',
-	'Or': 'Or',
-	'All': 'All'
+	'Or': 'Or'
 };
 
 /**

dev/Models/FilterActionModel.js

@@ -1,50 +0,0 @@
-/* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
-
-/**
- * @constructor
- */
-function FilterActionModel(oKoList, oKoCanBeDeleted)
-{
-	this.parentList = oKoList;
-	this.canBeDeleted = oKoCanBeDeleted;
-
-	this.value = ko.observable('');
-
-	this.type = ko.observable(Enums.FiltersAction.Move);
-	this.typeOptions = [ // TODO i18n
-		{'id': Enums.FiltersAction.Move, 'name': 'Move to'},
-		{'id': Enums.FiltersAction.Forward, 'name': 'Forward to'},
-		{'id': Enums.FiltersAction.Delete, 'name': 'Discard'},
-		{'id': Enums.FiltersAction.MarkAsRead, 'name': 'Mark as read'}
-	];
-
-	this.template = ko.computed(function () {
-
-		var sTemplate = '';
-		switch (this.type())
-		{
-			default:
-			case Enums.FiltersAction.Move:
-				sTemplate = 'SettingsFiltersActionValueAsFolders';
-				break;
-			case Enums.FiltersAction.Forward:
-				sTemplate = 'SettingsFiltersActionWithValue';
-				break;
-			case Enums.FiltersAction.MarkAsRead:
-			case Enums.FiltersAction.Delete:
-				sTemplate = 'SettingsFiltersActionNoValue';
-				break;
-		}
-
-		return sTemplate;
-
-	}, this);
-}
-
-FilterActionModel.prototype.removeSelf = function ()
-{
-	if (this.canBeDeleted())
-	{
-		this.parentList.remove(this);
-	}
-};

dev/Models/FilterConditionModel.js

@@ -3,25 +3,26 @@
 /**
  * @constructor
  */
-function FilterConditionModel(oKoList, oKoCanBeDeleted)
+function FilterConditionModel(oKoList)
 {
 	this.parentList = oKoList;
-	this.canBeDeleted = oKoCanBeDeleted;
 
-	this.field = ko.observable(Enums.FilterConditionField.Subject);
+	this.field = ko.observable(Enums.FilterConditionField.From);
+
 	this.fieldOptions = [ // TODO i18n
-		{'id': Enums.FilterConditionField.Subject, 'name': 'Subject'},
-		{'id': Enums.FilterConditionField.Recipient, 'name': 'Recipient (To or CC)'},
 		{'id': Enums.FilterConditionField.From, 'name': 'From'},
-		{'id': Enums.FilterConditionField.To, 'name': 'To'}
+		{'id': Enums.FilterConditionField.Recipient, 'name': 'Recipient (To or CC)'},
+		{'id': Enums.FilterConditionField.To, 'name': 'To'},
+		{'id': Enums.FilterConditionField.Subject, 'name': 'Subject'}
 	];
 
-	this.type = ko.observable(Enums.FilterConditionType.Contains);
+	this.type = ko.observable(Enums.FilterConditionType.EqualTo);
+	
 	this.typeOptions = [ // TODO i18n
-		{'id': Enums.FilterConditionType.Contains, 'name': 'Contains'},
-		{'id': Enums.FilterConditionType.NotContains, 'name': 'Not Contains'},
 		{'id': Enums.FilterConditionType.EqualTo, 'name': 'Equal To'},
-		{'id': Enums.FilterConditionType.NotEqualTo, 'name': 'Not Equal To'}
+		{'id': Enums.FilterConditionType.NotEqualTo, 'name': 'Not Equal To'},
+		{'id': Enums.FilterConditionType.Contains, 'name': 'Contains'},
+		{'id': Enums.FilterConditionType.NotContains, 'name': 'Not Contains'}
 	];
 
 	this.value = ko.observable('');
@@ -42,9 +43,6 @@ function FilterConditionModel(oKoList, oKoCanBeDeleted)
 }
 
 FilterConditionModel.prototype.removeSelf = function ()
-{
-	if (this.canBeDeleted())
 {
 	this.parentList.remove(this);
-	}
 };

dev/Models/FilterModel.js

@@ -5,6 +5,7 @@
  */
 function FilterModel()
 {
+	this.new = ko.observable(true);
 	this.enabled = ko.observable(true);
 
 	this.name = ko.observable('');
@@ -12,33 +13,56 @@ function FilterModel()
 	this.conditionsType = ko.observable(Enums.FilterRulesType.And);
 
 	this.conditions = ko.observableArray([]);
-	this.actions = ko.observableArray([]);
 
 	this.conditions.subscribe(function () {
 		Utils.windowResize();
 	});
 
-	this.actions.subscribe(function () {
-		Utils.windowResize();
-	});
+	// Actions
+	this.actionMarkAsRead = ko.observable(false);
+	this.actionSkipOtherFilters = ko.observable(true);
+	this.actionValue = ko.observable('');
 
-	this.conditionsCanBeDeleted = ko.computed(function () {
-		return 1 < this.conditions().length;
+	this.actionType = ko.observable(Enums.FiltersAction.Move);
+	this.actionTypeOptions = [ // TODO i18n
+		{'id': Enums.FiltersAction.None, 'name': 'Action - None'},
+		{'id': Enums.FiltersAction.Move, 'name': 'Action - Move to'},
+//		{'id': Enums.FiltersAction.Forward, 'name': 'Action - Forward to'},
+		{'id': Enums.FiltersAction.Discard, 'name': 'Action - Discard'}
+	];
+
+	this.actionMarkAsReadVisiblity = ko.computed(function () {
+		return -1 < Utils.inArray(this.actionType(), [
+			Enums.FiltersAction.None, Enums.FiltersAction.Forward, Enums.FiltersAction.Move
+		]);
 	}, this);
 
-	this.actionsCanBeDeleted = ko.computed(function () {
-		return 1 < this.actions().length;
+	this.actionTemplate = ko.computed(function () {
+
+		var sTemplate = '';
+		switch (this.actionType())
+		{
+			default:
+			case Enums.FiltersAction.Move:
+				sTemplate = 'SettingsFiltersActionValueAsFolders';
+				break;
+			case Enums.FiltersAction.Forward:
+				sTemplate = 'SettingsFiltersActionWithValue';
+				break;
+			case Enums.FiltersAction.None:
+			case Enums.FiltersAction.Discard:
+				sTemplate = 'SettingsFiltersActionNoValue';
+				break;
+		}
+
+		return sTemplate;
+
 	}, this);
 }
 
 FilterModel.prototype.addCondition = function ()
 {
-	this.conditions.push(new FilterConditionModel(this.conditions, this.conditionsCanBeDeleted));
-};
-
-FilterModel.prototype.addAction = function ()
-{
-	this.actions.push(new FilterActionModel(this.actions, this.actionsCanBeDeleted));
+	this.conditions.push(new FilterConditionModel(this.conditions));
 };
 
 FilterModel.prototype.parse = function (oItem)

dev/Settings/Filters.js

@@ -28,9 +28,5 @@ SettingsFilters.prototype.deleteFilter = function (oFilter)
 
 SettingsFilters.prototype.addFilter = function ()
 {
-	var oFilter = new FilterModel();
-	oFilter.addCondition();
-	oFilter.addAction();
-
-	this.filters.push(oFilter);
+	kn.showScreenPopup(PopupsFilterViewModel, [new FilterModel()]);
 };

dev/Styles/@Main.less

@@ -60,6 +60,7 @@
 @import "FolderClear.less";
 @import "FolderCreate.less";
 @import "FolderSystem.less";
+@import "Filter.less";
 @import "Languages.less";
 @import "AddAccount.less";
 @import "OpenPgpKey.less";

dev/Styles/Filter.less

@@ -0,0 +1,10 @@
+.popups {
+	.b-filter-content {
+
+		width: 800px;
+
+		.modal-header {
+			background-color: #fff;
+		}
+	}
+}

dev/ViewModels/Popups/PopupsFiterViewModel.js

@@ -0,0 +1,37 @@
+/* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
+
+/**
+ * @constructor
+ * @extends KnoinAbstractViewModel
+ */
+function PopupsFilterViewModel()
+{
+	KnoinAbstractViewModel.call(this, 'Popups', 'PopupsFilter');
+
+	this.filter = ko.observable(null);
+
+	this.selectedFolderValue = ko.observable(Consts.Values.UnuseOptionValue);
+	this.folderSelectList = RL.data().folderMenuForMove;
+	this.defautOptionsAfterRender = Utils.defautOptionsAfterRender;
+
+	Knoin.constructorEnd(this);
+}
+
+Utils.extendAsViewModel('PopupsFilterViewModel', PopupsFilterViewModel);
+
+PopupsFilterViewModel.prototype.clearPopup = function ()
+{
+
+};
+
+PopupsFilterViewModel.prototype.onShow = function (oFilter)
+{
+	this.clearPopup();
+
+	this.filter(oFilter);
+};
+
+PopupsFilterViewModel.prototype.onFocus = function ()
+{
+
+};

gulpfile.js

@@ -200,27 +200,27 @@ cfg.paths.js = {
 			'dev/Models/FolderModel.js',
 			'dev/Models/AccountModel.js',
 			'dev/Models/IdentityModel.js',
-			'dev/Models/FilterActionModel.js',
 			'dev/Models/FilterConditionModel.js',
 			'dev/Models/FilterModel.js',
 			'dev/Models/OpenPgpKeyModel.js',
 
-			'dev/ViewModels/PopupsFolderClearViewModel.js',
-			'dev/ViewModels/PopupsFolderCreateViewModel.js',
-			'dev/ViewModels/PopupsFolderSystemViewModel.js',
-			'dev/ViewModels/PopupsComposeViewModel.js',
-			'dev/ViewModels/PopupsContactsViewModel.js',
-			'dev/ViewModels/PopupsAdvancedSearchViewModel.js',
-			'dev/ViewModels/PopupsAddAccountViewModel.js',
-			'dev/ViewModels/PopupsAddOpenPgpKeyViewModel.js',
-			'dev/ViewModels/PopupsViewOpenPgpKeyViewModel.js',
-			'dev/ViewModels/PopupsGenerateNewOpenPgpKeyViewModel.js',
-			'dev/ViewModels/PopupsComposeOpenPgpViewModel.js',
-			'dev/ViewModels/PopupsIdentityViewModel.js',
-			'dev/ViewModels/PopupsLanguagesViewModel.js',
-			'dev/ViewModels/PopupsTwoFactorTestViewModel.js',
-			'dev/ViewModels/PopupsAskViewModel.js',
-			'dev/ViewModels/PopupsKeyboardShortcutsHelpViewModel.js',
+			'dev/ViewModels/Popups/PopupsFolderClearViewModel.js',
+			'dev/ViewModels/Popups/PopupsFolderCreateViewModel.js',
+			'dev/ViewModels/Popups/PopupsFolderSystemViewModel.js',
+			'dev/ViewModels/Popups/PopupsComposeViewModel.js',
+			'dev/ViewModels/Popups/PopupsContactsViewModel.js',
+			'dev/ViewModels/Popups/PopupsAdvancedSearchViewModel.js',
+			'dev/ViewModels/Popups/PopupsAddAccountViewModel.js',
+			'dev/ViewModels/Popups/PopupsAddOpenPgpKeyViewModel.js',
+			'dev/ViewModels/Popups/PopupsViewOpenPgpKeyViewModel.js',
+			'dev/ViewModels/Popups/PopupsGenerateNewOpenPgpKeyViewModel.js',
+			'dev/ViewModels/Popups/PopupsComposeOpenPgpViewModel.js',
+			'dev/ViewModels/Popups/PopupsIdentityViewModel.js',
+			'dev/ViewModels/Popups/PopupsLanguagesViewModel.js',
+			'dev/ViewModels/Popups/PopupsTwoFactorTestViewModel.js',
+			'dev/ViewModels/Popups/PopupsAskViewModel.js',
+			'dev/ViewModels/Popups/PopupsKeyboardShortcutsHelpViewModel.js',
+			'dev/ViewModels/Popups/PopupsFiterViewModel.js',
 
 			'dev/ViewModels/LoginViewModel.js',
 
@@ -298,11 +298,11 @@ cfg.paths.js = {
 			'dev/Models/EmailModel.js',
 			'dev/Models/ContactTagModel.js',
 
-			'dev/ViewModels/PopupsDomainViewModel.js',
-			'dev/ViewModels/PopupsPluginViewModel.js',
-			'dev/ViewModels/PopupsActivateViewModel.js',
-			'dev/ViewModels/PopupsLanguagesViewModel.js',
-			'dev/ViewModels/PopupsAskViewModel.js',
+			'dev/ViewModels/Popups/PopupsDomainViewModel.js',
+			'dev/ViewModels/Popups/PopupsPluginViewModel.js',
+			'dev/ViewModels/Popups/PopupsActivateViewModel.js',
+			'dev/ViewModels/Popups/PopupsLanguagesViewModel.js',
+			'dev/ViewModels/Popups/PopupsAskViewModel.js',
 
 			'dev/ViewModels/AdminLoginViewModel.js',
 
@@ -592,7 +592,7 @@ gulp.task('rainloop+', ['rainloop', 'package-inc-release']);
 gulp.task('owncloud', ['rainloop:owncloud:copy', 'rainloop:owncloud:setup', 'rainloop:owncloud:zip', 'rainloop:owncloud:md5', 'rainloop:owncloud:clean']);
 
 //WATCH
-gulp.task('watch', function() {
+gulp.task('watch', ['fast'], function() {
 	gulp.watch(cfg.paths.js.app.src, {interval: 1000}, ['js:app']);
 	gulp.watch(cfg.paths.js.admin.src, {interval: 1000}, ['js:admin']);
 	gulp.watch(cfg.paths.less.main.watch, {interval: 1000}, ['css:main']);

rainloop/v/0.0.0/app/templates/Views/App/PopupsFilter.html

@@ -0,0 +1,67 @@
+<div class="popups">
+	<div class="modal hide b-filter-content g-ui-user-select-none" data-bind="modal: modalVisibility">
+		<div>
+			<div class="modal-header">
+				<button type="button" class="close" data-bind="command: cancelCommand">&times;</button>
+				<h3>
+					<span class="i18n" data-i18n-text="POPUPS_CREATE_FOLDER/TITLE_CREATE_FOLDER"></span>
+				</h3>
+			</div>
+			<div class="modal-body">
+				<div class="row filter" data-bind="with: filter">
+					<div class="span9">
+						<br />
+						<input type="text" class="span4" data-bind="value: name" placeholder="Description" />
+						<hr />
+						<div>
+							<a class="btn" data-bind="click: addCondition">
+								<i class="icon-plus"></i>
+								&nbsp;&nbsp;
+								<span class="i18n" data-i18n-text="SETTINGS_FILTERS/BUTTON_ADD_CONDITION"></span>
+							</a>
+							<br />
+							<br />
+							<div data-bind="visible: 1 < conditions().length">
+								<select class="span4" data-bind="value: conditionsType">
+									<option value="And">
+										Matching all of the following rules
+									</option>
+									<option value="Or">
+										Matching any of the following rules
+									</option>
+								</select>
+							</div>
+							<div data-bind="visible: 0 < conditions().length, foreach: conditions">
+								<div data-bind="template: {'name': template(), 'data': $data}"></div>
+							</div>
+							<div data-bind="visible: 0 === conditions().length">
+								All messages
+							</div>
+						</div>
+						<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>
+							&nbsp;&nbsp;
+							<span>Mark as read</span>
+						</label>
+
+						<label data-bind="click: function () { actionSkipOtherFilters(!actionSkipOtherFilters()); }">
+							<i data-bind="css: actionSkipOtherFilters() ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked'"></i>
+							&nbsp;&nbsp;
+							<span>Skip other filters</span>
+						</label>
+					</div>
+				</div>
+			</div>
+			<div class="modal-footer">
+				<a class="btn buttonSave">
+					<i class="icon-folder-add"></i>
+					&nbsp;&nbsp;
+					<span class="i18n" data-i18n-text="POPUPS_CREATE_FOLDER/BUTTON_CREATE"></span>
+				</a>
+			</div>
+		</div>
+	</div>
+</div>

rainloop/v/0.0.0/app/templates/Views/App/SettingsFilters.html

@@ -6,60 +6,8 @@
 	</div>
 	<div class="row">
 		<div data-bind="foreach: filters, i18nUpdate: filters">
-			<div class="filter span12 pull-left" style="background-color: #eee; padding: 15px; border-radius: 4px">
-
-				<input type="text" data-bind="value: name" placeholder="Description:" />
-
+			<span  data-bind="text: name" ></span>
 			<br />
-
-				<label class="radio inline">
-					<input type="radio" name="conditionsType" value="And" data-bind="checked: conditionsType" />
-					Matching all of the following rules
-				</label>
-				<label class="radio inline">
-					<input type="radio" name="conditionsType" value="Or" data-bind="checked: conditionsType" />
-					Matching any of the  following rules
-				</label>
-				<label class="radio inline">
-					<input type="radio" name="conditionsType" value="All" data-bind="checked: conditionsType" />
-					All messages
-				</label>
-
-				<hr />
-
-				<div>
-					<a class="btn" data-bind="click: addCondition">
-						<i class="icon-plus"></i>
-						&nbsp;&nbsp;
-						<span class="i18n" data-i18n-text="SETTINGS_FILTERS/BUTTON_ADD_CONDITION"></span>
-					</a>
-					<br />
-					<br />
-					<div data-bind="foreach: conditions">
-						<div data-bind="template: {'name': template(), 'data': $data}"></div>
-					</div>
-				</div>
-				<hr />
-				<div>
-					<a class="btn" data-bind="click: addAction">
-						<i class="icon-plus"></i>
-						&nbsp;&nbsp;
-						<span class="i18n" data-i18n-text="SETTINGS_FILTERS/BUTTON_ADD_ACTION"></span>
-					</a>
-					<br />
-					<br />
-					<div data-bind="foreach: actions">
-						<div data-bind="template: {'name': template(), 'data': $data}"></div>
-					</div>
-				</div>
-				<hr />
-				<a class="btn" data-bind="click: function (oFilter) { $parent.deleteFilter(oFilter); }">
-					<i class="icon-trash"></i>
-					&nbsp;&nbsp;
-					<span class="i18n" data-i18n-text="SETTINGS_FILTERS/BUTTON_DELETE_FILTER"></span>
-				</a>
-				<br />
-			</div>
 		</div>
 	</div>
 	<br />

rainloop/v/0.0.0/app/templates/Views/App/SettingsFiltersActionNoValue.html

@@ -1,4 +1 @@
-<select data-bind="options: typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
-<span class="delete-action pull-right" data-bind="visible: canBeDeleted, click: removeSelf">
-	<i class="icon-trash"></i>
-</span>
+<select data-bind="options: actionTypeOptions, value: actionType, optionsText: 'name', optionsValue: 'id'"></select>

rainloop/v/0.0.0/app/templates/Views/App/SettingsFiltersActionValueAsFolders.html

@@ -1,5 +1,4 @@
-<select data-bind="options: typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
-Folders
-<span class="delete-action pull-right" data-bind="visible: canBeDeleted, click: removeSelf">
-	<i class="icon-trash"></i>
-</span>
+<select data-bind="options: actionTypeOptions, value: actionType, optionsText: 'name', optionsValue: 'id'"></select>
+&nbsp;
+<select data-bind="options: $root.folderSelectList, value: $root.selectedFolderValue,
+	optionsText: 'name', optionsValue: 'id', optionsAfterRender: $root.defautOptionsAfterRender"></select>

rainloop/v/0.0.0/app/templates/Views/App/SettingsFiltersActionWithValue.html

@@ -1,5 +1,3 @@
-<select data-bind="options: typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
-<input type="text" data-bind="value: value" />
-<span class="delete-action pull-right" data-bind="visible: canBeDeleted, click: removeSelf">
-	<i class="icon-trash"></i>
-</span>
+<select data-bind="options: actionTypeOptions, value: actionType, optionsText: 'name', optionsValue: 'id'"></select>
+&nbsp;
+<input type="text" data-bind="value: actionValue" />

rainloop/v/0.0.0/app/templates/Views/App/SettingsFiltersConditionDefault.html

@@ -1,6 +1,9 @@
-<select data-bind="options: fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select>
-<select data-bind="options: typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
-<input type="text" data-bind="value: value" />
-<span class="delete-action pull-right" data-bind="visible: canBeDeleted, click: removeSelf">
+<select class="span3" data-bind="options: fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select>
+&nbsp;
+<select class="span2" data-bind="options: typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
+&nbsp;
+<input class="span3" type="text" data-bind="value: value" />
+&nbsp;
+<span class="delete-action pull-right" data-bind="click: removeSelf">
 	<i class="icon-trash"></i>
 </span>

rainloop/v/0.0.0/langs/en.ini

@@ -363,7 +363,6 @@ LEGEND_FILTERS = "Filters"
 BUTTON_ADD_FILTER = "Add Filter"
 BUTTON_DELETE_FILTER = "Delete Filter"
 BUTTON_ADD_CONDITION = "Add Condition"
-BUTTON_ADD_ACTION = "Add Action"
 
 [SETTINGS_IDENTITY]
 LEGEND_IDENTITY = "Identity"

rainloop/v/0.0.0/langs/pl.ini

@@ -362,7 +362,6 @@ LEGEND_FILTERS = "Filtry"
 BUTTON_ADD_FILTER = "Dodaj filter"
 BUTTON_DELETE_FILTER = "Usuń filter"
 BUTTON_ADD_CONDITION = "Dodaj warunek"
-BUTTON_ADD_ACTION = "Dodaj działanie"
 
 [SETTINGS_IDENTITY]
 LEGEND_IDENTITY = "Tożsamość"

rainloop/v/0.0.0/static/css/app.css

@@ -7502,6 +7502,12 @@ html.rl-left-panel-disabled .btn.buttonContacts {
 .popups .b-folder-system-content .modal-header {
   background-color: #fff;
 }
+.popups .b-filter-content {
+  width: 800px;
+}
+.popups .b-filter-content .modal-header {
+  background-color: #fff;
+}
 .popups .b-languages-content.modal {
   width: 700px;
 }

rainloop/v/0.0.0/static/js/admin.js

@@ -674,9 +674,10 @@ Enums.FilterConditionType = {
  * @enum {string}
  */
 Enums.FiltersAction = {
+	'None': 'None',
 	'Move': 'Move',
-	'Delete': 'Delete',
-	'Forward': 'Forward'
+	'Discard': 'Discard',
+	'Forward': 'Forward',
 };
 
 /**
@@ -684,8 +685,7 @@ Enums.FiltersAction = {
  */
 Enums.FilterRulesType = {
 	'And': 'And',
-	'Or': 'Or',
-	'All': 'All'
+	'Or': 'Or'
 };
 
 /**

rainloop/v/0.0.0/static/js/app.js

@@ -677,9 +677,10 @@ Enums.FilterConditionType = {
  * @enum {string}
  */
 Enums.FiltersAction = {
+	'None': 'None',
 	'Move': 'Move',
-	'Delete': 'Delete',
-	'Forward': 'Forward'
+	'Discard': 'Discard',
+	'Forward': 'Forward',
 };
 
 /**
@@ -687,8 +688,7 @@ Enums.FiltersAction = {
  */
 Enums.FilterRulesType = {
 	'And': 'And',
-	'Or': 'Or',
-	'All': 'All'
+	'Or': 'Or'
 };
 
 /**
@@ -8511,75 +8511,26 @@ IdentityModel.prototype.formattedNameForEmail = function ()
 /**
  * @constructor
  */
-function FilterActionModel(oKoList, oKoCanBeDeleted)
+function FilterConditionModel(oKoList)
 {
 	this.parentList = oKoList;
-	this.canBeDeleted = oKoCanBeDeleted;
 
-	this.value = ko.observable('');
+	this.field = ko.observable(Enums.FilterConditionField.From);
 
-	this.type = ko.observable(Enums.FiltersAction.Move);
-	this.typeOptions = [ // TODO i18n
-		{'id': Enums.FiltersAction.Move, 'name': 'Move to'},
-		{'id': Enums.FiltersAction.Forward, 'name': 'Forward to'},
-		{'id': Enums.FiltersAction.Delete, 'name': 'Discard'},
-		{'id': Enums.FiltersAction.MarkAsRead, 'name': 'Mark as read'}
-	];
-
-	this.template = ko.computed(function () {
-
-		var sTemplate = '';
-		switch (this.type())
-		{
-			default:
-			case Enums.FiltersAction.Move:
-				sTemplate = 'SettingsFiltersActionValueAsFolders';
-				break;
-			case Enums.FiltersAction.Forward:
-				sTemplate = 'SettingsFiltersActionWithValue';
-				break;
-			case Enums.FiltersAction.MarkAsRead:
-			case Enums.FiltersAction.Delete:
-				sTemplate = 'SettingsFiltersActionNoValue';
-				break;
-		}
-
-		return sTemplate;
-
-	}, this);
-}
-
-FilterActionModel.prototype.removeSelf = function ()
-{
-	if (this.canBeDeleted())
-	{
-		this.parentList.remove(this);
-	}
-};
-/* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
-
-/**
- * @constructor
- */
-function FilterConditionModel(oKoList, oKoCanBeDeleted)
-{
-	this.parentList = oKoList;
-	this.canBeDeleted = oKoCanBeDeleted;
-
-	this.field = ko.observable(Enums.FilterConditionField.Subject);
 	this.fieldOptions = [ // TODO i18n
-		{'id': Enums.FilterConditionField.Subject, 'name': 'Subject'},
-		{'id': Enums.FilterConditionField.Recipient, 'name': 'Recipient (To or CC)'},
 		{'id': Enums.FilterConditionField.From, 'name': 'From'},
-		{'id': Enums.FilterConditionField.To, 'name': 'To'}
+		{'id': Enums.FilterConditionField.Recipient, 'name': 'Recipient (To or CC)'},
+		{'id': Enums.FilterConditionField.To, 'name': 'To'},
+		{'id': Enums.FilterConditionField.Subject, 'name': 'Subject'}
 	];
 
-	this.type = ko.observable(Enums.FilterConditionType.Contains);
+	this.type = ko.observable(Enums.FilterConditionType.EqualTo);
+	
 	this.typeOptions = [ // TODO i18n
-		{'id': Enums.FilterConditionType.Contains, 'name': 'Contains'},
-		{'id': Enums.FilterConditionType.NotContains, 'name': 'Not Contains'},
 		{'id': Enums.FilterConditionType.EqualTo, 'name': 'Equal To'},
-		{'id': Enums.FilterConditionType.NotEqualTo, 'name': 'Not Equal To'}
+		{'id': Enums.FilterConditionType.NotEqualTo, 'name': 'Not Equal To'},
+		{'id': Enums.FilterConditionType.Contains, 'name': 'Contains'},
+		{'id': Enums.FilterConditionType.NotContains, 'name': 'Not Contains'}
 	];
 
 	this.value = ko.observable('');
@@ -8600,11 +8551,8 @@ function FilterConditionModel(oKoList, oKoCanBeDeleted)
 }
 
 FilterConditionModel.prototype.removeSelf = function ()
-{
-	if (this.canBeDeleted())
 {
 	this.parentList.remove(this);
-	}
 };
 
 /* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
@@ -8614,6 +8562,7 @@ FilterConditionModel.prototype.removeSelf = function ()
  */
 function FilterModel()
 {
+	this.new = ko.observable(true);
 	this.enabled = ko.observable(true);
 
 	this.name = ko.observable('');
@@ -8621,33 +8570,56 @@ function FilterModel()
 	this.conditionsType = ko.observable(Enums.FilterRulesType.And);
 
 	this.conditions = ko.observableArray([]);
-	this.actions = ko.observableArray([]);
 
 	this.conditions.subscribe(function () {
 		Utils.windowResize();
 	});
 
-	this.actions.subscribe(function () {
-		Utils.windowResize();
-	});
+	// Actions
+	this.actionMarkAsRead = ko.observable(false);
+	this.actionSkipOtherFilters = ko.observable(true);
+	this.actionValue = ko.observable('');
 
-	this.conditionsCanBeDeleted = ko.computed(function () {
-		return 1 < this.conditions().length;
+	this.actionType = ko.observable(Enums.FiltersAction.Move);
+	this.actionTypeOptions = [ // TODO i18n
+		{'id': Enums.FiltersAction.None, 'name': 'Action - None'},
+		{'id': Enums.FiltersAction.Move, 'name': 'Action - Move to'},
+//		{'id': Enums.FiltersAction.Forward, 'name': 'Action - Forward to'},
+		{'id': Enums.FiltersAction.Discard, 'name': 'Action - Discard'}
+	];
+
+	this.actionMarkAsReadVisiblity = ko.computed(function () {
+		return -1 < Utils.inArray(this.actionType(), [
+			Enums.FiltersAction.None, Enums.FiltersAction.Forward, Enums.FiltersAction.Move
+		]);
 	}, this);
 
-	this.actionsCanBeDeleted = ko.computed(function () {
-		return 1 < this.actions().length;
+	this.actionTemplate = ko.computed(function () {
+
+		var sTemplate = '';
+		switch (this.actionType())
+		{
+			default:
+			case Enums.FiltersAction.Move:
+				sTemplate = 'SettingsFiltersActionValueAsFolders';
+				break;
+			case Enums.FiltersAction.Forward:
+				sTemplate = 'SettingsFiltersActionWithValue';
+				break;
+			case Enums.FiltersAction.None:
+			case Enums.FiltersAction.Discard:
+				sTemplate = 'SettingsFiltersActionNoValue';
+				break;
+		}
+
+		return sTemplate;
+
 	}, this);
 }
 
 FilterModel.prototype.addCondition = function ()
 {
-	this.conditions.push(new FilterConditionModel(this.conditions, this.conditionsCanBeDeleted));
-};
-
-FilterModel.prototype.addAction = function ()
-{
-	this.actions.push(new FilterActionModel(this.actions, this.actionsCanBeDeleted));
+	this.conditions.push(new FilterConditionModel(this.conditions));
 };
 
 FilterModel.prototype.parse = function (oItem)
@@ -12596,6 +12568,44 @@ PopupsKeyboardShortcutsHelpViewModel.prototype.onBuild = function (oDom)
 
 /* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
 
+/**
+ * @constructor
+ * @extends KnoinAbstractViewModel
+ */
+function PopupsFilterViewModel()
+{
+	KnoinAbstractViewModel.call(this, 'Popups', 'PopupsFilter');
+
+	this.filter = ko.observable(null);
+
+	this.selectedFolderValue = ko.observable(Consts.Values.UnuseOptionValue);
+	this.folderSelectList = RL.data().folderMenuForMove;
+	this.defautOptionsAfterRender = Utils.defautOptionsAfterRender;
+
+	Knoin.constructorEnd(this);
+}
+
+Utils.extendAsViewModel('PopupsFilterViewModel', PopupsFilterViewModel);
+
+PopupsFilterViewModel.prototype.clearPopup = function ()
+{
+
+};
+
+PopupsFilterViewModel.prototype.onShow = function (oFilter)
+{
+	this.clearPopup();
+
+	this.filter(oFilter);
+};
+
+PopupsFilterViewModel.prototype.onFocus = function ()
+{
+
+};
+
+/* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
+
 /**
  * @constructor
  * @extends KnoinAbstractViewModel
@@ -15614,11 +15624,7 @@ SettingsFilters.prototype.deleteFilter = function (oFilter)
 
 SettingsFilters.prototype.addFilter = function ()
 {
-	var oFilter = new FilterModel();
-	oFilter.addCondition();
-	oFilter.addAction();
-
-	this.filters.push(oFilter);
+	kn.showScreenPopup(PopupsFilterViewModel, [new FilterModel()]);
 };
 
 /* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */