<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: slapdash</title>
    <description>The latest articles on DEV Community by slapdash (@flee2free).</description>
    <link>https://dev.to/flee2free</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F652914%2F3b045989-827e-4d6d-b2b5-774ed43e0424.jpeg</url>
      <title>DEV Community: slapdash</title>
      <link>https://dev.to/flee2free</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/flee2free"/>
    <language>en</language>
    <item>
      <title>Yabai - Toggle Window</title>
      <dc:creator>slapdash</dc:creator>
      <pubDate>Mon, 12 Jul 2021 14:02:32 +0000</pubDate>
      <link>https://dev.to/flee2free/yabai-toggle-window-4536</link>
      <guid>https://dev.to/flee2free/yabai-toggle-window-4536</guid>
      <description>&lt;p&gt;Window Management is no doubt the most boring stuff that no one wants to be doing. I used to have various shortcuts and hot corners set, to size up/down the window as needed. &lt;a href="https://magnet.crowdcafe.com/"&gt;Magnet&lt;/a&gt;, &lt;a href="https://manytricks.com/moom/"&gt;Moom&lt;/a&gt;, &lt;a href="https://www.spectacleapp.com"&gt;Spectacle&lt;/a&gt; were amongst the few that i used. Then i discovered &lt;a href="https://github.com/koekeishiya/yabai"&gt;Yabai&lt;/a&gt;, it blew my mind off. You no longer need to remember all the crazy shortcuts. The windows are neatly tiled for you to work on and as a bonus those handful of not needed shortcuts could now be used for other important actions.&lt;/p&gt;

&lt;p&gt;Yabai automatically partitions your windows using Binary Space Partitioning. There are lot of tutorials dedicated to configure and setup Yabai. I would suggest you go look into it first. Along with Yabai please do look into &lt;a href="https://github.com/koekeishiya/skhd"&gt;SKHD&lt;/a&gt;, this helps you setup the hotkeys to manipulate the Yabai calls. &lt;/p&gt;

&lt;p&gt;Now, lets say you are comfortable with Yababi and it's inner workings including SKHD, I would like to share a small snippet that i use all the time to quickly float and toggle the size of the window with just a single shortcut. &lt;/p&gt;

&lt;h5&gt;
  
  
  resize.sh
&lt;/h5&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;#!/bin/sh

    xpt=$(yabai -m query --windows --window | jq -re '. | .frame.x')

    _log() {
        terminal-notifier -message $1
    }

    _big() {
        yabai -m window --grid 16:32:4:2:24:12
        _log 'big'
    }

    _medium() {
        yabai -m window --grid 16:32:6:2:20:12
        _log 'medium'
    }

    _small() {
        yabai -m window --grid 16:32:8:3:16:10
        _log 'small'
    }

    [[ $xpt -gt 481 ]] &amp;amp;&amp;amp; _small
    [[ $xpt -le 481 &amp;amp;&amp;amp; $xpt -gt 361 ]] &amp;amp;&amp;amp; _medium
    [[ $xpt -le 361 &amp;amp;&amp;amp; $xpt -gt 241 ]] &amp;amp;&amp;amp; _big
    [[ $xpt -le 241 ]] &amp;amp;&amp;amp; _small
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Query the current active window to retrieve the window coordinates. It uses jq to parse the JSON output that the yabai command spits out. &lt;code&gt;xpt=$(yabai -m query --windows --window | jq -re '. | .frame.x')&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Yabai uses the grid system to understand the window size. I have defined a small window as follows &lt;code&gt;yabai -m window --grid 16:32:8:3:16:10&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Define various reference points as the x  coordinates (xpt) to anchor the size of the window. Eg. in my setup the small window size falls exactly at the 481 pixel points. Use the range to define the toggle that cycles between big, medium and small.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    [[ $xpt -gt 481 ]] &amp;amp;&amp;amp; _small
    [[ $xpt -le 481 &amp;amp;&amp;amp; $xpt -gt 361 ]] &amp;amp;&amp;amp; _medium
    [[ $xpt -le 361 &amp;amp;&amp;amp; $xpt -gt 241 ]] &amp;amp;&amp;amp; _big
    [[ $xpt -le 241 ]] &amp;amp;&amp;amp; _small
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now, the final part to trigger this shell script, i have assigned a hot key combination with skhd as follows &lt;code&gt;ctrl + cmd - c : ~/bin/resize.sh&lt;/code&gt;. You need to add this to your skhdrc (configuration file for SKHD).&lt;/p&gt;

&lt;p&gt;This is a small inspiration and there are much more to play around with this amazing window tiling manager.&lt;/p&gt;

&lt;h2&gt;
  
  
  References
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/koekeishiya/yabai"&gt;yabai&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/koekeishiya/skhd"&gt;skhd&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/stedolan/jq"&gt;jq&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/julienXX/terminal-notifier"&gt;terminal-notifier&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
    </item>
  </channel>
</rss>
