Summernote Not Wroking With Datatables - javascript

I am New to Web Programming ....
I have a Problem With including Libraries , I Using Summer note (/*! Summernote v0.7.3 ) For Add Notes And I Using Data Tables And Bootstrap 4.5
<script src="template/assets/js/datatables.js"></script>
When After Add Above Connection Code
! Summernote Change To Like This
enter image description here
I Changed Up And Down Of Rules and Lines Of Code Libraries Links
But does Not Changes Anything
Like This
!! up
<script src="template/assets/js/datatables.js"></script>
<script src="template/assets/plugins/summernote/summernote.min.js" type="text/javascript"></script>
!! Down
<script src="template/assets/plugins/summernote/summernote.min.js" type="text/javascript"></script>
<script src="template/assets/js/datatables.js"></script>
After Removed the Data tables Link Summernote Work Correctly
enter image description here
How I Run this 2 Codes Links Without Crashing Like this

Related

How to use marker area learn

Right now I'm working with Three.js , Aframe and AR.js .
I'm following Jerome's example :
https://github.com/jeromeetienne/AR.js/blob/master/three.js/examples/multi-markers/examples/player.html
I've included his library in my project sample and I'm trying to figure out why this happens :
When I'm on the player.html page , everything's working , the console doesn't display any error , just a warning :
stop profile.trackingBackend() obsolete function. use .trackingMethod instead
(But I don't think this is causing the problem)
And then , when I click to scan the markers , the button works , the function behind executes , I get redirected to the learner.html webpage , but all import scripts are getting 400 error code and aren't loaded on the website so nothing's working.
What I did : I've checked the scripts via online tools , line by line , copy paste try.They're the same , when I say the same I mean the learner.html page has 3 less scripts imported than the player.html , the common scripts syntax is the same on both pages.
What I noticed : If I try to access the webpage without the options in the URL the page is perfectly working ... well , the page is giving me some output about the missins options but the scripts are loaded , but I need the options :(
The problem with the scripts imports I think it's caused by that object included in the URL webpage , weird thing because it has some other things added in the player webpage as well and it's working.
I'm using NodeJS v4.2.6 & NPM v3.5.2 & Express v4.16.4
This is the way how I handle the requests for these 2 page in NodeJS:
app.get('/multiMarkers4', function (req, res) {
res.render( pathView + 'player.ejs', { pageName:"player", errorMsg:"" });
});
app.get('/learner', function (req, res) {
res.render( pathView + 'learner.ejs', { pageName:"learner", errorMsg:"" });
});
Yes, I've changed the files from html to ejs and moved them into the /views ( only these 2 learner.ejs and player.ejs )
For scripts I've created some specific paths in Node :
app.use('/three', express.static(__dirname + '/three.js'));
The learner.ejs and player.ejs webpages have pretty much the same code as they have in the Jerome's GitHub repository , the only modified thing are the import scripts :
This is in player.ejs and it's working
<!-- three.js library -->
<script src='/three/examples/vendor/three.js/build/three.js'></script>
<script src='/three/examples/vendor/three.js/examples/js/libs/stats.min.js'></script>
<!-- jsartookit -->
<script src='/three/vendor/jsartoolkit5/build/artoolkit.min.js'></script>
<script src='/three/vendor/jsartoolkit5/js/artoolkit.api.js'></script>
<!-- aruco -->
<script src='/three/vendor/js-aruco/src/svd.js'></script>
<script src='/three/vendor/js-aruco/src/posit1.js'></script>
<script src='/three/vendor/js-aruco/src/cv.js'></script>
<script src='/three/vendor/js-aruco/src/aruco.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucocontext.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucodebug.js'></script>
<!-- include threex.artoolkit -->
<script src='/three/src/threex/threex-artoolkitsource.js'></script>
<script src='/three/src/threex/threex-artoolkitcontext.js'></script>
<script src='/three/src/threex/threex-artoolkitprofile.js'></script>
<script src='/three/src/threex/threex-arbasecontrols.js'></script>
<script src='/three/src/threex/threex-armarkercontrols.js'></script>
<script src='/three/src/threex/threex-armarkerhelper.js'></script>
<script src='/three/src/threex/threex-arsmoothedcontrols.js'></script>
<script>THREEx.ArToolkitContext.baseURL = '';</script>
<script src='/three/examples/multi-markers/threex-armultimarkerutils.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkercontrols.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkerlearning.js'></script>
<script src='/three/examples/multi-markers/examples/threex-screenasportal/threex-screenasportal.js'></script>
<script>THREEx.ScreenAsPortal.baseURL = 'threex-screenasportal/';</script>
When I'm on player.ejs page the URL is :
https://x.y.z/multiMarkers4#%7B"trackingBackend"%3A"artoolkit"%7D
When I'm on player.ejs page the console log in devTools is :
THREE.WebGLRenderer 86
threex-artoolkitprofile.js:145 stop profile.trackingBackend() obsolete function. use .trackingMethod instead
ARjs.Profile.trackingBackend # threex-artoolkitprofile.js:145(This is that warning,the rest of the output is just simple output)
artoolkit.min.js:1 Allocated videoFrameSize 1228800
artoolkit.min.js:1 Pattern detection mode set to 1.
artoolkit.min.js:1 Pattern ratio size set to 0.500000.
This is in learner.ejs and it's working WITHOUT THE OPTIONS IN URL :
<!-- three.js library -->
<script src='/three/examples/vendor/three.js/build/three.js'></script>
<script src='/three/examples/vendor/three.js/examples/js/libs/stats.min.js'></script>
<!-- jsartookit -->
<script src='/three/vendor/jsartoolkit5/build/artoolkit.min.js'></script>
<script src='/three/vendor/jsartoolkit5/js/artoolkit.api.js'></script>
<!-- aruco -->
<script src='/three/vendor/js-aruco/src/svd.js'></script>
<script src='/three/vendor/js-aruco/src/posit1.js'></script>
<script src='/three/vendor/js-aruco/src/cv.js'></script>
<script src='/three/vendor/js-aruco/src/aruco.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucocontext.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucodebug.js'></script>
<!-- include threex.artoolkit -->
<script src='/three/src/threex/threex-artoolkitsource.js'></script>
<script src='/three/src/threex/threex-artoolkitcontext.js'></script>
<script src='/three/src/threex/threex-artoolkitprofile.js'></script>
<script src='/three/src/threex/threex-arbasecontrols.js'></script>
<script src='/three/src/threex/threex-armarkercontrols.js'></script>
<script src='/three/src/threex/threex-armarkerhelper.js'></script>
<script src='/three/src/threex/threex-arsmoothedcontrols.js'></script>
<script>THREEx.ArToolkitContext.baseURL = '';</script>
<script src='/three/examples/multi-markers/threex-armultimarkerutils.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkercontrols.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkerlearning.js'></script>
When I'm on learner.ejs page the URL is :
https://x.y.z/learner?%7B"backURL"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4%23%257B%2522trackingBackend%2522%253A%2522artoolkit%2522%257D"%2C"trackingBackend"%3A"artoolkit"%2C"markersControlsParameters"%3A%5B%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fhiro.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fkanji.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fa.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fb.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fc.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Ff.patt"%7D%5D%7D
As I said , for https://x.y.z/learner the scripts are included but I don't have the options and I need them
When I'm on learner.ejs page the console log in devTools has the 400 response from server for all scripts :
Failed to load resource: the server responded with a status of 400 (Bad Request)
How can I import these scripts and keep the options so I will be able to learn the marker area?
Ok, I'll put here the answer to my question.
After posting this question, I've tried to change back from EJS to HTML and see if there's any difference, still the same results.
So I chose the hard way: I've made some changes in the library, to sum it up:
I've kept the way how I access the file e.g: via /learner & without any parameters in the URL, But I need them, so I've moved them on the web localStorage and just used them from there on the website part and that worked.

angular js i18n translate loading issue

I am using http://github.com/angular-translate/angular-translate for website localization.
when page load it's working perfectly.
But load page partially, the translation works in lagging way. That means,
Partial page loads first with the tag and showing in the same way in the page.
{{ 'CONGRATS' | translate }}
After 5 or 8 seconds, it translate to original text. Sometime network may be slow. In that time this should not be show like that.
Translation should be done properly, before page show to the user.
How to rectify this error ?
What mistake I made here ?
I've loaded the angular js scripts in the following manner.
<script src="scripts/angular.min.js"></script>
<script src="scripts/angular-route.min.js"></script>
<script src="App/angular-translate.js"></script>
<script src="App/angular-translate-loader-static-files.js"></script>
<script src="App/angular-translate-loader-partial.js"></script>
<script src="App/app.js"></script>
I am loading the languages in app.js like following,
var langSvSE = {
"ENTER_EMAIL_ADDRESS": "Ange e-post adress",
"PASSWORD": "Lösenord",
}
$translateProvider.translations('sv-SE', langSvSE);
$translateProvider.preferredLanguage('sv-SE');

Find a script in head with jquery based on it's data-attribute

In my content editor you can change custom webfonts on the fly. If you change a font, it deletes all scripts and styles using the data-attribute as an identifier and the new ones then get appended after an ajax call. Now after some testing i realised it work's very well with css files but it ignores the < script >'s. Any ideas? Here is my Script:
$('head').find('[data-fontset-id=ce-fontset]').each(function() {
$(this).remove();
});
For example this is how the head section looks like:
<link data-fonset-id="ce-fontset" rel="stylesheet" href="..........">
<script data-fonset-id="ce-fontset" type="text/javascript" src="//use.typekit.net/xxxxx.js"></script>
<script data-fonset-id="ce-fontset" type="text/javascript">try{Typekit.load();}catch(e){}</script>
In this example, the css file gets removed but the javascript files didnt, any ideas why they are being ignored?
Thanks a lot in advance,
Michael

Javascript blank screen error

I am setting up a website for my Minecraft server and I ran into this problem, I followed the instructions, as seen in the link below, and it doesn’t work, nothing shows up, it is just blank.
Image URL:
http://i.stack.imgur.com/jAqkI.png
This is the code that I am doing:
<script src="http://www.playgrid.com/api/2.0/js/f87087296b71a8c31eccf14d8b809982f5158662/" type="text/javascript" async=true ></script>
<div class="playgrid-recent-players">
<!-- widget will be inserted here -->
</div>
Looks like JQuery is required for this widget to run, try including it above the widget code:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
Here is a working fiddle:
http://jsfiddle.net/p7PjS/

Change language of Aloha-Editor

I want to use the Aloha-Editor for one of my projects. The default project language is german, but I can't find any way to change the language of the editor. (Searched the web and the Guides of their website.)
The only thing I found is how to use i18n when developing a plugin for the editor but not how to set the language in the current stable version.
This is what I did:
<!-- load the jQuery and require.js libraries -->
<script type="text/javascript" src="http://cdn.aloha-editor.org/latest/lib/require.js"></script>
<script type="text/javascript" src="http://cdn.aloha-editor.org/latest/lib/vendor/jquery-1.7.2.js"></script>
<!-- load the Aloha Editor core and some plugins -->
<script src="http://cdn.aloha-editor.org/latest/lib/aloha.js"
data-aloha-plugins="common/ui,
common/format,
common/list,
common/link,
common/highlighteditables">
</script>
<!-- load the Aloha Editor CSS styles -->
<link href="http://cdn.aloha-editor.org/latest/css/aloha.css" rel="stylesheet" type="text/css" />
<!-- make all elements with class="editable" editable with Aloha Editor -->
<script type="text/javascript">
Aloha.ready( function() {
var $ = Aloha.jQuery;
$('.editable').aloha();
});
</script>
Does anyone know what I need to add or change to get the editor in an other language?
At first I found something in the Aloha Guide about Localization but doing this didn't work for me.
Than I had a look at the demo pages and came to this working solution. I had to add the following javascript before I include require.js and aloha.js
<script language="javascript">
Aloha = window.Aloha || {};
Aloha.settings = {
locale: 'de'
};
</script>
Then the Aloha script automatically loads the i18n files for the chosen language. I used a local version of aloha and did not test it with the version from http://cdn.aloha-editor.org/latest. My version was 0.22.7.
you can download other languages here there is more information available in the help file
You can change the master language at any time in your project via Admin->Languages.
hope this helps
Rachel

Categories