Merge branch 'issue_12758' into 'master'

Implement custom notification level options

![Screen_Shot_2016-06-17_at_15.31.43](/uploads/3fc47d2f461b3e8b67bb8acaa304cf99/Screen_Shot_2016-06-17_at_15.31.43.png)

![Screenshot_from_2016-06-15_10-52-27](/uploads/88dbdd21d97e80ee772fe08fa0c9b393/Screenshot_from_2016-06-15_10-52-27.png)

part of #12758 

See merge request !4389

3 files changed, 69 insertions, 0 deletions

diff --git a/app/views/shared/notifications/_button.html.haml b/app/views/shared/notifications/_button.html.haml
new file mode 100644
index 00000000000..ff1cf966a9b
--- /dev/null
+++ b/app/views/shared/notifications/_button.html.haml
@@ -0,0 +1,25 @@
+- left_align = local_assigns[:left_align]
+- if notification_setting
+  .dropdown.notification-dropdown.pull-right
+    = form_for notification_setting, remote: true, html: { class: "inline notification-form" } do |f|
+      = hidden_setting_source_input(notification_setting)
+      = f.hidden_field :level, class: "notification_setting_level"
+      .js-notification-toggle-btns
+        %div{ class: ("btn-group" if notification_setting.custom?) }
+          - if notification_setting.custom?
+            %button.dropdown-new.btn.btn-default.notifications-btn#notifications-button{ type: "button", data: { toggle: "modal", target: "#" + notifications_menu_identifier("modal", notification_setting) } }
+              = icon("bell", class: "js-notification-loading")
+              = notification_title(notification_setting.level)
+            %button.btn.dropdown-toggle{ data: { toggle: "dropdown", target: notifications_menu_identifier("dropdown", notification_setting) } }
+              %span.caret
+              .sr-only Toggle dropdown
+          - else
+            %button.dropdown-new.btn.btn-default.notifications-btn#notifications-button{ type: "button", data: { toggle: "dropdown", target: notifications_menu_identifier("dropdown", notification_setting) } }
+              = icon("bell", class: "js-notification-loading")
+              = notification_title(notification_setting.level)
+              = icon("caret-down")
+
+          = render "shared/notifications/notification_dropdown", notification_setting: notification_setting, left_align: left_align
+
+          = content_for :scripts_body do
+            = render "shared/notifications/custom_notifications", notification_setting: notification_setting
diff --git a/app/views/shared/notifications/_custom_notifications.html.haml b/app/views/shared/notifications/_custom_notifications.html.haml
new file mode 100644
index 00000000000..b704981e3db
--- /dev/null
+++ b/app/views/shared/notifications/_custom_notifications.html.haml
@@ -0,0 +1,31 @@
+.modal.fade{ tabindex: "-1", role: "dialog", id: notifications_menu_identifier("modal", notification_setting), aria: { labelledby: "custom-notifications-title" } }
+  .modal-dialog
+    .modal-content
+      .modal-header
+        %button.close{ type: "button", data: { dismiss: "modal" }, aria: { label: "close" } }
+          %span{ aria: { hidden: "true" } } ×
+        %h4#custom-notifications-title.modal-title
+          Custom notification events
+
+      .modal-body
+        .container-fluid
+          = form_for notification_setting, html: { class: "custom-notifications-form" } do |f|
+            = hidden_setting_source_input(notification_setting)
+            .row
+              .col-lg-4
+                %h4.prepend-top-0
+                  Notification events
+                %p
+                  Custom notification levels are the same as participating levels. With custom notification levels you will also receive notifications for select events. To find out more, check out
+                  = succeed "." do
+                    %a{ href: "http://docs.gitlab.com/ce/workflow/notifications.html", target: "_blank"} notification emails
+              .col-lg-8
+                - NotificationSetting::EMAIL_EVENTS.each_with_index do |event, index|
+                  - field_id = "#{notifications_menu_identifier("modal", notification_setting)}_notification_setting[#{event}]"
+                  .form-group
+                    .checkbox{ class: ("prepend-top-0" if index == 0) }
+                      %label{ for: field_id }
+                        = check_box("notification_setting", event, id: field_id, class: "js-custom-notification-event", checked: notification_setting.events[event])
+                        %strong
+                          = event.to_s.humanize
+                          = icon("spinner spin", class: "custom-notification-event-loading")
diff --git a/app/views/shared/notifications/_notification_dropdown.html.haml b/app/views/shared/notifications/_notification_dropdown.html.haml
new file mode 100644
index 00000000000..d3258ee64cb
--- /dev/null
+++ b/app/views/shared/notifications/_notification_dropdown.html.haml
@@ -0,0 +1,13 @@
+- left_align = local_assigns[:left_align]
+%ul.dropdown-menu.dropdown-menu-no-wrap.dropdown-menu-selectable.dropdown-menu-large{ role: "menu", class: [notifications_menu_identifier("dropdown", notification_setting), ("dropdown-menu-align-right" unless left_align)] }
+  - NotificationSetting.levels.each_key do |level|
+    - next if level == "custom"
+    - next if level == "global" && notification_setting.source.nil?
+
+    = notification_list_item(level, notification_setting)
+
+  %li.divider
+  %li
+    %a.update-notification{ href: "#", role: "button", class: ("is-active" if notification_setting.custom?), data: { toggle: "modal", target: "#" + notifications_menu_identifier("modal", notification_setting), notification_level: "custom", notification_title: "Custom" } }
+      %strong.dropdown-menu-inner-title Custom
+      %span.dropdown-menu-inner-content= notification_description("custom")