topic Re: widget auto launch location in ArcGIS Web AppBuilder Questions

widget auto launch location

CCWeedcontrol — Sun, 12 Dec 2021 03:40:17 GMT

I have an app with two widgets that auto launch when the app is opened. The problem is that these two widgets cover the zoom, home, locate icons and the widget icons on the top right at start up. I've tried editing the Panel.js to moving them based on this thread but mine seems different so i am not sure what lines to edit and with what? I tried adding line position.left += 50; to line 29 but the panels are still over the icons.

I am working with the Launchpad Theme.

Thanks.

Here is what mine looks like.

_setPositionStyle: function(pos){
      var style;

      if(this.position.zIndex){
        pos.zIndex = this.position.zIndex;
      }
      this.position.left = pos.left;
      this.position.top = pos.top;
      this.position.width = pos.width;
      this.position.height = pos.height;

      style = utils.getPositionStyle(pos);
      lang.mixin(style, pos.borderRadiusStyle);
      domStyle.set(this.domNode, style);
    },

    onWindowResize: function(){
      var position = {}, box;

      if(this.windowState === 'minimized'){
        return; //do nothing if panel is minimized.
      }

      if(window.appInfo.isRunInMobile){
        box = this._getLayoutBox();

        if(this.windowState === 'maximized'){
          position.top = 0;
          position.left += 50; 
          position.height = box.h;
        }else{
          position.top = box.h / 2;
          position.height = box.h / 2;
        }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: widget auto launch location

RobertScheitlin__GISP — Thu, 09 Mar 2017 22:25:03 GMT

what version of WAB?

Re: widget auto launch location

CCWeedcontrol — Thu, 09 Mar 2017 22:39:36 GMT

oops my bad WAB 2.3

Re: widget auto launch location

RobertScheitlin__GISP — Sun, 12 Dec 2021 03:40:20 GMT

For 2.3 the instructions are the same. Here is the code block in that version (line 18):

    /**
     * @override
     * @param {Object} position      contains these fields: left, top, width, height,
     * margin and index
     * @param {[type]} containerNode [description]
     */
    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();
    },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: widget auto launch location

CCWeedcontrol — Fri, 10 Mar 2017 18:06:40 GMT

Robert that seem to work for just the Legend widget, but the Esearch popup is blocking the the widgets on the right. I can't seem to find the location of code to add position.left+=50: for Permit Search widget.

Re: widget auto launch location

RobertScheitlin__GISP — Fri, 10 Mar 2017 18:08:25 GMT

I am a little confused. Can you provide a screenshot?

Re: widget auto launch location

CCWeedcontrol — Fri, 10 Mar 2017 19:55:43 GMT

sure.

I have two widgets that pop up when the application is started, the Legend and Permit Search. I was able to move the legend widget with the code you posted but you can see that the Permit Search widget is blocking the widget icons on the top right corner at start up.

Re: widget auto launch location

RobertScheitlin__GISP — Sun, 12 Dec 2021 03:40:23 GMT

That is a WHOLE other thing when dealing with on screen placeholder widgets vs Launchpad anchor bar.

jimu/OnScreenWidgetPanel.js

      _getPositionInfo: function() {
        var result = {
          isRunInMobile: false,
          position: {
            left: 0,
            top: 5
          }
        };
        var layoutBox = this._getLayoutBox();
        //judge width
        var leftBlankWidth = this._positionInfoBox.l;
        if (!window.appInfo.isRunInMobile) {
          if (window.isRTL) {
            result.position.left = layoutBox.w - leftBlankWidth;

            // prevent the panel out of map content
            if ((result.position.left + this._positionInfoBox.w) > layoutBox.w) {
              result.position.left -= this._positionInfoBox.w;
              if (result.position.left < 0) {
                result.position.left = layoutBox.w - this._positionInfoBox.w;
              }
            }
          } else {
            result.position.left = leftBlankWidth;
            // prevent the panel out of map content
            if ((result.position.left + this._positionInfoBox.w) > layoutBox.w) {
              if (layoutBox.w > this._positionInfoBox.w) {
//This is my change adding - 70 
                result.position.left = layoutBox.w - this._positionInfoBox.w - 70;
              } else {
                result.position.left = 0;
              }
            }
          }
        } else {
          result.isRunInMobile = true;
          return result;
        }

        //judge height
        // preloadIcon height is 40px, tolerance is 3px
        var topBlankHeight = this._positionInfoBox.t;
        var bottomBlankHeight = layoutBox.h - topBlankHeight;
        if (topBlankHeight >= bottomBlankHeight) {
          if (topBlankHeight >= this._positionInfoBox.h) { // preloadIcon height is 40px
            result.position.top = this._positionInfoBox.t - this._positionInfoBox.h - 40 - 3;
          }
        } else {
          if (bottomBlankHeight >= this._positionInfoBox.h) {
//This is my change commenting out the + 40 + 3
            result.position.top = this._positionInfoBox.t;// + 40 + 3; // preloadIcon height is 40px
          }
        }

        return result;
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: widget auto launch location

CCWeedcontrol — Mon, 13 Mar 2017 15:08:47 GMT

Awesome Thank you.

Re: widget auto launch location

CCWeedcontrol — Thu, 01 Jun 2017 21:57:30 GMT

Sorry to bring this back up but i has been bothering me and can't figure out how to move the windows down.

Pic one curently show how the ESearch appears at launch, pic two is how i would like it to appear at lunch it doesn't cover up the toggle buttons. What do i need to change to get to ESarch auto lunch to move down.