I am trying to set theme for my application.I included the dependent files in the order jquery,lodash,backbone,graphlib,dagre,keyboard,rappid and localJs file. when i tried to set the theme with joint.setTheme(dark); it throws an error in the console Joint.setTheme is not a function. I went through the rappid documentation Rappid documentation UI
I included rappid.js and rappid.css files instead of including individually other joint.ui.xxx.js files in-order to get access to all the features that rappid provides.
the sample JS code looks like this joint.setTheme error code.
How can i set the theme specific to the code written in the fiddle below? please help...
you don't need to include rappid for themes, as the setThemes is part of the JointJS core. Also make sure joint is exposed to global namespace when you tried the joint.setTheme in browser console.
For inspiration please visit setTheme fiddle https://jsfiddle.net/vtalas/2kubzakn/
Actually i need Rappid for application styling. What i found is joint.setTheme is available in rappid V2.0 i was using older version(found with joint.version in the console). When i update rappid.min.css and rappid.min.js to V2.0 it is working. #vt your example is impressive. Thanks for that and appreciate your time.
Related
I was studying Javascript / Ember and I was looking into its source codes.
https://github.com/emberjs/ember.js/
While I was studying, I found something interesting and I wonder how it works. As you may know, you can get version number of Ember if you type Ember.VERSION in the browser console. I wanted to do in my project so I started searching codes how Ember did it.
I could find
// in packages/ember/lib/index.js
Ember.VERSION = VERSION;
...
// Later exports Ember object
However I can't find how Ember makes it available in window (from browser). I expected they did like... window['Ember'] = Ember or something like that but I couldn't find any similar codes.
I wonder if there is anyone knows how they make Ember object available throughout window. Thank you so much!
ember-cli-app-version addon can expose your application's name and version info. So you can put your version in your templates via an helper.
The addon also registers the infos to the Ember.libraries so that ember-inspector can understand. You can access the Ember.libraries in a such way:
Ember.libraries._registry.filter(item=>{return item.name==='my-app-name';})[0].version
The addon can give you both package.json information or git describe result.
I am working with this demo: http://cssdeck.com/labs/setting-active-states-on-sticky-navigations-while-scrolling/
For some reason when I try to recreate it the Java part making the navigation work isn't coming through on my version here: http://cssdeck.com/labs/ydsxavxy
So far I saved out index.html, style.css, and flip.js and attempted to link the CSS and JS in the index.
How can I get my version working like the demo? How is a Java file included outside of CSSDeck? I am not too familiar with how CSSDeck takes the HTML, CSS, and Java and combines them into one page preview.
The version of jQuery you are loading is not correct.
The example that works uses 1.8, and you are loading 1.4:
<script class="cssdeck" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
You can easily know this by looking at your browser console and seeing what errors it's throwing. In your case, the error is as follows:
TypeError: $(...).on is not a function
This usually means your jQuery library is not defined or not supported by the code you're using.
I am trying to debug ext-all-debug-w-comments.js file. The file is pretty big and when the error occurs, it says "TypeError: all.item(...) is null (151559 out of range 149122)"
Basically the error occurs at line number 151559 but only 149122 files are shown in firebug. Since all the lines are not loaded I cannot debug in firebug.
Please see below image for more information
What should option I have here?
Thank you
Is there a browser specific issue involved?
If not, you could use Chrome, it can handle bigger scripts compared to Firefox.
Use ext-dev.js instead. The ext-all- files are compiled versions with all classes available in Ext JS; ext-dev.js will load every class you use in a separate file. Slows down the app loading considerably so it's only suitable for debugging, but it also makes Ext JS a lot easier to debug.
In order to use ext-dev.js you'll need to set the paths to Ext JS and your custom classes using Ext.Loader.setPath, before the first classes are required -- at the top of your app.js would probably be the best place.
Another (better) way to manage dependencies is to use Sencha Cmd.
i want to put a soundcloud music player (http://stratus.sc/) on my drupalgardens page. i added an external source javascript library and uploaded a js file on the system as it says on the pluging website. all this tru the administration website of drupalgardens. When i check the sourcecode of my webpage it appears like the pluging is on the header. But it doesnt work, i cant see it. i activated all the jquery functions.
bit of sourcecode on header where the pluging seems there:
<script type="text/javascript" src="http://stratus.sc/stratus.js"></script>
<script type="text/javascript" src="http://NAMEOFMYSITE/sites/NAMEOFMYSITE/files/js/js_PRNQJr2GPf-FrbaSuV5IDQ1l6Lfby6e79KpPOUTf5kI.js"></script>
link:
http://bit.ly/10nyAHV
Any suggestions?
Note : The player im talking about is NOT the one that can be seen under the rotating banner. the one im talking about its supposed to be globally on the webpage at its seem on the pluging oficcial webpage
For one you're getting this console error: "Uncaught SyntaxError: Unexpected token < "
Not sure how that script is getting added but just removing the script tags may clear it up.
Even if the frame errors mentioned by KG are unrelated, you have to go clean that all up.
Your script should also be loaded after jquery. Since it looks like you have js aggregation turned on, I don't really know how to determine if drupal is loading things correctly. You can just tell your script to load in the footer instead of header if you're unsure. The links below explain how to do that.
Here are some javascript related resources for Drupal. They sometimes expect things to be handled differently.
The plugin is dependent on jQuery. By default, Drupal 7 loads jQuery 1.4. You may need to use the jQuery Update plugin to use 1.5, 1.7 or 1.8
Drupal Community docs about javascript:
http://drupal.org/node/756722
Drupal javascript API:
http://drupal.org/node/751744
I had a similar issue. Some reasons for a not working player are:
For some reason $ is not known (although jQuery is included). I replaced '$' by 'jQuery' and everything worked fine. That means use jquery(document).ready(... instead of $(document).ready(... and jQuery.stratus({.. instead of $.stratus({...
There is a typo on the stratos.sc web site. It should read $.stratus not $stratus (or jQuery.stratus, see previous hint).
Check that the source stratus.js and the initialisation code is included.
Mixture of https and http might be a good guess as reason for problems, but actually it works (I just tried it). If you can't find the problem, try to use a JavaScript debugger and check the error logs first!
I've been fooling around with videojs and I'd like to register a plugin for some code that I grabbed over on Github my forked code. I followed the setup directions indicated by original author, however when the script goes to self register I get a javascript error on this line:
videojs.plugin('thumbnails', function(options) {
which gives error Uncaught Reference error : videojs is undefined I referred to the docs for videojs where it's says to register a plugin using the call
vjs.plugin('examplePlugin', examplePlugin);
seen at this link. So I was hoping a quick fix would be to just change videojs to vjs but no such luck! Where am I supposed to declare vjs/videojs and as what? as it's not mentioned in the plugin docs. So basically how do you properly register plugins?
Have you done the following?
<script src="/path/to/video.js"></script>
Doing this should include the necessary files that declare vjs and its extended name videojs.
These are both decalred in the above script.
Either vjs or videojs should work if you have done so.
Also, make sure that you have included video.js before your plugin registration. If you have done so, then I believe what you are doing should work fine.
According to the demo included in the vjs download, keep the script include for video.js in the <head> tags to be compatible with older browsers.