Unable to update a jquery script downloaded from github - javascript

I'm new to using jQuery.
I'm attempting to setup a local installation of code called 'scm-music-player' which I found on github.. There is a version of the script that works great using the author's server, the code seems to have external links to outdated jQuery scripts, I located within the zip file I download the files, but I just can not get it to work, I've been at it for days now.
Here is what I've done so far:
Downloaded files from here https://github.com/cshum/scm-music-player/archive/github.zip
Extracted & uploaded to my server root directory https://mohdish.com
Then ran the configuration script as advised http://scmplayer.co/#base=https://mohdish.com/
This generates a block of code:
Installed the generated script shown below in my index.php at the start of the script. It didn't work Next looked through the scripts and noticed that the config.js (root folder) file had outdated external links. I found all the scripts that were being referenced to on my server from the zip file I then made several attempts at modifying config.js with no success. All the links below point to the correct location, but I must be missing something.
This is what part of that looks like now: paths: {'jquery': 'https://mohdish.com/js/lib/jquery/jquery-1.8.2.min.js','jquery.ui': 'https://mohdish.com/js/lib/jquery/jquery-ui.min.js','jquery.scrollto':'https://mohdish.com/js/lib/jquery/jquery.scrollTo.min.js','underscore': 'https://mohdish.com/js/lib/underscore/underscore.js', 'knockout':'https://mohdish.com/js/lib/knockout/knockout-2.1.0.js','text': 'https://mohdish.com/lib/require/text.js','domready': 'https://mohdish.com/lib/require/domready.js'},
Anyone able to give me some advice?
<!-- SCM Music Player http://scmplayer.co -->
<script type="text/javascript" src="https://mohdish.com/script.js"
data-config="{'skin':'skins/aquaBlue/skin.css','volume':50,'autoplay':false,'shuffle':false,'repeat':1,'placement':'top','showplaylist':false,'playlist':[{'title':'Million Dreams','url':'https://mohdish.com/ziv.mp3'}]}" ></script>
<!-- SCM Music Player script end -->
This is what I've modified, I am sure I've done something wrong!
{'jquery': 'https://mohdish.com/js/lib/jquery/jquery-1.8.2.min.js','jquery.ui': 'https://mohdish.com/js/lib/jquery/jquery-ui.min.js','jquery.scrollto':'https://mohdish.com/js/lib/jquery/jquery.scrollTo.min.js','underscore': 'https://mohdish.com/js/lib/underscore/underscore.js', 'knockout':'https://mohdish.com/js/lib/knockout/knockout-2.1.0.js','text': 'https://mohdish.com/lib/require/text.js','domready': 'https://mohdish.com/lib/require/domready.js'},
I expected it to work the same as it does on the author's server.

I did a lot of posts reading on Google, realised that I was incorrect in adding .js to the file path, when I took this off & corrected the path to the correct folders then the player started working, well on desktop devices anyway. Just need to work out why my site does not play on mobile devices.

Related

JavaScript path doesn't load on Live Server extension (VS Code)

HTML and CSS files are working perfectly on my live server. But every time I lead to a .js script it will not be shown on my live server. If I try to load the .js file directly through the URL it shows "Cannot GET /line.js". I already tried out everything I've found on the internet but it's still not working. Here are the points I checked/did:
Installed Code Runner
Installed Node.js = node.js system path done
Settings = Live Server Config = specified browser
"liveServer.settings.CustomBrowser": "chrome" on JSON settings
.js file is in a separate folder and accessed via <script src="line.js"></script> on index.html
Chrome is set as default browser on my system
Thanks for your inputs.
If the js file is in a separate folder, you need to provide the exact route to the folder in the script tag, since in the current form it is trying to find the js file in the root directory. The script tag should look like this:
<script src="FOLDER_NAME/line.js"></script>
It's possible that your javascript file is being loaded before the HTML page is rendered. You can try adding "defer" to your script tag like this:
<script src="demo_defer.js" defer></script>

Why can't I get my script tag src's to work?

I have been coding up a localhost, and I made the localhost by using of course a JavaScript file to do so, and I then made it reference an HTML file. However, I noticed that when I am using localhost to serve up the HTML file I get this error:
"GET http://localhost:3333/filetesting.js"
The filetesting.js is that js file, there are also other things I'm referencing too, like websites. I'm referencing it by using script tag src.
I looked at the network on developer tools of it and it says it's a 404 error not found. I'm trying to figure out how to reference my script tag src's without having localhost:3333 go before it.
When I run the HTML file without using the localhost, it works just fine when it comes to the script tag src's. If you do not entirely understand what I'm asking for, just ask.
Assuming that your script will always reside in the root level of your website, you can simply target it with the root-relative prefix /:
<script src="/filetesting.js"></script>
This will load your script from the root, regardless of the site the file is hosted on. For example, on http://localhost:3333/ it will load the file from http://localhost:3333/filetesting.js, and from http://localhost:3333/folder/, it will attempt to load the file from the same location.
If you move your files over to a proper website, it will still work the same way: www.example.com will look for the file at www.example.com/filetesting.js, and www.example.com/folder/ will look for the same file at www.example.com/filetesting.js.
Hope this helps! :)

