How do I create a relative link to a downloaded jquery library? - html

I am having trouble linking to a jquery library and am wondering if someone might be able to point out what I am doing wrong.
My html page is a locally hosted Sharepoint site here:
http://server/sites/blog/dude/Pages/MyPage.html
and my jquery library is located here:
http://server/sites/blog/style%20library/js/jquery-1.7.2.min.js
I it works fine if I reference the whole jquery address like so:
<script language="javascript" type="text/javascript" src='http://server/sites/blog/style%20library/js/jquery-1.7.2.min.js'></script>
But it isn't located when I do this:
<script language="javascript" type="text/javascript" src='../../blog/style%20library/js/jquery-1.7.2.min.js'></script>
Am I using the "folder up" syntax incorrectly perhaps?

Just put /sites/blog/style%20library/js/jquery-1.7.2.min.js
The leading slash tells the browser to go to the host and start from there.

Related

How do you use a background.html page (instead of background.js) with Manifest 2 in a Chrome Extension

I have a Chrome Extension that worked great with the background specified as a script (background.js). Chrome created a virtual background.html page...
I need to a script to background (to get Google Drive integration) and so (as I understand it) need to move to background.html.
My Manifest now specifies:
"background": {
"page": "background.html"},
I added "https://apis.google.com/js/api.js" to my original setup (below) to gain Google Drive access for my Chrome Extension...but my background page was throwing "gapi is not defined" errors...so I switched to background.html to try and get my background processes to be able to access the Drive scripts.
"background": {
"scripts": ["/dscripts/jquery-3.1.1.min.js","/dscripts/firebase.js","/dscripts/bootstrap-multiselect.min.js","/dscripts/bootstrap.min.js", "https://apis.google.com/js/api.js", "/scripts/background.js"]},
My new background.html page looks like:
<!DOCTYPE html>
<html>
<head>
<!--Original javascript / CDN -->
<script type="text/javascript" src="dscripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="dscripts/jquery-ui.min.js"></script>
<script type="text/javascript" src="dscripts/bootstrap.min.js"></script>
<script type="text/javascript" src="dscripts/bootstrap-toggle.min.js"></script>
<!-- FIREBASE - I think we only need JS, not app.js and auth.js -->
<script src="dscripts/firebase.js"></script>
<!-- <script src="https://www.gstatic.com/firebasejs/4.6.2/firebase.js"></script>
<script> -->
<!-- Google APIS -->
<script type="text/javascript" src="https://apis.google.com/js/api.js"></script>
<!-- background.js -->
<script type="text/javascript" src="scripts/background.js">
</head>
</html>
I haven't made any changes to background.js - which holds chrome.runtime.onStartup.addListener and lots of well-established logic.
When I run my Extension and view the background.html console, I get:
Navigated to chrome-extension://XXXXX/background.html
Usually there would be a ton of debug console content generated by my background.js file. It's as if the background.js doesn't run.
Which makes sense, I guess - there's no dom to load and trigger actions.
I feel like I'm missing something really obvious (apologies) - but all the examples I could find use background.js, not background.html.
How do I get my javascript to fire when specifying background.html?
Was missing closing tag on the background.js file. Once I added that then the js in background ran exactly as expected.
So there is no extra action (for those coming after) required to use your own background.html page vs. the auto-generated one.

Load ssl via relative `src`

Haven't been able to find anything posted about this, but is it possible to load https:// Via a relative URL?
On my testing server that is located at example.com:3000 I reference my scripts explicitly like so :
<script type="text/javascript" src="https://example.com:3000/js/dist.js"></script>
This is fine but anytime I switch over to production I need to change this to:
<script type="text/javascript" src="https://example.com/js/dist.js"></script>
What I am wondering is if it is possible to load it like below but ensure that it will be loaded over ssl:
<script type="text/javascript" src="/js/dist.js"></script>

404 file not found on believed correct path?

