Mirroring On MacBook Causes Page To Shrink

Posted on August 31, 2015 Written by Leave a Comment

Here is the background

I usually stream movies on my MacBook Pro and then mirror it to my TV to make the viewing much enjoyable, obviously because of the screen size. Here is the setup, my Macbook Pro connected to my TV through a mini display port to HDMI cable. It’s a common setup when you want to connect your laptop to your TV or any display.

The problem?

The problem is when I connect my Macbook Pro to the TV, the Macbook Pro’s display will refresh and you should expect the display to be mirrored to the TV display. Yes, the mirroring happens but page turns into a display shrank into half. The shrank page is also mirrored in the TV display which does not happen to the rest of the open tabs. See below what I mean.

Page Shrank in Half

There are times I preload the movie like in Netflix or other stream sites so you can buffer the whole movie before starting to watch. Then the shrinking happens when you connect it to your TV. Not good.

It worked! Here is the trick

You can alway close and then open again the page that shrank but in case you encounter the issue you can always to do this trick to solve the issue. I tried to move the page, resize the page, minimize/maximize the page but it does not work. Then I tried to open the Developer Tools (Option + Command + I) and then close it.

Chrome Developer Tools Options Bar

It worked, the page goes back to full screen mode without opening or closing the page. Saving anything I buffered in the page. Cool.

Filed Under: Chrome, Developer Tools, Google Chrome, Life Hacker, OSX, Safari Tagged: , ,

How To Make JSFiddle Default To jQuery Library

Posted on August 23, 2014 Written by Leave a Comment

You click Run or hit Ctrl+Enter from your JSFiddle session but nothing happens. Yes, that simple jQuery script you are trying to run seems too simple not to work, isn’t it? Then you notice that yes there is an option located in the left side of JSFiddle to choose the javascript library you want to use. You select the latest jQuery version available from the list and click Run. You just had the last 10 minutes sorting out the script making sure it is a valid jQuery script but the problem is that JSFiddle is not using jQuery as the default javascript library. That happened to me too many times, that its really frustrating.

I forgot to make JSFiddle default to jQuery library.

I often forget to make JSFiddle default to jQuery library when my brain is to eager to try and fiddle with an idea and turn it into an actual jQuery script. When you start from scratch JSFiddle’s default library is set No library (pure JS).

JSFiddle Default Library No JS

You need to choose what library you want to use before diving in and coding into the Javascript pane. There must be a way to make JSFiddle default to jQuery library. The left side of JSFiddle is the area for user options. I was trying to find a setting that will make JSFiddle default to jQuery library. But there is no option for that as of this writing.

JohnKPaul user script

I came across the blog post of Mr. JohnKPaul for Changing jsFiddle’s default library to jQuery. He had the same experience using JSFiddle with the library not using jQuery by default. He created a chrome user script to solve this problem. The user script will make JSFiddle default to jQuery library. Perfect!

How do I apply the user script to Chrome?

I’m not familiar with user scripts. Now I have a user script to use on Chrome for my JSFiddle problem but I do not know how to set it up. I attempted to search for an extension to handle users cripts and it pointed me to use TamperMonkey Chrome extension.

TamperMonkey

Tampermonkey userscript manager

TamperMonkey is the Chrome version of GreaseMonkey in Firefox to house and run user scripts. I thought I had the solution to install and setup the user script to Chrome using TamperMonkey but I came across a better solution.

Install the user script using chrome://extensions

A more direct way of installing user scripts in Chrome is to just go directly to the Chrome extensions page. From Chrome go to chrome://extensions and then drag the user script file to the page.

Userscript install to Chrome

JSFiddle User Script Installed in Chrome

The user script will be installed like any extension in Chrome.

JsFiddle Default Library jQuery

Now when you go to JSFiddle and create a new fiddle session, the default library is now showing jQuery 2.x(edge) as the Javascript library. Now I’m happy! 🙂

UPDATE : It seems Google does not allow user scripts to be installed directly to Chrome. I made another blog post as an update to this. Check it here How To Make JSFiddle Default To jQuery Library – Update

Filed Under: Developer Tools, jQuery, Programming, Web Tagged: , , , , , ,

Notepad++ – Source Code Editor and More

Posted on June 26, 2014 Written by 1 Comment

 

Using Notepad++ with Visual Studio

To compliment Visual Studio, I use Notepad++ as my other source code editor. Visual Studio is still my primary IDE but its good to have Notepad++ on the side for that quick search in files, syntax highlighting depending on the language or even when you want to compare texts or codes. There are other free code editors out there like Notepad2 or Sublime but my vote goes to Notepad++.

My Favorite Notepad++ Features

Syntax Highlighting

Notepad++ Syntax Highlighting

You get to choose from the programming languages like C#, C++, SQL, XML to Objective-C or Perl for syntax highlighting.

Find In Files

When I’m working on a big solution file in Visual Studio and I want to look for all references of a specific method, property or keyword I use Notepad++ Find In Files. Instead of waiting for Visual Studio to return to me a list of instances, I just search it with Notepad++. It will take time and it will make Notepad++ unresponsive during search but I can still continue with my coding in Visual Studio.

Notepad++ FindInFiles

 

Plugins

There are number of plugins that are available for install and download. The plugins manager is also a plugin by itself. Just like Package Manager in Visual Studio its the source where third party features can be found.

Notepad++ PluginsManager

 

Useful Plugins

TextFx

Notepad++ TextFxUnwrapText

If you find yourself working on a big chunk of text and its supposed to stay on one line, you can use the “Unwrap Text” option of TextFx. It will remove the newline and carriage return characters of the text to make it a one line.

StraightText

XML Tools

If you are working with XML messages that is sent as a one line of string you can use the “Pretty Print with Line Breaks” option of XML tools. This will arrange the XML nodes with proper indention to make it easier for you to inspect the XML string you have.

Notepad++ XMLToolsPrettyPrint

XMLFormattedText

 

I hope this little note for Notepad++ helps.

Filed Under: Developer Tools, Source Code Editor, Visual Studio, Windows Tagged: , , , ,