Подключение плагина аналитической панели в веб-приложении

// Зададим блок саморегистрации
(function ()
{
  if (window.Kap)
  {
    Kap.regPluginBlock({
      Id: "MyLabel",  //id, по которому происходит связка плагин-блока с его реализацией
      Name: "MyLabelText",  //наименование типа блока
      View: "PP.Ui.Dashboard.MyLabel",  //класс визуализатора или имя класса визуализатора
      Icon: "../build/img/app/MainIcon.png",  //путь к пиктограмме (16*16) для плагина, необязательный параметр
      SourceClass: PP.Mb.MetabaseObjectClass.KE_CLASS_EXPRESSREPORT, // тип или код класса источника данных
      Js: "../plugins/MyLabel.js",  //для динамической загрузки скрипта с реализацией плагина, обязательный параметр
      Master: "PP.Ui.MyMaster",  //класс мастера или имя класса мастера
      Props: {  // дополнительные параметры плагина для установки значений по умолчанию, необязательный параметр
        pluginProps: {}
      }
    });
  }
})();
 
if (!PP.Ui.MyLabel)
{
  PP.Ui.MyLabel = {};
  PP.initNamespace(PP.Ui.MyLabel, "PP.Ui.MyLabel");
}
 
// Создадим прототип своего визуализатора для регистрируемого блока
PP.Ui.MyLabel = function(settings) {
  this._Source = null;
  this._bgFlag = false;
  this.PropertyChanged = new PP.Delegate();
  this.Refreshed = new PP.Delegate();
  PP.Ui.MyLabel.base.constructor.apply(this, arguments);
  this.setContent("MyLabelText");
};
PP.initClass(PP.Ui.MyLabel, PP.Ui.Label, "PP.Ui.MyLabel");
 
PP.Ui.MyLabel.prototype._propertyChangedFire = function () {
  this.PropertyChanged.fire(this);
};
 
PP.Ui.MyLabel.prototype._refreshedFire = function () {
  console.log("My Label Refreshed");
  this.Refreshed.fire(this);
};
 
// Если плагин должен поддерживать работу с источником данных, то
// установим источник визуализатору, который открыт в аналитической панели
PP.Ui.MyLabel.prototype.setSource = function(source) {
  this._Source = source;
  this.setContent("Source loaded: " + this._Source.getId());
  this._refreshedFire();
};
 
// Если плагин должен поддерживать хранимые свойства зададим методы setProps и getProps 
PP.Ui.MyLabel.prototype.setProps = function(value) {  // метод установки хранимых свойств блока
  if (value) {
    var props = JSON.parse(value);
    this._bgFlag = props.bgFlag ? props.bgFlag : false;
  } else {
    this._bgFlag = false;
  }
  this.refresh();
};
 
PP.Ui.MyLabel.prototype.getProps = function() {  //метод, предоставляющий аналитической панели свойства для сохранения
  var props = {
    bgFlag: this._bgFlag
  };
  return JSON.stringify(props);
};
 
PP.Ui.MyLabel.prototype.refresh = function() {
  this._DomNode.style.backgroundColor = this._bgFlag ? "green" : "transparent";
  this._refreshedFire();
};
 
PP.Ui.MyLabel.prototype.refreshAll = function () {  // метод вызывается при обновлении блока с данными
};
 
PP.Ui.MyLabel.prototype.setWidth = function () {
  if (this._Instance)   this._redraw();
};
 
PP.Ui.MyLabel.prototype.setHeight = function () {
  if (this._Instance)   this._redraw();
};
 
// Если плагин должен иметь собственное контекстное меню зададим метод getContextMenu
PP.Ui.MyLabel.prototype.getContextMenu = function() {
  var _DataView = this;
  var menu = new PP.Ui.Menu({
    Items : [ {
      MenuItem : {
        Id : "pluginMenuItem",
        Content : "plugin menu item",
        Checked : _DataView._bgFlag,
        CheckedChanged : function(sender, args) {
          _DataView._bgFlag = sender.getChecked();
          _DataView.refresh();
        }
      }
    }]
  });
  return menu;
};
 
// Создадим прототип мастера для регистрируемого блока 
PP.Ui.MyMaster = function(settings) {
  this._DataView;
  PP.Ui.MyMaster.base.constructor.apply(this, arguments);
  var myPanel = new PP.Ui.MasterPanel(
  {
    Id: "MyPluginMaster",
    ViewType: PP.Ui.NavigationItem,
    Content: "Plugin settings...",
    Title: "My plugin master"
  });
  myPanel.getHeaderControl().CheckedChanged.add(this._onPropsChanged, this);
  this.addMasterPanel(myPanel);
};
PP.initClass(PP.Ui.MyMaster, PP.Ui.Master, "PP.Ui.MyMaster");
 
// Если для плагина должны отображаться дополнительные вкладки боковой панели, содержащие его настройки,
// то зададим реализацию метода setDataView(view), где view - это экземпляр визуализатора плагина.
// Дополнительно зададим свойство Master в блоке регистрации
PP.Ui.MyMaster.prototype.setDataView = function(view) {
  this._DataView = view;
  for (var i = 0; i < this.getItems().length; i++) {
    var item = this.getItem(i);
    if (item.getId() === "MyPluginMaster") {
      item.setTitle("My plugin master. Data view type: " + view.getTypeName());
      if (view._bgFlag) {
        item.getHeaderControl().setChecked(view._bgFlag, false);
      }
    }
  }
};
 
PP.Ui.MyMaster.prototype._onPropsChanged = function(sender, args) {
  this._DataView._bgFlag = args.CheckedState;
  this._DataView._propertyChangedFire();
  this._DataView.refresh();
};