Odd image rotation when uploading photos taken from Samsung S4

Issue occurs when I upload an image to my webapp from the Samsung S4. The actual image displays just fine when requested directly through Chrome (ie. http://xxxxx/image.jpg). However, when rendered using rails image tag, the image appears 90 degrees rotated. The image appears rotated in Chrome but renders fine in mobile safari.

Turns out.. images uploaded through the Samsung Galaxy S4 includes an extra bit of metadata to tell the renderer how to orient the image correctly. It would appear that chrome (or perhaps it's rails, not sure) isn't taking this into account.

The proper solution is to allow your rendering code to detect the image orientation. Perhaps there's a way to solve this through CSS. Since I'm bound by time, I've came up with the most fastest (albeit hacky) solution possible... manual commands via imagemagick!

Turns out it's extremely easy to install imagemagick on linux:

sudo apt-get install imagemagick

Rotating the image:

convert source_photo.jpg -rotate 90 dest_photo.jpg

Removing the image metadata:

mogrify -strip image.jpg

Please share if you have a more automated solution!!

Various jQuery filters

basic filters
:first
:last
:even
:odd
:eq(n)
:gt(n)
:lt(n)
:header // selects H1, H2...
:animated
:not(selector)

attribute filters
[attribute]
[attribute=value]
[attribute!=value[
[attribute^=value[ // starts with
[attribute$=value[ // ends with
[attribute*=value[ // contains
[attrFilter1][attrFilterN] // match all specified filters

content filters
:contains(text) // contains text string
:empty // only include empty elements
:has(selector) // element containing at least one element with specified selector
:parent // all elements that are parents

visibility filters
:visible
:hidden

child filters
:nth-child(index)
:nth-child(even)
:nth-child(odd)
:nth-child(equation)
:first-child
:last-child
:only-child

form filters
:input
:text
:password
:radio
:checkbox
:submit
:reset
:image
:button
:file

form state filters
:enabled
:disabled
:checked
:selected

Deploying .NET through Plesk

Need:

To deploy a .NET 4.0 web application

Problem:

Plesk is used to manage sites and application pools :(

Plesk is old and only supports .NET 2.0 :( :(

Solution:

create new subdomain in plesk. By default the site will use ASP.NET 2.0

cd c:\...\framework\v4.0.xxxxx

aspnet_regiis.exe -lk

# now go find the identifier of the site/subdomain in IIS, should be a number

# now update .NET version of that site/subdomain using identifier

aspnet_regiis -sn W3SVC//ROOT/

# verify that it worked

aspnet_regiis.exe -lk

Site now served using .NET 4.0 application pool even though Plesk doesn't support it.

Problems in Rails

Problem: Issue with rails missing the rake gem
Solution: Install rake to the rvm global environment

rvm ruby-2.0.0-p###
gem install rake -v 10.1.0


Problem: It looks like Bundler could not find a gem. This is probably because your application is being run under a different environment than it's supposed to.
Solution: Manage gems with rvm. In my case, 'passenger' was using the global gemset even though I specified the project to use env1... solution is of course to install all missing gems for the global gemset.

# list the gemsets
rvm gemset list
# to use env1 gemset
rvm 2.0.0-p###@env1
# to use global gemset
rvm 2.0.0-p###@global
# install missing gems
gem install
bundle install


Problem: Various commands for cloning/creating/deleting gemsets
Solution: Use rvm

# clone
rvm gemset copy 2.0.0-pXXX@env1 2.0.0-pXXX@env2
# create
rvm gemset create env2
# delete
rvm gemset delete env2


Problem: When POW complains that rake does not exist
Solution: Add a .powrc file with the following content:

if [ -f "$rvm_path/scripts/rvm" ]; then

  source "$rvm_path/scripts/rvm"

fi

rvm ruby-2.0.0-pXXX@env1

Problem: Gem::LoadError: You have already activated json 1.8.1, but your Gemfile requires json 1.8.0 ...

Solution-1: Globally, call bundle uninstall json -v 1.8.1

Solution-2: Locally, call bundle update json

Getting PHP and Apache to work again after upgrading to Yosemite

One of the worst part about upgrading OSX has to be reconfiguring Apache to work. It was the same when I upgraded to Maverick, and again now in my upgrade to Yosemite.

Apache:

The httpd.conf is still at the same place: /etc/apache2/httpd.conf, but it was overwritten. I think the previous is automatically backed up as httpd.conf~previous.

You can use sudo apachectl configtest to check configuration errors. Diff-ing the previous version against the current version yielded the following (annoying) gotchas:

1. Many modules were turned off by default (ie. php5_module). Some were added (ie. session_module), renamed (ie. disk_cache_module), or removed (ie. ident_module)
2. User & Group were reset to _www
3. Order deny,allow / Deny from all is now Require all denied
4. Order deny,allow / Allow from all is now Require all granted
5. Supplemental configs were removed (ie. httpd-vhosts.conf, httpd-ssl.conf, etc)
6. For SSLSessionCache, you need to enable several modules in the httpd.conf file (ie. socache_shmcb_module, socache_dbm_module, socache_memcache_module)

The biggest, and most annoying gotcha of all were items #3 and #4. Make sure you make these changes in all supplemental configs like httpd-vhosts.conf.

PHP:

php.ini was removed. I think the previous is automatically backed up as php.ini-x.x-previous. For some reason, my php zts extension was updated as well, so I had to make a minor update to the php.ini ie. /usr/lib/php/extensions/no-debug-non-zts-xxxxxxxx/xdebug.so

P.s. I don't remember if I had to reinstall pear.

MySQL:

If MySQL isn't started, run this command to start it again:

sudo /usr/local/mysql/support-files/mysql.server start

Setting up a local proxy on your phone

The software I chose to use is called Squidman Proxy. A more robust and intuitive (albeit costly) option is Charles Proxy.

http://squidman.net/squidman/
http://www.charlesproxy.com/

This tutorial is for setting up Squidman for iOS or Android.

Precursor:
Make sure that the computer is accessible by your device by IP.
It's easiest to set up your environment if both are connected to the same router.

Steps:
On your iOS device, select WIFI and click on the little (i) icon
Select Manual for HTTP PROXY
Set Server IP to the IP of your computer
Set Port to 8112
Leave authentication empty
On your computer, open Squidman
Set your HTTP Port to 8112.
Go to the Template tab, and paste the following
Replace the highlighted IP with your device's IP
Click on Start Squid

cache_peer %PARENTPROXY% parent %PARENTPORT% 7 no-query no-digest no-netdb-exchange default
cache_dir ufs %CACHEDIR% %CACHESIZE% 16 256
maximum_object_size %MAXOBJECTSIZE%
coredump_dir %CACHEDIR%
visible_hostname %VISIBLEHOSTNAME%
cache_access_log stdio:/Users/dyu/Desktop/access.log
cache_store_log stdio:/Users/dyu/Desktop/store.log
cache_log /Users/dyu/Desktop/cache.log
pid_filename %PIDFILE%
http_port %PORT%
acl SSL_ports port 443
acl Safe_ports port 80  # http
acl Safe_ports port 21  # ftp
acl Safe_ports port 443  # https
acl Safe_ports port 70  # gopher
acl Safe_ports port 210  # wais
acl Safe_ports port 1025-65535 # unregistered ports
acl Safe_ports port 280  # http-mgmt
acl Safe_ports port 488  # gss-http
acl Safe_ports port 591  # filemaker
acl Safe_ports port 777  # multiling http
acl CONNECT method CONNECT
%ALLOWEDHOSTS%
%DIRECTHOSTS%
http_access allow localhost manager 
http_access deny manager
acl allcomputers src 192.168.0.0/255.255.252.0
http_access allow allcomputers
http_access deny !Safe_ports
http_access deny CONNECT !SSL_ports
http_access deny to_localhost
http_access allow localhost
%HTTPACCESSALLOWED%
http_access deny all
%ALWAYSDIRECT%
always_direct deny all
hierarchy_stoplist cgi-bin ?
refresh_pattern ^ftp:  1440 20% 10080
refresh_pattern ^gopher: 1440 0% 1440
refresh_pattern -i (/cgi-bin/|\?) 0 0% 0
refresh_pattern .  0 20% 4320

How not to write Javascript

Great tips & tricks from an javascript expert:

http://www.sitepoint.com/google-closure-how-not-to-write-javascript/

Highlights:

When checking if a variable is undefined:

var undefined;

return val !== undefined

When using strings in a switch: 

// use hash instead

obj[key] = 1;

if obj.hasOwnProperty(key);

When looping:

for (var i=0; j=arr.length; i

When converting functions to string for function name:

// str = String(foo);

str = (foo + "");

When checking for string type:

// typeof new String("a string") == 'object'

typeof (new String("a string") + "") == 'string'

When using float points:

// 1.0 - 0.25

1 - 0.25

When initializing arrays it is unnecessary to pre-allocate 'space':

// arr = new Array(25);

arr = [];



In JS, variable scope is declared by functions, and not blocks. That is:
if (a) { var x = 25; } console.log(x); // prints 25 just fine



The difference between:
var foo = function() {} and function bar() {} is that the latter is a function with the name 'bar'. The former is an anonymous function without a 'name'



Arrays are very powerful:
Acting as a queue: push, shift (unshift)
Acting as a stack: push, pop
Acting as array: arr[index], delete arr[index] (sets index content to undefined)
Splicing array: adding & removing elements with arr.splice(index,count,objs...)



Using regex:
var regex = '/regex_exp/i';
regex.test(haystack);



Using enumerative for-loops the right way:
for (var p in pages) { if (pages.hasOwnProperty(p)) { /* do something awesome */ } };
Use the hasOwnProperty method to prevent against enumerating over inherited properties



Don't use document.write(str);
Don't use browser sniffing code, ie. navigator.appName == 'Microsoft IE'
Don't use eval(str)
Don't use pseudo-protocols, ie. link