Why my site isn't fully functioning on public domain (in the world wide web)?

I made a simple website. The site is fully functionable in my localhost (my computer). Everything working fine here.
But problem arises when I upload the files into the web server in order for running that in public domain. There, no content is showing except the layout. No link or tab is working, no paragraph inside the body is displaying. You may have a look here.
For what reason?
I uploaded all the files (with source code) associated my website except the images and videos (since there are a lots of images and I will upload it a bit later).
[NOTE: I have xampp local server installed in my computer. All the
sourse codes files are stored inside the htdocs folder. Inside the
htdocs folder I have a folder named jquery(which was installed with
the package). I saved my .JS file inside the JQuery folder (since I
used jquery code too). So when I upload file into the server do I need
to upload the whole htdocs folder? Or how about the JQuery folder
(which contains the JQuery source code)? Do I also need to upload it?
My paths set are the following:
C:\xampp\htdocs\jquery [contains the whole project's source file]
C:\xampp\htdocs\jquery\js [Contains only JavaScript&JQuery file]
If you inspect your page and look where you expect the content to be, you'll find <div id="home">. Looking at the CSS for this, it shows line 258 of your css file has this:
#all_contents >div {
display:none;
}
This is causing all of your contents to not display. Removing this will fix the problem.
Also, if you look on the browser's console when your page loads, you'll notice a lot of 404s trying to load various scripts, stylesheets, and images. That's potentially contributing to the problem. I'd focus on fixing those first, to make sure everything is loading properly.
I tried debugging the HTML on your website. I found the following code in design.css at line number 258
#all_contents >div {
display:none;
}
Once you remove this(display:none), all the content is available on the website link that you shared.
Also, I am not sure why this is working on your local. Are you sure that you have uploaded the same version which is running in your local?
You can debug your webpage by pressing F12 and then selecting the problematic area. On the right hand side, you can see the css rules associated with the selected element.
For getting the specific content in a page and not all, create a new file by the name who_im.html and put your content over there and then You should do something like
About Me
Like this you will have to make other pages as well and add the hyper links to the menu in every page.

Broken URLs for including js and css resources

I have a very strange issues in production servers. In VbScript application in pages i've linked it to js or css resources. Somehow part of the url, for download js or css resource, connect with some other part of code on the page or in included pages (this is seen in logs already). Other part can be js, css or html code.
For example: full path to resourse
../mydomain/admin/somefolder/css/la-core-main.css
Instead this in logs i see error (System.Web.HttpException (0x80004005): A potentially dangerous Request.Path value...) with next URL:
../mydomain/admin/somefolder/css/lead>
Without a code example it's hard to nail down your problem. On your activation of the download links target _blank instead so it does not try to navigate the user to the file directly.
Download
EDIT: to better address OP's question.
Includes for CSS and javascript only fail due to improperly linked paths. It is possible that you are trying to link the css and js files from the server end of the folder structure and not the client end of the folder structure. Trying to link the css and js files from the server end, you would use the Scripting.FileSystemObject to read in the files and populate them as part of the page. You would NOT use <link rel""...> or <script src=""...> to connect the scripts in the vbscript/asp code.
If you are trying to connect the scripts to the website on the client end, you need to verify the paths of the js and css documents from the website directly. Open the webpage from your browser and build off of the direct path from the website. So that way it specifically matches the containing folders in the website.
Examples:
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
Final note: Also verify that your js and css documents are in your hosting web application folders so that you can actually get to them via website.

JS and SWF calling issue

I'm using ZeroClipboard code to add a copy button to my page. It was working perfect when everything was in the same folder, but when I started classifying everything, like .js in a folder and .swf in another folder, the script stopped working. (NOTE: testing on localhost WAMP Server).
Here is my code:
<script type="text/javascript" src="js/ZeroClipboard.js"></script>
And here is the part of the JS that is not working/causing problem:
moviePath: '/swf/ZeroClipboard.swf', // URL to movie
Before, when the JS and the SWF were in the same folder, it worked perfectly. Now when separated, it is not working. Here are all the trials I made:
moviePath: './swf/ZeroClipboard.swf', // URL to movie
moviePath: '../swf/ZeroClipboard.swf', // URL to movie
moviePath: 'swf/ZeroClipboard.swf', // URL to movie
None worked and the error returned (using Google Chrome Javascript Console):
**GET http://localhost/swf/ZeroClipboard.swf 404 (Not Found)**
Anyone else facing this? Anyone know how to override/solve this?
If you are using apache check your .htaccess file and
/var/log/apache2/access_log
/var/log/apache2/error_log
for detailed info

Categories