progressing on services.

Gulpfile.js

@@ -11,6 +11,7 @@ var sourcemaps = require('gulp-sourcemaps');
 var assign = require('lodash.assign');
 var browserSync = require('browser-sync').create();
 var del = require('del');
+var flatten = require('gulp-flatten');
 
 // add custom browserify options here
 var customOpts = {
@@ -40,7 +41,7 @@ function bundle() {
     .pipe(sourcemaps.init({loadMaps: true})) // loads map from browserify file
        // Add transformation tasks to the pipeline here.
     .pipe(sourcemaps.write('./')) // writes .map file
-    .pipe(gulp.dest('./dist/scripts'));
+    .pipe(gulp.dest('./dist'));
 }
 
 gulp.task('dist', ['dist-node-modules'], function () {
@@ -49,6 +50,7 @@ gulp.task('dist', ['dist-node-modules'], function () {
     'src/**/*.css',
     'src/**/*.js'
     ], {base: 'src'})
+    .pipe(flatten())
     .pipe(gulp.dest('dist'));
 });
 

package.json

@@ -39,6 +39,7 @@
     "angular": "^1.4.7",
     "bootstrap": "^3.3.5",
     "del": "^2.0.2",
+    "gulp-flatten": "^0.2.0",
     "jquery": "^2.1.4"
   }
 }

src/content_script.js

@@ -16,7 +16,7 @@ $(document).ready(function () {
     var s = document.createElement('script');
     // TODO: add "script.js" to web_accessible_resources in manifest.json
     // s.src = chrome.extension.getURL('script.js');
-    s.src = 'scripts/bundle.js'
+    s.src = 'bundle.js'
     s.onload = function() {
         this.parentNode.removeChild(this);
         bootStrapAndRestoreAngular();
@@ -32,4 +32,34 @@ $(document).ready(function () {
     });
   }
 
+  document.addEventListener('click', function(evt) {
+    if (!document.hasFocus()) {
+      return true;
+    }
+    processSelection();
+    // evt.stopPropagation();
+    // evt.preventDefault();
+  }, false);
+
+  // Find currently selected word
+  function processSelection () {
+    var focused = document.activeElement;
+    var selectedText;
+    if (focused) {
+      try {
+        selectedText = focused.value.substring(
+          focused.selectionStart, focused.selectionEnd);
+      } catch (err) {
+      }
+    }
+    if (selectedText == undefined) {
+      var sel = window.getSelection();
+      var selectedText = sel.toString();
+    }
+    if (selectedText) {
+      currentlySelectedWord = selectedText;
+      displaySelectedWord(currentlySelectedWord);
+      getSensesFromServer(currentlySelectedWord);
+    }
+  }
 });

src/data/data.service.ts

