Skip to content

Commit

Permalink
fix nav
Browse files Browse the repository at this point in the history
  • Loading branch information
notwaldorf committed Sep 9, 2024
1 parent 78f9eea commit 03086d7
Show file tree
Hide file tree
Showing 83 changed files with 12,308 additions and 24 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
I"�{"source"=>"/Users/monica/Code/notwaldorf.github.com", "destination"=>"/Users/monica/Code/notwaldorf.github.com/_site", "collections_dir"=>"", "cache_dir"=>".jekyll-cache", "plugins_dir"=>"_plugins", "layouts_dir"=>"_layouts", "data_dir"=>"_data", "includes_dir"=>"_includes", "collections"=>{"posts"=>{"output"=>true, "permalink"=>"/posts/:title/"}, "weeks"=>{"output"=>true, "permalink"=>"/posts/:title"}}, "safe"=>false, "include"=>[".htaccess"], "exclude"=>[".sass-cache", ".jekyll-cache", "gemfiles", "Gemfile", "Gemfile.lock", "node_modules", "vendor/bundle/", "vendor/cache/", "vendor/gems/", "vendor/ruby/"], "keep_files"=>[".git", ".svn"], "encoding"=>"utf-8", "markdown_ext"=>"markdown,mkdown,mkdn,mkd,md", "strict_front_matter"=>false, "show_drafts"=>nil, "limit_posts"=>0, "future"=>true, "unpublished"=>false, "whitelist"=>[], "plugins"=>["jekyll-redirect-from"], "markdown"=>"kramdown", "highlighter"=>"rouge", "lsi"=>false, "excerpt_separator"=>"\n\n", "incremental"=>false, "detach"=>false, "port"=>"4000", "host"=>"127.0.0.1", "baseurl"=>nil, "show_dir_listing"=>false, "permalink"=>"/posts/:title/", "paginate_path"=>"/page:num", "timezone"=>nil, "quiet"=>false, "verbose"=>false, "defaults"=>[], "liquid"=>{"error_mode"=>"warn", "strict_filters"=>false, "strict_variables"=>false}, "kramdown"=>{"auto_ids"=>true, "toc_levels"=>[1, 2, 3, 4, 5, 6], "entity_output"=>"as_char", "smart_quotes"=>"lsquo,rsquo,ldquo,rdquo", "input"=>"GFM", "hard_wrap"=>false, "guess_lang"=>true, "footnote_nr"=>1, "show_warnings"=>false, "syntax_highlighter"=>"rouge", "syntax_highlighter_opts"=>{:default_lang=>"plaintext", :guess_lang=>true}, "coderay"=>{}}, "name"=>"Monica Dinculescu", "url"=>"http://localhost:4000", "description"=>"A wild blog appears.", "twitter"=>"notwaldorf", "gravatar_url"=>"https://s.gravatar.com/avatar/053e75a5b48b44d6dd0612795dfb326d", "google_analytics_tracking_id"=>"UA-47334320-2", "livereload_port"=>35729, "serving"=>true, "watch"=>true}:ET
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
I"<<p>I’ve never really done a year in review. One day, I’d like to <a href="https://github.com/una/personal-goals">open source</a>
my goals, but since I’m still a chicken, this is a baby step towards that. Plus, this is
one of the first years I’m really proud of, and things that you’re proud of tend
to live on the Internet, for posterity.</p>

<p>Here’s what my GitHub contributions say about it:</p>

<p><img alt="2015 contribution graph" src="https://cloud.githubusercontent.com/assets/1369170/12084003/d0f4558a-b261-11e5-84f4-d28e947dd75d.png" /></p>

<h2 id="burning-out">Burning out</h2>
<p>The year started off really poorly. My team had just shipped the new Profiles
UI in Chrome, after a year and a half of hard work, and it was met with a looooot
of Internet anger. On one side we had data to prove that the change we did was right, which made
the powers that be want to stick by it; on the other side I had Twitter,
who was calling me names and wanting me fired. Kind of ironic, since
I was just the person who implemented the feature and had no power
to change it.</p>

