mistic100 / angular-jqcloud Goto Github PK

Inside the directive's link function, near the bottom there is a section to call jQCloud's update function, if by chance the 'words' is changed via $watchCollection.

Now I put some console.logs in there to make sure this code segment is being ran like so:

$scope.$watchCollection('words', function() {
        console.log('jqcloud updating')
        $scope.$evalAsync(function() {
          var words = [];
          $.extend(words,$scope.words);
          $elem.jQCloud('update', words);
          console.log('jqcloud finished updating');
        });
        //$elem.jQCloud('update', $scope.words);
        //$elem.jQCloud('destroy');
        //$elem.jQCloud($scope.words, options);
        //$scope.$apply();
      });

I see both statements outputted in the console, but the actual cloud isn't updated. Any ideas? I tried destroying the cloud, then initing one... but to no avail. However, the destroy method works.

Project Structure

index.html

app.js

view3.js

bower.js

The http load files

The error

Hi,

I was trying to install the package by putting in my bower.json: "angular-jqcloud": "~1.0.1"

but after executing npm install I get:

And accordingly to this, I get the code of 1.0.0 version that get me errors on execution refering $elem.jQCloud that I can see in the GitHub version that it's ok to jQuery($elem) ( angular-jqcloud/angular-jqcloud.js)

So I think that somehow the npm package it's "corrupted" the line "version": "1.0.0", cause it's different from the one of GitHub "version": "1.0.1", cause this problems...

Please could you check it?

many many thanks in advance

view1.js

view.html

See below example

For example, i need to specify colors='["#00ff00", "#00e500", "#00cc00", "#00b200", "#009900", "#007f00", "#006600", "#004c00", "#003300"]'

instead of colors='colorsArr' , where $scope.colorsArr = ["#00ff00", "#00e500", "#00cc00", "#00b200", "#009900", "#007f00", "#006600", "#004c00", "#003300"]

I have the following configuration
jqcloud words="k" width="100%" height="100%" autoResize="false" colors="['#800026', '#bd0026', '#e31a1c', '#fc4e2a', '#fd8d3c', '#feb24c', '#669900']" delay="50" steps="7" font-size="{from:0.09, to:0.04}"></jqcloud
i have tried switching the autoresize on and off but still the component doesnt show anything at all, but if i have put a fixed width/height it shows.
also fixed width and height with autoresize enabled doesnt take the container size

Could you add an example on how to use a click handle? This seems a bit awkward when I tried. I could not call another method in my controller from it.

I would like to use this for dynamic content. Think of a live chat where current usernames are in the word cloud (as they join the room, they appear in the word cloud).

It works nicely, however when I push a username into the words array, the cloud redraws and changes the color of each username. It would be cool to have a "cache" feature or something similar where current words in the array are not redrawn. Bonus if you add subtle animations when a new word enters. Let me know, thanks!

It is not able to pickup JQCloud as a valid dependency. My bower.json is as below:

{
"name": "phat-stats-front-end",
"version": "0.0.0",
"dependencies": {
"angular": "^1.3.0",
"json3": "^3.3.0",
"es5-shim": "^4.0.0",
"bootstrap": "^3.2.0",
"angular-animate": "^1.3.0",
"angular-cookies": "^1.3.0",
"angular-resource": "^1.3.0",
"angular-route": "^1.3.0",
"angular-sanitize": "^1.3.0",
"angular-touch": "^1.3.0",
"jqcloud2": "git://github.com/mistic100/jQCloud.git#2.0.1"
},
"devDependencies": {
"angular-mocks": "~1.3.0",
"angular-scenario": "~1.3.0"
},

"appPath": "app"
}

It still gives me the below error:

TypeError: undefined is not a function
at link (http://localhost:9000/scripts/angular-jqcloud.js:37:13)

at this line:

  $elem.jQCloud($scope.words, options);

Not sure what I am doing wrong.

Hej, how am I supposed to inject jqcloud into my app as a dependency? I'm doing this:

var app = angular
.module('app', [
'angular-jqcloud'
]);

I have both the js and css file loaded correctly (chrome network says so). After adding the injection I get the following error:

Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module angular-jqcloud due to:
Error: [$injector:nomod] Module 'angular-jqcloud' is not available! You either misspelled the module >name or forgot to load it. If registering a module ensure that you specify the dependencies as the >second argument.

Thanks in advance.

defaults throws an error at example codebase.

Hi,

Any chance your package could be published in NPM in addition to Bower?

That would be useful when not using Bower (e.g. NPM only, or other package managers like JSPM). That's especially relevant with newer toolchains like Typescript, ES6, SystemJS, etc. which are moving away from Bower in favour of module systems...

Cheers,

Nicolas