jquery-ellipsis - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

bower.json

 {
   "name": "ellipsis",
   "description": "ellipsis text depending on number of lines or number of chars",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "main": "./dist/jquery.ellipsis.min.js",
@@ -6,0 +6,0 @@ "authors": [

dist/jquery.ellipsis.js

@@ -21,3 +21,3 @@ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
   var PLUGIN_NAME = 'ellipsis';
-  var VERSION = '0.1.4';
+  var VERSION = '0.1.5';
 
@@ -47,2 +47,16 @@ /**
   /**
+   * different custom events shoud
+   * @type { Object }
+   */
+  var EVENTS = {
+    namespace: '.ellispsis',
+    initialize: 'initialize.ellipsis',
+    initialized: 'initialized.ellipsis',
+    update: 'update.ellipsis',
+    updated: 'updated.ellipsis',
+    excerpt: 'excerpt.ellipsis',
+    excerpted: 'excerpted.ellipsis'
+  };
+
+  /**
    * Ellipsis class that excerpt the text of an attached element depending
@@ -84,2 +98,4 @@ * on number of lines / characters
 
+        this.element.trigger(EVENTS.initialize);
+
         if (this.options.type === 'chars') {
@@ -89,3 +105,7 @@ result = this._excerptTillChar(this.options.count);
           charsNo = this._getTotalCharsInLines(this.options.count);
-          if (charsNo) result = this._excerptTillChar(charsNo);
+          if (charsNo) {
+            this.element.trigger(EVENTS.excerpt);
+            result = this._excerptTillChar(charsNo);
+            this.element.trigger(EVENTS.excerpted);
+          }
         }
@@ -100,2 +120,3 @@
         }
+        this.element.trigger(EVENTS.initialized);
       }
@@ -112,2 +133,4 @@
 
+        this.element.trigger(EVENTS.update);
+
         if (this.options.type === 'lines') {
@@ -119,5 +142,36 @@ number = this._getTotalCharsInLines(this.options.count);
 
+        this.element.trigger(EVENTS.excerpt);
         this._excerptTillChar(number);
+        this.element.trigger(EVENTS.excerpted);
+
+        this.element.trigger(EVENTS.updated);
       }
 
+      /**
+       * reset ellipsis instance options
+       * if any change is needed later.
+       *
+       * @param {Object} options text/type/count.
+       */
+
+    }, {
+      key: 'reset',
+      value: function reset(options) {
+        if (options.text) this.text = options.text;
+        if (options.type) this.options.type = options.type;
+        if (options.count) this.options.count = options.count;
+
+        if (Object.keys(options).length > 0) {
+          this.element.text(this.text);
+          this.update();
+        }
+      }
+    }, {
+      key: 'destroy',
+      value: function destroy() {
+        $(window).off('resize', this._resizeHandler);
+        this.element.text(this.text);
+        this.element.off(EVENTS.namespace);
+      }
+
       /*=========================================================================
@@ -135,2 +189,3 @@ * private Methods
       value: function _excerptTillChar(number) {
+
         if (number <= 0) return new Error('Number of chars to be shown is equal to or less than zero !!');
@@ -146,3 +201,3 @@
       /**
-       * get the number of charters in dedicated
+       * get the number of characters in dedicated
        * number of lines.
@@ -218,3 +273,3 @@ *
       /**
-       * get unique id for each spn
+       * get unique id for each span
        * that used for calculation
@@ -221,0 +276,0 @@ */

dist/jquery.ellipsis.min.js

@@ -1,1 +0,1 @@
-function _classCallCheck(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},_createClass=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}();!function(t,e,i,n){"use strict";var s="ellipsis",o={type:"lines",count:3},r={visibility:"hidden",opacity:1,display:"block",position:"absolute"},l=function(){function i(e){var s=arguments.length>1&&arguments[1]!==n?arguments[1]:{};_classCallCheck(this,i),this.element=t(e),this.options=Object.assign({},i.DEFAULTS,s),this.text=this.element.text(),this._resizeTimeout=null,this._resizeHandler=this._updateOnResize.bind(this),this.init()}return _createClass(i,[{key:"init",value:function(){var i=void 0,n=void 0;if("chars"===this.options.type?i=this._excerptTillChar(this.options.count):"lines"===this.options.type&&(n=this._getTotalCharsInLines(this.options.count),n&&(i=this._excerptTillChar(n))),i instanceof Error)throw i;"lines"===this.options.type&&t(e).on("resize",this._resizeHandler)}},{key:"update",value:function(){var t=void 0;t="lines"===this.options.type?this._getTotalCharsInLines(this.options.count):this.options.count,this._excerptTillChar(t)}},{key:"_excerptTillChar",value:function(t){return t<=0?new Error("Number of chars to be shown is equal to or less than zero !!"):("lines"===this.options.type&&t>=3&&(t-=3),t>=this.text.length?null:this.element.html(this.text.slice(0,t)+"..."))}},{key:"_getTotalCharsInLines",value:function(e){var i=0,n=void 0,s=void 0,o=void 0,l=void 0;if(e<=0)return 0;if(s="ellipsis_char_"+this._getIdNo(),this.element.append('<span id="'+s+'" class="jquery_ellipsis">W</span>'),n=t("#"+s),n.css(r),l=n.width(),i=e*this.element.width()/l,o=e*n.height(),i>=this.text.length)return n.remove(),null;for(n.text(this.text.slice(0,i)),n.css("max-width",this.element.width());n.height()<=o&&this.text.length>=n.text().length+1;)n.text(this.text.slice(0,n.text().length+1));return i=n.text().length,n.remove(),i>=this.text.length?null:(i&&"number"==typeof i&&i--,i)}},{key:"_updateOnResize",value:function(){var t=this;clearTimeout(this._resizeTimeout),this._resizeTimeout=setTimeout(function(){t.update()},300)}},{key:"_getIdNo",value:function(){return t("jquery_ellipsis").length}}],[{key:"DEFAULTS",get:function(){return Object.freeze(o)}}]),i}();t.fn[s]=function(e){var i=arguments;if(e===n||"object"===("undefined"==typeof e?"undefined":_typeof(e)))return this.each(function(){t.data(this,"plugin_"+s)||t.data(this,"plugin_"+s,new l(this,e))});if("string"==typeof e&&"_"!==e[0]&&"init"!==e){var o;return this.each(function(){var n=t.data(this,"plugin_"+s);n instanceof l&&"function"==typeof n[e]&&(o=n[e].apply(n,Array.prototype.slice.call(i,1))),"destroy"===e&&t.data(this,"plugin_"+s,null)}),o!==n?o:this}},t(i).ready(function(){var e=t('[data-toggle="ellipsis"]');e.each(function(e,i){var s=t(i),o={};s.data("type")!==n&&(o.type=s.data("type")),s.data("count")!==n&&(o.count=s.data("count")),s.ellipsis(o)})})}(jQuery,window,document);
+function _classCallCheck(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},_createClass=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}();!function(t,e,i,n){"use strict";var s="ellipsis",o={type:"lines",count:3},l={visibility:"hidden",opacity:1,display:"block",position:"absolute"},r={namespace:".ellispsis",initialize:"initialize.ellipsis",initialized:"initialized.ellipsis",update:"update.ellipsis",updated:"updated.ellipsis",excerpt:"excerpt.ellipsis",excerpted:"excerpted.ellipsis"},a=function(){function i(e){var s=arguments.length>1&&arguments[1]!==n?arguments[1]:{};_classCallCheck(this,i),this.element=t(e),this.options=Object.assign({},i.DEFAULTS,s),this.text=this.element.text(),this._resizeTimeout=null,this._resizeHandler=this._updateOnResize.bind(this),this.init()}return _createClass(i,[{key:"init",value:function(){var i=void 0,n=void 0;if(this.element.trigger(r.initialize),"chars"===this.options.type?i=this._excerptTillChar(this.options.count):"lines"===this.options.type&&(n=this._getTotalCharsInLines(this.options.count),n&&(this.element.trigger(r.excerpt),i=this._excerptTillChar(n),this.element.trigger(r.excerpted))),i instanceof Error)throw i;"lines"===this.options.type&&t(e).on("resize",this._resizeHandler),this.element.trigger(r.initialized)}},{key:"update",value:function(){var t=void 0;this.element.trigger(r.update),t="lines"===this.options.type?this._getTotalCharsInLines(this.options.count):this.options.count,this.element.trigger(r.excerpt),this._excerptTillChar(t),this.element.trigger(r.excerpted),this.element.trigger(r.updated)}},{key:"reset",value:function(t){t.text&&(this.text=t.text),t.type&&(this.options.type=t.type),t.count&&(this.options.count=t.count),Object.keys(t).length>0&&(this.element.text(this.text),this.update())}},{key:"destroy",value:function(){t(e).off("resize",this._resizeHandler),this.element.text(this.text),this.element.off(r.namespace)}},{key:"_excerptTillChar",value:function(t){return t<=0?new Error("Number of chars to be shown is equal to or less than zero !!"):("lines"===this.options.type&&t>=3&&(t-=3),t>=this.text.length?null:this.element.html(this.text.slice(0,t)+"..."))}},{key:"_getTotalCharsInLines",value:function(e){var i=0,n=void 0,s=void 0,o=void 0,r=void 0;if(e<=0)return 0;if(s="ellipsis_char_"+this._getIdNo(),this.element.append('<span id="'+s+'" class="jquery_ellipsis">W</span>'),n=t("#"+s),n.css(l),r=n.width(),i=e*this.element.width()/r,o=e*n.height(),i>=this.text.length)return n.remove(),null;for(n.text(this.text.slice(0,i)),n.css("max-width",this.element.width());n.height()<=o&&this.text.length>=n.text().length+1;)n.text(this.text.slice(0,n.text().length+1));return i=n.text().length,n.remove(),i>=this.text.length?null:(i&&"number"==typeof i&&i--,i)}},{key:"_updateOnResize",value:function(){var t=this;clearTimeout(this._resizeTimeout),this._resizeTimeout=setTimeout(function(){t.update()},300)}},{key:"_getIdNo",value:function(){return t("jquery_ellipsis").length}}],[{key:"DEFAULTS",get:function(){return Object.freeze(o)}}]),i}();t.fn[s]=function(e){var i=arguments;if(e===n||"object"===("undefined"==typeof e?"undefined":_typeof(e)))return this.each(function(){t.data(this,"plugin_"+s)||t.data(this,"plugin_"+s,new a(this,e))});if("string"==typeof e&&"_"!==e[0]&&"init"!==e){var o;return this.each(function(){var n=t.data(this,"plugin_"+s);n instanceof a&&"function"==typeof n[e]&&(o=n[e].apply(n,Array.prototype.slice.call(i,1))),"destroy"===e&&t.data(this,"plugin_"+s,null)}),o!==n?o:this}},t(i).ready(function(){var e=t('[data-toggle="ellipsis"]');e.each(function(e,i){var s=t(i),o={};s.data("type")!==n&&(o.type=s.data("type")),s.data("count")!==n&&(o.count=s.data("count")),s.ellipsis(o)})})}(jQuery,window,document);