<p>I think what burnt me out wasn’t waking up to a stream of negative
emails and tweets, it was knowing that there was absolutely nothing I could do about
it other than wait.</p>

<p>So I started working on dumb side projects to feel better. I made a
<a href="http://meowni.ca/meowto/">link aliaser</a>. I bought <a href="http://canihaveapony.com/">dumb</a>
domains. I wrote <a href="http://meowni.ca/posts/chromium-101/">blog</a> <a href="http://meowni.ca/posts/chromium-owners">posts</a>
about the only thing that I knew, which was working on Chromium.
I noticed that not working on Chromium made me happy.</p>

<p>So I bit the bullet, left Chromium, and joined Polymer.</p>

<h2 id="joining-polymer">Joining Polymer</h2>
<p>Looking back, I picked Polymer for a bunch of silly reasons that ended up working out
spectacularly well. I wanted to leave Montreal. I wanted to work on JavaScript,
since it was the only thing keeping me going. I didn’t want to commute to Mountain View,
which reduced my options by like a billion percent, and I wanted to ship things.
Polymer had all of that. So on April 15, I packed my cat and my books
and moved to San Francisco.</p>

<p>Polymer is my dream job. I get to write code
that I’m genuinely passionate about. I get to try to change the web platform, and talk
about why I think we’re doing the right thing. Most importantly, I get to ship
something everyday. It turns out that’s a thing that matters to me a lot.</p>

<p>I miss working on Chromium. I miss C++ and the big-ness and complicated-ness
that is working on a browser. It taught me that if I could find my way around
the 7 million lines of code and actually do something useful, there’s basically
nothing that I can’t do or learn. That’s one of the best feelings.</p>

<h2 id="tl-dr">TL; DR.</h2>

<p>I shipped 5 projects:</p>

<ul>
<li><a href="http://meowni.ca/meowto/">meowto</a></li>
<li><a href="http://meowni.ca/emoji-translate/">emoji-translate</a></li>
<li><a href="https://caturday-post.herokuapp.com/">caturday post</a></li>
<li><a href="http://meowni.ca/emoji-rain/">emoji-rain</a></li>
<li><a href="http://meowni.ca/muster/#6&amp;23">muster</a></li>
<li><a href="http://meowni.ca/is-ie10-dead/">is IE10 dead</a></li>
</ul>

<p><br />
I gave 5 different talks at 3 conferences and 2 meetups:</p>

<ul>
<li>Contributing to Chromium, <a href="https://speakerdeck.com/notwaldorf/contributing-to-chromium">slides</a></li>
<li>Push notifications for fun and profit, <a href="https://speakerdeck.com/notwaldorf/push-notifications-for-fun-and-profit-if-by-profit-you-mean-cats">slides</a>, <a href="https://vimeo.com/137771040">video</a></li>
<li>Styling the Shadow DOM without dragons, <a href="https://speakerdeck.com/notwaldorf/styling-the-shadow-dom-without-dragons">slides</a>, <a href="https://www.youtube.com/watch?v=IbOaJwqLgog">video</a></li>
<li>Input I &lt;3 you but you’re bringing me down, <a href="https://speakerdeck.com/notwaldorf/input-i-3-you-but-youre-bringing-me-down">slides</a>, <a href="https://vimeo.com/144980655">video</a></li>
<li>How I didn’t fix emoji in Chrome, <a href="https://speakerdeck.com/notwaldorf/or-how-i-didnt-fix-emoji-in-chrome">slides</a></li>
</ul>

