Dynamic Point Cloud - javascript

I have another issue regarding the Image Paths on the sidebar.
I am working on a site that has to be able to load a cloud by selecting it from a grid, then selecting another cloud from the grid and:
Clear the existing cloud and annotations if there are any.
Load the new cloud with new annotations.
I have both of those two steps working. The problem I have is When I try to use the sidebar menu, Most of the information/links and Icons are gone.
I am doing things a little bit unconventional. I am using a single .aspx page to load whichever cloud is selected from the grid and not a single .html page for each cloud created. The folder structure for the libs are as follows in relation to the .aspx page
/scripts/Potree/libs
I'm fairly sure this is a path thing since everything else is working as expected. I can not figure out how to resolve this. has anyone else tried this and if so, how did you resolve this?

There was a different version of JQuery loaded from the Master page of this project that conflicted with the version Potree needed. I changed the Master to only load the conflicting JQuery file if the page is not the one containing the point cloud.

Related

How to embed HTML5/CSS + js music player on single wordpress page?

I have an html 5, css, and javascript audio player that I'm trying to add to one page on my wordpress site.
I tried to paste the html into my page's text editor, while installing the JS and CSS folders for the player in my child theme's folder, which didn't work.
I tried placing the CSS for the player styling in my child themes CSS file, and that didn't work. I also tried linking to the style sheets and js scripts from the header.php file, which wasn't working for me.
My first thoughts are that because the html is showing up as it should, the css and JS files aren't being called. So I just need to figure out the path structure of how wordpress creates pages? Yet I know wordpress does something with a database to display the pages?
I saw some documentation about using I think it was either php or JS functions to call scripts or something and I don't understand enough of those languages to be able to make sense of it yet.
I'm still working with my developer, but he's 7 hours ahead of me and asleep. I just want to put the hardcoded version of the player and a few songs on my site for now so I can do some testing/see how it looks.
I hope that this question meets the SO req's. I tried to search on my own and I know the answer is out there, I just don't know enough to understand it yet. Trying to get a head start
The path to your Child theme's folder should be '/wp-content/themes/name-of-theme/'. You can use that in your header to call the files from wherever you might have placed them in your Child theme's folder.
To hard code the HTML, pasting it in the WordPress page editor should work fine unless there is another JS call or some weird iFraming going on.. if that's the case, you can simply create a Page Template (https://developer.wordpress.org/themes/template-files-section/page-template-files/page-templates/#creating-custom-page-templates-for-global-use) and paste the code there. You'll likely want to just copy an existing page template from your Theme, take out the inner loop, and replace it with your video code.
Adding the links to your 'header.php' file would be considered bad practice. You would want to create a 'functions.php' file inside your Child theme and call the JS/CSS from there. You can also find this within the WordPress codex (they literally give examples you can copy/paste and change your file names).

js corrupt file only working on some pages

I am making a magento webshop, but i have run into some problems with the theme i am using.
I bought it on themeforest, and i have asked the developer for help, but it takes ages for them to answer and come with a real solution to fix the problems, so now i am seeing if someone here can help me solve the problem.
The webshop: http://new.webhipster.dk/index.php/home-left
When i add items to basket ("Læg i kurv"), it only works on the front page (the link listed above). When i go to another page, it won't add the item to basket. (e.g. http://new.webhipster.dk/index.php/roedvin.html)
So my guess is that there is a corrupt js file, but what i don't understand is, that it is the same code which is generated in header on both pages - but still it doesn't work on any other page but the frontpage.
How do i figure out what js file is corrupt and isn't loaded properly?
I have gone trough each one to see if they load, and it seems like they all load exactly like they do on the frontpage.
I guess you are missing a library required for it or might be css. As error in your console window say that it could not found css property.
Because when I tried accessing url directly from browser it's adding items into cart
For Example you are calling -
setLocation('http://new.webhipster.dk/index.php/checkout/cart/add/uenc/aHR0cDovL25ldy53ZWJoaXBzdGVyLmRrL2luZGV4LnBocC9ob21lLWxlZnQ,/product/2/form_key/1Tfx79G6V33Q7l2Q/')
Now try accessing it from the url something like
http://new.webhipster.dk/index.php/checkout/cart/add/uenc/aHR0cDovL25ldy53ZWJoaXBzdGVyLmRrL2luZGV4LnBocC9ob21lLWxlZnQ,/product/2/form_key/1Tfx79G6V33Q7l2Q/
and this will add item in your cart.
Now you debugging should start from function setLocation(). Try doing file search for setLocation function. and check where it is failing.
Hope this will help you atleast for debugging.

shopify and instafeed.js compatibility issues

I am trying to use shopify and instafeed.js together but I am getting no data returned on the page just some broken image icons. I have read about solutions here: Instagram feed not returning any data and still cant figure out why. you can find my page here: http://supaslydes.com/ and at the very bottom you will see broken image links. This same code works on my local machine, but when I integrate it into shopify liquid file it breaks. Any known issues or solutions would be most helpful.
The template option from instafeed is not compatible out of the box, remove it, save it, and re add it and it will work.

Twitter embedded timeline widget