I have a simple Angular application that I am bundling with Gulp. The index.html has a script reference of:
<script src="./../../js/all.js" charset="utf-8"></script>
and a file structure:
Does this not seem accurately relative?
I am also serving from the public/html/layout/index.html
try
<script src="../../js/all.js" charset="utf-8"></script>
The resolution involved a best practice of placing the index.html at a higher level directory. Still didn't explain why the issue occurred, but the issue is no longer affecting me.
If you are using Google Chrome then you can open your index.html in the browser and goto View Source.
Find this line in the source: <script src="./../../js/all.js" charset="utf-8"></script>
and click the hyperlink of the file. It will then show you the complete address of the javascript file the browser is trying to load. Once you get the complete address I believe you can fix this issue easily.

ReferenceError: google is not defined

I use google map's api in my website to show couple of locations. Google Maps is working just fine in my local solution but not in my website. I changed this source
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.5&sensor=false"> </script>
to this one. and i again changed this
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script>
with this one...
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"> </script>
Only thing it says: ReferenceError: google is not defined
Does anyone familiar with such problem?
Owing to the fact that my website uses https for the connection, I can not use http://maps.google.com/maps/api/js?sensor=false. When I debug the whole page, this link says: Warning : The page index.html ran insecure content. so I made another search on google and came across to this question. so what basically causes a problem is not using https link in the source part so the correct link will be (for me)
https://maps.google.com/maps/api/js?sensor=false
now everything works just fine!
That's an old URL. If you look at the examples from the documentation, almost all of them use:
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
To me, with the new Google Maps API, simply this solution worked:
Just omit "async defer" from the script provided by goolge:
<script async defer src="https://maps.googleapis.com/maps/api/js?key={your_key}"></script>
TO
<script src="https://maps.googleapis.com/maps/api/js?key={your_key}"></script>
i met this problem in the rails application.
request to googlemap was from http and https pages
and it solved:
= javascript_include_tag "//maps.google.com/maps/api/js?sensor=false"
if protocol not defined rails inserts automatic

How to clean a DotNetNuke page for viewing on a mobile device?

I've been asked to make a landing page in DotNetNuke 5 for smartphone users who scan a QR code. I'm comfortable making mobile-optimized HTML, but what I can't figure out is how to remove the dozens of little JavaScript files DotNetNuke insists on splattering all over my page.
Here's my skin file:
<%# Control Language="VB" Codebehind="~/admin/Skins/skin.vb" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Skins.Skin" %>
<div id="ContentPane" runat="server" />
Somehow this generates ten <script> tags inside the body tag alone. Even if these files are 1k, they're going to slow down the iPhones and Androids that will hit the page over a 3G connection.
How can I get rid of stuff like this?
<script src="/WebResource.axd?d=ZqXqDXDKumeQiG8GZ0x_mzZZ0jQMPgecqAb7TxBPgb6GZEdhNEOACHbMv_-DjQSx6FMWwSwTCVOkBTdp0&t=634390613877902798" type="text/javascript"></script>
<script src="/js/dnncore.js" type="text/javascript"></script>
<script src="/WebResource.axd?d=OY9wp5yXYij5t96ul3j-usYb-39eRGfAvw_wEQs0x7yQkcbu_mJ6hC130al2esCXmkgk0yjNpDCTD4bw0&t=634390613877902798" type="text/javascript"></script>
<script src="/js/dnn.js" type="text/javascript"></script>
<script src="/js/dnn.xml.js" type="text/javascript"></script>
Unfortunately, at the moment there isn't anything built into DNN that will let you remove most of those scripts (though some of the WebResource.axd scripts may depend on which controls you have being displayed, or which control panel you're using).
I think your best bet is probably to use the Snapsis Page Blaster product, which is made to optimize the output from DNN. By default, it combines and minifies scripts and CSS files. It also has filtering capabilities which you should be able to use to remove those scripts altogether.
So far as CSS is concerned, you can also use the StyleHelper skin object which allows you to specify which CSS files should not be loaded by DNN.