80194c8587f86d58ac335aa6237b5ee9544b868868148f4492604c285cbe0bc6ff7a88156cc598bdd49ded999cec0077b9775aa08012153384250e63ddbf20 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. /*---------------------------------------------------------------------------------------------
  2. * Copyright (c) Microsoft Corporation. All rights reserved.
  3. * Licensed under the MIT License. See License.txt in the project root for license information.
  4. *--------------------------------------------------------------------------------------------*/
  5. import { $, append } from '../../dom.js';
  6. import { Color } from '../../../common/color.js';
  7. import { mixin } from '../../../common/objects.js';
  8. import { format } from '../../../common/strings.js';
  9. import './countBadge.css';
  10. const defaultOpts = {
  11. badgeBackground: Color.fromHex('#4D4D4D'),
  12. badgeForeground: Color.fromHex('#FFFFFF')
  13. };
  14. export class CountBadge {
  15. constructor(container, options) {
  16. this.count = 0;
  17. this.options = options || Object.create(null);
  18. mixin(this.options, defaultOpts, false);
  19. this.badgeBackground = this.options.badgeBackground;
  20. this.badgeForeground = this.options.badgeForeground;
  21. this.badgeBorder = this.options.badgeBorder;
  22. this.element = append(container, $('.monaco-count-badge'));
  23. this.countFormat = this.options.countFormat || '{0}';
  24. this.titleFormat = this.options.titleFormat || '';
  25. this.setCount(this.options.count || 0);
  26. }
  27. setCount(count) {
  28. this.count = count;
  29. this.render();
  30. }
  31. setTitleFormat(titleFormat) {
  32. this.titleFormat = titleFormat;
  33. this.render();
  34. }
  35. render() {
  36. this.element.textContent = format(this.countFormat, this.count);
  37. this.element.title = format(this.titleFormat, this.count);
  38. this.applyStyles();
  39. }
  40. style(styles) {
  41. this.badgeBackground = styles.badgeBackground;
  42. this.badgeForeground = styles.badgeForeground;
  43. this.badgeBorder = styles.badgeBorder;
  44. this.applyStyles();
  45. }
  46. applyStyles() {
  47. if (this.element) {
  48. const background = this.badgeBackground ? this.badgeBackground.toString() : '';
  49. const foreground = this.badgeForeground ? this.badgeForeground.toString() : '';
  50. const border = this.badgeBorder ? this.badgeBorder.toString() : '';
  51. this.element.style.backgroundColor = background;
  52. this.element.style.color = foreground;
  53. this.element.style.borderWidth = border ? '1px' : '';
  54. this.element.style.borderStyle = border ? 'solid' : '';
  55. this.element.style.borderColor = border;
  56. }
  57. }
  58. }