GPQAPP

1
/**
2
 * AdminLTE Demo Menu
3
 * ------------------
4
 * You should not use this file in production.
5
 * This file is for demo purposes only.
6
 */
7

8
/* eslint-disable camelcase */
9

10
(function ($) {
11
  'use strict'
12

13
  setTimeout(function () {
14
    if (window.___browserSync___ === undefined && Number(localStorage.getItem('AdminLTE:Demo:MessageShowed')) < Date.now()) {
15
      localStorage.setItem('AdminLTE:Demo:MessageShowed', (Date.now()) + (15 * 60 * 1000))
16
      // eslint-disable-next-line no-alert
17
      alert('You load AdminLTE\'s "demo.js", \nthis file is only created for testing purposes!')
18
    }
19
  }, 1000)
20

21
  function capitalizeFirstLetter(string) {
22
    return string.charAt(0).toUpperCase() + string.slice(1)
23
  }
24

25
  function createSkinBlock(colors, callback, noneSelected) {
26
    var $block = $('<select />', {
27
      class: noneSelected ? 'custom-select mb-3 border-0' : 'custom-select mb-3 text-light border-0 ' + colors[0].replace(/accent-|navbar-/, 'bg-')
28
    })
29

30
    if (noneSelected) {
31
      var $default = $('<option />', {
32
        text: 'None Selected'
33
      })
34

35
      $block.append($default)
36
    }
37

38
    colors.forEach(function (color) {
39
      var $color = $('<option />', {
40
        class: (typeof color === 'object' ? color.join(' ') : color).replace('navbar-', 'bg-').replace('accent-', 'bg-'),
41
        text: capitalizeFirstLetter((typeof color === 'object' ? color.join(' ') : color).replace(/navbar-|accent-|bg-/, '').replace('-', ' '))
42
      })
43

44
      $block.append($color)
45
    })
46
    if (callback) {
47
      $block.on('change', callback)
48
    }
49

50
    return $block
51
  }
52

53
  var $sidebar = $('.control-sidebar')
54
  var $container = $('<div />', {
55
    class: 'p-3 control-sidebar-content'
56
  })
57

58
  $sidebar.append($container)
59

60
  // Checkboxes
61

62
  $container.append(
63
    '<h5>Customize AdminLTE</h5><hr class="mb-2"/>'
64
  )
65

66
  var $dark_mode_checkbox = $('<input />', {
67
    type: 'checkbox',
68
    value: 1,
69
    checked: $('body').hasClass('dark-mode'),
70
    class: 'mr-1'
71
  }).on('click', function () {
72
    if ($(this).is(':checked')) {
73
      $('body').addClass('dark-mode')
74
    } else {
75
      $('body').removeClass('dark-mode')
76
    }
77
  })
78
  var $dark_mode_container = $('<div />', { class: 'mb-4' }).append($dark_mode_checkbox).append('<span>Dark Mode</span>')
79
  $container.append($dark_mode_container)
80

81
  $container.append('<h6>Header Options</h6>')
82
  var $header_fixed_checkbox = $('<input />', {
83
    type: 'checkbox',
84
    value: 1,
85
    checked: $('body').hasClass('layout-navbar-fixed'),
86
    class: 'mr-1'
87
  }).on('click', function () {
88
    if ($(this).is(':checked')) {
89
      $('body').addClass('layout-navbar-fixed')
90
    } else {
91
      $('body').removeClass('layout-navbar-fixed')
92
    }
93
  })
94
  var $header_fixed_container = $('<div />', { class: 'mb-1' }).append($header_fixed_checkbox).append('<span>Fixed</span>')
95
  $container.append($header_fixed_container)
96

97
  var $dropdown_legacy_offset_checkbox = $('<input />', {
98
    type: 'checkbox',
99
    value: 1,
100
    checked: $('.main-header').hasClass('dropdown-legacy'),
101
    class: 'mr-1'
102
  }).on('click', function () {
103
    if ($(this).is(':checked')) {
104
      $('.main-header').addClass('dropdown-legacy')
105
    } else {
106
      $('.main-header').removeClass('dropdown-legacy')
107
    }
108
  })
109
  var $dropdown_legacy_offset_container = $('<div />', { class: 'mb-1' }).append($dropdown_legacy_offset_checkbox).append('<span>Dropdown Legacy Offset</span>')
110
  $container.append($dropdown_legacy_offset_container)
111

112
  var $no_border_checkbox = $('<input />', {
113
    type: 'checkbox',
114
    value: 1,
115
    checked: $('.main-header').hasClass('border-bottom-0'),
116
    class: 'mr-1'
117
  }).on('click', function () {
118
    if ($(this).is(':checked')) {
119
      $('.main-header').addClass('border-bottom-0')
120
    } else {
121
      $('.main-header').removeClass('border-bottom-0')
122
    }
123
  })
124
  var $no_border_container = $('<div />', { class: 'mb-4' }).append($no_border_checkbox).append('<span>No border</span>')
125
  $container.append($no_border_container)
126

127
  $container.append('<h6>Sidebar Options</h6>')
128

129
  var $sidebar_collapsed_checkbox = $('<input />', {
130
    type: 'checkbox',
131
    value: 1,
132
    checked: $('body').hasClass('sidebar-collapse'),
133
    class: 'mr-1'
134
  }).on('click', function () {
135
    if ($(this).is(':checked')) {
136
      $('body').addClass('sidebar-collapse')
137
      $(window).trigger('resize')
138
    } else {
139
      $('body').removeClass('sidebar-collapse')
140
      $(window).trigger('resize')
141
    }
142
  })
143
  var $sidebar_collapsed_container = $('<div />', { class: 'mb-1' }).append($sidebar_collapsed_checkbox).append('<span>Collapsed</span>')
144
  $container.append($sidebar_collapsed_container)
145

146
  $(document).on('collapsed.lte.pushmenu', '[data-widget="pushmenu"]', function () {
147
    $sidebar_collapsed_checkbox.prop('checked', true)
148
  })
149
  $(document).on('shown.lte.pushmenu', '[data-widget="pushmenu"]', function () {
150
    $sidebar_collapsed_checkbox.prop('checked', false)
151
  })
152

153
  var $sidebar_fixed_checkbox = $('<input />', {
154
    type: 'checkbox',
155
    value: 1,
156
    checked: $('body').hasClass('layout-fixed'),
157
    class: 'mr-1'
158
  }).on('click', function () {
159
    if ($(this).is(':checked')) {
160
      $('body').addClass('layout-fixed')
161
      $(window).trigger('resize')
162
    } else {
163
      $('body').removeClass('layout-fixed')
164
      $(window).trigger('resize')
165
    }
166
  })
167
  var $sidebar_fixed_container = $('<div />', { class: 'mb-1' }).append($sidebar_fixed_checkbox).append('<span>Fixed</span>')
168
  $container.append($sidebar_fixed_container)
169

170
  var $sidebar_mini_checkbox = $('<input />', {
171
    type: 'checkbox',
172
    value: 1,
173
    checked: $('body').hasClass('sidebar-mini'),
174
    class: 'mr-1'
175
  }).on('click', function () {
176
    if ($(this).is(':checked')) {
177
      $('body').addClass('sidebar-mini')
178
    } else {
179
      $('body').removeClass('sidebar-mini')
180
    }
181
  })
182
  var $sidebar_mini_container = $('<div />', { class: 'mb-1' }).append($sidebar_mini_checkbox).append('<span>Sidebar Mini</span>')
183
  $container.append($sidebar_mini_container)
184

185
  var $sidebar_mini_md_checkbox = $('<input />', {
186
    type: 'checkbox',
187
    value: 1,
188
    checked: $('body').hasClass('sidebar-mini-md'),
189
    class: 'mr-1'
190
  }).on('click', function () {
191
    if ($(this).is(':checked')) {
192
      $('body').addClass('sidebar-mini-md')
193
    } else {
194
      $('body').removeClass('sidebar-mini-md')
195
    }
196
  })
197
  var $sidebar_mini_md_container = $('<div />', { class: 'mb-1' }).append($sidebar_mini_md_checkbox).append('<span>Sidebar Mini MD</span>')
198
  $container.append($sidebar_mini_md_container)
199

200
  var $sidebar_mini_xs_checkbox = $('<input />', {
201
    type: 'checkbox',
202
    value: 1,
203
    checked: $('body').hasClass('sidebar-mini-xs'),
204
    class: 'mr-1'
205
  }).on('click', function () {
206
    if ($(this).is(':checked')) {
207
      $('body').addClass('sidebar-mini-xs')
208
    } else {
209
      $('body').removeClass('sidebar-mini-xs')
210
    }
211
  })
212
  var $sidebar_mini_xs_container = $('<div />', { class: 'mb-1' }).append($sidebar_mini_xs_checkbox).append('<span>Sidebar Mini XS</span>')
213
  $container.append($sidebar_mini_xs_container)
214

215
  var $flat_sidebar_checkbox = $('<input />', {
216
    type: 'checkbox',
217
    value: 1,
218
    checked: $('.nav-sidebar').hasClass('nav-flat'),
219
    class: 'mr-1'
220
  }).on('click', function () {
221
    if ($(this).is(':checked')) {
222
      $('.nav-sidebar').addClass('nav-flat')
223
    } else {
224
      $('.nav-sidebar').removeClass('nav-flat')
225
    }
226
  })
227
  var $flat_sidebar_container = $('<div />', { class: 'mb-1' }).append($flat_sidebar_checkbox).append('<span>Nav Flat Style</span>')
228
  $container.append($flat_sidebar_container)
229

230
  var $legacy_sidebar_checkbox = $('<input />', {
231
    type: 'checkbox',
232
    value: 1,
233
    checked: $('.nav-sidebar').hasClass('nav-legacy'),
234
    class: 'mr-1'
235
  }).on('click', function () {
236
    if ($(this).is(':checked')) {
237
      $('.nav-sidebar').addClass('nav-legacy')
238
    } else {
239
      $('.nav-sidebar').removeClass('nav-legacy')
240
    }
241
  })
242
  var $legacy_sidebar_container = $('<div />', { class: 'mb-1' }).append($legacy_sidebar_checkbox).append('<span>Nav Legacy Style</span>')
243
  $container.append($legacy_sidebar_container)
244

245
  var $compact_sidebar_checkbox = $('<input />', {
246
    type: 'checkbox',
247
    value: 1,
248
    checked: $('.nav-sidebar').hasClass('nav-compact'),
249
    class: 'mr-1'
250
  }).on('click', function () {
251
    if ($(this).is(':checked')) {
252
      $('.nav-sidebar').addClass('nav-compact')
253
    } else {
254
      $('.nav-sidebar').removeClass('nav-compact')
255
    }
256
  })
257
  var $compact_sidebar_container = $('<div />', { class: 'mb-1' }).append($compact_sidebar_checkbox).append('<span>Nav Compact</span>')
258
  $container.append($compact_sidebar_container)
259

260
  var $child_indent_sidebar_checkbox = $('<input />', {
261
    type: 'checkbox',
262
    value: 1,
263
    checked: $('.nav-sidebar').hasClass('nav-child-indent'),
264
    class: 'mr-1'
265
  }).on('click', function () {
266
    if ($(this).is(':checked')) {
267
      $('.nav-sidebar').addClass('nav-child-indent')
268
    } else {
269
      $('.nav-sidebar').removeClass('nav-child-indent')
270
    }
271
  })
272
  var $child_indent_sidebar_container = $('<div />', { class: 'mb-1' }).append($child_indent_sidebar_checkbox).append('<span>Nav Child Indent</span>')
273
  $container.append($child_indent_sidebar_container)
274

275
  var $child_hide_sidebar_checkbox = $('<input />', {
276
    type: 'checkbox',
277
    value: 1,
278
    checked: $('.nav-sidebar').hasClass('nav-collapse-hide-child'),
279
    class: 'mr-1'
280
  }).on('click', function () {
281
    if ($(this).is(':checked')) {
282
      $('.nav-sidebar').addClass('nav-collapse-hide-child')
283
    } else {
284
      $('.nav-sidebar').removeClass('nav-collapse-hide-child')
285
    }
286
  })
287
  var $child_hide_sidebar_container = $('<div />', { class: 'mb-1' }).append($child_hide_sidebar_checkbox).append('<span>Nav Child Hide on Collapse</span>')
288
  $container.append($child_hide_sidebar_container)
289

290
  var $no_expand_sidebar_checkbox = $('<input />', {
291
    type: 'checkbox',
292
    value: 1,
293
    checked: $('.main-sidebar').hasClass('sidebar-no-expand'),
294
    class: 'mr-1'
295
  }).on('click', function () {
296
    if ($(this).is(':checked')) {
297
      $('.main-sidebar').addClass('sidebar-no-expand')
298
    } else {
299
      $('.main-sidebar').removeClass('sidebar-no-expand')
300
    }
301
  })
302
  var $no_expand_sidebar_container = $('<div />', { class: 'mb-4' }).append($no_expand_sidebar_checkbox).append('<span>Disable Hover/Focus Auto-Expand</span>')
303
  $container.append($no_expand_sidebar_container)
304

305
  $container.append('<h6>Footer Options</h6>')
306
  var $footer_fixed_checkbox = $('<input />', {
307
    type: 'checkbox',
308
    value: 1,
309
    checked: $('body').hasClass('layout-footer-fixed'),
310
    class: 'mr-1'
311
  }).on('click', function () {
312
    if ($(this).is(':checked')) {
313
      $('body').addClass('layout-footer-fixed')
314
    } else {
315
      $('body').removeClass('layout-footer-fixed')
316
    }
317
  })
318
  var $footer_fixed_container = $('<div />', { class: 'mb-4' }).append($footer_fixed_checkbox).append('<span>Fixed</span>')
319
  $container.append($footer_fixed_container)
320

321
  $container.append('<h6>Small Text Options</h6>')
322

323
  var $text_sm_body_checkbox = $('<input />', {
324
    type: 'checkbox',
325
    value: 1,
326
    checked: $('body').hasClass('text-sm'),
327
    class: 'mr-1'
328
  }).on('click', function () {
329
    if ($(this).is(':checked')) {
330
      $('body').addClass('text-sm')
331
    } else {
332
      $('body').removeClass('text-sm')
333
    }
334
  })
335
  var $text_sm_body_container = $('<div />', { class: 'mb-1' }).append($text_sm_body_checkbox).append('<span>Body</span>')
336
  $container.append($text_sm_body_container)
337

338
  var $text_sm_header_checkbox = $('<input />', {
339
    type: 'checkbox',
340
    value: 1,
341
    checked: $('.main-header').hasClass('text-sm'),
342
    class: 'mr-1'
343
  }).on('click', function () {
344
    if ($(this).is(':checked')) {
345
      $('.main-header').addClass('text-sm')
346
    } else {
347
      $('.main-header').removeClass('text-sm')
348
    }
349
  })
350
  var $text_sm_header_container = $('<div />', { class: 'mb-1' }).append($text_sm_header_checkbox).append('<span>Navbar</span>')
351
  $container.append($text_sm_header_container)
352

353
  var $text_sm_brand_checkbox = $('<input />', {
354
    type: 'checkbox',
355
    value: 1,
356
    checked: $('.brand-link').hasClass('text-sm'),
357
    class: 'mr-1'
358
  }).on('click', function () {
359
    if ($(this).is(':checked')) {
360
      $('.brand-link').addClass('text-sm')
361
    } else {
362
      $('.brand-link').removeClass('text-sm')
363
    }
364
  })
365
  var $text_sm_brand_container = $('<div />', { class: 'mb-1' }).append($text_sm_brand_checkbox).append('<span>Brand</span>')
366
  $container.append($text_sm_brand_container)
367

368
  var $text_sm_sidebar_checkbox = $('<input />', {
369
    type: 'checkbox',
370
    value: 1,
371
    checked: $('.nav-sidebar').hasClass('text-sm'),
372
    class: 'mr-1'
373
  }).on('click', function () {
374
    if ($(this).is(':checked')) {
375
      $('.nav-sidebar').addClass('text-sm')
376
    } else {
377
      $('.nav-sidebar').removeClass('text-sm')
378
    }
379
  })
380
  var $text_sm_sidebar_container = $('<div />', { class: 'mb-1' }).append($text_sm_sidebar_checkbox).append('<span>Sidebar Nav</span>')
381
  $container.append($text_sm_sidebar_container)
382

383
  var $text_sm_footer_checkbox = $('<input />', {
384
    type: 'checkbox',
385
    value: 1,
386
    checked: $('.main-footer').hasClass('text-sm'),
387
    class: 'mr-1'
388
  }).on('click', function () {
389
    if ($(this).is(':checked')) {
390
      $('.main-footer').addClass('text-sm')
391
    } else {
392
      $('.main-footer').removeClass('text-sm')
393
    }
394
  })
395
  var $text_sm_footer_container = $('<div />', { class: 'mb-4' }).append($text_sm_footer_checkbox).append('<span>Footer</span>')
396
  $container.append($text_sm_footer_container)
397

398
  // Color Arrays
399

400
  var navbar_dark_skins = [
401
    'navbar-primary',
402
    'navbar-secondary',
403
    'navbar-info',
404
    'navbar-success',
405
    'navbar-danger',
406
    'navbar-indigo',
407
    'navbar-purple',
408
    'navbar-pink',
409
    'navbar-navy',
410
    'navbar-lightblue',
411
    'navbar-teal',
412
    'navbar-cyan',
413
    'navbar-dark',
414
    'navbar-gray-dark',
415
    'navbar-gray'
416
  ]
417

418
  var navbar_light_skins = [
419
    'navbar-light',
420
    'navbar-warning',
421
    'navbar-white',
422
    'navbar-orange'
423
  ]
424

425
  var sidebar_colors = [
426
    'bg-primary',
427
    'bg-warning',
428
    'bg-info',
429
    'bg-danger',
430
    'bg-success',
431
    'bg-indigo',
432
    'bg-lightblue',
433
    'bg-navy',
434
    'bg-purple',
435
    'bg-fuchsia',
436
    'bg-pink',
437
    'bg-maroon',
438
    'bg-orange',
439
    'bg-lime',
440
    'bg-teal',
441
    'bg-olive'
442
  ]
443

444
  var accent_colors = [
445
    'accent-primary',
446
    'accent-warning',
447
    'accent-info',
448
    'accent-danger',
449
    'accent-success',
450
    'accent-indigo',
451
    'accent-lightblue',
452
    'accent-navy',
453
    'accent-purple',
454
    'accent-fuchsia',
455
    'accent-pink',
456
    'accent-maroon',
457
    'accent-orange',
458
    'accent-lime',
459
    'accent-teal',
460
    'accent-olive'
461
  ]
462

463
  var sidebar_skins = [
464
    'sidebar-dark-primary',
465
    'sidebar-dark-warning',
466
    'sidebar-dark-info',
467
    'sidebar-dark-danger',
468
    'sidebar-dark-success',
469
    'sidebar-dark-indigo',
470
    'sidebar-dark-lightblue',
471
    'sidebar-dark-navy',
472
    'sidebar-dark-purple',
473
    'sidebar-dark-fuchsia',
474
    'sidebar-dark-pink',
475
    'sidebar-dark-maroon',
476
    'sidebar-dark-orange',
477
    'sidebar-dark-lime',
478
    'sidebar-dark-teal',
479
    'sidebar-dark-olive',
480
    'sidebar-light-primary',
481
    'sidebar-light-warning',
482
    'sidebar-light-info',
483
    'sidebar-light-danger',
484
    'sidebar-light-success',
485
    'sidebar-light-indigo',
486
    'sidebar-light-lightblue',
487
    'sidebar-light-navy',
488
    'sidebar-light-purple',
489
    'sidebar-light-fuchsia',
490
    'sidebar-light-pink',
491
    'sidebar-light-maroon',
492
    'sidebar-light-orange',
493
    'sidebar-light-lime',
494
    'sidebar-light-teal',
495
    'sidebar-light-olive'
496
  ]
497

498
  // Navbar Variants
499

500
  $container.append('<h6>Navbar Variants</h6>')
501

502
  var $navbar_variants = $('<div />', {
503
    class: 'd-flex'
504
  })
505
  var navbar_all_colors = navbar_dark_skins.concat(navbar_light_skins)
506
  var $navbar_variants_colors = createSkinBlock(navbar_all_colors, function () {
507
    var color = $(this).find('option:selected').attr('class')
508
    var $main_header = $('.main-header')
509
    $main_header.removeClass('navbar-dark').removeClass('navbar-light')
510
    navbar_all_colors.forEach(function (color) {
511
      $main_header.removeClass(color)
512
    })
513

514
    $(this).removeClass().addClass('custom-select mb-3 text-light border-0 ')
515

516
    if (navbar_dark_skins.indexOf(color) > -1) {
517
      $main_header.addClass('navbar-dark')
518
      $(this).addClass(color).addClass('text-light')
519
    } else {
520
      $main_header.addClass('navbar-light')
521
      $(this).addClass(color)
522
    }
523

524
    $main_header.addClass(color)
525
  })
526

527
  var active_navbar_color = null
528
  $('.main-header')[0].classList.forEach(function (className) {
529
    if (navbar_all_colors.indexOf(className) > -1 && active_navbar_color === null) {
530
      active_navbar_color = className.replace('navbar-', 'bg-')
531
    }
532
  })
533

534
  $navbar_variants_colors.find('option.' + active_navbar_color).prop('selected', true)
535
  $navbar_variants_colors.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_navbar_color)
536

537
  $navbar_variants.append($navbar_variants_colors)
538

539
  $container.append($navbar_variants)
540

541
  // Sidebar Colors
542

543
  $container.append('<h6>Accent Color Variants</h6>')
544
  var $accent_variants = $('<div />', {
545
    class: 'd-flex'
546
  })
547
  $container.append($accent_variants)
548
  $container.append(createSkinBlock(accent_colors, function () {
549
    var color = $(this).find('option:selected').attr('class')
550
    var $body = $('body')
551
    accent_colors.forEach(function (skin) {
552
      $body.removeClass(skin)
553
    })
554

555
    var accent_color_class = color.replace('bg-', 'accent-')
556

557
    $body.addClass(accent_color_class)
558
  }, true))
559

560
  var active_accent_color = null
561
  $('body')[0].classList.forEach(function (className) {
562
    if (accent_colors.indexOf(className) > -1 && active_accent_color === null) {
563
      active_accent_color = className.replace('navbar-', 'bg-')
564
    }
565
  })
566

567
  // $accent_variants.find('option.' + active_accent_color).prop('selected', true)
568
  // $accent_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_accent_color)
569

570
  $container.append('<h6>Dark Sidebar Variants</h6>')
571
  var $sidebar_variants_dark = $('<div />', {
572
    class: 'd-flex'
573
  })
574
  $container.append($sidebar_variants_dark)
575
  var $sidebar_dark_variants = createSkinBlock(sidebar_colors, function () {
576
    var color = $(this).find('option:selected').attr('class')
577
    var sidebar_class = 'sidebar-dark-' + color.replace('bg-', '')
578
    var $sidebar = $('.main-sidebar')
579
    sidebar_skins.forEach(function (skin) {
580
      $sidebar.removeClass(skin)
581
      $sidebar_light_variants.removeClass(skin.replace('sidebar-dark-', 'bg-')).removeClass('text-light')
582
    })
583

584
    $(this).removeClass().addClass('custom-select mb-3 text-light border-0').addClass(color)
585

586
    $sidebar_light_variants.find('option').prop('selected', false)
587
    $sidebar.addClass(sidebar_class)
588
    $('.sidebar').removeClass('os-theme-dark').addClass('os-theme-light')
589
  }, true)
590
  $container.append($sidebar_dark_variants)
591

592
  var active_sidebar_dark_color = null
593
  $('.main-sidebar')[0].classList.forEach(function (className) {
594
    var color = className.replace('sidebar-dark-', 'bg-')
595
    if (sidebar_colors.indexOf(color) > -1 && active_sidebar_dark_color === null) {
596
      active_sidebar_dark_color = color
597
    }
598
  })
599

600
  $sidebar_dark_variants.find('option.' + active_sidebar_dark_color).prop('selected', true)
601
  $sidebar_dark_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_sidebar_dark_color)