<p><br />
I wrote a blog post that a lot of people liked. Most importantly, this happened (#humblebrag):</p>
<blockquote class="twitter-tweet" lang="en"><p lang="en" dir="ltr">I think <a href="https://t.co/eAoYZGWieP">https://t.co/eAoYZGWieP</a> by <a href="https://twitter.com/notwaldorf">@notwaldorf</a> may be the best thing I have ever read</p>&mdash; Jeff Atwood (@codinghorror) <a href="https://twitter.com/codinghorror/status/657371215800086529">October 23, 2015</a></blockquote>
<script async="" src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

<p><br />
I had my first ever interview, on <a href="https://usesthis.com/interviews/monica.dinculescu/">The Setup</a>. I spoke on my
first ever podcast, <a href="http://hanselminutes.com/499/understanding-web-components-and-polymer-with-monica-dinculescu">Hanselminutes</a>.
I discovered <a href="https://www.instagram.com/p/9aW5ZxIrBu">#nailconf</a>, which reassures me I can be both a giant nerd and have pretty nails. I kept
3 succulents alive, accidentally killed one, and resurrected a fig leaf tree. I saw my first live
baseball and basketball games. I bought a second
<a href="https://www.instagram.com/p/-VIJ05orDH">ukulele</a>. I didn’t work on weekends. I didn’t spoil Star Wars for
anybody. I turned 30.</p>

<h2>🎉</h2>
<p>See y’all next year, internet friends!</p>
:ET
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
I"0 <ul>
<li>
<p><a href="https://www.nintendo.com/games/detail/calico-switch/">Calico</a> came out and I finished it in 2 days! It’s an adorably cute game about running a pet cafe in a fantastical little world. It’s honestly the kind of game I would make. It has an incredible cooking activity interaction, which I can only describe as “shit, this game engine has physics and collision detection, let’s use it for something!”. It’s great. (spoilers if you don’t want to play it: the interaction is “you turn into a smol person and throw the cooking ingredients that are now bigger than you at a giant bowl”. it’s wonderful.)</p>
</li>
<li>
<p>I am now playing Fenyx Rising on the Switch because it looked like a Zelda Breath of the Wild clone and can confirm: it’s basically BOTW minus cooking plus quality of life improvements (swords don’t break! more looting and outfits!) and sassy greek gods. Don’t know how the Ubisoft lawyers managed to sweep that under the rug, but I for one welcome the 50+ hours of gameplay ahead of me.</p>
</li>
<li>
<p>I tried to make a Queen of Puddings desert because I saw it on celebrity bakeoff and like Dizzee Rascal (self proclaimed literal first time baker) managed to follow the recipe and do it so I felt overconfident. My custard didn’t set; I would’ve come last in the technical challenge. Also, it was WAY too sweet in my opinion, but at least that part wasn’t my fault.</p>
</li>
<li>
<p>I also made my own homemade kaya! I discovered kaya when I was in Singapore 2 years ago, and it was life changing. A kaya toast set is probably my favourite breakfast concept, and I missed having it since I ran out of the Ya Kun kaya I bought on that trip. Worry no more: I am back on that bullshit.</p>
</li>
<li>
<p>I am doing a 2 week <a href="https://www.chloeting.com/program/2020/two-weeks-shred-challenge.html">Chloe Ting program</a>, which means I have exercised every day this week. This is a huge record that I am very proud of, because I think exercising is the most boring and awful activity in the universe. I hated every minute of it, but by Sunday the minutes SEEM to at least pass faster? I dunno fam, it’s not great.</p>
</li>
<li>
<p>I’ve started cross stitching while watching the Mentalist. It feels…oddly relaxing? I have no idea what I’m going to do with the result of cross stitching though, hang it in a bathroom somewhere? Is it too early to go down the pensioner aesthetic route?</p>
</li>
<li>
<p>The linocut print of generated-with-javascript tree ring is almost done! I’ve been making some test prints, and they’re cute! I think I’m going to write a blog post about the process because I am very happy with it!</p>
</li>
<li>
<p>I think summer is coming. Better get that SPF out.</p>
</li>
</ul>
:ET
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
I"0!<p>Because that would be crazy. Crazy is in the next blog post.</p>

<p>I’ve had to write a sizeable chunk of (fairly mediocre) Objective-C code recently, and I’ve formed the following opinions:</p>

<ul>
<li>It’s easier if you just get over the thing with the brackets</li>
<li>Event listeners are sooper cool</li>
<li>Standard Cocoa controls are great if you want them to look exactly like Apple wants them to look like</li>
<li>If you disagree with the above point, you’re going to have to play subclass bingo</li>
</ul>

<h2 id="subclass-bingo">Subclass bingo</h2>
<p>You’re a subclass bingo winner when you’ve made a custom class out of all of the NSControls. If this sounds ridiculous, it just means you haven’t tried hard enough.</p>

<p>I started playing subclass bingo at the same time I started mumbling Cocoa, which was two months ago; I relied on the internet a lot for help. Sometimes the internet let me down, as it is wont to do, and then I had to ask actual humans things that in retrospect were fairly trivial. To save you from bringing a pox on both your houses, here are three (3) custom controls that you might one day look for.</p>

<p>All of them live in the <a href="http://www.chromium.org/Home">Chromium</a> code zoo now. Token feeding and photography sessions are held three times a day, weather permitting.</p>

<h2 id="nsbutton-with-custom-padding">NSButton with custom padding</h2>
<p>By default, if you have an NSButton that has an image and a title, these will be squished right next to each other. This doesn’t always look very pretty. By default, we get the thing on the left. We want the thing on the right.</p>

<p><img src="/images/2014-01-30-button-padding.png" alt="NSButton with padding" /></p>

<p>The way we’re going to fix this is by creating a custom <code class="language-plaintext highlighter-rouge">NSButtonCell</code>, and overriding its <code class="language-plaintext highlighter-rouge">-drawTitle</code> method (I actually mean <code class="language-plaintext highlighter-rouge">-drawTitle:withFrame:inView:</code>, but I’m going to keep dropping the other parameters to make things look less scary. You can find everything in the <a href="https://developer.apple.com/library/mac/documentation/cocoa/reference/applicationkit/classes/NSButtonCell_Class/Reference/Reference.html">docs</a>, which are quite lovely).</p>

<p>If you also want to give your button a left margin (I did. I wanted that), you can also override <code class="language-plaintext highlighter-rouge">-drawImage</code> and add some spacing in there. The only thing you need to keep in mind is that because you’re adding all this spacing to the cell, you’ll need to manually update <code class="language-plaintext highlighter-rouge">-cellSize</code>, so that the correct value gets returned and your title isn’t cut off.</p>

<p>The full implementation is <a href="https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/ui/cocoa/browser/profile_chooser_controller.mm&amp;l=345">here</a>, and its use is <a href="https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/ui/cocoa/browser/profile_chooser_controller.mm&amp;l=402">here</a>. The important bits are:</p>

<figure class="highlight"><pre><code class="language-objective-c" data-lang="objective-c">- (NSRect)drawTitle:(NSAttributedString*)title
withFrame:(NSRect)frame
inView:(NSView*)controlView {
// This is the text's origin, which is from the left margin of the button.
// If you add a left margin in -drawImage, you have to add it here as well.
frame.origin.x += spacing_;
return [super drawTitle:title withFrame:frame inView:controlView];
}
- (NSSize)cellSize {
NSSize buttonSize = [super cellSize];
buttonSize.width += spacing_;
return buttonSize;
}</code></pre></figure>

<h2 id="nsbutton-with-a-transparent-background-color">NSButton with a transparent background color</h2>
<p>Setting a normal, opaque background on a button is easy. You can do something like <code class="language-plaintext highlighter-rouge">[[button cell] setBackgroundColor:[NSColor blueColor]]</code>, however this only works for borderless buttons and opaque backgrounds. If we want to draw a transparent background, we have to take drawing into our own hands and override <code class="language-plaintext highlighter-rouge">-drawRect</code>. Custom painting? You’re well on your way to a subclass bingo! Keep in mind this isn’t the cheapest operation (it gets called literally all the time), so don’t get too ambitious in there.</p>

<p>The full implementation is <a href="https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/ui/cocoa/browser/profile_chooser_controller.mm&amp;l=150">here</a>, but the main method is:</p>

<figure class="highlight"><pre><code class="language-objective-c" data-lang="objective-c">- (void)drawRect:(NSRect)dirtyRect {
NSColor* backgroundColor = [NSColor colorWithCalibratedWhite:0 alpha:0.1f];
[backgroundColor setFill];
// P.S. NSRectFill(...) won't work, and will ignore the alpha. I tried.
NSRectFillUsingOperation(dirtyRect, NSCompositeSourceAtop);
[super drawRect:dirtyRect];
}</code></pre></figure>

<p>Bonus points to Cocoa for using the word “atop”.</p>

<h2 id="otter-intermission">Otter intermission</h2>
<p>I bet you feel pretty pleased with how you’re doing in subclass bingo right now. Here’s a gif of an otter who probably just subclassed a slider.
<img src="http://i.imgur.com/nUIe0yQ.gif" alt="otter" /></p>

<h2 id="nsbutton-that-changes-its-background-on-hover">NSButton that changes its background on hover</h2>
<p>Disclaimer: in Chromium, using a raw <code class="language-plaintext highlighter-rouge">NSTrackingArea</code> is a pretty big <a href="http://www.chromium.org/developers/coding-style/cocoa-dos-and-donts">don’t</a>, because it’s leaky and leads to weird crashes. We also don’t tend to use raw pointers like the code below either, because ain’t nobody got time for segfaults. Instead, we use <a href="https://code.google.com/p/chromium/codesearch#chromium/src/base/mac/scoped_nsobject.h">scoped_nsobjects</a>, which are the badass Objective-C flavours of scoped_ptrs. Refcounting 4 lyfe &lt;3.</p>

<p>The code as used in Chromium is <a href="https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/ui/cocoa/browser/profile_chooser_controller.mm&amp;l=392">here</a>. I’m going to make the crazy assumption that you, dear reader, aren’t using this in Chromium, so below is a regular-world variant. I can tell you that it compiles and runs, but I am not ready at this point to make any guarantees about the irregularities in the space-time continuum it might cause. Worst case, you’ll have to release that <code class="language-plaintext highlighter-rouge">NSTrackingArea</code> when you’re done with it (e.g. in the button’s <code class="language-plaintext highlighter-rouge">-dealloc</code>).</p>

<figure class="highlight"><pre><code class="language-objective-c" data-lang="objective-c">@interface HoverBackgroundButton : NSButton
@end
@implementation HoverBackgroundButton
- (id)initWithFrame:(NSRect)frameRect {
if ((self = [super initWithFrame:frameRect])) {
[self setBordered:NO];
// Bonus code for you. NSMomentaryChangeButton means that the pressed
// style of the button is the same as the active one.
// Also, look: font change!
[self setFont:[NSFont labelFontOfSize:14]];
[self setButtonType:NSMomentaryChangeButton];
[[self cell] setBackgroundColor:[NSColor whiteColor]];
[self sizeToFit]; // &lt;--- We need this so that [self bounds] is a thing.
// Add a tracking area so that we can show/hide the button when hovering.
NSTrackingArea* trackingArea = [[NSTrackingArea alloc]
initWithRect:[self bounds]
options:NSTrackingMouseEnteredAndExited | NSTrackingActiveAlways
owner:self userInfo:nil];
[self addTrackingArea:trackingArea];
}
return self;
}
- (void)mouseEntered:(NSEvent*)event {
// Boom.
[[self cell] setBackgroundColor:[NSColor blueColor]];
}
- (void)mouseExited:(NSEvent*)event {
[[self cell] setBackgroundColor:[NSColor whiteColor]];
}
@end</code></pre></figure>

<h2 id="the-end">The end</h2>
<p>You’ve made it. Congratulations! Please let me know if/when you win at subclass bingo (though it’s unclear there are any winners), and I will send you another otter gif.</p>
:ET
Loading

0 comments on commit 03086d7

Please sign in to comment.