Need to find this script - javascript

I'm trying to do new stuff for my websites (based on PHP - Linux server) and I wanted to do something like this website
http://equ.com.au/
I love the fact that each content load and it changes the URL directory.
What's the script used? I tried to google a lot of words combination but the only thing that came out were images slider, or page loaders (all those stuff that I can't find when I need them).
Hope to get an answer soon.
C YA

as mentioned reference site ( http://equ.com.au ), this is single-page application. you need to try google for building single-page app.
But you want to change URL you need to write custom code in 'JavaScript'. Like this .
location.hash = "contact-us";
You should reefer http://www.w3schools.com/jsref/prop_loc_hash.asp
and use any 'Jquery' plugin for make slider.
Let me know if any query, Enjoy :)

You can use javascript history plugin to achieve this because it very difficult to manage data with browser hashes. You can use this https://github.com/browserstate/history.js

Related

Adding pure javascript code to Shopify Theme by using Shopify API

I developed a Shopify application that i install on Shopify Store and i want my application to add a javascript snippet in all the store pages. For this I want my application to modify the current theme, by using Shopify API, and add the javascript snippet to that theme.
I know of several ways to do it but they have several disadvantage:
Add a Shopify Asset/Snippet - The store owner has to manually modify the store's theme to link to the asset/snippet.
Add a script tag - I want my javascript to be embedded and not to be downloaded from a different source. A different source means longer page loads and i do not want my site to extend the page load.
Add an application proxy - This can also extend the loading time.
Can you suggest on what is the correct way to do it?
Add a script tag and be done with it. No other pattern offers up the same customer experience. When they install your App, your script is available. When they uninstall your App, their theme reverts nicely. Worrying about the load times of your asset is not worth it if you have done your job, and minimized your code and provided a fast CDN address for it.
In 2022, you get Theme App Extensions for OS 2.0. Do that!! Best way to add JS to a theme/store.
Are you using the embedded apps SDK? I'm pretty sure they have some option that makes this easier, like you can create a "sidebar" on every page and position it wherever you want (hidden if necessary).
Answering you question: the good way is using ScriptTag. Consider this article on this: https://docs.shopify.com/api/unlinked/using-javascript-responsibly
Still if you need to add code snippet as an asset, I want to point out that it's not necessary the customer must manually update the theme. As far as I know, you can add your snippet as an asset and then update another -- theme liquid template.
https://docs.shopify.com/api/asset#update
For the reasons described in an article I've provided above, you should not do that.

JavaScript file manager with column view

I would like to share documents on my homepage in column-view, so it feels like browsing in Marlin or Finder. How would I start out to do this with JavaScript? Possibly any JS libraries?
I do not have access to any serverside coding, though the server supports PHP5.
You can use UI library. Alternatives with similar UI controls are Sencha, jQWidgets, KendoUI, Wijmo.
For example you can use the jqxMenu by jQWidgets.
The file browsing can be done using the File API but probably you'll need already defined list of files (the use of the File API will be for extra file information).
the guys at sencha make a cracking library which could mimick the Finder style/look, have a look at some of their examples at http://docs.sencha.com/ext-js/4-1/#!/example but would require some serverside coding to return the file data you wish to display...

Modular approach to client-side applications

This is a follow-up to my previous question.
Suppose there is a single web page with a login form and sign-up link. When a user clicks on the link a new sign-up form is displayed. Suppose also I create separate HTML, CSS, and JavaScript files for both forms for modularity.
Now the web page should contain some JavaScript code to load the login form, when the page is loaded, and load the sign-up form upon click on the link.
Does this approach make sense? Are there any frameworks/libraries, which implement this approach? How would you suggest implement it?
I think the idea has some issues. First you should know that there are some old fashion ways to load another completely separated page in the main document. Using "iframe" tag is one of the most popular and unsecure ways to do such a thing. Showing popups and use "window.open" is another way that can show a new window and load the specific url completely separated. BUT...
There are many reasons that I'm now gonna suggest you not to do that in any of mentioned ways. You can simply use some libraries like "JQuery" to load another html in the current page without any need to load new resources that cause performance issues for you. I believe you should search for "JQuery $.get" and you will see how easy it would be.
Hope it helps.
Cheers
Yes that makes sense to me. I really like this approach as I think breaking an app into smaller chunks will make the development & maintenance much easier.
Basicly you need to load the css and js files by appending a link and script tag respecticly into the head section of the html. For loading the html part of the module you can simply use jQuery.get() method as suggested by other answer.
I have tried to implement it. I recently released my work on this. a small code base. actually in my approach each module has its own folder with its js, html and css files and optionally a server-side file too like a php or aspx file that will be called by javascript to query the server.
here is the project page in github called Yuva
take a look and let me know if this makes sense to you.

Add your javascript to any page (using proxy or something else)

What I want to do is be able to see how it will look any website with my javascript attached . I want to create something like selectorgadget working on any website.
The first idea is to use a proxy (eg privoxy) and define a regular expression changing in html: </head> to <script src="http://myserver.com/my_javascript.js"></script></head>. It works, but in such case, I need to set proxy in my browser. And it is not cool because It visible only for me.
Another idea is to write a website that will download page under the hood and show it. How it will work:
Go to page eg.: http://myserver.com/
My index.php will download eg.: www.google.com using http client or curl, replace page source (add my <script> before </head>) and return page to user. It works, but when page contains relative images I'm not able to see it. Rewriting image src, and other script src is not so simple.
Because I want to add only javascript, I thought that you can use iframes. But there is a restriction to the same domain.
Any ideas on how to do it? Maybe some tool? Something with cross-domain iframe?
You can configure Apache web server to work in reverse proxy mode and use your first approach. Hence it will work very similar to your second case, but all replacement Apache server will do for you.
I'll throw Greasemonkey into the list of suggestions. Also note that FireBug allows you to run arbitrary JavaScript on a page, plus a lot more useful stuff for developing & debugging web apps.
(Although from your short description, I agree with awoodland that bookmarklets are probably the best solution.)
Bookmarklets let you do exactly this without any kludges.
if you are using Chrome, you can develop a simple extension and use the content scripts.
You can use the following project which is a node based proxy that can allow you to include any arbitrary JS or CSS in all pages
https://github.com/amitamb/plugin-proxy
I am the developer of the project.

How to force every page to load a certain javascript file?

I've created a pretty basic system here at work that does what Google analytics does (extremely simplistic in comparison) and it works quite well, but like Google Analytics it requires each page to reference a JavaScript file. Is there any way to make all of our pages that are served from IIS reference this Javascript file? I would like to capture these stats for every page.
Any ideas?
Thanks
Hmm, it looks like you are looking for this.
If you're dealing with static HTML files your best bet seems to be this previous question.
If you have an ASP site going, and you already have a header or layout file, I'd recommend putting it in there.
This depends on how you build your web site, but most people do this by adding the reference to their templates, layouts, master pages, or whatever term is used in your development platform.
You don't want every page tracked, e.g., pages returning data such as JSON or XML should not be meddled with. This is why it is better to have explicit control over which pages get the analytics javascript added to them.

Categories