602

603
  $container.append('<h6>Light Sidebar Variants</h6>')
604
  var $sidebar_variants_light = $('<div />', {
605
    class: 'd-flex'
606
  })
607
  $container.append($sidebar_variants_light)
608
  var $sidebar_light_variants = createSkinBlock(sidebar_colors, function () {
609
    var color = $(this).find('option:selected').attr('class')
610
    var sidebar_class = 'sidebar-light-' + color.replace('bg-', '')
611
    var $sidebar = $('.main-sidebar')
612
    sidebar_skins.forEach(function (skin) {
613
      $sidebar.removeClass(skin)
614
      $sidebar_dark_variants.removeClass(skin.replace('sidebar-light-', 'bg-')).removeClass('text-light')
615
    })
616

617
    $(this).removeClass().addClass('custom-select mb-3 text-light border-0').addClass(color)
618

619
    $sidebar_dark_variants.find('option').prop('selected', false)
620
    $sidebar.addClass(sidebar_class)
621
    $('.sidebar').removeClass('os-theme-light').addClass('os-theme-dark')
622
  }, true)
623
  $container.append($sidebar_light_variants)
624

625
  var active_sidebar_light_color = null
626
  $('.main-sidebar')[0].classList.forEach(function (className) {
627
    var color = className.replace('sidebar-light-', 'bg-')
628
    if (sidebar_colors.indexOf(color) > -1 && active_sidebar_light_color === null) {
629
      active_sidebar_light_color = color
630
    }
631
  })
