Added favicon resolving to URL input.

Added blur event after entering URL.
Focus screen after entering URL.

res/app/components/stf/common-ui/icon-inside-input/icon-inside-input-directive.js

@@ -0,0 +1,19 @@
+module.exports = function iconInsideInputDirective() {
+  return {
+    restrict: 'A',
+    link: function (scope, element, attrs) {
+      // NOTE: this doesn't work on Chrome with auto-fill, known Chrome bug
+      element.css({
+        'background-repeat': 'no-repeat',
+        'background-position': '8px 8px',
+        'padding-left': '30px'
+      })
+
+      attrs.$observe('iconInsideInput', function(value) {
+        element.css({
+          'background-image': 'url(' + value +')'
+        })
+      })
+    }
+  }
+}

res/app/components/stf/common-ui/icon-inside-input/icon-inside-input-spec.js

@@ -0,0 +1,23 @@
+describe('iconInsideInput', function () {
+
+  beforeEach(module('stf.icon-inside-input'));
+
+  var scope, compile;
+
+  beforeEach(inject(function ($rootScope, $compile) {
+    scope = $rootScope.$new();
+    compile = $compile;
+  }));
+
+  it('should ...', function () {
+
+    /* 
+     To test your directive, you need to create some html that would use your directive,
+     send that through compile() then compare the results.
+
+     var element = compile('<div icon-inside-input name="name">hi</div>')(scope);
+     expect(element.text()).toBe('hello, world');
+     */
+
+  });
+});

res/app/components/stf/common-ui/icon-inside-input/index.js

@@ -0,0 +1,4 @@
+module.exports = angular.module('stf.icon-inside-input', [
+
+])
+  .directive('iconInsideInput', require('./icon-inside-input-directive'))