I went ahead and downloaded http://platform.twitter.com/widgets.js
And the http://platform.twitter.com/embed/timeline.4d0955f67d15e8ef0601086ae2d5fcd0.default.css
Two files the embedded timeline widget uses.
All I'm trying to do is customize the css of the widget, and since twitter only gives you a few design options like link color and a dark/light theme, I thought it would be easier to download the files and modify them myself.
Only problem is, I'm having some difficulty trying to point the css file location inside the widgets.js to the copy on my webapp
A line inside widget.js, locating the css file on twitters servers, its tied up with some variables that combine a prefixed platform.twitter.com/ value or something
provide("tfw/assets",...{"default":"embed/timeline.4d0955f67d15e8ef0601086ae2d5fcd0.default.css",
I don't how much editing has to be done to widget.js but my guess its only a couple lines?
If anybody proficient in javascript wouldn't mind taking a look and telling me "Not worth the effort", or "It's simple, just change __ to __", let me know.
widgets.js is the first hyperlink above
(See my edit below for a better solution) This seemed to work for me and doesn't take much time to implement:
In widgets.js, find
function Z(a,b,c)
Change this in function Z:
d.href=twttr.widgets.config.assetUrl()+"/"+b
to something like this:
d.href=b
The assetUrl just gets the base URL of the file (eg. a CSS file), which is at a domain Twitter owns. b will be the paths you specify throughout the JS (such as embed/timeline.4d0955f67d15e8ef0601086ae2d5fcd0.default.css ). Upload all the CSS (like timeline.xyz.default.css) to where you want it, then you can customize those files and keep them on your own server. You can't modify the CSS by simply adding rules to a CSS file on your server, since the Twitter feed is in an iframe from a different domain. Modifying CSS in iframes with this type of source (ie. not from your own domain) is not allowed, to prevent hijacking-type problems, but if the iframe refers to a CSS on your own server then you can modify things.
There may be some other things you might want to check out to make sure you have all the required files. You should also get sprite.png which is referred to in the Twitter CSS file. I was able to customize the CSS this way and it worked fine.
Edit:
I had problems with the above solution in IE7/6 and Chrome in Jelly Bean so found a better solution that lets you inject your own custom CSS file into the iframe while sticking with all of Twitter's CSS at their own domain. From a fresh widgets.js I went and added the following:
;d=c.createElement("link"),
d.id="custom-css-1",
d.rel="stylesheet",
d.type="text/css",
d.href="http://mydomain.com/css/timeline.custom.css";
c.getElementsByTagName("head")[0].appendChild(d);
immediately after
c.getElementsByTagName("head")[0].appendChild(d)
on the line in widgets.js starting with
provide("tfw/widget/timeline"
(again in function Z) This seems to work much better, and all you need is a copy of widgets.js at http://platform.twitter.com/widgets.js.
It looks like if I download wigdet.js and custom.css then widget does not pick up
data-chrome="transparent"
I downloaded
http://platform.twitter.com/embed/timeline.4d0955f67d15e8ef0601086ae2d5fcd0.default.css
renamed it timeline.custom.css
Changed in wigdet.js link to my css
function b(e,t,n){
var r;
n=n||document;
if(n.getElementById(e))return;
r=n.createElement("link"),
r.id=e,r.rel="stylesheet",
r.type="text/css",
r.href= "../css/timeline.custom.css",
n.getElementsByTagName("head")[0].appendChild(r)
}
Is link to css correct? Or twitter uses the newest version of css?
http://platform.twitter.com/embed/timeline.4d0955f67d15e8ef0601086ae2d5fcd0.default.css
How to make widget to pickup the data-chrome="transparent"
I used widget script
<a class="twitter-timeline"
data-dnt="true"
href="https://twitter.com/search?q=%23My_hush"
data-tweet-limit="1"
data-theme="dark"
data-screen-name="some_name"
data-chrome="noscrollbar noheader transparent noborders nofooter"
data-widget-id="My_id">
Tweets about "#My_hush"</a>

jQuery 1.7.1 slider not working except on homepage

I have tried to place the slider on every page on this website: http://atripathi.com
It works on the homepage, but doesn't work on any of the other pages (About, Services, etc.)
I know it's probably an easy fix, but I can't get it at the moment.
Thank you for any help or suggestions!
Looks like the original suggestion above is correct. I'm seeing slider javascript includes at the top of your homepage that aren't on the other pages.
Generally, a good way of troubleshooting is to make copies of both pages, index-c.php and about-c.php perhaps, and start removing everything that isn't pertinent to the trouble you're having (other HTML, css includes, etc.) until you get down to only the slider on the page. Once you've done that, you might notice that the one page is slightly different than the other, making it work. You can copy back and forth until it does.
The other possibility is that there's a relative path problem somewhere, because your one page is inside a folder (though I'm guessing you have a .htaccess redirect to a root folder page)? So if all else fails, move the reduced about-c.php to the root folder and see if that then works. If so, you know it's a path problem.
Hope these suggestions help.
I see that jQuery is being included on all your pages but the cycle plugin is only included on the home page. You should be able to update your template(s) to fix this.

Categories

Resources