package.json

 {
   "name": "jquery-ellipsis",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "ellipsis text depending on number of lines or number of chars",
@@ -5,0 +5,0 @@ "private": false,

README.md

 ## ellipsis
 
--------------------------------------------------------------------------------
 
-simple jquery plugin that excert text depending on lines number or characters number.
+simple jquery plugin that excerpts text depending on __lines__  or __characters__ number.
 
@@ -12,3 +11,3 @@ [![Build Status](https://travis-ci.org/pencilpix/ellipsis.svg?branch=master)](https://travis-ci.org/pencilpix/ellipsis) [![Coverage Status](https://coveralls.io/repos/github/pencilpix/ellipsis/badge.svg?branch=develop)](https://coveralls.io/github/pencilpix/ellipsis?branch=develop) [![DevDependency Status](https://david-dm.org/pencilpix/ellipsis/dev-status.svg)](https://david-dm.org/pencilpix/ellipsis/?type=dev)
 
-1. download via using one of the following
+1. Download using one of the following Methods
     * direct download or clone from this repository.
@@ -26,3 +25,3 @@ * via npm
 
-2. `jquery >= 2.x` must be included then include ellipsis:
+2. please be sure to include`jquery >= 2.x` then include ellipsis:
 
@@ -57,2 +56,4 @@ ```html
 
+
+
 ---------------------------------------------------------------------------------------------------------------
@@ -66,1 +67,37 @@ ### options
 
+
+### events
+
+event                  | when
+-----------------------|-----------------------------------------------------------------------------------------------
+initialize.ellipsis    | before the initialization of the plugin
+initialized.ellipsis   | after the initialization.
+excerpt.ellipsis       | before excerpt the text
+excerpted.ellipsis     | after the text being excerpted
+update.ellipsis        | before updating when window is resized
+updated.ellipsis       | after updating.
+
+
+#### example:
+  ```js
+  $('#paragraph').on('initialize.ellipsis', function() {
+    // do some stuff
+  });
+  ```
+
+
+
+---------------------------------------------------------------------------------------------------------------
+### Features:
+- [x] enhance the puplic API
+    - [x] two different types of excerpts by lines/characters
+    - [x] Support re-adjust option later.
+    - [x] different custom event through the life cycle of the plugin.
+    - [x] Destroyable.
+    - [x] data attribute automatic init.
+
+    - [ ] Up comming!
+        - [ ] use dedicated word instead of `...`
+        - [ ] use url to show more.
+        - [ ] use link class to control the style of link.
+

src/jquery.ellipsis.js

@@ -14,3 +14,3 @@ /**
   const PLUGIN_NAME = 'ellipsis';
-  const VERSION     = '0.1.4';
+  const VERSION     = '0.1.5';
 
@@ -44,3 +44,18 @@
 
+  /**
+   * different custom events shoud
+   * @type { Object }
+   */
+  const EVENTS = {
+    namespace:   '.ellispsis',
+    initialize:  'initialize.ellipsis',
+    initialized: 'initialized.ellipsis',
+    update:      'update.ellipsis',
+    updated:     'updated.ellipsis',
+    excerpt:     'excerpt.ellipsis',
+    excerpted:   'excerpted.ellipsis'
+  };
 
+
+
   /**
@@ -75,2 +90,4 @@ * Ellipsis class that excerpt the text of an attached element depending
 
+      this.element.trigger(EVENTS.initialize);
+
       if(this.options.type === 'chars'){
@@ -80,4 +97,7 @@ result = this._excerptTillChar(this.options.count);
         charsNo = this._getTotalCharsInLines(this.options.count);
-        if(charsNo)
+        if(charsNo){
+          this.element.trigger(EVENTS.excerpt);
           result = this._excerptTillChar(charsNo);
+          this.element.trigger(EVENTS.excerpted);
+        }
       }
@@ -94,2 +114,3 @@
       }
+      this.element.trigger(EVENTS.initialized);
     }
@@ -105,2 +126,4 @@
 
+      this.element.trigger(EVENTS.update);
+
       if(this.options.type === 'lines') {
@@ -112,3 +135,7 @@ number = this._getTotalCharsInLines(this.options.count)
 
+      this.element.trigger(EVENTS.excerpt);
       this._excerptTillChar(number);
+      this.element.trigger(EVENTS.excerpted);
+
+      this.element.trigger(EVENTS.updated);
     }
@@ -118,2 +145,29 @@
 
+    /**
+     * reset ellipsis instance options
+     * if any change is needed later.
+     *
+     * @param {Object} options text/type/count.
+     */
+    reset(options) {
+      if(options.text) this.text = options.text;
+      if(options.type) this.options.type = options.type;
+      if(options.count) this.options.count = options.count;
+
+      if(Object.keys(options).length > 0) {
+        this.element.text(this.text);
+        this.update();
+      }
+    }
+
+
+
+    destroy() {
+      $(window).off('resize', this._resizeHandler);
+      this.element.text(this.text);
+      this.element.off(EVENTS.namespace);
+    }
+
+
+
     /*=========================================================================
@@ -128,2 +182,3 @@ * private Methods
     _excerptTillChar(number) {
+
       if(number <= 0)
@@ -139,2 +194,3 @@ return new Error('Number of chars to be shown is equal to or less than zero !!');
       return this.element.html(this.text.slice(0, number) + '...');
+
     }
@@ -145,3 +201,3 @@
     /**
-     * get the number of charters in dedicated
+     * get the number of characters in dedicated
      * number of lines.
@@ -215,3 +271,3 @@ *
     /**
-     * get unique id for each spn
+     * get unique id for each span
      * that used for calculation
@@ -218,0 +274,0 @@ */

test/specs/test.spec.js

@@ -89,2 +89,59 @@ /**
     });
+
+
+    it('should emit ellipsis custom events in different positions', (done) => {
+      let initialize  = 0;
+      let initialized = 0;
+      let update      = 0;
+      let updated     = 0;
+      let excerpt     = 0;
+      let excerpted   = 0;
+
+      $('#paragraph').on('initialize.ellipsis', () => initialize = 1);
+      $('#paragraph').on('initialized.ellipsis', () => initialized = 1);
+      $('#paragraph').on('update.ellipsis', () => update = 1);
+      $('#paragraph').on('updated.ellipsis', () => updated = 1);
+      $('#paragraph').on('excerpt.ellipsis', () => excerpt = 1);
+      $('#paragraph').on('excerpted.ellipsis', () => excerpted = 1);
+
+
+
+      $('#paragraph').ellipsis({type: 'lines', count: 2});
+
+      $('#paragraph').ellipsis('update');
+
+      setTimeout(() => {
+        expect(initialize).toBe(1);
+        expect(initialized).toBe(1);
+        expect(update).toBe(1);
+        expect(updated).toBe(1);
+        expect(excerpt).toBe(1);
+        expect(excerpted).toBe(1);
+        done();
+      }, 100)
+    });
+
+
+    it('should be destroyable', (done) => {
+      let value = 0;
+
+      $('#paragraph').on('ellipsis.update', () => value = 1);
+      $('#paragraph').ellipsis({type: 'lines', count: 2});
+      $('#paragraph').ellipsis('destroy');
+      $(window).trigger('resize');
+
+      setTimeout(() => {
+        expect(value).toBe(0);
+        expect($('#paragraph').text()).toEqual(text);
+        done();
+      }, 400)
+    });
+
+    it('should update options and excerpt text relative to changes', () => {
+      $('#paragraph').ellipsis({type: 'lines', count: 2});
+      $('#paragraph').ellipsis('reset', {text: 'text changed', type: 'chars', count: 11});
+
+      expect($('#paragraph').text()).toEqual('text change...');
+      expect($('#paragraph').text().length).toEqual(14);
+    });
   });
@@ -91,0 +148,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

43049

increased by18%

Lines of code

927

increased by16.6%

Number of lines in readme file

100

increased by58.73%

No dependency changes