@@ -2,7 +2,8 @@
 
 class DataService {
 
-  $http : ng.IHttpService;
+  $http : ng.IHttpService
+  serverUrl = 'http://lexitags.dyndns.org/server/lexitags2/Semtags?data='
 
   static $inject = ["$scope", "$log"];
   constructor($http: ng.IHttpService, $log: ng.ILogService) {
@@ -10,18 +11,16 @@ class DataService {
   }
 
   createQuery (word: string) {
-    return '{"word":"QUERYTOREPLACE"}'.replace(/QUERYTOREPLACE/, word);
+    return '{"word":"QUERYTOREPLACE"}'
+      .replace(/QUERYTOREPLACE/, word);
   }
 
   callServer (word: string) {
     if (!word) {
       return;
     };
-
-    var serverUrl = 'http://lexitags.dyndns.org/server/lexitags2/Semtags?data='
-
-    return this.$http.get(serverUrl + this.createQuery(word));
-
+    return this.$http
+      .get(this.serverUrl + this.createQuery(word));
   }
 }
 

src/index.ts

@@ -4,13 +4,15 @@ import $ = require('jquery');
 import angular = require('angular');
 import MenuCtrl = require('./menu/menu.controller');
 import DataService = require('./data/data.service');
+import SelectedWordService = require('./selectedWord/selectedWord.service');
 
 angular.module('tagIt', [])
   .factory('DataService', DataService)
+  .factory('SelectedWordService', SelectedWordService)
   .controller('MenuCtrl', MenuCtrl);
 
 function initAngular () {
-  $.get('menu/menu.tpl.html', function (htmlData) {
+  $.get('menu.tpl.html', function (htmlData) {
     $('body').children().wrapAll('<div class="tagit-body" />');
     $('.tagit-body').before(htmlData);
     angular.bootstrap(

src/menu/menu.controller.ts

@@ -10,9 +10,11 @@ class MenuCtrl {
   testWord = "It's working"
   selectedWord = "No word yet"
 
-  static $inject = ["$scope", "$log"]
-  constructor($scope: any, $log: angular.ILogService) {
+  static $inject = ["$scope", "$log", "SelectedWordService"]
+
+  constructor($scope: any, $log: angular.ILogService, SelectedWordService: any) {
     $scope.vm = this;
+    SelectedWordService.init();
   }
 
   remove() {

src/menu/menu.tpl.html

@@ -15,16 +15,11 @@
     Currently selected word: <strong>{{vm.selectedWord}}</strong>
   </p>
 
-  <input type="text" class="form-control" placeholder="Filter tags" />
+  <input type="text" ng-model="wordToFilterBy" class="form-control" placeholder="Filter tags" />
 
   <ul id="senses">
     <li id="sense.senseid" ng-repeat="sense in senses" class="list-unstyled">
       <strong>{{sense.word}}</strong> {{sense.explanation}}
     </li>
   </ul>
-
-  <ul id="senses">
-    <ul id="senses"><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-exhibit-verb-1" class="list-unstyled"><strong>(to ..) exhibit .</strong> show an attribute, property, knowledge, or skill; "he exhibits a great talent"  </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-expose-verb-3" class="list-unstyled"><strong>(to ..) expose, exhibit, display .</strong> to show, make visible or apparent; "The Metropolitan Museum is exhibiting Goya's works this month"; "Why don't you show your nice legs and wear shorter skirts?"; "National leaders will have to display the highest skills of statesmanship"  </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-show-verb-1" class="list-unstyled"><strong>(to ..) show, demo, exhibit, present, demonstrate .</strong> give an exhibition of to an interested audience; "She shows her dogs frequently"; "We will demo the new software in Washington"  </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-parade-verb-1" class="list-unstyled"><strong>(to ..) parade, exhibit, march .</strong> walk ostentatiously; "She parades her new husband around town"  </li><li id="http://dbpedia.org/resource/Art_exhibition" class="list-unstyled"><strong>Art exhibition.</strong>             Art exhibitions are traditionally the space in which art objects (in the most general sense) meet an audience. The exhibit is universally understood to be for some temporary period unless, as is rarely true, it is stated to be a "permanent exhibition". In American English, they may be called "exhibit", "exposition" (the French word) or "show". In UK English, they are always called "exhibitions" or "shows", and an individual item in the show is an "exhibit".        </li><li id="http://dbpedia.org/resource/Exhibition" class="list-unstyled"><strong>Exhibition.</strong>             An exhibition, in the most general sense, is an organized presentation and display of a selection of items. In practice, exhibitions usually occur within museums, galleries and exhibition halls, and World's Fairs. Exhibitions include [whatever as in major art museums and small art galleries; interpretive exhibitions, as at natural history museums and history museums], for example; and commercial exhibitions, or trade fairs.        </li><li id="http://dbpedia.org/resource/Freak_show" class="list-unstyled"><strong>Freak show.</strong>             For the tv-series see Freak Show (TV series). A freak show is an exhibition of biological rarities, referred to as "freaks of nature". Typical features would be physically unusual humans, such as those uncommonly large or small, those with both male and female secondary sexual characteristics, people with other extraordinary diseases and conditions, and performances that are expected to be shocking to the viewers.        </li><li id="http://dbpedia.org/resource/Royal_Academy_summer_exhibition" class="list-unstyled"><strong>Royal Academy summer exhibition.</strong>             The Summer Exhibition is an open art exhibition held annually by the Royal Academy in Burlington House, Piccadilly in central London, England, during the summer months of June, July, and August. The exhibition includes paintings, prints, drawings, sculpture, architectural designs and models, and is the largest and most popular open exhibition in the United Kingdom.        </li><li id="http://dbpedia.org/resource/Online_disinhibition_effect" class="list-unstyled"><strong>Online disinhibition effect.</strong> </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-person-noun-1" class="list-unstyled"><strong>A PERSON.</strong> a human being</li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-event-noun-1" class="list-unstyled"><strong>AN EVENT.</strong> something that happens at a given place and time </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-creation-noun-2" class="list-unstyled"><strong>A CREATIVE WORK.</strong> an artifact that has been brought into existence by someone </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-abstraction-noun-6" class="list-unstyled"><strong>AN ABSTRACTION.</strong> a general concept formed by extracting common features from specific examples </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-organization-noun-1" class="list-unstyled"><strong>AN ORGANIZATION.</strong> a group of people who work together </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-topographic_point-noun-1" class="list-unstyled"><strong>A PLACE or SPOT.</strong> a point located with respect to surface features of some region; "this is a nice place for a picnic"; "a bright spot on a planet" </li><li id="http://www.w3.org/2006/03/wn/wn20/instances/synset-merchandise-noun-1" class="list-unstyled"><strong>A PRODUCT, SOME MERCHANDISE.</strong> commodities offered for sale; "good business depends on having good merchandise"; "that store offers a variety of products" </li></ul>
-  </ul>
-
-  </div>
+</div>

src/selectedWord/selectedWord.service.ts

@@ -0,0 +1,50 @@
+'use strict';
+
+/**
+ * Takes care of figuring out what word
+ * is selected.
+ */
+class SelectedWordService {
+
+  currentlySelectedWord: string
+  $log : ng.ILogService
+
+  static $inject = ["$log"];
+  constructor($log: ng.ILogService) {
+    this.$log = $log;
+  }
+
+  processSelection () {
+    // var focused : any = document.activeElement;
+    // var selectedText : string;
+    // if (focused) {
+    //   try {
+    //     selectedText = focused.value.substring(
+    //       focused.selectionStart, focused.selectionEnd);
+    //   } catch (err) {
+    //   }
+    // }
+    // if (selectedText == undefined) {
+    //   var sel = window.getSelection();
+    //   var selectedText = sel.toString();
+    // }
+    // if (selectedText) {
+    //   this.currentlySelectedWord = selectedText;
+    //   this.$log.debug('text that was selected: ' + selectedText);
+    // }
+  }
+
+  init () {
+    // document.addEventListener('click', function(evt) {
+    //   if (!document.hasFocus()) {
+    //     return true;
+    //   }
+    //   this.processSelection();
+    //   // clicks should propagate upwards to other things
+    //   // evt.stopPropagation();
+    //   // evt.preventDefault();
+    // }, false);
+  }
+}
+
+export = SelectedWordService;

tsconfig.json

@@ -3,8 +3,7 @@
         "module": "commonjs",
         "noImplicitAny": true
     },
-    "exclude": [
-        "node_modules",
-        "testfolder"
+    "files": [
+        "src/index.ts"
     ]
 }