OpenLayers3 examples offline - javascript

I'm trying to get the following example to work on my own webserver:
http://openlayers.org/en/master/examples/static-image.html
It works fine from the link, but if I checkout the OpenLayers3 git repository:
cd www
git clone https://github.com/openlayers/ol3.git
But if I then go to the examples in Firefox (Debian) I only see a gray back where the map should be. What do I need to do to get the examples working? I tried removing loader.js and referencing static-image.js directly. But that didn't work. I'm slightly at a loss.

Using directly Git repository with git clone https://github.com/openlayers/ol3.git is for advanced users or core developers (See https://github.com/openlayers/ol3/blob/master/CONTRIBUTING.md)
You should better make things simple for getting started.
Go to https://github.com/openlayers/ol3/releases
Click on the green button named "v3.0.0.zip"
unzip the downloaded file in a webserver
open the browser with an url similar to http://serverurl/path/to/examples/static-image.html
And it works.
PS: If you are really offline, download image from http://imgs.xkcd.com/comics/online_communities.png and change this same url in static-image.js file to the local downloaded file.

Related

Is there a reason as to why my locally hosted images aren't displaying on my site after uploading everything on GitHub?

o I am brand new to Github, and frankly to programming in general. I created my own portfolio website (following a Youtube guide) and have been facing so many issues trying to understand terminals and then getting it up on Github, but I must learn Github so it's worth learning it even though there are other options to post your websites onto. But after getting everything on my repositories, everything looks normal when I look at the code but when I open my website hosted on GitHub called tyler-104.GitHub.io (my portfolio website), all my images that are local to my computer won't display.
My images that aren't local are displaying ( I have one for github and one for LinkedIn) and work as they should. I thought that I simply only had to upload my local images that are also inside my HTML code to my repositories would solve it, but it does not.
If you look at my site
(tyler-104.github.io)
none of the bigger images are being displayed even after uploading my local files to my repository (https://github.com/Tyler-104/tyler-104.github.io). More than that I have tried and created multiple repositories, uploaded, altered, and updated but nothing seems to work. My only guess is that since they are local they won't display.
Do you need to somehow use images that are already stored online to make it work? Basically, would I have to remove my locally stored images (that are on my Desktop for example) in my HTML and use internet links that I want to display on some sites like Unsplash? Or can I use local images stored images and they will still be displayed?
The console of the developer mode is full of 404 for URLs like:
GET https://tyler-104.github.io/img/3D/Grapes.webp: 404
^^^^^ ?
But your repository does not have a img folder. It directly has 3D/Grapes.webp.
So might need to create img, and git mv 3D img/ in it (the commit and push), to test if those images are displayed.

Google Rich Text Editor Demo not running on localhost

I'm trying to run the google editor demo on my local machine to see if I can use it in my project.
https://google.github.io/closure-library/source/closure/goog/demos/editor/editor.html
I've downloaded the latest stable source code:
https://github.com/google/closure-library/releases
Unzipped the source code on my local machine and went to folder closure\goog\demos\editor
And Opened editor.html without changing any source code.
I get an incomplete editor with no buttons and not working as per the demo on github, maybe I'm missing something.
This is a node.js project and not a single HTML page.
You should follow the official tutorial to use it.

need to publish to server to reflect javascript changes

I am working on a dynamic web project in eclipse. Until yesterday, we were using CVS for our version control system. When I made any change on a javascript file, I would just save the file and refresh the browser and the change would be there.
However, since I started using Git, I need to publish to the weblogic server in order to see the changes in my browser.
I am not sure what is causing this problem.
The problem was solved.
I changed a setting in eclipse publishing mode from:
Publish as an exploded archive
to
Publish as a virtual application
It isn't related in anyway to Git vs CVS, it's just that I downloaded a new eclipse and the default setting was different from what I previously had.

Live Editing Remote JavaScript in Chrome Inspector

I'm trying to debug remote javaScript using Google Chrome inspector. I recall in the past being able to:
1) Edit remote javascript using Chrome Inspector
2) 'Save' the change using (cmd + s)
3) Test the effect the the altered javaScript on the page
Now when I try to 'save' the change I get a yellow warning icon in the 'tab' that says
"Changes to this file were not saved to the file system"
Can anyone help me with this, please bear in mind that I'm working with remote code (not trying to alter local files) and I do have the developer tools extension installed.
The changes were not saved to disk because you obviously can't access the remote js file, but they will take effect when javascript will reach to these lines of code.
You can add a breakpoint before the place you want to dynamically add your code, reload the page, add the code you want, click ctrl-s. Ignore the warning you mention about the file system and enjoy.
So you can follow these steps and just ignore the warning.
For anyone who stumbles across this, as I did...
For Local Files
You may need to run chrome as Administrator. Or in my case (Ubuntu) as root user.
sudo google-chrome --no-sandbox
Then you can save the files within devtools.
UPDATE: Per the link below, the docs have moved here.
You have to have Workspaces set up in order to do this. Read the docs on how to use Workspaces: https://developer.chrome.com/devtools/docs/workspaces

Javascript not working on localhost, but it is working on Live site

I am facing JavaScript problems on XAMPP Localhost. The Collapse Buttons, go to top button and jQuery news feed are not working on every site on my localhost.
But Facebook, Twitter, Plusone buttons load correctly from remote server i.e. from the respective Social Sites.
So, I think it narrows me to the point that the JavaScript files hosted locally are not executed while those from Facebook etc. are getting executed.
I tried reinstalling XAMPP but didn't work.
I know this is old but, I had the same problem and found this question while searching a solution. But I have lampp installed on ubuntu and since Linux asks permission to execute ANYTHING, the local js files which resided in htdocs were without permission. After:
sudo chmod 777 -R /opt/lampp/htdocs
... everything was OK. Hope this helps future wanabee web developers.
It should not matter whether your files are local or not...javascript should still get executed. Try using some debugging tool like to see if you get any errors that only occur on your local machine. Because it could be that you are running some code that is depending on a domain or whatever.
I know this post is old and the answer is already given, I just wanted to give an answer of a possible reason that I encountered in case someone else finds this and it does not help.
Make sure your entire html code gets executed by viewing your page source. With me, half my code was not being executed due to a PHP error that was working on localhost with the local database but not on live with the live database. This caused the HTML to cut of from that point above my javascript.
So check your page source. If it is being cut of somewhere, find out why :)
I had the same problem. I try a lot but finally solved. The main problem was my browser cache that prevents from loading the new JavaScript file. My recommendation is that clear your browser cache data then close the browser and reopen your site again it will work perfectly.
remove any (pre in post ) blank spaces from filenames of your namespace example : localhost:port/dir /index.html
localhost:port/dir/index.html
In similar cases,
If web project site runs JS on Live Server but not on locally opened index.html,
try to check validity of HTML File Paths,
e.g you may have written:
<script src="script.js"></script>
instead of:
<script src="./script.js"></script>
Try to add ./ before file name.
./ means Current directory.

Categories

Resources