632

633
  if (active_sidebar_light_color !== null) {
634
    $sidebar_light_variants.find('option.' + active_sidebar_light_color).prop('selected', true)
635
    $sidebar_light_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_sidebar_light_color)
636
  }
637

638
  var logo_skins = navbar_all_colors
639
  $container.append('<h6>Brand Logo Variants</h6>')
640
  var $logo_variants = $('<div />', {
641
    class: 'd-flex'
642
  })
643
  $container.append($logo_variants)
644
  var $clear_btn = $('<a />', {
645
    href: '#'
646
  }).text('clear').on('click', function (e) {
647
    e.preventDefault()
648
    var $logo = $('.brand-link')
649
    logo_skins.forEach(function (skin) {
650
      $logo.removeClass(skin)
651
    })
652
  })
653

654
  var $brand_variants = createSkinBlock(logo_skins, function () {
655
    var color = $(this).find('option:selected').attr('class')
656
    var $logo = $('.brand-link')
657

658
    if (color === 'navbar-light' || color === 'navbar-white') {
659
      $logo.addClass('text-black')
660
    } else {
661
      $logo.removeClass('text-black')
662
    }
663

664
    logo_skins.forEach(function (skin) {
665
      $logo.removeClass(skin)
666
    })
667

668
    if (color) {
669
      $(this).removeClass().addClass('custom-select mb-3 border-0').addClass(color).addClass(color !== 'navbar-light' && color !== 'navbar-white' ? 'text-light' : '')
670
    } else {
671
      $(this).removeClass().addClass('custom-select mb-3 border-0')
672
    }
673

674
    $logo.addClass(color)
675
  }, true).append($clear_btn)
676
  $container.append($brand_variants)
677

678
  var active_brand_color = null
679
  $('.brand-link')[0].classList.forEach(function (className) {
680
    if (logo_skins.indexOf(className) > -1 && active_brand_color === null) {
681
      active_brand_color = className.replace('navbar-', 'bg-')
682
    }
683
  })
684

685
  if (active_brand_color) {
686
    $brand_variants.find('option.' + active_brand_color).prop('selected', true)
687
    $brand_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_brand_color)
688
  }
689
})(jQuery)
690