Layer List auto start location change

[LeoLadefian4]

How do i set the location of the Layer List when auto start is set to true.  The Layer List covers up the zoom in and out buttons in the Launchpad Theme

[RobertScheitlin__GISP · Accepted solution]

Leo,

  There is no configuration for this so you have to edit the

[install dir]server\apps\[ap number]\themes\LaunchpadTheme\panels\LaunchpadPanel\Panel.js

When you open this file find this function:

setPosition: function(position){
      var style, box, row, col, size;

      box = this._getLayoutBox();
      size = Math.floor(box.w / (position.width + position.margin));

      row = Math.floor(position.index / size);
      col = position.index % size;
      position.left = (row + 1) * position.margin + col * (position.width + position.margin);
      position.top -= position.margin * row;
      position.left += 50;

      this.position = lang.clone(position);

      if(window.appInfo.isRunInMobile){
        position.left = 0;
        position.top = box.h / 2;
        position.width = box.w;
        position.height = box.h / 2;
      }

      style = utils.getPositionStyle(position);
      style.position = 'absolute';

      domConstruct.place(this.domNode, jimuConfig.mapId);
      domStyle.set(this.domNode, style);

      this._onResponsible();
    },

and add line 11 above

[LeoLadefian4]

Thanks, I was looking under the config.json for the widget layerlist.  wrong spot i suppose.

[RobertScheitlin__GISP]

Leo,

   You are correct, the config.json will not help in this case as the widgets position is calculated in the code at runtime and is not stored in the config.json.

[LeoLadefian4]

This is what I'm looking at in the code, a little different than what you show.

_setPositionStyle: function(a) {

            var b;

            this.position.zIndex && (a.zIndex = this.position.zIndex);

            this.position.left = a.left;

            this.position.top =

                a.top;

            this.position.width = a.width;

            this.position.height = a.height;

            b = h.getPositionStyle(a);

            e.mixin(b, a.borderRadiusStyle);

            c.set(this.domNode, b)

        },

        onWindowResize: function() {

            var a, b = {};

            window.appInfo.isRunInMobile ? (a = "map" === this.position.relativeTo ? this.map.id : window.jimuConfig.layoutId, a = f.getMarginBox(a), b.left = 0, b.top = 0, b.width = a.w, b.height = a.h, b.zIndex = this.position.zIndex) : (b = e.clone(this.position), "minimized" === this.windowState && (b.height = this.titleHeight));

            b = h.getPositionStyle(b);

            b.position = "absolute";

            "auto" === b.zIndex && (b.zIndex = 0);

            c.set(this.domNode, b);

            this._onResponsible()

        },

        setPosition: function(a, b) {

            var d, g, k;

            b || (b = "map" === a.relativeTo ? this.map.id : window.jimuConfig.layoutId);

            d = f.getMarginBox(b);

            k = Math.floor(d.w / (a.width + a.margin));

            g = Math.floor(a.index / k);

            a.left = (g + 1) * a.margin + a.index % k * (a.width + a.margin);

            a.top -= a.margin * g;

            this.position = e.clone(a);

            window.appInfo.isRunInMobile && (a.left = 0, a.top = 0, a.width = d.w, a.height = d.h);

            d = h.getPositionStyle(a);

            d.position = "absolute";

            "auto" === d.zIndex && (d.zIndex =

                0);

            p.place(this.domNode, b);

            c.set(this.domNode, d);

            this._onResponsible()

        },

[RobertScheitlin__GISP]

Leo,

  It looks like you are working with the minified code. That is not a problem. Here is the change for that version (line 8):

       setPosition: function(a, b) {
            var d, g, k;
            b || (b = "map" === a.relativeTo ? this.map.id : window.jimuConfig.layoutId);
            d = f.getMarginBox(b);
            k = Math.floor(d.w / (a.width + a.margin));
            g = Math.floor(a.index / k);
            a.left = (g + 1) * a.margin + a.index % k * (a.width + a.margin);
            a.left += 50;
            a.top -= a.margin * g;
            this.position = e.clone(a);
            window.appInfo.isRunInMobile && (a.left = 0, a.top = 0, a.width = d.w, a.height = d.h);
            d = h.getPositionStyle(a);
            d.position = "absolute";
            "auto" === d.zIndex && (d.zIndex =
                0);
            p.place(this.domNode, b);
            c.set(this.domNode, d);
            this._onResponsible()
        },

[IslamSaeed1]

Hello Robert,

Actually i am having a similar inquiry , i want the widget to open on the right side of the screen but when searching the mentioned block of code i didn't find that exact section, i am attaching my panel.js file for your reference

[RobertScheitlin__GISP]

Islam,

  You are going to have a really hard time trying to make any code changes to a minified/uglified code like that. This is why you should be using WAB Developer version.

[IslamSaeed1]

I am using the portal for arcgis 10.6.1 out of the box WAB so there is no way to tweak this ?

[RobertScheitlin__GISP]

It's not impossible just extremely difficult.