I am using CKEditor in my web app and new to it. It seems my js file isn't downloading with CKEditor, how to include external js files in CKEditor ?
Configuration related js needs to be in config.js
All plugin related files go in the plugins plugins/[plugin_name]/plugin.js
You'll need to add them to the config using extraPlugins config.extraPlugins: 'plugin',
If you want to do something else you can just load another .js
for example:
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="customcode.js"></script></code>
in customcode.js you can put your eventhandling and overrides
CKEDITOR.on( 'instanceReady', function( ev )
{
alert("CKEditor is loaded");
});
Related
I have an issue with the path definition of the libraries and models that are used in an HTML file using WebGL. The HTML file can be found here, which is an example code for a WebGL2 book.
The HTML file itself is sitting locally in the following directory in my computer.
C:\Users\bob\Desktop\Book\ch01\ch01_04_showroom.html
The libraries and other sources are located in
C:\Users\bob\Desktop\Book
├───ch01
| └───ch01_04_showroom.html
├───ch02
└───common
├───images
│ └───cubemap
├───js
├───lib
└───models
├───audi-r8
├───bmw-i8
├───ford-mustang
├───geometries
├───lamborghini-gallardo
└───nissan-gtr
The parts of the code that I have issues with are in the following
ch01_04_showroom.html
<html>
<head>
<title>Real-Time 3D Graphics with WebGL2</title>
<link rel="shortcut icon" type="image/png" href="/common/images/favicon.png" />
<!-- libraries -->
<link rel="stylesheet" href="/common/lib/normalize.css">
<script type="text/javascript" src="/common/lib/dat.gui.js"></script>
<script type="text/javascript" src="/common/lib/gl-matrix.js"></script>
<!-- modules -->
<script type="text/javascript" src="/common/js/utils.js"></script>
<script type="text/javascript" src="/common/js/EventEmitter.js"></script>
<script type="text/javascript" src="/common/js/Camera.js"></script>
...
<script type="text/javascript">
'use strict';
// ...
function configure() {
carModelData = {
// This is the number of parts to load for this particular model
partsCount: 178,
// The path to the model (which I have issue with on my computer)
path: '/common/models/nissan-gtr/part'
};
}
...
I have issue defining the path for hrefs and srcs. Also the one in the javascript function:
path: '/common/models/nissan-gtr/part'
If I use the code as it is posted in here nothing will be displayed in my Google Chrome, just an empty page.
So, I have changed paths from
/common
to relative paths:
./../common
but still, I am not able to load the HTML correctly. I see the gridded floor with an incomplete menu but the car is not displayed yet as in the following snapshot.
It's a security, Chrome doesn't let you load local files through file:///... for security reasons.
The purpose of this security is to prevent external resources from gaining access to your system, which could allow them to modify or steal files
Solutions
The best solution is to run a little http server locally since you can follow the steps from this SO answer or this one.
Or, maybe others will bring it up so I'll mention it, you can also launching Google Chrome from the command line with the flag: --allow-file-access-from-files, but this isn't recommended since Chrome doesn't allow this behaviour to protect you.
Would like to:
Create a static HTML file from a view (so it should include all CSS and JS) using the technologies mentioned above (default Laravel installation)
What I tried:
Simply injecting the content of the app.js into the app.blade.php file with the following code (done this for the app.css and it worked) but it only printed out the text of the JS file:
<script defer>
{!! file_get_contents(public_path('js/app.js')) !!}
</script>
static-generator package => It is only for 4.2
Run npm production (instead of npm development) and it will minify the assets, won't leave in comments and stuff and the first solution (simply injecting it into the HTML file will work)
I saw tutorials regarding webpack and i'm able to bundle everything in bundle.js and i'm able to import jquery in .js files.
In my application i'm using ajax,bootstrap-table, so i need jquery and bootstrap-table in index.html
Using webpack how can i pack and load these in html file using webpack?
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.min.js"></script>
This is my webpack.config.js
var webpack =require('webpack');
module.exports = {
entry: './app.js',
output: {
filename: './bundle.js'
},
node: {
fs: 'empty',
net: 'empty',
tls: 'empty'
},
plugins:[
new webpack.ProvidePlugin({
$:'jquery',
jQuery:'jquery'
})
]
};
If i want jquery in js file, in my nodejs file i'm adding require('jquery') but i want to load those in html?I didn't find much materials regarding this. If anyone knows please help!!!Thanks a lot in advance!!
Are you importing bootstrap inside app.js too?
Based on the current setup, the bundle is generated in the directory in which you have your webpack config file.
if you already have your html template[index.html], then you should include the relative path of the bundled js file in the index.html
i.e. <script src="./bundle.js"></script>
else if you want the bundled file to be included dynamically in your index.html template, you should have a look at html-webpack-plugin
I'm using the java script library html5media.min.js to play mp3 file in Firefox.
my problem is that when I add the script link to my page as:
<script src = "http://api.html5media.info/1.1.5/html5media.min.js" type="text/javascript"></script>
It is working fine.
But if I get the code and save it in a local file, it is not working!!
i.e.
<script src="Scripts/html5media.min.js" type="text/javascript"></script>
Just add this code into your page after the the script tag
html5media.flowplayerSwf = "/path/to/your/flowplayer.swf";
html5media.flowplayerAudioSwf = "/path/to/your/flowplayer.audio.swf";
html5media.flowplayerControlsSwf = "/path/to/your/flowplayer.controls.swf";
You can see this
I have ajax tabs that load external files
see demo here please bottom of the page
http://www.php-help.ro/examples/mootools_fancy_tabs/
they work perfect but my external file has additional 1 javascript file and inline javascript
example :
<script type="text/javascript">
window.addEvent('load', function(){
/*something here*/
});
</script>
on tab load any request to script tag is removed , I dont see anywhere in the file itself that
evalScripts: is set to false , I also added it in right after
url:this.tabs[key].get('href'),
I setup the file on Jsfidle but seems like ajax can load only internal files
http://jsfiddle.net/PUsBg/16/
if anyone could help me out just to be able to load my own script within the ajax tab.
Thank you!
This is probably the result of parsing the request, with the javascript being thrown out in the process. If you include javascript within a CDATA-section, it should not be parsed and still be included:
<script type="text/javascript">
/* <![CDATA[ */
window.addEvent('load', function(){
/*something here*/
});
/* ]]> */
</script>