# Node red dashboard detect and output screen width

**URL:** https://discourse.nodered.org/t/node-red-dashboard-detect-and-output-screen-width/84308
**Category:** Dashboard
**Created:** [5 January 2024 07:49 UTC](https://discourse.nodered.org/t/node-red-dashboard-detect-and-output-screen-width/84308 "2024-01-05T07:49:13Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Ideasbuilders](https://avatars.discourse-cdn.com/v4/letter/i/5f8ce5/32.png) [@Ideasbuilders](https://discourse.nodered.org/u/Ideasbuilders)
#### Post date: [5 January 2024 07:49 UTC](https://discourse.nodered.org/t/node-red-dashboard-detect-and-output-screen-width/84308/1 "2024-01-05T07:49:13Z")

</div>

Hi,  
is there any ways for dashboard to detect and output screen width to node output?

---

<div class="post-metadata">

### Author: ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [6 January 2024 16:06 UTC](https://discourse.nodered.org/t/node-red-dashboard-detect-and-output-screen-width/84308/2 "2024-01-06T16:06:27Z")

</div>

There is. And many more than just the screen.  
Example contains more than just the screen width but you'll get the point.  
It fires message on init and is capable also to send same data on demand.

```auto
[{"id":"f6a3dd5921436153","type":"ui_template","z":"f8b8c963bdc117f5","group":"55888982bdd0637f","name":"","order":1,"width":0,"height":0,"format":"<script>\n(function(scope) {\n const getHorizontalDimensions = () => { \n return { \n screen:{\n width:screen.width,\n availWidth:screen.availWidth\n }, \n window:{\n innerWidth:window.innerWidth,\n outerWidth:window.outerWidth\n },\n document:{\n clientWidth:document.documentElement.clientWidth,\n scrollWidth:document.documentElement.scrollWidth\n }\n }\n } \n scope.send({payload:getHorizontalDimensions()})\n \n scope.$watch('msg', function(msg) {\n if (msg) {\n if(msg.topic == \"get-width\"){\n scope.send({payload:getHorizontalDimensions()})\n }\n }\n });\n\n})(scope);\n</script>","storeOutMessages":true,"fwdInMessages":false,"resendOnRefresh":true,"templateScope":"local","className":"","x":520,"y":380,"wires":[["354adbba6efd0aa1"]]},{"id":"354adbba6efd0aa1","type":"debug","z":"f8b8c963bdc117f5","name":"debug 348","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":710,"y":380,"wires":[]},{"id":"24175006327630b9","type":"inject","z":"f8b8c963bdc117f5","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"get-width","payload":"","payloadType":"date","x":330,"y":380,"wires":[["f6a3dd5921436153"]]},{"id":"55888982bdd0637f","type":"ui_group","name":"1. group","tab":"62083694d0eab7ca","order":1,"disp":true,"width":"6","collapse":false,"className":""},{"id":"62083694d0eab7ca","type":"ui_tab","name":"Home","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

### Author: ![Ideasbuilders](https://avatars.discourse-cdn.com/v4/letter/i/5f8ce5/32.png) [@Ideasbuilders](https://discourse.nodered.org/u/Ideasbuilders)
#### Post date: [9 January 2024 02:17 UTC](https://discourse.nodered.org/t/node-red-dashboard-detect-and-output-screen-width/84308/3 "2024-01-09T02:17:49Z")

</div>

Great, thanks

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)
#### Post date: [23 January 2024 02:17 UTC](https://discourse.nodered.org/t/node-red-dashboard-detect-and-output-screen-width/84308/4 "2024-01-23T02:17:53Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.