I'm working on a site where we need "dynamic" breadcrumb generation.
Pages within this application are not specific children of the other, so when the user is browsing one of them, I can't simply retrace steps back up.
I could have the following breadcrumbs-like lists: (updated)
* inbox > message > user profile
* search results > user profile
* search results > user profile > new message
( FYI; there will be a few dedicated parent pages that will reset the whole stack. Also there will be a check that prevents recursion. )
So... To accomplish this, I have to remember where the user has been, and in what order. I reckon the most elegant and reliable way to do is, is write a mechanism that remembers the user's history in the session.
If I do that though, the whole thing will break when a user opens a new browser window or tab.
To fix that, I could store this data in the querystring. Though different browsers/proxies have different limits of data that can be transferred that way. So, one day, this will probably break as well.
Does anyone have an idea on how to implement this?
Or;
Does anyone know how to reliably identify different browsers windows?
(I'd rather not rely on javascript for this, unless it's my only workable option. I use dojo toolkit for the frontend)
thanks in advance!
On HTML5 compatible browsers I would save these on the local storage.
You can detect a new tab open like this:
on page load set a cookie by javascript
use the onbeforeunload event to clear the cookie
When the visitor will open your site, it will set a cookie eg session=1, if they click on a new link on your site, when they leave the site the cookie will be eg session=0 but as soon as they arrive again on your site it will be session=1.
When the visitor will open a new tab, it will encounter a session=1 so probably will do that session=2. You got the point?
window.name survives a new document load. So you can write a history string to window.name and then read it back from the next page, or use a generated name as a key for storing window-specific cookies/sessions.
I don't think this is a good idea though. “Breadcrumbs” are traditionally a hierarchical navigation device, not a history list. The browser already provides a perfectly good history list on the back/forward buttons that it is not useful to reproduce on the page; presenting an on-page history list, especially in a format that is normally a hierarchical place marker, is more likely to confuse users than to be of any help.
I asked a similar question a few months ago. The top answer - which I will am planning to go with - suggested building a path, and parsing that using a combination of mod_rewrite and PHP:
www.mysite.com/inbox/message/user_profile/12345/new_message
Up to a certain point (the request URL should never grow larger than 1024 bytes), that can be quite a good solution. An additional advantage is that the breadcrumb path can even survive sessions, and works in links forwarded to others (if that is desirable in your scenario).
Another thing, looking at your examples, I can't really see the need to reset the history when the user opens a new page, or to take different browser windows into consideration at all. There is a logical hierarchy (not a history) and why should the system start changing then hierarchy just because I choose to open the new message editor in a new tab?
Related
I'm trying to make a page divided in 2 frames. One that shows an external page... a shop for example,and other(mine) that offers related content to what is being shown in the external page.
I've been searching how to know the URL of the frame, but it can't be done due to security reasons(XSS, clickjacking, etc).
But I know it has to be one way to know it. I recently read that some plugins like the facebook's, have the ability to know where the client is while he is navigating.
I hope that my intention is clear. Do you know if this is possible?
Without having the site's owner install some JS on their site, you will find it very hard to find a cross-browser way to do this. FB do have people include a script and this is how they are able to access information cross domain.
You may be able to create plugins to do this, however you will have to create one per browser.
I am trying to create a web page with a tab menu. I want to be able to dynamically add and delete tabs (and other content). There is a perfect example of what I want here: http://www.dhtmlgoodies.com/index.html?whichScript=tab-view . I want the newly created tabs to be persistent through page loads. So basically if I add a tab and refresh I want the tab to still be there. If I close the browser and reload the page a month later I would like the tab and any content to still be there. This page is for personal use and will be hosted on my computer and accessed through the browser alone, not any kind of web server. Although I'm not against using a web server if I need to.
Looking at the code it seems that the 'add tab' functions just add HTML to the page in memory but I need it to permanently change the HTML of the page. Is there a way to write dynamic changes to the DOM back to disk? I'm not quite sure where to go with this and searching for a week has left me with too many language and implementation options to look into. I am not an experienced web developer and there is so many different ways to create web pages and so many new terms that I'm a little overloaded now.
I do realize that this is a little outside the realm of a typical web-site. It is generally not a good idea to let the client-side make changes to data on the server-side. But since I am the only person who will be using this and it will not be accessible from the internet security is not an issue.
I'm not apposed to any particular scripting language, but I would like to keep it as simple as possible. I.e.: one HTML page, one CSS, and maybe a script file. Whatever is necessary. I am not apposed to reading and learning on my own either so being pointed down the right path is fine for me.
If you need a rock solid method, then you would need some record of having those tabs existing. That means having a database that knows that the tab exists, which tab it was, and what content it contained. Html5's local browser storage (not to be confused with cookies though) could also be a viable solution but browser compatibility is an issue (for now).
You also need some sort of "user accounts system" so you know who among your users had this set of tabs open. Otherwise, if you had a single "tabs list" for everyone, everyone would open the same tabs!
For dynamic html and js for the "tab adding", you are on the right spot. You need PHP to interact with the database that is MySQL. What PHP does it it recieves data in the server from the browser about what happened like:
know which user is logged in
what action did he choose (add or remove tab)
add to the database or delete a record
reply with a success or error, whichever happened
For MySQL, you need to create a database with a table for your "tab list". This list must have:
User id (to know which user did what among the ones in the list)
Tab id (know which tab is which among the ones in the list)
Tab content (it may be a link for an iframe, actual html, text etc.)
Friend, when you talk of closing the browser and not losing the data, then you are talking about data persistence or data durability. In other words, you have to save your data somewhere, and load it next time.
For storage you can use a flat file (a simple text file), a database, an XML file, etc. However, you need to learn a lot to save the information and content of the new tab somewhere, and next time load it.
I am trying to develop a web application for which I need to capture a specific user-driven event (such as mouse dblclick) occurring on a different-website page loaded through my website.
What I want to do is :
User visits my website - hosted by me.
There, user types in any website URL (e.g.: http://www.example.com)
That URL page gets loaded as is.
When user double-clicks mouse over any link or image from that page, a popup/side-panel is displayed with content related to that particular image or link.
I can do this with a combination of PHP get_page_contents or include-page, and javascript dblclick.
However, when user clicks on any link or submits a form, the control goes to that other website, where I cannot show the side-panel.
I might be able to handle the links by proxifying them when user clicks on any of them. How do I handle forms submission and other stuff ?
I can use a full-featured proxy, but that will be too heavy just for the purpose of capturing the event.
My question is that is there a way to write some kind of light PHP script that sits on my website - that loads other websites contents as is, but lets me capture the mouse-dblclick event to show related-content in the side panel .
I have already searched the internet, but could not find anything.
Any help is really appreciated. Thanks.
This sounds way too complicated to ever get reliably working IMO. Proxifying complex requests on 3rd-party pages? Maybe even with some additional AJAX that you'd have to proxify too? I may be wrong, but I think you'll go crazy and get swamped with complaints about sites not working.
I don't know what your web application is supposed to do but I would strongly consider building a Firefox extension (that has much more rights to access and do things on 3rd party sites) or similar.
I have a large, PHP-based CMS that manages web pages.
All items are organized in a tree structure.
When I edit an item, the "back" button usually points to its parent item.
So, the usual workflow is navigating through the tree.
Now every now and then, the need arises for a workflow that "jumps" to other items without regard for the structure.
For example, when a user is editing a web page, they may want to open the template the page is attached to (another item in a completely different branch), make a change there, and when clicking "save" expect to come back to the page they were editing.
At the moment, I solve this using
domain.com/admin/template/edit?from=/frontpage/edit
where the "from" variable determines the target URLs of the "save" and "cancel" buttons.
This works up to a certain point when the path becomes too long and complex. For example, what if the user
edits a page
opens the attached template
previews that template in the front-end view
and then expects to be seamlessly taken back to the page they were editing?
Right now, the "history" ends at the last item so that when the user returns from the front-end view, the link to the original page is lost, and they have to search it by hand.
Another problem that can happen quickly is that the GET URL containing all the "from" values becomes too long, or totally chaotic:
domain.com/admin/template/edit?from=/frontpage/edit&from=/somepage/edit
&from=/template/preview&/from=template/edit&/from=template_preview ...
(you get the drift)
I have solved this elegantly by opening separate windows in the past, but I really want to implement a seamless one-window workflow that works universally, mainly because multiple windows tend to confuse users.
How do you solve this?
Have you implemented a robust "unstructured" navigation that works well with multiple windows open (=one user doing multiple different things with different navigation paths)?
How do you go about this on the user interface side?
The best approach I can think of is passing on a "from" value that points to a temporary record in a database or session. That record contains all the information about the current path, and can thus always provide the right "back to page x" value.
What I would like to hear most is experiences from people who have successfully implemented this, and how they did it.
Just a couple suggestions
Preview Problem: preview in an IFRAME, so the history doean't get lost?
Cluttered URL problem: If you have some sort of key for each page, other than the URL path
(i.e. /frontpage/edit = 952,
/frontpage/edit&from=/somepage/edit = 763,
/template/preview = 651,
template/edit = 612,
template_preview = 866 etc.)
you could string them together in the PATH_INFO like so:
domain.com/admin/template/edit/952/763/651/612/866
You could build a stack of visited pages for the session as the user clicks around, pushing on a new page each time the open it, popping off when they click back. Store it as a session variable.
The trick then is to always check their referrer string, since they may also use their browser's back and forward buttons. If their referrer string isn't at the top of their stack, you'll have to scan the stack for it to see if they manually backed up to a previous page.
As long as you're only needing to backstep once, why not pass in whatever linkback page IDs you want whenever you produce the page you're jumping to?
I own an image hosting site and would like to generate one popup per visitor per day. The easiest way for me to do this was to write a php script that called subdomains, like ads1.sitename.com
ads2.sitename.com
unfortunatly most of my advertisers want to give me a block of javascript code to use rather than a direct link, so I can't just make the individual subdomains header redirects.I'd rather use the subdomains that way I can manage multiple advertisers without changing any code on page, just code in my php admin page. Any ideas on how I can stick this jscript into the page so I don't need to worry about a blank ads1.sitename.com as well as the popup coming up?
I doubt you'll find much sympathy for help with pop-up ads.
How about appending a simple window.close() after the advertising code? That way their popup is displayed and your window closes neatly.
I'm not sure that I've ever had a browser complain that the window is being closed. This method has always worked for me. (IE, Firefox, etc.)
At the risk of helping someone who wants to deploy popup ads (which is bound to fail due to most popup blockers anyway), why can't you just have the subdomains load pages that load the block of Javascript the advertisers give you?
Hey, cut the guy some slack. Popups might not be very nice, but at least he's trying to reduce the amount of them. And popup blockers are going to fix most of it anyway. In any case, someone else might find this question with more altruistic goals (not sure how they'd fit that with popups, but hey-ho).
I don't quite follow your question, but here's some ideas:
Look into Server Side Includes (SSI) to easily add a block of javascript to each page (though you could also do it with a PHP include instead)
Do your advertiser choosing in your PHP script rather than calling the subdomains
Decipher the javascript to work out what it's doing and put a modified version in the subdomain page so it doesn't need an additional popup. Shouldn't be too hard.