From 363a1067e2e49940a4ed3995008161f69dc1f884 Mon Sep 17 00:00:00 2001 From: "Laird, Kathy" Date: Wed, 14 Jun 2017 01:46:59 -0600 Subject: [PATCH 1/4] stop click event propagation triggered by more/less toggle --- dist/readmore.js | 8 ++++++-- dist/readmore.min.js | 2 +- src/readmore.js | 6 +++++- src/readmore.template.html | 2 +- 4 files changed, 13 insertions(+), 5 deletions(-) diff --git a/dist/readmore.js b/dist/readmore.js index 01a54ea..b58772e 100644 --- a/dist/readmore.js +++ b/dist/readmore.js @@ -82,7 +82,11 @@ function readMore($templateCache) { vm.toggle.dotsClass = vm.hmDotsClass; } - vm.doToggle = function () { + vm.doToggle = function (event) { + if (event) { + event.preventDefault() + event.stopPropagation() + } $log.debug('doToggle'); vm.toggle.state = !vm.toggle.state; vm.showMoreText = !vm.showMoreText; @@ -158,4 +162,4 @@ function readMore($templateCache) { } }; -angular.module('hm.readmore').run(['$templateCache', function($templateCache) {$templateCache.put('readmore.template.html','{{ vm.toggle.dots }}{{ vm.toggle.text }}');}]); \ No newline at end of file +angular.module('hm.readmore').run(['$templateCache', function($templateCache) {$templateCache.put('readmore.template.html','{{ vm.toggle.dots }}{{ vm.toggle.text }}');}]); \ No newline at end of file diff --git a/dist/readmore.min.js b/dist/readmore.min.js index 7bfff92..bb014da 100644 --- a/dist/readmore.min.js +++ b/dist/readmore.min.js @@ -1 +1 @@ -"use strict";function readMore(e){function t(e,t,o){function s(){o.debug("setToggleMoreText"),d.toggle.moreText=d.hmMoreText||"Read more"}function n(){o.debug("setToggleLessText"),d.toggle.lessText=d.hmLessText||"Read less"}function m(){o.debug("setCurrentToggleText"),d.toggle.text=d.toggle.state?d.toggle.lessText:d.toggle.moreText}function g(){o.debug("setShowToggle"),d.toggle.show=d.moreText&&d.moreText.length>0}function l(){o.debug("setLinkClass"),d.toggle.linkClass=d.hmLinkClass}function i(){o.debug("setDotsClass"),d.toggle.dotsClass=d.hmDotsClass}function a(){o.debug("validateLimit"),d.hmLimit=d.hmLimit&&d.hmLimit<=0?void 0:d.hmLimit}function h(){return o.debug("getMoreTextLimit"),d.hmLimit&&d.hmLimit{{ vm.toggle.dots }}{{ vm.toggle.text }}')}]); \ No newline at end of file +"use strict";function readMore(e){function t(e,t,o){function s(){o.debug("setToggleMoreText"),d.toggle.moreText=d.hmMoreText||"Read more"}function n(){o.debug("setToggleLessText"),d.toggle.lessText=d.hmLessText||"Read less"}function g(){o.debug("setCurrentToggleText"),d.toggle.text=d.toggle.state?d.toggle.lessText:d.toggle.moreText}function m(){o.debug("setShowToggle"),d.toggle.show=d.moreText&&d.moreText.length>0}function l(){o.debug("setLinkClass"),d.toggle.linkClass=d.hmLinkClass}function i(){o.debug("setDotsClass"),d.toggle.dotsClass=d.hmDotsClass}function a(){o.debug("validateLimit"),d.hmLimit=d.hmLimit&&d.hmLimit<=0?void 0:d.hmLimit}function h(){return o.debug("getMoreTextLimit"),d.hmLimit&&d.hmLimit{{ vm.toggle.dots }}{{ vm.toggle.text }}')}]); \ No newline at end of file diff --git a/src/readmore.js b/src/readmore.js index 4263b2f..03c9cda 100644 --- a/src/readmore.js +++ b/src/readmore.js @@ -80,7 +80,11 @@ function readMore($templateCache) { vm.toggle.dotsClass = vm.hmDotsClass; } - vm.doToggle = function () { + vm.doToggle = function (event) { + if (event) { + event.preventDefault() + event.stopPropagation() + } $log.debug('doToggle'); vm.toggle.state = !vm.toggle.state; vm.showMoreText = !vm.showMoreText; diff --git a/src/readmore.template.html b/src/readmore.template.html index 91ebd52..cc30e68 100644 --- a/src/readmore.template.html +++ b/src/readmore.template.html @@ -5,5 +5,5 @@ {{ vm.toggle.dots }} - {{ vm.toggle.text }} + {{ vm.toggle.text }} From 2631d863b965d965283e184d5b29824a902493d4 Mon Sep 17 00:00:00 2001 From: "Laird, Kathy" Date: Fri, 16 Jun 2017 02:03:41 -0600 Subject: [PATCH 2/4] add monospace support' --- dist/readmore.js | 315 +++++++++++++++++++------------------ dist/readmore.min.js | 2 +- src/readmore.js | 312 ++++++++++++++++++------------------ src/readmore.spec.js | 11 +- src/readmore.template.html | 6 +- 5 files changed, 336 insertions(+), 310 deletions(-) diff --git a/dist/readmore.js b/dist/readmore.js index b58772e..3319a05 100644 --- a/dist/readmore.js +++ b/dist/readmore.js @@ -2,164 +2,175 @@ readMore.$inject = ["$templateCache"]; angular - .module('hm.readmore', ['ngAnimate', 'ngSanitize']) - .directive('hmReadMore', readMore) + .module('hm.readmore', ['ngAnimate', 'ngSanitize']) + .directive('hmReadMore', readMore) .config(["$logProvider", function ($logProvider) { - $logProvider.debugEnabled(false); + $logProvider.debugEnabled(false); }]); /** @ngInject */ function readMore($templateCache) { - hmReadMoreController.$inject = ["$filter", "$scope", "$log"]; - var directive = { - restrict: 'AE', - scope: { - hmText: '@', - hmLimit: '@', - hmMoreText: '@', - hmLessText: '@', - hmDotsClass: '@', - hmLinkClass: '@' - }, - template: $templateCache.get('readmore.template.html'), - controller: hmReadMoreController, - controllerAs: 'vm', - bindToController: true - }; - - return directive; - - /** @ngInject */ - // "bindToController: true" binds scope variables to Controller - function hmReadMoreController($filter, $scope, $log) { - var vm = this; - vm.toggle = { - dots: '...', - dotsClass: vm.hmDotsClass, - linkClass: vm.hmLinkClass - } - - vm.$onInit = function(){ - $log.debug('initialize'); - setToggleMoreText(); - setToggleLessText(); - validateLimit(); - setLessAndMoreText(); - setShowToggle(); - setCurrentToggleText(); - setLinkClass(); - setDotsClass(); - } - - // Toggle functions - function setToggleMoreText() { - $log.debug('setToggleMoreText'); - vm.toggle.moreText = vm.hmMoreText || 'Read more'; - } - - function setToggleLessText() { - $log.debug('setToggleLessText'); - vm.toggle.lessText = vm.hmLessText || 'Read less'; - } - - function setCurrentToggleText() { - $log.debug('setCurrentToggleText'); - vm.toggle.text = vm.toggle.state ? vm.toggle.lessText : vm.toggle.moreText; - } - - function setShowToggle() { - $log.debug('setShowToggle'); - vm.toggle.show = vm.moreText && vm.moreText.length > 0; - } - - function setLinkClass(){ - $log.debug('setLinkClass'); - vm.toggle.linkClass = vm.hmLinkClass; - } - - function setDotsClass(){ - $log.debug('setDotsClass'); - vm.toggle.dotsClass = vm.hmDotsClass; - } - - vm.doToggle = function (event) { - if (event) { + hmReadMoreController.$inject = ["$filter", "$scope", "$log"]; + var directive = { + restrict: 'AE', + scope: { + hmText: '@', + hmTextClass: '@', + hmLimit: '@', + hmMoreText: '@', + hmLessText: '@', + hmDotsClass: '@', + hmLinkClass: '@' + }, + template: $templateCache.get('readmore.template.html'), + controller: hmReadMoreController, + controllerAs: 'vm', + bindToController: true + }; + + return directive; + + /** @ngInject */ + // "bindToController: true" binds scope variables to Controller + function hmReadMoreController($filter, $scope, $log) { + var vm = this; + vm.toggle = { + dots: ' ...', + dotsClass: vm.hmDotsClass, + linkClass: vm.hmLinkClass + } + + vm.$onInit = function(){ + $log.debug('initialize'); + setToggleMoreText(); + setToggleLessText(); + validateLimit(); + setLessAndMoreText(); + setShowToggle(); + setCurrentToggleText(); + setLinkClass(); + setDotsClass(); + } + + // Toggle functions + function setToggleMoreText() { + $log.debug('setToggleMoreText'); + vm.toggle.moreText = vm.hmMoreText || 'Read more'; + } + + function setToggleLessText() { + $log.debug('setToggleLessText'); + vm.toggle.lessText = vm.hmLessText || 'Read less'; + } + + function setCurrentToggleText() { + $log.debug('setCurrentToggleText'); + vm.toggle.text = vm.toggle.state ? vm.toggle.lessText : vm.toggle.moreText; + } + + function setShowToggle() { + $log.debug('setShowToggle'); + vm.toggle.show = vm.moreText && vm.moreText.length > 0; + } + + function setLinkClass(){ + $log.debug('setLinkClass'); + vm.toggle.linkClass = vm.hmLinkClass; + } + + function setDotsClass(){ + $log.debug('setDotsClass'); + vm.toggle.dotsClass = vm.hmDotsClass; + } + + vm.doToggle = function (event) { + // prevent the click event from propagate + if (event) { event.preventDefault() event.stopPropagation() } - $log.debug('doToggle'); - vm.toggle.state = !vm.toggle.state; - vm.showMoreText = !vm.showMoreText; - setCurrentToggleText(); - } - - $scope.$watch('vm.hmMoreText', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmMoreText changed'); - setToggleMoreText(); - setCurrentToggleText(); - } - }); - - $scope.$watch('vm.hmLessText', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmLessText changed'); - setToggleLessText(); - setCurrentToggleText(); - } - }); - - $scope.$watch('vm.hmDotsClass', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmDotsClass changed'); - setDotsClass(); - } - }); - - $scope.$watch('vm.hmLinkClass', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmLinkClass changed'); - setLinkClass(); - } - }); - - // ---------- - - // If negative number, set to undefined - function validateLimit() { - $log.debug('validateLimit'); - vm.hmLimit = (vm.hmLimit && vm.hmLimit <= 0) ? undefined : vm.hmLimit; - } - - function getMoreTextLimit() { - $log.debug('getMoreTextLimit'); - return vm.hmLimit && vm.hmLimit < vm.hmText.length ? vm.hmLimit - vm.hmText.length : 0; - } - - function setLessAndMoreText() { - $log.debug('setLessAndMoreText'); - vm.lessText = $filter('limitTo')(vm.hmText, vm.hmLimit); - vm.moreText = $filter('limitTo')(vm.hmText, getMoreTextLimit()); - } - - $scope.$watch('vm.hmText', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmText changed'); - validateLimit(); - setLessAndMoreText(); - setShowToggle(); - } - }); - - $scope.$watch('vm.hmLimit', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmLimit changed'); - validateLimit(); - setLessAndMoreText(); - setShowToggle(); - } - }); - } -}; -angular.module('hm.readmore').run(['$templateCache', function($templateCache) {$templateCache.put('readmore.template.html','{{ vm.toggle.dots }}{{ vm.toggle.text }}');}]); \ No newline at end of file + $log.debug('doToggle'); + vm.toggle.state = !vm.toggle.state; + vm.showMoreText = !vm.showMoreText; + + if (vm.showMoreText) { + //replace the entire text + vm.lessText = '' + vm.moreText = vm.hmText + } else { + vm.lessText = $filter('limitTo')(vm.hmText, vm.hmLimit) + vm.moreText = $filter('limitTo')(vm.hmText, getMoreTextLimit()); + } + setCurrentToggleText(); + } + + $scope.$watch('vm.hmMoreText', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmMoreText changed'); + setToggleMoreText(); + setCurrentToggleText(); + } + }); + + $scope.$watch('vm.hmLessText', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmLessText changed'); + setToggleLessText(); + setCurrentToggleText(); + } + }); + + $scope.$watch('vm.hmDotsClass', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmDotsClass changed'); + setDotsClass(); + } + }); + + $scope.$watch('vm.hmLinkClass', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmLinkClass changed'); + setLinkClass(); + } + }); + + // ---------- + + // If negative number, set to undefined + function validateLimit() { + $log.debug('validateLimit'); + vm.hmLimit = (vm.hmLimit && vm.hmLimit <= 0) ? undefined : vm.hmLimit; + } + + function getMoreTextLimit() { + $log.debug('getMoreTextLimit'); + return vm.hmLimit && vm.hmLimit < vm.hmText.length ? vm.hmLimit - vm.hmText.length : 0; + } + + function setLessAndMoreText() { + $log.debug('setLessAndMoreText'); + vm.lessText = $filter('limitTo')(vm.hmText, vm.hmLimit); + vm.moreText = $filter('limitTo')(vm.hmText, getMoreTextLimit()); + } + + $scope.$watch('vm.hmText', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmText changed'); + validateLimit(); + setLessAndMoreText(); + setShowToggle(); + } + }); + + $scope.$watch('vm.hmLimit', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmLimit changed'); + validateLimit(); + setLessAndMoreText(); + setShowToggle(); + } + }); + } +}; +angular.module('hm.readmore').run(['$templateCache', function($templateCache) {$templateCache.put('readmore.template.html','{{ vm.toggle.dots }}{{ vm.toggle.text }}');}]); \ No newline at end of file diff --git a/dist/readmore.min.js b/dist/readmore.min.js index bb014da..41e5099 100644 --- a/dist/readmore.min.js +++ b/dist/readmore.min.js @@ -1 +1 @@ -"use strict";function readMore(e){function t(e,t,o){function s(){o.debug("setToggleMoreText"),d.toggle.moreText=d.hmMoreText||"Read more"}function n(){o.debug("setToggleLessText"),d.toggle.lessText=d.hmLessText||"Read less"}function g(){o.debug("setCurrentToggleText"),d.toggle.text=d.toggle.state?d.toggle.lessText:d.toggle.moreText}function m(){o.debug("setShowToggle"),d.toggle.show=d.moreText&&d.moreText.length>0}function l(){o.debug("setLinkClass"),d.toggle.linkClass=d.hmLinkClass}function i(){o.debug("setDotsClass"),d.toggle.dotsClass=d.hmDotsClass}function a(){o.debug("validateLimit"),d.hmLimit=d.hmLimit&&d.hmLimit<=0?void 0:d.hmLimit}function h(){return o.debug("getMoreTextLimit"),d.hmLimit&&d.hmLimit{{ vm.toggle.dots }}{{ vm.toggle.text }}')}]); \ No newline at end of file +"use strict";function readMore(e){function t(e,t,o){function s(){o.debug("setToggleMoreText"),T.toggle.moreText=T.hmMoreText||"Read more"}function m(){o.debug("setToggleLessText"),T.toggle.lessText=T.hmLessText||"Read less"}function n(){o.debug("setCurrentToggleText"),T.toggle.text=T.toggle.state?T.toggle.lessText:T.toggle.moreText}function g(){o.debug("setShowToggle"),T.toggle.show=T.moreText&&T.moreText.length>0}function l(){o.debug("setLinkClass"),T.toggle.linkClass=T.hmLinkClass}function i(){o.debug("setDotsClass"),T.toggle.dotsClass=T.hmDotsClass}function a(){o.debug("validateLimit"),T.hmLimit=T.hmLimit&&T.hmLimit<=0?void 0:T.hmLimit}function h(){return o.debug("getMoreTextLimit"),T.hmLimit&&T.hmLimit{{ vm.toggle.dots }}{{ vm.toggle.text }}')}]); \ No newline at end of file diff --git a/src/readmore.js b/src/readmore.js index 03c9cda..f3b8736 100644 --- a/src/readmore.js +++ b/src/readmore.js @@ -1,161 +1,173 @@ 'use strict'; angular - .module('hm.readmore', ['ngAnimate', 'ngSanitize']) - .directive('hmReadMore', readMore) + .module('hm.readmore', ['ngAnimate', 'ngSanitize']) + .directive('hmReadMore', readMore) .config(function ($logProvider) { - $logProvider.debugEnabled(false); + $logProvider.debugEnabled(false); }); /** @ngInject */ function readMore($templateCache) { - var directive = { - restrict: 'AE', - scope: { - hmText: '@', - hmLimit: '@', - hmMoreText: '@', - hmLessText: '@', - hmDotsClass: '@', - hmLinkClass: '@' - }, - template: $templateCache.get('readmore.template.html'), - controller: hmReadMoreController, - controllerAs: 'vm', - bindToController: true - }; - - return directive; - - /** @ngInject */ - // "bindToController: true" binds scope variables to Controller - function hmReadMoreController($filter, $scope, $log) { - var vm = this; - vm.toggle = { - dots: '...', - dotsClass: vm.hmDotsClass, - linkClass: vm.hmLinkClass - } - - vm.$onInit = function(){ - $log.debug('initialize'); - setToggleMoreText(); - setToggleLessText(); - validateLimit(); - setLessAndMoreText(); - setShowToggle(); - setCurrentToggleText(); - setLinkClass(); - setDotsClass(); - } - - // Toggle functions - function setToggleMoreText() { - $log.debug('setToggleMoreText'); - vm.toggle.moreText = vm.hmMoreText || 'Read more'; - } - - function setToggleLessText() { - $log.debug('setToggleLessText'); - vm.toggle.lessText = vm.hmLessText || 'Read less'; - } - - function setCurrentToggleText() { - $log.debug('setCurrentToggleText'); - vm.toggle.text = vm.toggle.state ? vm.toggle.lessText : vm.toggle.moreText; - } - - function setShowToggle() { - $log.debug('setShowToggle'); - vm.toggle.show = vm.moreText && vm.moreText.length > 0; - } - - function setLinkClass(){ - $log.debug('setLinkClass'); - vm.toggle.linkClass = vm.hmLinkClass; - } - - function setDotsClass(){ - $log.debug('setDotsClass'); - vm.toggle.dotsClass = vm.hmDotsClass; - } - - vm.doToggle = function (event) { - if (event) { + var directive = { + restrict: 'AE', + scope: { + hmText: '@', + hmTextClass: '@', + hmLimit: '@', + hmMoreText: '@', + hmLessText: '@', + hmDotsClass: '@', + hmLinkClass: '@' + }, + template: $templateCache.get('readmore.template.html'), + controller: hmReadMoreController, + controllerAs: 'vm', + bindToController: true + }; + + return directive; + + /** @ngInject */ + // "bindToController: true" binds scope variables to Controller + function hmReadMoreController($filter, $scope, $log) { + var vm = this; + vm.toggle = { + dots: ' ...', + dotsClass: vm.hmDotsClass, + linkClass: vm.hmLinkClass + } + + vm.$onInit = function(){ + $log.debug('initialize'); + setToggleMoreText(); + setToggleLessText(); + validateLimit(); + setLessAndMoreText(); + setShowToggle(); + setCurrentToggleText(); + setLinkClass(); + setDotsClass(); + } + + // Toggle functions + function setToggleMoreText() { + $log.debug('setToggleMoreText'); + vm.toggle.moreText = vm.hmMoreText || 'Read more'; + } + + function setToggleLessText() { + $log.debug('setToggleLessText'); + vm.toggle.lessText = vm.hmLessText || 'Read less'; + } + + function setCurrentToggleText() { + $log.debug('setCurrentToggleText'); + vm.toggle.text = vm.toggle.state ? vm.toggle.lessText : vm.toggle.moreText; + } + + function setShowToggle() { + $log.debug('setShowToggle'); + vm.toggle.show = vm.moreText && vm.moreText.length > 0; + } + + function setLinkClass(){ + $log.debug('setLinkClass'); + vm.toggle.linkClass = vm.hmLinkClass; + } + + function setDotsClass(){ + $log.debug('setDotsClass'); + vm.toggle.dotsClass = vm.hmDotsClass; + } + + vm.doToggle = function (event) { + // prevent the click event from propagate + if (event) { event.preventDefault() event.stopPropagation() } - $log.debug('doToggle'); - vm.toggle.state = !vm.toggle.state; - vm.showMoreText = !vm.showMoreText; - setCurrentToggleText(); - } - - $scope.$watch('vm.hmMoreText', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmMoreText changed'); - setToggleMoreText(); - setCurrentToggleText(); - } - }); - - $scope.$watch('vm.hmLessText', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmLessText changed'); - setToggleLessText(); - setCurrentToggleText(); - } - }); - - $scope.$watch('vm.hmDotsClass', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmDotsClass changed'); - setDotsClass(); - } - }); - - $scope.$watch('vm.hmLinkClass', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmLinkClass changed'); - setLinkClass(); - } - }); - - // ---------- - - // If negative number, set to undefined - function validateLimit() { - $log.debug('validateLimit'); - vm.hmLimit = (vm.hmLimit && vm.hmLimit <= 0) ? undefined : vm.hmLimit; - } - - function getMoreTextLimit() { - $log.debug('getMoreTextLimit'); - return vm.hmLimit && vm.hmLimit < vm.hmText.length ? vm.hmLimit - vm.hmText.length : 0; - } - - function setLessAndMoreText() { - $log.debug('setLessAndMoreText'); - vm.lessText = $filter('limitTo')(vm.hmText, vm.hmLimit); - vm.moreText = $filter('limitTo')(vm.hmText, getMoreTextLimit()); - } - - $scope.$watch('vm.hmText', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmText changed'); - validateLimit(); - setLessAndMoreText(); - setShowToggle(); - } - }); - - $scope.$watch('vm.hmLimit', function (newValue, oldValue) { - if (newValue != oldValue) { - $log.debug('hmLimit changed'); - validateLimit(); - setLessAndMoreText(); - setShowToggle(); - } - }); - } -}; + + $log.debug('doToggle'); + vm.toggle.state = !vm.toggle.state; + vm.showMoreText = !vm.showMoreText; + + if (vm.showMoreText) { + //replace the entire text + vm.lessText = '' + vm.moreText = vm.hmText + } else { + vm.lessText = $filter('limitTo')(vm.hmText, vm.hmLimit) + vm.moreText = $filter('limitTo')(vm.hmText, getMoreTextLimit()); + } + setCurrentToggleText(); + } + + $scope.$watch('vm.hmMoreText', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmMoreText changed'); + setToggleMoreText(); + setCurrentToggleText(); + } + }); + + $scope.$watch('vm.hmLessText', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmLessText changed'); + setToggleLessText(); + setCurrentToggleText(); + } + }); + + $scope.$watch('vm.hmDotsClass', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmDotsClass changed'); + setDotsClass(); + } + }); + + $scope.$watch('vm.hmLinkClass', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmLinkClass changed'); + setLinkClass(); + } + }); + + // ---------- + + // If negative number, set to undefined + function validateLimit() { + $log.debug('validateLimit'); + vm.hmLimit = (vm.hmLimit && vm.hmLimit <= 0) ? undefined : vm.hmLimit; + } + + function getMoreTextLimit() { + $log.debug('getMoreTextLimit'); + return vm.hmLimit && vm.hmLimit < vm.hmText.length ? vm.hmLimit - vm.hmText.length : 0; + } + + function setLessAndMoreText() { + $log.debug('setLessAndMoreText'); + vm.lessText = $filter('limitTo')(vm.hmText, vm.hmLimit); + vm.moreText = $filter('limitTo')(vm.hmText, getMoreTextLimit()); + } + + $scope.$watch('vm.hmText', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmText changed'); + validateLimit(); + setLessAndMoreText(); + setShowToggle(); + } + }); + + $scope.$watch('vm.hmLimit', function (newValue, oldValue) { + if (newValue != oldValue) { + $log.debug('hmLimit changed'); + validateLimit(); + setLessAndMoreText(); + setShowToggle(); + } + }); + } +}; \ No newline at end of file diff --git a/src/readmore.spec.js b/src/readmore.spec.js index 6fff489..44ccf7c 100644 --- a/src/readmore.spec.js +++ b/src/readmore.spec.js @@ -213,8 +213,9 @@ describe('hmReadMoreController', function () { controller.doToggle(); - expect(controller.lessText).toEqual(text50); - expect(controller.moreText).toEqual('dreams, he found himself transformed in his bed in'); + expect(controller.lessText).toEqual(''); + expect(controller.moreText).toEqual(text100) + // expect(controller.moreText).toEqual('dreams, he found himself transformed in his bed in'); expect(controller.toggle.state).toBeTruthy(); expect(controller.showMoreText).toBeTruthy(); expect(controller.toggle.text).toEqual('Read less'); @@ -227,8 +228,10 @@ describe('hmReadMoreController', function () { controller = element.controller('hmReadMore'); controller.doToggle(); - expect(controller.lessText).toEqual(text50); - expect(controller.moreText).toEqual('dreams, he found himself transformed in his bed in'); + expect(controller.lessText).toEqual(''); + expect(controller.moreText).toEqual(text100) + + // expect(controller.moreText).toEqual('dreams, he found himself transformed in his bed in'); expect(controller.toggle.state).toBeTruthy(); expect(controller.showMoreText).toBeTruthy(); expect(controller.toggle.text).toEqual('Read less'); diff --git a/src/readmore.template.html b/src/readmore.template.html index cc30e68..8711d00 100644 --- a/src/readmore.template.html +++ b/src/readmore.template.html @@ -1,9 +1,9 @@ - - + + {{ vm.toggle.dots }} {{ vm.toggle.text }} - + \ No newline at end of file From b8329e991635948e762ac3783cbe256938fef9ae Mon Sep 17 00:00:00 2001 From: "Laird, Kathy" Date: Fri, 16 Jun 2017 02:20:10 -0600 Subject: [PATCH 3/4] clean ups --- src/readmore.spec.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/readmore.spec.js b/src/readmore.spec.js index 44ccf7c..25abba6 100644 --- a/src/readmore.spec.js +++ b/src/readmore.spec.js @@ -215,7 +215,6 @@ describe('hmReadMoreController', function () { expect(controller.lessText).toEqual(''); expect(controller.moreText).toEqual(text100) - // expect(controller.moreText).toEqual('dreams, he found himself transformed in his bed in'); expect(controller.toggle.state).toBeTruthy(); expect(controller.showMoreText).toBeTruthy(); expect(controller.toggle.text).toEqual('Read less'); @@ -226,12 +225,11 @@ describe('hmReadMoreController', function () { element = compile('')(scope); scope.$digest(); controller = element.controller('hmReadMore'); + controller.doToggle(); expect(controller.lessText).toEqual(''); expect(controller.moreText).toEqual(text100) - - // expect(controller.moreText).toEqual('dreams, he found himself transformed in his bed in'); expect(controller.toggle.state).toBeTruthy(); expect(controller.showMoreText).toBeTruthy(); expect(controller.toggle.text).toEqual('Read less'); From 73ac935ad94e92ec79247b6ee75697eb15c3c1cb Mon Sep 17 00:00:00 2001 From: "Laird, Kathy" Date: Thu, 22 Jun 2017 15:57:23 -0600 Subject: [PATCH 4/4] remove dots --- dist/readmore.js | 2 +- dist/readmore.min.js | 2 +- src/readmore.template.html | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/dist/readmore.js b/dist/readmore.js index 3319a05..67ca12e 100644 --- a/dist/readmore.js +++ b/dist/readmore.js @@ -173,4 +173,4 @@ function readMore($templateCache) { }); } }; -angular.module('hm.readmore').run(['$templateCache', function($templateCache) {$templateCache.put('readmore.template.html','{{ vm.toggle.dots }}{{ vm.toggle.text }}');}]); \ No newline at end of file +angular.module('hm.readmore').run(['$templateCache', function($templateCache) {$templateCache.put('readmore.template.html','{{ vm.toggle.text }}');}]); \ No newline at end of file diff --git a/dist/readmore.min.js b/dist/readmore.min.js index 41e5099..59c0638 100644 --- a/dist/readmore.min.js +++ b/dist/readmore.min.js @@ -1 +1 @@ -"use strict";function readMore(e){function t(e,t,o){function s(){o.debug("setToggleMoreText"),T.toggle.moreText=T.hmMoreText||"Read more"}function m(){o.debug("setToggleLessText"),T.toggle.lessText=T.hmLessText||"Read less"}function n(){o.debug("setCurrentToggleText"),T.toggle.text=T.toggle.state?T.toggle.lessText:T.toggle.moreText}function g(){o.debug("setShowToggle"),T.toggle.show=T.moreText&&T.moreText.length>0}function l(){o.debug("setLinkClass"),T.toggle.linkClass=T.hmLinkClass}function i(){o.debug("setDotsClass"),T.toggle.dotsClass=T.hmDotsClass}function a(){o.debug("validateLimit"),T.hmLimit=T.hmLimit&&T.hmLimit<=0?void 0:T.hmLimit}function h(){return o.debug("getMoreTextLimit"),T.hmLimit&&T.hmLimit{{ vm.toggle.dots }}{{ vm.toggle.text }}')}]); \ No newline at end of file +"use strict";function readMore(e){function t(e,t,s){function o(){s.debug("setToggleMoreText"),T.toggle.moreText=T.hmMoreText||"Read more"}function m(){s.debug("setToggleLessText"),T.toggle.lessText=T.hmLessText||"Read less"}function n(){s.debug("setCurrentToggleText"),T.toggle.text=T.toggle.state?T.toggle.lessText:T.toggle.moreText}function g(){s.debug("setShowToggle"),T.toggle.show=T.moreText&&T.moreText.length>0}function l(){s.debug("setLinkClass"),T.toggle.linkClass=T.hmLinkClass}function i(){s.debug("setDotsClass"),T.toggle.dotsClass=T.hmDotsClass}function a(){s.debug("validateLimit"),T.hmLimit=T.hmLimit&&T.hmLimit<=0?void 0:T.hmLimit}function h(){return s.debug("getMoreTextLimit"),T.hmLimit&&T.hmLimit\x3c!--{{ vm.toggle.dots }}--\x3e{{ vm.toggle.text }}')}]); \ No newline at end of file diff --git a/src/readmore.template.html b/src/readmore.template.html index 8711d00..9a1cf8d 100644 --- a/src/readmore.template.html +++ b/src/readmore.template.html @@ -3,7 +3,7 @@ - - {{ vm.toggle.dots }} + + {{ vm.toggle.text }} \ No newline at end of file