S
S
SpeakeazyYT12019-08-12 12:37:29
JavaScript
SpeakeazyYT1, 2019-08-12 12:37:29

Why in my Google Chrome application, where 2 windows are created, the 2nd repeats the movement of the 1st, window 2 only moves horizontally?

Good evening.
I'm building my own Google Chrome app in JavaScript. I downloaded the source codes of the application https://github.com/GoogleChrome/chrome-app-samples... from github 5 years ago, where 2 windows are created, the black window is not active for moving, the white window is active accordingly. When moving the white window, as we would like, the black window should also move, exactly how many coordinates horizontally and vertically, how much the white window moved. But as I said, it does not happen, namely, the black window, when moving the white one, only moves horizontally, but not vertically.
You can see it clearly here - https://www.youtube.com/watch?v=FHwqRoA9XM4
When I first started the application, I was immediately greeted by a warning in the console:

'webkitRequestAnimationFrame' is vendor-specific. Please use the standard 'requestAnimationFrame' instead.

In the windows.js file on line 7:
onload = function() {
  function update() {
    ['screenX', 'screenY', 'innerWidth', 'innerHeight'].forEach(function(prop) {
      document.getElementById(prop).innerText = window[prop];
    });

    webkitRequestAnimationFrame(update);
  }

  update();

  var minimizeNode = document.getElementById('minimize-button');
  if (minimizeNode) {
    minimizeNode.onclick = function() {
      chrome.runtime.getBackgroundPage(function(background) {
        background.minimizeAll();
      });
    };
  }

  var closeNode = document.getElementById('close');
  if (closeNode) {
    closeNode.onclick = function() {
      window.close();
    };
  }
}

tKjf9yweVd0.jpg
I replaced webkitRequestAnimationFrame with requestAnimationFrame, the error disappeared from the console, but the windows still do not move normally

Also here is the main JS in the application that creates these windows and performs interaction actions - main.js
var windows = [];

/**
 * Resets the windows and removes
 * any interval that is running
 */
function reset() {

  windows.forEach( function (w) {
    w.contentWindow.close();
  } );

  windows.length = 0;
}

/**
 * Initialise and launch the windows
 * @see http://developer.chrome.com/apps/app.window.html
 */
function launch() {

  // reset everything
  reset();

  // create the original window
  chrome.app.window.create('original.html', {
      id: "mainwin",
      innerBounds: {
        top: 128,
        left: 128,
        width: 300,
        height: 300,
        minHeight: 300,
        maxWidth: 500,
        minWidth: 300
      },
      frame: 'none'
    },

    // when that is created store it
    // and create the copycat window
    function(originalWindow) {

      windows.push(originalWindow);

      chrome.app.window.create('copycat.html', {
        id: "copywin",
        innerBounds: {
          top: 128,
          left: 428 + 5,
          width: 300,
          height: 300,
          minHeight: 300,
          maxWidth: 500,
          minWidth: 300
        },
        frame: 'none'
      },

      function(copycatWindow) {

        // store the copycat
        windows.push(copycatWindow);

        // now have the copycat watch the
        // original window for changes
        originalWindow.onClosed.addListener(reset);
        copycatWindow.onClosed.addListener(reset);

        originalWindow.onBoundsChanged.addListener(function() {
          var bounds = originalWindow.outerBounds;
          copycatWindow.outerBounds.left = bounds.left + bounds.width + 5;
        });

        copycatWindow.onRestored.addListener(function() {
          console.log('copy restored');
          if (originalWindow.isMinimized())
            originalWindow.restore();
        })

        originalWindow.onRestored.addListener(function() {
          console.log('copy restored');
          if (copycatWindow.isMinimized())
            copycatWindow.restore();
        })

        originalWindow.focus();
      });
  });
}

/**
 * Minimises both the original and copycat windows
 * @see http://developer.chrome.com/apps/app.window.html
 */
function minimizeAll() {

  windows.forEach( function (w) {
    w.minimize();
  });
}

// @see http://developer.chrome.com/apps/app.runtime.html
chrome.app.runtime.onLaunched.addListener(launch);


Please help me solve the problem.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question