chore(dependencies): remove jquery

weihanchen · Nov 23, 2017 · 3a74887 · 3a74887
1 parent f181d32
commit 3a74887
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 15 deletions.
diff --git a/.eslintrc.yml b/.eslintrc.yml
@@ -16,6 +16,7 @@ globals:
   it: true
   process: true
   spyOn: true
+  document: true
   __dirname: true
   __testBase: true
   "$": true
@@ -26,6 +27,7 @@ rules:
   angular/controller-as-vm: 'off'
   angular/log: 'off'
   angular/angularelement: 'off'
+  angular/document-service: 'off'
   no-undef: error
   no-console: 'off'
   quotes:

diff --git a/README.md b/README.md
@@ -44,7 +44,6 @@ Add dependencies to the <head> section of your index html:
 
 ```html
 <meta charset="utf-8">  <!-- it's important for d3.js -->
-<script src="[bower_components/node_modules]/jquery/dist/jquery.min.js"></script>
 <script src="[bower_components/node_modules]/angular/angular.min.js"></script>
 <script src="[bower_components/node_modules]/d3/d3.min.js"></script>
 <script src="[bower_components/node_modules]/d3-cloud/build/d3.layout.cloud.js"></script>
@@ -119,10 +118,10 @@ Inject `angular-d3-word-cloud` into angular module, set up some options to our c
 ### Font size calculations ###
 
 ```javascript
-	 var element = $element.find('#wordsCloud');
+	 var element = document.getElementById('wordsCloud');
      var height = $window.innerHeight * 0.75;
-     element.height(height);
-     var width = element[0].offsetWidth;
+     element.style.height = height + 'px';
+     var width = element.getBoundingClientRect().width;
      var maxCount = originWords[0].count;
      var minCount = originWords[originWords.length - 1].count;
      var maxWordSize = width * 0.15;

diff --git a/bower.json b/bower.json
@@ -14,8 +14,7 @@
     "dependencies": {
         "angular": "~1.x",
         "d3": "~4.6.0",
-        "d3-cloud": "~1.2.4",
-        "jquery": "~1.12.4"
+        "d3-cloud": "~1.2.4"
     },
     "ignore": [
         "**/.*",

diff --git a/docs/index.html b/docs/index.html
@@ -11,7 +11,6 @@
     <link rel="stylesheet" type="text/css" href="css/normalize.css" media="screen">
     <link rel="stylesheet" type="text/css" href="css/stylesheet.css" media="screen">
     <link rel="stylesheet" type="text/css" href="css/github-light.css" media="screen">
-    <script src="js/plugins/jquery.min.js"></script>
     <script src="js/plugins/angular.min.js"></script>
     <script src="js/plugins/d3.min.js"></script>
     <script src="js/plugins/d3.layout.cloud.js"></script>

diff --git a/docs/js/controllers/app.js b/docs/js/controllers/app.js
@@ -1,8 +1,8 @@
 (function() {
    angular.module('app', ['angular-d3-word-cloud', 'colorpicker.module'])
-      .controller('AppController', ['$window', '$element', '$timeout', appController]);
+      .controller('AppController', ['$window', '$timeout', appController]);
 
-   function appController($window, $element, $timeout) {
+   function appController($window, $timeout) {
       var originWords = [];
       var maxWordCount = 1000;
       var self = this;
@@ -37,10 +37,10 @@
        */
       function resizeWordsCloud() {
          $timeout(function() {
-            var element = $element.find('#wordsCloud');
+            var element = document.getElementById('wordsCloud');
             var height = $window.innerHeight * 0.75;
-            element.height(height);
-            var width = element[0].offsetWidth;
+            element.style.height = height + 'px';
+            var width = element.getBoundingClientRect().width;
             var maxCount = originWords[0].count;
             var minCount = originWords[originWords.length - 1].count;
             var maxWordSize = width * 0.15;

diff --git a/package.json b/package.json
@@ -25,8 +25,7 @@
    "dependencies": {
       "angular": "^1.3.0",
       "d3": "~4.6.0",
-      "d3-cloud": "~1.2.4",
-      "jquery": "~3.1.1"
+      "d3-cloud": "~1.2.4"
    },
    "devDependencies": {
       "angular-mocks": "~1.6.2",

diff --git a/src/angular-word-cloud.js b/src/angular-word-cloud.js
@@ -72,7 +72,6 @@
                   }
                })
                .on('mouseout', function () {
-                  tooltip.style('visibility', 'hidden');
                   if (self.useTransition) {
                      d3.select(this).transition().style('font-size', function (d) {
                         return d.size + 'px';