goodeggs / angular-barcode-listener

Angular directive to listen for barcode scanner events
MIT License
16 stars 10 forks source link

Error using bookmarklet to test implementation.. #7

Closed crispconcepts closed 8 years ago

crispconcepts commented 8 years ago

I'm not sure this is the fault of the bookmarklet itself, but it was involved in producing of the error.

I am including the barcode js file after angular js file, and before app/ctrl js files on index.html

I include it as a dependency..

var app = angular.module("myApp", [
    "ngRoute",
    "ngStorage",
    "barcodeListener",
]);

I add it to template/view html file.. <barcode-listener on-scan="handleScan" prefix="" scan-duration="500"></barcode-listener>

I then click the bookmark and I get the following error in console..

TypeError:` q.indexOf is not a function
n.event.trigger(b=keypress charCode=, keyCode=, c=undefined, d=Document /custom_scripts/mobile_scanner/#/, e=true)jquery.min.js (line 3)
.triggerHandler(a=keypress charCode=, keyCode=, b=undefined)jquery.min.js (line 3)
triggerKeypressEvent(char="p")javascr...20})(); (line 1)
javascript:(function(){%20%20%20var%20$document%20=%20window.angular.element(document).injector().get('$document');%20%20%20%20var%20triggerKeypressEvent%20=%20function(char)%20{%20%20%20%20%20var%20event%20=%20new%20Event('keypress');%20%20%20%20%20event.which%20=%20char.charCodeAt(0);%20%20%20%20%20$document.triggerHandler(event);%20%20%20};%20%20%20%20var%20barcode%20=%20prompt('Text%20to%20scan');%20%20%20for%20(var%20i%20=%200;%20i%20<%20barcode.length;%20i++)%20{%20%20%20%20%20triggerKeypressEvent(barcode[i]);%20%20%20}%20})();()javascr...20})(); (line 1)
javascript:(function(){%20%20%20var%20$document%20=%20window.angular.element(document).injector().get('$document');%20%20%20%20var%20triggerKeypressEvent%20=%20function(char)%20{%20%20%20%20%20var%20event%20=%20new%20Event('keypress');%20%20%20%20%20event.which%20=%20char.charCodeAt(0);%20%20%20%20%20$document.triggerHandler(event);%20%20%20};%20%20%20%20var%20barcode%20=%20prompt('Text%20to%20scan');%20%20%20for%20(var%20i%20=%200;%20i%20<%20barcode.length;%20i++)%20{%20%20%20%20%20triggerKeypressEvent(barcode[i]);%20%20%20}%20})();()javascr...20})(); (line 1)
...deType&&!X.test(q+n.event.triggered)&&(q.indexOf(".")>=0&&(r=q.split("."),q=r.sh...

Is it failing to inject it to the document for some reason?

Also, do you have an example implementation of an onScan event/function in the controller? There isn't one in the documentation or anything explaining how to handle the barcode data once it reaches controller. Would it be something like $scope.handleScan = function(barcode){console.log(barcode);} ?

crispconcepts commented 8 years ago

Nvm. I will use a simpler solution since this one seems unsupported. For those curious..

html

<body ng-view ng-keypress="keyPressed($event)"></body>

controller

var keys = "";
var barcodeIsDone = false;
$scope.keypressed = function(event){
    $timeout(function(){
        if(event.key == "Enter"){
            var barcodeIsDone = true;
        }else{
            keys = keys + event.key;
            var barcodeIsDone = false;
        }
        if(barcodeIsDone){
            $scope.scanner_input = keys;
            barcodeIsDone = false;
            keys = "";
        }
    });
};

$scope.$watch('scanner_input', function(value) {
    .......
    .......
    $timeout(function(){
        $scope.scanner_input = "";
    }, 500);
});
OmanFerrer commented 8 years ago

Thanks you @ljacobs-sml. I had the same conflict but this helped me.