summaryrefslogtreecommitdiff
path: root/app/views/admin/broadcast_messages/index.html.haml
blob: 77495724e15113d75df487cc981ce606667cd7e6 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
= stylesheet_link_tag "JalaliJSCalendar-1.4/calendar-blue"
= javascript_include_tag "JalaliJSCalendar-1.4/jalali"
= javascript_include_tag "JalaliJSCalendar-1.4/calendar"
= javascript_include_tag "JalaliJSCalendar-1.4/calendar-setup"
= javascript_include_tag "JalaliJSCalendar-1.4/lang/calendar-fa"
%h3.page-title
  Broadcast Messages
%p.light
  Broadcast messages are displayed for every user and can be used to notify users about scheduled maintenance, recent upgrades and more.
.broadcast-message-preview{ dir: :auto }
  %i.fa.fa-bullhorn
  %span Your message here

= form_for [:admin, @broadcast_message], html: { class: 'broadcast-message-form form-horizontal'} do |f|
  -if @broadcast_message.errors.any?
    .alert.alert-danger
      - @broadcast_message.errors.full_messages.each do |msg|
        %p= msg
  .form-group
    = f.label :message, class: 'control-label'
    .col-sm-10
      = f.text_area :message, class: "form-control", rows: 2, required: true, dir: 'auto'
      %div
        = link_to '#', class: 'js-toggle-colors-link' do
          Customize colors
  .form-group.js-toggle-colors-container.hide
    = f.label :color, "Background Color", class: 'control-label'
    .col-sm-10
      = f.text_field :color, placeholder: "#AA33EE", class: "form-control"
      .light 6 character hex values starting with a # sign.
  .form-group.js-toggle-colors-container.hide
    = f.label :font, "Font Color", class: 'control-label'
    .col-sm-10
      = f.text_field :font, placeholder: "#224466", class: "form-control"
      .light 6 character hex values starting with a # sign.
  .form-group
    = f.label :starts_at, class: 'control-label'
    .col-sm-10.datetime-controls{ style: 'width: auto' }
      = f.hidden_field :starts_at
      #datepicker1
  .form-group
    = f.label :ends_at, class: 'control-label'
    .col-sm-10.datetime-controls{ style: 'width: auto' }
      = f.hidden_field :ends_at
      #datepicker2
  .form-actions
    = f.submit "Add broadcast message", class: "btn btn-create"

-if @broadcast_messages.any?
  %ul.bordered-list.broadcast-messages
    - @broadcast_messages.each do |broadcast_message|
      %li
        .pull-right
          - if broadcast_message.starts_at
            %strong
              #{JalaliDate.new(broadcast_message.starts_at).strftime("%A %d %b %Y %H:%M")}
            \...
          - if broadcast_message.ends_at
            %strong
              #{JalaliDate.new(broadcast_message.ends_at).strftime("%A %d %b %Y %H:%M")}
           
          = link_to [:admin, broadcast_message], method: :delete, remote: true, class: 'remove-row btn btn-tiny' do
            %i.fa.fa-times.cred

        .message{ dir: 'auto' }= broadcast_message.message


  = paginate @broadcast_messages

:javascript
  function utcString(date) {
    var utc = new Date(date.getTime() + date.getTimezoneOffset() * 60000);
    return utc.toLocaleFormat("%Y/%m/%d %H:%M");
  }
  var now = new Date();
  var nowCounterUTC = new Date(now.getTime() - now.getTimezoneOffset() * 60000);
  Calendar.setup({
    inputField   : "broadcast_message_starts_at",
    flat         : "datepicker1",   // id of the input field
    flatCallback : function(calendar) {$('#broadcast_message_starts_at').val(utcString(calendar.date))},
    ifFormat     : "%Y/%m/%d %H:%M",       // format of the input field
    dateType     : 'jalali',
    timeFormat   : '24',
    showsTime    : true,
    weekNumbers  : false
  }).setDate(nowCounterUTC);
  Calendar.setup({
    inputField   : "broadcast_message_ends_at",
    flat         : "datepicker2",   // id of the input field
    flatCallback : function(calendar) {$('#broadcast_message_ends_at').val(utcString(calendar.date))},
    ifFormat     : "%Y/%m/%d %H:%M",       // format of the input field
    dateType     : 'jalali',
    timeFormat   : '24',
    showsTime    : true,
    weekNumbers  : false
  }).setDate(nowCounterUTC);