Skip to content

Commit 8694cb7

Browse files
Thorin-OakenpantsThorin-Oakenpants
authored
tweak (#336)
1 parent 2db0498 commit 8694cb7

File tree

3 files changed

+97
-48
lines changed

3 files changed

+97
-48
lines changed

‎js/globals.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const btnList = ['alerts', 'errors', 'lies']
1919

2020
const jsFilesExpected = 14,
2121
gSectionsExpected = 16,
22-
expectedMetrics = 153
22+
expectedMetrics = 154
2323
let jsFiles = 0, gCount = 0, gCountTiming = 0
2424

2525
// global
@@ -119,7 +119,9 @@ const screen_green = sgtick+'screens match]'+sc,
119119
window_green = sgtick+'windows match]'+sc,
120120
window_red = sbx+'windows match]'+sc,
121121
sizes_green = sgtick+'screen = inner]'+sc,
122-
sizes_red = sbx+'screen = inner]'+sc
122+
sizes_red = sbx+'screen = inner]'+sc,
123+
isizes_green = sgtick+'iframes = inner]'+sc,
124+
isizes_red = sbx+'iframes = inner]'+sc
123125

124126
// dynamic TB/MB notation
125127
let tb_green = sgtick+'TB]'+sc,

‎js/screen.js

+85-46
Original file line numberDiff line numberDiff line change
@@ -204,37 +204,46 @@ const get_scr_measure = () => new Promise(resolve => {
204204
Promise.all([
205205
get_scr_mm('measure'),
206206
]).then(function(mmres){
207-
let tmpScreen = {}, tmpWindow = {}, oScreen = {}, oWindow = {}
207+
let oTmp = {'screen': {}, 'window': {}, 'iframe': {}}, oIframe = {}, oScreen = {}, oWindow = {}
208208
// matchmedia
209-
tmpScreen["device-height"] = mmres[0]["device-height"]
210-
tmpScreen["device-width"] = mmres[0]["device-width"]
211-
tmpWindow["height"] = mmres[0]["height"]
212-
tmpWindow["width"] = mmres[0]["width"]
209+
oTmp.screen["device-height"] = mmres[0]["device-height"]
210+
oTmp.screen["device-width"] = mmres[0]["device-width"]
211+
oTmp.window["height"] = mmres[0]["height"]
212+
oTmp.window["width"] = mmres[0]["width"]
213213
// screen/window
214-
let aList = [
215-
"width","height","availWidth","availHeight", // scr
216-
"outerWidth","outerHeight","innerWidth","innerHeight", // window
217-
]
214+
let oList = {
215+
'screen': ["width","height","availWidth","availHeight"],
216+
'window': ["outerWidth","outerHeight","innerWidth","innerHeight"],
217+
"iframe": ["width","height","availWidth","availHeight","outerWidth","outerHeight"],
218+
}
219+
let iTarget
220+
try {iTarget = dom.iFrameBlank.contentWindow} catch(e) {}
221+
218222
//runST = true
219-
for (let i=0; i < 8; i++) {
220-
let x
221-
let prefix = ((i < 4) ? "screen" : "window") + '_sizes_'
222-
try {
223-
if (i < 4) {x = screen[aList[i]]
224-
} else {x = window[aList[i]]
225-
}
226-
if (runST) {
227-
let oTest = {1: NaN, 2: Infinity, 3: "", 4: "6", 5: null, 6: false, 7: [1], 8: {1:1}}
228-
x = oTest[i]
223+
for (const k of Object.keys(oList)) {
224+
let aList = oList[k]
225+
for (let i=0; i < aList.length; i++) {
226+
let x, p = aList[i]
227+
try {
228+
if ('screen' == k) {x = screen[p]
229+
} else if ('window' == k) {x = window[p]
230+
} else {
231+
if (i < 4) {x = iTarget.screen[p]} else {x = iTarget.window[p]}
232+
}
233+
if (runST) {
234+
let oTest = {1: NaN, 2: Infinity, 3: "", 4: "6", 5: null, 6: false, 7: [1], 8: {1:1}}
235+
x = oTest[i]
236+
}
237+
let typeCheck = typeFn(x)
238+
if ("number" !== typeCheck) {throw zErrType + typeCheck}
239+
} catch (e) {
240+
log_error(1, k +'_sizes_' + p, e)
241+
x = zErr
229242
}
230-
let typeCheck = typeFn(x)
231-
if ("number" !== typeCheck) {throw zErrType + typeCheck}
232-
} catch (e) {
233-
log_error(1, prefix + aList[i], e)
234-
x = zErr
243+
oTmp[k][p] = x
235244
}
236-
if (i < 4) {tmpScreen[aList[i]] = x} else {tmpWindow[aList[i]] = x}
237245
}
246+
238247
//runST = false
239248
// css
240249
let cssList = [
@@ -245,7 +254,6 @@ const get_scr_measure = () => new Promise(resolve => {
245254
]
246255
cssList.forEach(function(array) {
247256
let cssID = array[0], pseudo = array[1], item = array[2], metric = array[3]
248-
249257
let value = getElementProp(1, cssID, metric +'_sizes_'+ item, pseudo)
250258
if (value !== zErr && '?' !== value) {
251259
let cType = typeFn(value)
@@ -254,59 +262,89 @@ const get_scr_measure = () => new Promise(resolve => {
254262
value = zErr
255263
}
256264
}
257-
if (array[0] == "#S") {tmpScreen[item] = value} else {tmpWindow[item] = value}
265+
if (array[0] == "#S") {oTmp.screen[item] = value} else {oTmp.window[item] = value}
258266
})
259267
// default display
260268
let oDisplay = {
261-
"mAvailable": tmpScreen.availWidth +" x "+ tmpScreen.availHeight,
262-
"mmScreen": tmpScreen["device-width"] +" x "+ tmpScreen["device-height"],
263-
"mScreen": tmpScreen.width +" x "+ tmpScreen.height,
264-
"mOuter": tmpWindow.outerWidth +" x "+ tmpWindow.outerHeight,
265-
"mmInner": tmpWindow.width +" x "+ tmpWindow.height,
266-
"mInner": tmpWindow.innerWidth +" x "+ tmpWindow.innerHeight,
269+
"iAvailable": oTmp.iframe.availWidth +" x "+ oTmp.iframe.availHeight,
270+
"iScreen": oTmp.iframe.width +" x "+ oTmp.iframe.height,
271+
"iOuter": oTmp.iframe.outerWidth +" x "+ oTmp.iframe.outerHeight,
272+
"mAvailable": oTmp.screen.availWidth +" x "+ oTmp.screen.availHeight,
273+
"mmScreen": oTmp.screen["device-width"] +" x "+ oTmp.screen["device-height"],
274+
"mScreen": oTmp.screen.width +" x "+ oTmp.screen.height,
275+
"mOuter": oTmp.window.outerWidth +" x "+ oTmp.window.outerHeight,
276+
"mmInner": oTmp.window.width +" x "+ oTmp.window.height,
277+
"mInner": oTmp.window.innerWidth +" x "+ oTmp.window.innerHeight,
267278
"initialInner": isInitial.innerWidth + " x " + isInitial.innerHeight,
268279
"initialOuter": isInitial.outerWidth + " x " + isInitial.outerHeight,
269280
}
270281

271282
// order into new objects
272-
for (const k of Object.keys(tmpScreen).sort()) {oScreen[k] = tmpScreen[k]}
273-
for (const k of Object.keys(tmpWindow).sort()) {oWindow[k] = tmpWindow[k]}
283+
for (const k of Object.keys(oTmp.screen).sort()) {oScreen[k] = oTmp.screen[k]}
284+
for (const k of Object.keys(oTmp.window).sort()) {oWindow[k] = oTmp.window[k]}
285+
for (const k of Object.keys(oTmp.iframe).sort()) {oIframe[k] = oTmp.iframe[k]}
274286

275287
// notations
276288
let notation ='', initData = zNA, initHash =''
277289
// screen_size_matches_inner
278-
let oCompare = {1: [oScreen.width, oScreen.height, oWindow.innerWidth, oWindow.innerHeight]}
290+
let oCompare = {
291+
'screen_size_matches_inner': [sizes_red, sizes_green, oScreen.width, oScreen.height, oWindow.innerWidth, oWindow.innerHeight],
292+
'iframe_sizes_match_inner': [isizes_red, isizes_green,
293+
oIframe.availWidth, oIframe.availHeight, oIframe.width, oIframe.height, oIframe.outerWidth, oIframe.outerHeight
294+
],
295+
}
279296
// window_sizes_initial
280297
if ('android' == isOS) {
281-
oCompare[2] = [isInitial.innerWidth, isInitial.innerHeight, isInitial.outerWidth, isInitial.outerHeight]
298+
oCompare['window_sizes_initial'] = [window_red, window_green,
299+
isInitial.innerWidth, isInitial.innerHeight, isInitial.outerWidth, isInitial.outerHeight
300+
]
282301
// FP data
283302
initData = isInitial; initHash = mini(isInitial)
284303
} else {
285304
// LB/NW
286-
addDisplay(1, 'window_letterbox','','', return_lb(tmpWindow.innerWidth, tmpWindow.innerHeight, isTB))
287-
addDisplay(1, 'window_newwin','','', return_nw(tmpWindow.innerWidth, tmpWindow.innerHeight, isTB))
305+
addDisplay(1, 'window_letterbox','','', return_lb(oTmp.window.innerWidth, oTmp.window.innerHeight, isTB))
306+
addDisplay(1, 'window_newwin','','', return_nw(oTmp.window.innerWidth, oTmp.window.innerHeight, isTB))
288307
}
308+
let isIframesSame = false
289309
for (const k of Object.keys(oCompare)) {
290310
let isValid = true, data = oCompare[k]
291-
notation = k == 1 ? sizes_red : window_red
292-
let target = k == 1 ? "screen_size_matches_inner" : "window_sizes_initial"
293-
for (let i=0; i < 4; i++) {if ("number" !== typeFn(data[i])) {isValid = false; break}}
311+
notation = data[0]
312+
for (let i=2; i < oCompare[k].length; i++) {if ("number" !== typeFn(data[i])) {isValid = false; break}}
294313
if (isValid) {
295-
if (data[0] +""+ data[1] === data[2] +""+ data[3]) {notation = k == 1 ? sizes_green : window_green}
314+
let isGood = false
315+
let test1 = data[2] +''+ data[3], test2 = data[4] +''+ data[5]
316+
if ('iframe_sizes_match_inner' == k) {
317+
let test3 = data[6] +''+ data[7]
318+
if (test1 === test2 && test1 == test3) {
319+
isIframesSame = true
320+
if (test1 === oWindow.innerWidth +''+ oWindow.innerHeight) {isGood = true}
321+
}
322+
} else {
323+
if (test1 === test2) {isGood = true}
324+
}
325+
if (isGood) {notation = data[1]}
296326
}
297-
addDisplay(1, target,'','', notation)
327+
addDisplay(1, k,'','', notation)
298328
}
299329
// ToDo: screen_sizes (_match)
300330
// ToDo: window_sizes (_match)
301331

332+
//addDisplay(1, 'iframe_sizes_match_inner','','', isizes_red)
333+
302334
// simple health lookups
303335
if (gRun) {
304-
let strInner = tmpWindow.innerWidth +' x '+ tmpWindow.innerHeight
305-
let strScreen = tmpScreen['device-width'] +' x '+ tmpScreen['device-height']
336+
let strInner = oTmp.window.innerWidth +' x '+ oTmp.window.innerHeight
337+
let strScreen = oTmp.screen['device-width'] +' x '+ oTmp.screen['device-height']
306338
let scrMatch = strInner == strScreen ? strInner : 'inner: '+ strInner +' | screen: '+ strScreen
307339
let initInner = isInitial.innerWidth + " x " + isInitial.innerHeight
308340
let initOuter = isInitial.outerWidth + " x " + isInitial.outerHeight
309341
let initMatch = initInner == initOuter ? initInner : 'inner: '+ initInner +' | outer: '+ initOuter
342+
let iframeMatch = "available: "+ oTmp.iframe.availWidth +" x "+ oTmp.iframe.availHeight
343+
+ " | screen: "+ oTmp.iframe.width +" x "+ oTmp.iframe.height
344+
+ " | outer: "+ oTmp.iframe.outerWidth +" x "+ oTmp.window.outerHeight
345+
if (isIframesSame) {iframeMatch = oTmp.iframe.availWidth +" x "+ oTmp.iframe.availHeight}
346+
347+
sDetail[isScope].lookup['iframe_sizes_match_inner'] = iframeMatch
310348
sDetail[isScope].lookup['screen_size_matches_inner'] = scrMatch
311349
sDetail[isScope].lookup['window_letterbox'] = strInner
312350
sDetail[isScope].lookup['window_newwin'] = strInner
@@ -316,6 +354,7 @@ const get_scr_measure = () => new Promise(resolve => {
316354
for (const k of Object.keys(oDisplay)) {addDisplay(1, k, oDisplay[k])}
317355
addData(1, "screen_sizes", oScreen, mini(oScreen))
318356
addData(1, "window_sizes", oWindow, mini(oWindow))
357+
addData(1, "iframe_sizes", oIframe, mini(oIframe))
319358
addData(1, "window_sizes_initial", initData, initHash)
320359
return resolve()
321360
})

‎tzp.html

+8
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@
7878
</div>
7979
<!--hidden-->
8080
<div class="hidden">
81+
<iframe id="iFrameBlank"></iframe>
8182
<span id="sColorElement"></span>
8283
<div id="dprBorder" style="border: 0.1px solid;">foo</div>
8384
<div class="normalized">
@@ -197,6 +198,13 @@
197198
<span class="c" id="screen_orientation_-moz-device-orientation"></span> | <span class="c" id="screen_orientation_device-aspect-ratio"></span>
198199
</td></tr>
199200

201+
<!--iframe-->
202+
<tr><td>[iframe] available screen</td><td class="c mono" id="iAvailable"></td></tr>
203+
<tr><td>[iframe] screen</td><td class="c mono" id="iScreen"></td></tr>
204+
<tr><td>[iframe] outer window</td><td class="mono border-bottom">
205+
<span class="c" id="iOuter"></span><span class="c" id="iframe_sizes_match_inner"></span>
206+
</td></tr>
207+
200208
<!--screen: measurements-->
201209
<tr><td>available screen</td>
202210
<td class="mono"><span class="c" id="mAvailable"></span><span class="c" id="screen_sizes"></span></td></tr>

0 commit comments

Comments
 (0)