Search Results

Search found 987 results on 40 pages for 'abdullah al khalidi'.

Page 40/40 | < Previous Page | 36 37 38 39 40 

  • Set up linux box for secure local hosting a-z

    - by microchasm
    I am in the process of reinstalling the OS on a machine that will be used to host a couple of apps for our business. The apps will be local only; access from external clients will be via vpn only. The prior setup used a hosting control panel (Plesk) for most of the admin, and I was looking at using another similar piece of software for the reinstall - but I figured I should finally learn how it all works. I can do most of the things the software would do for me, but am unclear on the symbiosis of it all. This is all an attempt to further distance myself from the land of Configuration Programmer/Programmer, if at all possible. I can't find a full walkthrough anywhere for what I'm looking for, so I thought I'd put up this question, and if people can help me on the way I will edit this with the answers, and document my progress/pitfalls. Hopefully someday this will help someone down the line. The details: CentOS 5.5 x86_64 httpd: Apache/2.2.3 mysql: 5.0.77 (to be upgraded) php: 5.1 (to be upgraded) The requirements: SECURITY!! Secure file transfer Secure client access (SSL Certs and CA) Secure data storage Virtualhosts/multiple subdomains Local email would be nice, but not critical The Steps: Download latest CentOS DVD-iso (torrent worked great for me). Install CentOS: While going through the install, I checked the Server Components option thinking I was going to be using another Plesk-like admin. In hindsight, considering I've decided to try to go my own way, this probably wasn't the best idea. Basic config: Setup users, networking/ip address etc. Yum update/upgrade. Upgrade PHP/MySQL: To upgrade PHP and MySQL to the latest versions, I had to look to another repo outside CentOS. IUS looks great and I'm happy I found it! Add IUS repository to our package manager cd /tmp wget http://dl.iuscommunity.org/pub/ius/stable/Redhat/5/x86_64/epel-release-1-1.ius.el5.noarch.rpm rpm -Uvh epel-release-1-1.ius.el5.noarch.rpm wget http://dl.iuscommunity.org/pub/ius/stable/Redhat/5/x86_64/ius-release-1-4.ius.el5.noarch.rpm rpm -Uvh ius-release-1-4.ius.el5.noarch.rpm yum list | grep -w \.ius\. # list all the packages in the IUS repository; use this to find PHP/MySQL version and libraries you want to install Remove old version of PHP and install newer version from IUS rpm -qa | grep php # to list all of the installed php packages we want to remove yum shell # open an interactive yum shell remove php-common php-mysql php-cli #remove installed PHP components install php53 php53-mysql php53-cli php53-common #add packages you want transaction solve #important!! checks for dependencies transaction run #important!! does the actual installation of packages. [control+d] #exit yum shell php -v PHP 5.3.2 (cli) (built: Apr 6 2010 18:13:45) Upgrade MySQL from IUS repository /etc/init.d/mysqld stop rpm -qa | grep mysql # to see installed mysql packages yum shell remove mysql mysql-server #remove installed MySQL components install mysql51 mysql51-server mysql51-devel transaction solve #important!! checks for dependencies transaction run #important!! does the actual installation of packages. [control+d] #exit yum shell service mysqld start mysql -v Server version: 5.1.42-ius Distributed by The IUS Community Project Upgrade instructions courtesy of IUS wiki: http://wiki.iuscommunity.org/Doc/ClientUsageGuide Install rssh (restricted shell) to provide scp and sftp access, without allowing ssh login cd /tmp wget http://dag.wieers.com/rpm/packages/rssh/rssh-2.3.2-1.2.el5.rf.x86_64.rpm rpm -ivh rssh-2.3.2-1.2.el5.rf.x86_64.rpm useradd -m -d /home/dev -s /usr/bin/rssh dev passwd dev Edit /etc/rssh.conf to grant access to SFTP to rssh users. vi /etc/rssh.conf Uncomment or add: allowscp allowsftp This allows me to connect to the machine via SFTP protocol in Transmit (my FTP program of choice; I'm sure it's similar with other FTP apps). rssh instructions appropriated (with appreciation!) from http://www.cyberciti.biz/tips/linux-unix-restrict-shell-access-with-rssh.html Set up virtual interfaces ifconfig eth1:1 192.168.1.3 up #start up the virtual interface cd /etc/sysconfig/network-scripts/ cp ifcfg-eth1 ifcfg-eth1:1 #copy default script and match name to our virtual interface vi ifcfg-eth1:1 #modify eth1:1 script #ifcfg-eth1:1 | modify so it looks like this: DEVICE=eth1:1 IPADDR=192.168.1.3 NETMASK=255.255.255.0 NETWORK=192.168.1.0 ONBOOT=yes NAME=eth1:1 Add more Virtual interfaces as needed by repeating. Because of the ONBOOT=yes line in the ifcfg-eth1:1 file, this interface will be brought up when the system boots, or the network starts/restarts. service network restart Shutting down interface eth0: [ OK ] Shutting down interface eth1: [ OK ] Shutting down loopback interface: [ OK ] Bringing up loopback interface: [ OK ] Bringing up interface eth0: [ OK ] Bringing up interface eth1: [ OK ] ping 192.168.1.3 64 bytes from 192.168.1.3: icmp_seq=1 ttl=64 time=0.105 ms Virtualhosts In the rssh section above I added a user to use for SFTP. In this users' home directory, I created a folder called 'https'. This is where the documents for this site will live, so I need to add a virtualhost that will point to it. I will use the above virtual interface for this site (herein called dev.site.local). vi /etc/http/conf/httpd.conf Add the following to the end of httpd.conf: <VirtualHost 192.168.1.3:80> ServerAdmin [email protected] DocumentRoot /home/dev/https ServerName dev.site.local ErrorLog /home/dev/logs/error_log TransferLog /home/dev/logs/access_log </VirtualHost> I put a dummy index.html file in the https directory just to check everything out. I tried browsing to it, and was met with permission denied errors. The logs only gave an obscure reference to what was going on: [Mon May 17 14:57:11 2010] [error] [client 192.168.1.100] (13)Permission denied: access to /index.html denied I tried chmod 777 et. al., but to no avail. Turns out, I needed to chmod+x the https directory and its' parent directories. chmod +x /home chmod +x /home/dev chmod +x /home/dev/https This solved that problem. DNS I'm handling DNS via our local Windows Server 2003 box. However, the CentOS documentation for BIND can be found here: http://www.centos.org/docs/5/html/Deployment_Guide-en-US/ch-bind.html SSL To get SSL working, I changed the following in httpd.conf: NameVirtualHost 192.168.1.3:443 #make sure this line is in httpd.conf <VirtualHost 192.168.1.3:443> #change port to 443 ServerAdmin [email protected] DocumentRoot /home/dev/https ServerName dev.site.local ErrorLog /home/dev/logs/error_log TransferLog /home/dev/logs/access_log </VirtualHost> Unfortunately, I keep getting (Error code: ssl_error_rx_record_too_long) errors when trying to access a page with SSL. As JamesHannah gracefully pointed out below, I had not set up the locations of the certs in httpd.conf, and thusly was getting the page thrown at the broswer as the cert making the browser balk. So first, I needed to set up a CA and make certificate files. I found a great (if old) walkthrough on the process here: http://www.debian-administration.org/articles/284. Here are the relevant steps I took from that article: mkdir /home/CA cd /home/CA/ mkdir newcerts private echo '01' > serial touch index.txt #this and the above command are for the database that will keep track of certs Create an openssl.cnf file in the /home/CA/ dir and edit it per the walkthrough linked above. (For reference, my finished openssl.cnf file looked like this: http://pastebin.com/raw.php?i=hnZDij4T) openssl req -new -x509 -extensions v3_ca -keyout private/cakey.pem -out cacert.pem -days 3650 -config ./openssl.cnf #this creates the cacert.pem which gets distributed and imported to the browser(s) Modified openssl.cnf again per walkthrough instructions. openssl req -new -nodes -out dev.req.pem -config ./openssl.cnf #generates certificate request, and key.pem which I renamed dev.key.pem. Modified openssl.cnf again per walkthrough instructions. openssl ca -out dev.cert.pem -config ./openssl.cnf -infiles dev.req.pem #create and sign certificate. cp dev.cert.pem /home/dev/certs/cert.pem cp dev.key.pem /home/certs/key.pem I updated httpd.conf to reflect the certs and turn SSLEngine on: NameVirtualHost 192.168.1.3:443 <VirtualHost 192.168.1.3:443> ServerAdmin [email protected] DocumentRoot /home/dev/https SSLEngine on SSLCertificateFile /home/dev/certs/cert.pem SSLCertificateKeyFile /home/dev/certs/key.pem ServerName dev.site.local ErrorLog /home/dev/logs/error_log TransferLog /home/dev/logs/access_log </VirtualHost> Put the CA cert.pem in a web-accessible place, and downloaded/imported it into my browser. Now I can visit https://dev.site.local with no errors or warnings. And this is where I'm at. I will keep editing this as I make progress. Any tips on how to configure SSL email would be appreciated.

    Read the article

  • wsdl interoperability problems

    - by manu1001
    I wrote a .asmx web service which I'm trying to consume from a java client. I'm using axis2's wsdl2java to generate code. But it says that the wsdl is invalid. What exactly is the problem here? It is .net which generated the wsdl automatically after all. Are there problems with wsdl standards, rather the lack of them? What can I do now? I'm putting the wsdl here for reference. <?xml version="1.0" encoding="utf-8"?> <wsdl:definitions xmlns:soap="http://schemas.xmlsoap.org/wsdl/soap/" xmlns:tm="http://microsoft.com/wsdl/mime/textMatching/" xmlns:soapenc="http://schemas.xmlsoap.org/soap/encoding/" xmlns:mime="http://schemas.xmlsoap.org/wsdl/mime/" xmlns:tns="http://localhost:4148/" xmlns:s="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://schemas.xmlsoap.org/wsdl/soap12/" xmlns:http="http://schemas.xmlsoap.org/wsdl/http/" targetNamespace="http://localhost:4148/" xmlns:wsdl="http://schemas.xmlsoap.org/wsdl/"> <wsdl:types> <s:schema elementFormDefault="qualified" targetNamespace="http://localhost:4148/"> <s:element name="GetUser"> <s:complexType> <s:sequence> <s:element minOccurs="0" maxOccurs="1" name="uid" type="s:string" /> </s:sequence> </s:complexType> </s:element> <s:element name="GetUserResponse"> <s:complexType> <s:sequence> <s:element minOccurs="0" maxOccurs="1" name="GetUserResult" type="tns:User" /> </s:sequence> </s:complexType> </s:element> <s:complexType name="User"> <s:sequence> <s:element minOccurs="0" maxOccurs="1" name="HA" type="tns:ComplexT" /> <s:element minOccurs="0" maxOccurs="1" name="AP" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="AL" type="tns:ArrayOfString" /> <s:element minOccurs="0" maxOccurs="1" name="CO" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="EP" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="ND" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="AE" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="IE" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="IN" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="HM" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="AN" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="MI" type="tns:ArrayOfString" /> <s:element minOccurs="0" maxOccurs="1" name="NO" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="TL" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="UI" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="DT" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="PT" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="PO" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="AE" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="ME" type="tns:ArrayOfString" /> </s:sequence> </s:complexType> <s:complexType name="ComplexT"> <s:sequence> <s:element minOccurs="0" maxOccurs="1" name="SR" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="CI" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="TA" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="SC" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="RU" type="s:string" /> <s:element minOccurs="0" maxOccurs="1" name="HN" type="s:string" /> </s:sequence> </s:complexType> <s:complexType name="ArrayOfString"> <s:sequence> <s:element minOccurs="0" maxOccurs="unbounded" name="string" nillable="true" type="s:string" /> </s:sequence> </s:complexType> </s:schema> </wsdl:types> <wsdl:message name="GetUserSoapIn"> <wsdl:part name="parameters" element="tns:GetUser" /> </wsdl:message> <wsdl:message name="GetUserSoapOut"> <wsdl:part name="parameters" element="tns:GetUserResponse" /> </wsdl:message> <wsdl:portType name="UserServiceSoap"> <wsdl:operation name="GetUser"> <wsdl:input message="tns:GetUserSoapIn" /> <wsdl:output message="tns:GetUserSoapOut" /> </wsdl:operation> </wsdl:portType> <wsdl:binding name="UserServiceSoap" type="tns:UserServiceSoap"> <soap:binding transport="http://schemas.xmlsoap.org/soap/http" /> <wsdl:operation name="GetUser"> <soap:operation soapAction="http://localhost:4148/GetUser" style="document" /> <wsdl:input> <soap:body use="literal" /> </wsdl:input> <wsdl:output> <soap:body use="literal" /> </wsdl:output> </wsdl:operation> </wsdl:binding> <wsdl:binding name="UserServiceSoap12" type="tns:UserServiceSoap"> <soap12:binding transport="http://schemas.xmlsoap.org/soap/http" /> <wsdl:operation name="GetUser"> <soap12:operation soapAction="http://localhost:4148/GetUser" style="document" /> <wsdl:input> <soap12:body use="literal" /> </wsdl:input> <wsdl:output> <soap12:body use="literal" /> </wsdl:output> </wsdl:operation> </wsdl:binding> <wsdl:service name="UserService"> <wsdl:port name="UserServiceSoap" binding="tns:UserServiceSoap"> <soap:address location="http://localhost:4148/Service/UserService.asmx" /> </wsdl:port> <wsdl:port name="UserServiceSoap12" binding="tns:UserServiceSoap12"> <soap12:address location="http://localhost:4148/Service/UserService.asmx" /> </wsdl:port> </wsdl:service> </wsdl:definitions>

    Read the article

  • SINGLE SIGN ON SECURITY THREAT! FACEBOOK access_token broadcast in the open/clear

    - by MOKANA
    Subsequent to my posting there was a remark made that this was not really a question but I thought I did indeed postulate one. So that there is no ambiquity here is the question with a lead in: Since there is no data sent from Facebook during the Canvas Load process that is not at some point divulged, including the access_token, session and other data that could uniquely identify a user, does any one see any other way other than adding one more layer, i.e., a password, sent over the wire via HTTPS along with the access_toekn, that will insure unique untampered with security by the user? Using Wireshark I captured the local broadcast while loading my Canvas Application page. I was hugely surprised to see the access_token broadcast in the open, viewable for any one to see. This access_token is appended to any https call to the Facebook OpenGraph API. Using facebook as a single click log on has now raised huge concerns for me. It is stored in a session object in memory and the cookie is cleared upon app termination and after reviewing the FB.Init calls I saw a lot of HTTPS calls so I assumed the access_token was always encrypted. But last night I saw in the status bar a call from what was simply an http call that included the App ID so I felt I should sniff the Application Canvas load sequence. Today I did sniff the broadcast and in the attached image you can see that there are http calls with the access_token being broadcast in the open and clear for anyone to gain access to. Am I missing something, is what I am seeing and my interpretation really correct. If any one can sniff and get the access_token they can theorically make calls to the Graph API via https, even though the call back would still need to be the site established in Facebook's application set up. But what is truly a security threat is anyone using the access_token for access to their own site. I do not see the value of a single sign on via Facebook if the only thing that was established as secure was the access_token - becuase for what I can see it clearly is not secure. Access tokens that never have an expire date do not change. Access_tokens are different for every user, to access to another site could be held tight to just a single user, but compromising even a single user's data is unacceptable. http://www.creatingstory.com/images/InTheOpen.png Went back and did more research on this: FINDINGS: Went back an re ran the canvas application to verify that it was not any of my code that was not broadcasting. In this call: HTTP GET /connect.php/en_US/js/CacheData HTTP/1.1 The USER ID is clearly visible in the cookie. So USER_ID's are fully visible, but they are already. Anyone can go to pretty much any ones page and hover over the image and see the USER ID. So no big threat. APP_ID are also easily obtainable - but . . . http://www.creatingstory.com/images/InTheOpen2.png The above file clearly shows the FULL ACCESS TOKEN clearly in the OPEN via a Facebook initiated call. Am I wrong. TELL ME I AM WRONG because I want to be wrong about this. I have since reset my app secret so I am showing the real sniff of the Canvas Page being loaded. Additional data 02/20/2011: @ifaour - I appreciate the time you took to compile your response. I am pretty familiar with the OAuth process and have a pretty solid understanding of the signed_request unpacking and utilization of the access_token. I perform a substantial amount of my processing on the server and my Facebook server side flows are all complete and function without any flaw that I know of. The application secret is secure and never passed to the front end application and is also changed regularly. I am being as fanatical about security as I can be, knowing there is so much I don’t know that could come back and bite me. Two huge access_token issues: The issues concern the possible utilization of the access_token from the USER AGENT (browser). During the FB.INIT() process of the Facebook JavaScript SDK, a cookie is created as well as an object in memory called a session object. This object, along with the cookie contain the access_token, session, a secret, and uid and status of the connection. The session object is structured such that is supports both the new OAuth and the legacy flows. With OAuth, the access_token and status are pretty much al that is used in the session object. The first issue is that the access_token is used to make HTTPS calls to the GRAPH API. If you had the access_token, you could do this from any browser: https://graph.facebook.com/220439?access_token=... and it will return a ton of information about the user. So any one with the access token can gain access to a Facebook account. You can also make additional calls to any info the user has granted access to the application tied to the access_token. At first I thought that a call into the GRAPH had to have a Callback to the URL established in the App Setup, but I tested it as mentioned below and it will return info back right into the browser. Adding that callback feature would be a good idea I think, tightens things up a bit. The second issue is utilization of some unique private secured data that identifies the user to the third party data base, i.e., like in my case, I would use a single sign on to populate user information into my database using this unique secured data item (i.e., access_token which contains the APP ID, the USER ID, and a hashed with secret sequence). None of this is a problem on the server side. You get a signed_request, you unpack it with secret, make HTTPS calls, get HTTPS responses back. When a user has information entered via the USER AGENT(browser) that must be stored via a POST, this unique secured data element would be sent via HTTPS such that they are validated prior to data base insertion. However, If there is NO secured piece of unique data that is supplied via the single sign on process, then there is no way to guarantee unauthorized access. The access_token is the one piece of data that is utilized by Facebook to make the HTTPS calls into the GRAPH API. it is considered unique in regards to BOTH the USER and the APPLICATION and is initially secure via the signed_request packaging. If however, it is subsequently transmitted in the clear and if I can sniff the wire and obtain the access_token, then I can pretend to be the application and gain the information they have authorized the application to see. I tried the above example from a Safari and IE browser and it returned all of my information to me in the browser. In conclusion, the access_token is part of the signed_request and that is how the application initially obtains it. After OAuth authentication and authorization, i.e., the USER has logged into Facebook and then runs your app, the access_token is stored as mentioned above and I have sniffed it such that I see it stored in a Cookie that is transmitted over the wire, resulting in there being NO UNIQUE SECURED IDENTIFIABLE piece of information that can be used to support interaction with the database, or in other words, unless there were one more piece of secure data sent along with the access_token to my database, i.e., a password, I would not be able to discern if it is a legitimate call. Luckily I utilized secure AJAX via POST and the call has to come from the same domain, but I am sure there is a way to hijack that. I am totally open to any ideas on this topic on how to uniquely identify my USERS other than adding another layer (password) via this single sign on process or if someone would just share with me that I read and analyzed my data incorrectly and that the access_token is always secure over the wire. Mahalo nui loa in advance.

    Read the article

  • Using HTML 5 SessionState to save rendered Page Content

    - by Rick Strahl
    HTML 5 SessionState and LocalStorage are very useful and super easy to use to manage client side state. For building rich client side or SPA style applications it's a vital feature to be able to cache user data as well as HTML content in order to swap pages in and out of the browser's DOM. What might not be so obvious is that you can also use the sessionState and localStorage objects even in classic server rendered HTML applications to provide caching features between pages. These APIs have been around for a long time and are supported by most relatively modern browsers and even all the way back to IE8, so you can use them safely in your Web applications. SessionState and LocalStorage are easy The APIs that make up sessionState and localStorage are very simple. Both object feature the same API interface which  is a simple, string based key value store that has getItem, setItem, removeitem, clear and  key methods. The objects are also pseudo array objects and so can be iterated like an array with  a length property and you have array indexers to set and get values with. Basic usage  for storing and retrieval looks like this (using sessionStorage, but the syntax is the same for localStorage - just switch the objects):// set var lastAccess = new Date().getTime(); if (sessionStorage) sessionStorage.setItem("myapp_time", lastAccess.toString()); // retrieve in another page or on a refresh var time = null; if (sessionStorage) time = sessionStorage.getItem("myapp_time"); if (time) time = new Date(time * 1); else time = new Date(); sessionState stores data that is browser session specific and that has a liftetime of the active browser session or window. Shut down the browser or tab and the storage goes away. localStorage uses the same API interface, but the lifetime of the data is permanently stored in the browsers storage area until deleted via code or by clearing out browser cookies (not the cache). Both sessionStorage and localStorage space is limited. The spec is ambiguous about this - supposedly sessionStorage should allow for unlimited size, but it appears that most WebKit browsers support only 2.5mb for either object. This means you have to be careful what you store especially since other applications might be running on the same domain and also use the storage mechanisms. That said 2.5mb worth of character data is quite a bit and would go a long way. The easiest way to get a feel for how sessionState and localStorage work is to look at a simple example. You can go check out the following example online in Plunker: http://plnkr.co/edit/0ICotzkoPjHaWa70GlRZ?p=preview which looks like this: Plunker is an online HTML/JavaScript editor that lets you write and run Javascript code and similar to JsFiddle, but a bit cleaner to work in IMHO (thanks to John Papa for turning me on to it). The sample has two text boxes with counts that update session/local storage every time you click the related button. The counts are 'cached' in Session and Local storage. The point of these examples is that both counters survive full page reloads, and the LocalStorage counter survives a complete browser shutdown and restart. Go ahead and try it out by clicking the Reload button after updating both counters and then shutting down the browser completely and going back to the same URL (with the same browser). What you should see is that reloads leave both counters intact at the counted values, while a browser restart will leave only the local storage counter intact. The code to deal with the SessionStorage (and LocalStorage not shown here) in the example is isolated into a couple of wrapper methods to simplify the code: function getSessionCount() { var count = 0; if (sessionStorage) { var count = sessionStorage.getItem("ss_count"); count = !count ? 0 : count * 1; } $("#txtSession").val(count); return count; } function setSessionCount(count) { if (sessionStorage) sessionStorage.setItem("ss_count", count.toString()); } These two functions essentially load and store a session counter value. The two key methods used here are: sessionStorage.getItem(key); sessionStorage.setItem(key,stringVal); Note that the value given to setItem and return by getItem has to be a string. If you pass another type you get an error. Don't let that limit you though - you can easily enough store JSON data in a variable so it's quite possible to pass complex objects and store them into a single sessionStorage value:var user = { name: "Rick", id="ricks", level=8 } sessionStorage.setItem("app_user",JSON.stringify(user)); to retrieve it:var user = sessionStorage.getItem("app_user"); if (user) user = JSON.parse(user); Simple! If you're using the Chrome Developer Tools (F12) you can also check out the session and local storage state on the Resource tab:   You can also use this tool to refresh or remove entries from storage. What we just looked at is a purely client side implementation where a couple of counters are stored. For rich client centric AJAX applications sessionStorage and localStorage provide a very nice and simple API to store application state while the application is running. But you can also use these storage mechanisms to manage server centric HTML applications when you combine server rendering with some JavaScript to perform client side data caching. You can both store some state information and data on the client (ie. store a JSON object and carry it forth between server rendered HTML requests) or you can use it for good old HTTP based caching where some rendered HTML is saved and then restored later. Let's look at the latter with a real life example. Why do I need Client-side Page Caching for Server Rendered HTML? I don't know about you, but in a lot of my existing server driven applications I have lists that display a fair amount of data. Typically these lists contain links to then drill down into more specific data either for viewing or editing. You can then click on a link and go off to a detail page that provides more concise content. So far so good. But now you're done with the detail page and need to get back to the list, so you click on a 'bread crumbs trail' or an application level 'back to list' button and… …you end up back at the top of the list - the scroll position, the current selection in some cases even filters conditions - all gone with the wind. You've left behind the state of the list and are starting from scratch in your browsing of the list from the top. Not cool! Sound familiar? This a pretty common scenario with server rendered HTML content where it's so common to display lists to drill into, only to lose state in the process of returning back to the original list. Look at just about any traditional forums application, or even StackOverFlow to see what I mean here. Scroll down a bit to look at a post or entry, drill in then use the bread crumbs or tab to go back… In some cases returning to the top of a list is not a big deal. On StackOverFlow that sort of works because content is turning around so quickly you probably want to actually look at the top posts. Not always though - if you're browsing through a list of search topics you're interested in and drill in there's no way back to that position. Essentially anytime you're actively browsing the items in the list, that's when state becomes important and if it's not handled the user experience can be really disrupting. Content Caching If you're building client centric SPA style applications this is a fairly easy to solve problem - you tend to render the list once and then update the page content to overlay the detail content, only hiding the list temporarily until it's used again later. It's relatively easy to accomplish this simply by hiding content on the page and later making it visible again. But if you use server rendered content, hanging on to all the detail like filters, selections and scroll position is not quite as easy. Or is it??? This is where sessionStorage comes in handy. What if we just save the rendered content of a previous page, and then restore it when we return to this page based on a special flag that tells us to use the cached version? Let's see how we can do this. A real World Use Case Recently my local ISP asked me to help out with updating an ancient classifieds application. They had a very busy, local classifieds app that was originally an ASP classic application. The old app was - wait for it: frames based - and even though I lobbied against it, the decision was made to keep the frames based layout to allow rapid browsing of the hundreds of posts that are made on a daily basis. The primary reason they wanted this was precisely for the ability to quickly browse content item by item. While I personally hate working with Frames, I have to admit that the UI actually works well with the frames layout as long as you're running on a large desktop screen. You can check out the frames based desktop site here: http://classifieds.gorge.net/ However when I rebuilt the app I also added a secondary view that doesn't use frames. The main reason for this of course was for mobile displays which work horribly with frames. So there's a somewhat mobile friendly interface to the interface, which ditches the frames and uses some responsive design tweaking for mobile capable operation: http://classifeds.gorge.net/mobile  (or browse the base url with your browser width under 800px)   Here's what the mobile, non-frames view looks like:   As you can see this means that the list of classifieds posts now is a list and there's a separate page for drilling down into the item. And of course… originally we ran into that usability issue I mentioned earlier where the browse, view detail, go back to the list cycle resulted in lost list state. Originally in mobile mode you scrolled through the list, found an item to look at and drilled in to display the item detail. Then you clicked back to the list and BAM - you've lost your place. Because there are so many items added on a daily basis the full list is never fully loaded, but rather there's a "Load Additional Listings"  entry at the button. Not only did we originally lose our place when coming back to the list, but any 'additionally loaded' items are no longer there because the list was now rendering  as if it was the first page hit. The additional listings, and any filters, the selection of an item all were lost. Major Suckage! Using Client SessionStorage to cache Server Rendered Content To work around this problem I decided to cache the rendered page content from the list in SessionStorage. Anytime the list renders or is updated with Load Additional Listings, the page HTML is cached and stored in Session Storage. Any back links from the detail page or the login or write entry forms then point back to the list page with a back=true query string parameter. If the server side sees this parameter it doesn't render the part of the page that is cached. Instead the client side code retrieves the data from the sessionState cache and simply inserts it into the page. It sounds pretty simple, and the overall the process is really easy, but there are a few gotchas that I'll discuss in a minute. But first let's look at the implementation. Let's start with the server side here because that'll give a quick idea of the doc structure. As I mentioned the server renders data from an ASP.NET MVC view. On the list page when returning to the list page from the display page (or a host of other pages) looks like this: https://classifieds.gorge.net/list?back=True The query string value is a flag, that indicates whether the server should render the HTML. Here's what the top level MVC Razor view for the list page looks like:@model MessageListViewModel @{ ViewBag.Title = "Classified Listing"; bool isBack = !string.IsNullOrEmpty(Request.QueryString["back"]); } <form method="post" action="@Url.Action("list")"> <div id="SizingContainer"> @if (!isBack) { @Html.Partial("List_CommandBar_Partial", Model) <div id="PostItemContainer" class="scrollbox" xstyle="-webkit-overflow-scrolling: touch;"> @Html.Partial("List_Items_Partial", Model) @if (Model.RequireLoadEntry) { <div class="postitem loadpostitems" style="padding: 15px;"> <div id="LoadProgress" class="smallprogressright"></div> <div class="control-progress"> Load additional listings... </div> </div> } </div> } </div> </form> As you can see the query string triggers a conditional block that if set is simply not rendered. The content inside of #SizingContainer basically holds  the entire page's HTML sans the headers and scripts, but including the filter options and menu at the top. In this case this makes good sense - in other situations the fact that the menu or filter options might be dynamically updated might make you only cache the list rather than essentially the entire page. In this particular instance all of the content works and produces the proper result as both the list along with any filter conditions in the form inputs are restored. Ok, let's move on to the client. On the client there are two page level functions that deal with saving and restoring state. Like the counter example I showed earlier, I like to wrap the logic to save and restore values from sessionState into a separate function because they are almost always used in several places.page.saveData = function(id) { if (!sessionStorage) return; var data = { id: id, scroll: $("#PostItemContainer").scrollTop(), html: $("#SizingContainer").html() }; sessionStorage.setItem("list_html",JSON.stringify(data)); }; page.restoreData = function() { if (!sessionStorage) return; var data = sessionStorage.getItem("list_html"); if (!data) return null; return JSON.parse(data); }; The data that is saved is an object which contains an ID which is the selected element when the user clicks and a scroll position. These two values are used to reset the scroll position when the data is used from the cache. Finally the html from the #SizingContainer element is stored, which makes for the bulk of the document's HTML. In this application the HTML captured could be a substantial bit of data. If you recall, I mentioned that the server side code renders a small chunk of data initially and then gets more data if the user reads through the first 50 or so items. The rest of the items retrieved can be rather sizable. Other than the JSON deserialization that's Ok. Since I'm using SessionStorage the storage space has no immediate limits. Next is the core logic to handle saving and restoring the page state. At first though this would seem pretty simple, and in some cases it might be, but as the following code demonstrates there are a few gotchas to watch out for. Here's the relevant code I use to save and restore:$( function() { … var isBack = getUrlEncodedKey("back", location.href); if (isBack) { // remove the back key from URL setUrlEncodedKey("back", "", location.href); var data = page.restoreData(); // restore from sessionState if (!data) { // no data - force redisplay of the server side default list window.location = "list"; return; } $("#SizingContainer").html(data.html); var el = $(".postitem[data-id=" + data.id + "]"); $(".postitem").removeClass("highlight"); el.addClass("highlight"); $("#PostItemContainer").scrollTop(data.scroll); setTimeout(function() { el.removeClass("highlight"); }, 2500); } else if (window.noFrames) page.saveData(null); // save when page loads $("#SizingContainer").on("click", ".postitem", function() { var id = $(this).attr("data-id"); if (!id) return true; if (window.noFrames) page.saveData(id); var contentFrame = window.parent.frames["Content"]; if (contentFrame) contentFrame.location.href = "show/" + id; else window.location.href = "show/" + id; return false; }); … The code starts out by checking for the back query string flag which triggers restoring from the client cache. If cached the cached data structure is read from sessionStorage. It's important here to check if data was returned. If the user had back=true on the querystring but there is no cached data, he likely bookmarked this page or otherwise shut down the browser and came back to this URL. In that case the server didn't render any detail and we have no cached data, so all we can do is redirect to the original default list view using window.location. If we continued the page would render no data - so make sure to always check the cache retrieval result. Always! If there is data the it's loaded and the data.html data is restored back into the document by simply injecting the HTML back into the document's #SizingContainer element:$("#SizingContainer").html(data.html); It's that simple and it's quite quick even with a fully loaded list of additional items and on a phone. The actual HTML data is stored to the cache on every page load initially and then again when the user clicks on an element to navigate to a particular listing. The former ensures that the client cache always has something in it, and the latter updates with additional information for the selected element. For the click handling I use a data-id attribute on the list item (.postitem) in the list and retrieve the id from that. That id is then used to navigate to the actual entry as well as storing that Id value in the saved cached data. The id is used to reset the selection by searching for the data-id value in the restored elements. The overall process of this save/restore process is pretty straight forward and it doesn't require a bunch of code, yet it yields a huge improvement in the usability of the site on mobile devices (or anybody who uses the non-frames view). Some things to watch out for As easy as it conceptually seems to simply store and retrieve cached content, you have to be quite aware what type of content you are caching. The code above is all that's specific to cache/restore cycle and it works, but it took a few tweaks to the rest of the script code and server code to make it all work. There were a few gotchas that weren't immediately obvious. Here are a few things to pay attention to: Event Handling Logic Timing of manipulating DOM events Inline Script Code Bookmarking to the Cache Url when no cache exists Do you have inline script code in your HTML? That script code isn't going to run if you restore from cache and simply assign or it may not run at the time you think it would normally in the DOM rendering cycle. JavaScript Event Hookups The biggest issue I ran into with this approach almost immediately is that originally I had various static event handlers hooked up to various UI elements that are now cached. If you have an event handler like:$("#btnSearch").click( function() {…}); that works fine when the page loads with server rendered HTML, but that code breaks when you now load the HTML from cache. Why? Because the elements you're trying to hook those events to may not actually be there - yet. Luckily there's an easy workaround for this by using deferred events. With jQuery you can use the .on() event handler instead:$("#SelectionContainer").on("click","#btnSearch", function() {…}); which monitors a parent element for the events and checks for the inner selector elements to handle events on. This effectively defers to runtime event binding, so as more items are added to the document bindings still work. For any cached content use deferred events. Timing of manipulating DOM Elements Along the same lines make sure that your DOM manipulation code follows the code that loads the cached content into the page so that you don't manipulate DOM elements that don't exist just yet. Ideally you'll want to check for the condition to restore cached content towards the top of your script code, but that can be tricky if you have components or other logic that might not all run in a straight line. Inline Script Code Here's another small problem I ran into: I use a DateTime Picker widget I built a while back that relies on the jQuery date time picker. I also created a helper function that allows keyboard date navigation into it that uses JavaScript logic. Because MVC's limited 'object model' the only way to embed widget content into the page is through inline script. This code broken when I inserted the cached HTML into the page because the script code was not available when the component actually got injected into the page. As the last bullet - it's a matter of timing. There's no good work around for this - in my case I pulled out the jQuery date picker and relied on native <input type="date" /> logic instead - a better choice these days anyway, especially since this view is meant to be primarily to serve mobile devices which actually support date input through the browser (unlike desktop browsers of which only WebKit seems to support it). Bookmarking Cached Urls When you cache HTML content you have to make a decision whether you cache on the client and also not render that same content on the server. In the Classifieds app I didn't render server side content so if the user comes to the page with back=True and there is no cached content I have to a have a Plan B. Typically this happens when somebody ends up bookmarking the back URL. The easiest and safest solution for this scenario is to ALWAYS check the cache result to make sure it exists and if not have a safe URL to go back to - in this case to the plain uncached list URL which amounts to effectively redirecting. This seems really obvious in hindsight, but it's easy to overlook and not see a problem until much later, when it's not obvious at all why the page is not rendering anything. Don't use <body> to replace Content Since we're practically replacing all the HTML in the page it may seem tempting to simply replace the HTML content of the <body> tag. Don't. The body tag usually contains key things that should stay in the page and be there when it loads. Specifically script tags and elements and possibly other embedded content. It's best to create a top level DOM element specifically as a placeholder container for your cached content and wrap just around the actual content you want to replace. In the app above the #SizingContainer is that container. Other Approaches The approach I've used for this application is kind of specific to the existing server rendered application we're running and so it's just one approach you can take with caching. However for server rendered content caching this is a pattern I've used in a few apps to retrofit some client caching into list displays. In this application I took the path of least resistance to the existing server rendering logic. Here are a few other ways that come to mind: Using Partial HTML Rendering via AJAXInstead of rendering the page initially on the server, the page would load empty and the client would render the UI by retrieving the respective HTML and embedding it into the page from a Partial View. This effectively makes the initial rendering and the cached rendering logic identical and removes the server having to decide whether this request needs to be rendered or not (ie. not checking for a back=true switch). All the logic related to caching is made on the client in this case. Using JSON Data and Client RenderingThe hardcore client option is to do the whole UI SPA style and pull data from the server and then use client rendering or databinding to pull the data down and render using templates or client side databinding with knockout/angular et al. As with the Partial Rendering approach the advantage is that there's no difference in the logic between pulling the data from cache or rendering from scratch other than the initial check for the cache request. Of course if the app is a  full on SPA app, then caching may not be required even - the list could just stay in memory and be hidden and reactivated. I'm sure there are a number of other ways this can be handled as well especially using  AJAX. AJAX rendering might simplify the logic, but it also complicates search engine optimization since there's no content loaded initially. So there are always tradeoffs and it's important to look at all angles before deciding on any sort of caching solution in general. State of the Session SessionState and LocalStorage are easy to use in client code and can be integrated even with server centric applications to provide nice caching features of content and data. In this post I've shown a very specific scenario of storing HTML content for the purpose of remembering list view data and state and making the browsing experience for lists a bit more friendly, especially if there's dynamically loaded content involved. If you haven't played with sessionStorage or localStorage I encourage you to give it a try. There's a lot of cool stuff that you can do with this beyond the specific scenario I've covered here… Resources Overview of localStorage (also applies to sessionStorage) Web Storage Compatibility Modernizr Test Suite© Rick Strahl, West Wind Technologies, 2005-2013Posted in JavaScript  HTML5  ASP.NET  MVC   Tweet !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();

    Read the article

  • The Incremental Architect&rsquo;s Napkin - #5 - Design functions for extensibility and readability

    - by Ralf Westphal
    Originally posted on: http://geekswithblogs.net/theArchitectsNapkin/archive/2014/08/24/the-incremental-architectrsquos-napkin---5---design-functions-for.aspx The functionality of programs is entered via Entry Points. So what we´re talking about when designing software is a bunch of functions handling the requests represented by and flowing in through those Entry Points. Designing software thus consists of at least three phases: Analyzing the requirements to find the Entry Points and their signatures Designing the functionality to be executed when those Entry Points get triggered Implementing the functionality according to the design aka coding I presume, you´re familiar with phase 1 in some way. And I guess you´re proficient in implementing functionality in some programming language. But in my experience developers in general are not experienced in going through an explicit phase 2. “Designing functionality? What´s that supposed to mean?” you might already have thought. Here´s my definition: To design functionality (or functional design for short) means thinking about… well, functions. You find a solution for what´s supposed to happen when an Entry Point gets triggered in terms of functions. A conceptual solution that is, because those functions only exist in your head (or on paper) during this phase. But you may have guess that, because it´s “design” not “coding”. And here is, what functional design is not: It´s not about logic. Logic is expressions (e.g. +, -, && etc.) and control statements (e.g. if, switch, for, while etc.). Also I consider calling external APIs as logic. It´s equally basic. It´s what code needs to do in order to deliver some functionality or quality. Logic is what´s doing that needs to be done by software. Transformations are either done through expressions or API-calls. And then there is alternative control flow depending on the result of some expression. Basically it´s just jumps in Assembler, sometimes to go forward (if, switch), sometimes to go backward (for, while, do). But calling your own function is not logic. It´s not necessary to produce any outcome. Functionality is not enhanced by adding functions (subroutine calls) to your code. Nor is quality increased by adding functions. No performance gain, no higher scalability etc. through functions. Functions are not relevant to functionality. Strange, isn´t it. What they are important for is security of investment. By introducing functions into our code we can become more productive (re-use) and can increase evolvability (higher unterstandability, easier to keep code consistent). That´s no small feat, however. Evolvable code can hardly be overestimated. That´s why to me functional design is so important. It´s at the core of software development. To sum this up: Functional design is on a level of abstraction above (!) logical design or algorithmic design. Functional design is only done until you get to a point where each function is so simple you are very confident you can easily code it. Functional design an logical design (which mostly is coding, but can also be done using pseudo code or flow charts) are complementary. Software needs both. If you start coding right away you end up in a tangled mess very quickly. Then you need back out through refactoring. Functional design on the other hand is bloodless without actual code. It´s just a theory with no experiments to prove it. But how to do functional design? An example of functional design Let´s assume a program to de-duplicate strings. The user enters a number of strings separated by commas, e.g. a, b, a, c, d, b, e, c, a. And the program is supposed to clear this list of all doubles, e.g. a, b, c, d, e. There is only one Entry Point to this program: the user triggers the de-duplication by starting the program with the string list on the command line C:\>deduplicate "a, b, a, c, d, b, e, c, a" a, b, c, d, e …or by clicking on a GUI button. This leads to the Entry Point function to get called. It´s the program´s main function in case of the batch version or a button click event handler in the GUI version. That´s the physical Entry Point so to speak. It´s inevitable. What then happens is a three step process: Transform the input data from the user into a request. Call the request handler. Transform the output of the request handler into a tangible result for the user. Or to phrase it a bit more generally: Accept input. Transform input into output. Present output. This does not mean any of these steps requires a lot of effort. Maybe it´s just one line of code to accomplish it. Nevertheless it´s a distinct step in doing the processing behind an Entry Point. Call it an aspect or a responsibility - and you will realize it most likely deserves a function of its own to satisfy the Single Responsibility Principle (SRP). Interestingly the above list of steps is already functional design. There is no logic, but nevertheless the solution is described - albeit on a higher level of abstraction than you might have done yourself. But it´s still on a meta-level. The application to the domain at hand is easy, though: Accept string list from command line De-duplicate Present de-duplicated strings on standard output And this concrete list of processing steps can easily be transformed into code:static void Main(string[] args) { var input = Accept_string_list(args); var output = Deduplicate(input); Present_deduplicated_string_list(output); } Instead of a big problem there are three much smaller problems now. If you think each of those is trivial to implement, then go for it. You can stop the functional design at this point. But maybe, just maybe, you´re not so sure how to go about with the de-duplication for example. Then just implement what´s easy right now, e.g.private static string Accept_string_list(string[] args) { return args[0]; } private static void Present_deduplicated_string_list( string[] output) { var line = string.Join(", ", output); Console.WriteLine(line); } Accept_string_list() contains logic in the form of an API-call. Present_deduplicated_string_list() contains logic in the form of an expression and an API-call. And then repeat the functional design for the remaining processing step. What´s left is the domain logic: de-duplicating a list of strings. How should that be done? Without any logic at our disposal during functional design you´re left with just functions. So which functions could make up the de-duplication? Here´s a suggestion: De-duplicate Parse the input string into a true list of strings. Register each string in a dictionary/map/set. That way duplicates get cast away. Transform the data structure into a list of unique strings. Processing step 2 obviously was the core of the solution. That´s where real creativity was needed. That´s the core of the domain. But now after this refinement the implementation of each step is easy again:private static string[] Parse_string_list(string input) { return input.Split(',') .Select(s => s.Trim()) .ToArray(); } private static Dictionary<string,object> Compile_unique_strings(string[] strings) { return strings.Aggregate( new Dictionary<string, object>(), (agg, s) => { agg[s] = null; return agg; }); } private static string[] Serialize_unique_strings( Dictionary<string,object> dict) { return dict.Keys.ToArray(); } With these three additional functions Main() now looks like this:static void Main(string[] args) { var input = Accept_string_list(args); var strings = Parse_string_list(input); var dict = Compile_unique_strings(strings); var output = Serialize_unique_strings(dict); Present_deduplicated_string_list(output); } I think that´s very understandable code: just read it from top to bottom and you know how the solution to the problem works. It´s a mirror image of the initial design: Accept string list from command line Parse the input string into a true list of strings. Register each string in a dictionary/map/set. That way duplicates get cast away. Transform the data structure into a list of unique strings. Present de-duplicated strings on standard output You can even re-generate the design by just looking at the code. Code and functional design thus are always in sync - if you follow some simple rules. But about that later. And as a bonus: all the functions making up the process are small - which means easy to understand, too. So much for an initial concrete example. Now it´s time for some theory. Because there is method to this madness ;-) The above has only scratched the surface. Introducing Flow Design Functional design starts with a given function, the Entry Point. Its goal is to describe the behavior of the program when the Entry Point is triggered using a process, not an algorithm. An algorithm consists of logic, a process on the other hand consists just of steps or stages. Each processing step transforms input into output or a side effect. Also it might access resources, e.g. a printer, a database, or just memory. Processing steps thus can rely on state of some sort. This is different from Functional Programming, where functions are supposed to not be stateful and not cause side effects.[1] In its simplest form a process can be written as a bullet point list of steps, e.g. Get data from user Output result to user Transform data Parse data Map result for output Such a compilation of steps - possibly on different levels of abstraction - often is the first artifact of functional design. It can be generated by a team in an initial design brainstorming. Next comes ordering the steps. What should happen first, what next etc.? Get data from user Parse data Transform data Map result for output Output result to user That´s great for a start into functional design. It´s better than starting to code right away on a given function using TDD. Please get me right: TDD is a valuable practice. But it can be unnecessarily hard if the scope of a functionn is too large. But how do you know beforehand without investing some thinking? And how to do this thinking in a systematic fashion? My recommendation: For any given function you´re supposed to implement first do a functional design. Then, once you´re confident you know the processing steps - which are pretty small - refine and code them using TDD. You´ll see that´s much, much easier - and leads to cleaner code right away. For more information on this approach I call “Informed TDD” read my book of the same title. Thinking before coding is smart. And writing down the solution as a bunch of functions possibly is the simplest thing you can do, I´d say. It´s more according to the KISS (Keep It Simple, Stupid) principle than returning constants or other trivial stuff TDD development often is started with. So far so good. A simple ordered list of processing steps will do to start with functional design. As shown in the above example such steps can easily be translated into functions. Moving from design to coding thus is simple. However, such a list does not scale. Processing is not always that simple to be captured in a list. And then the list is just text. Again. Like code. That means the design is lacking visuality. Textual representations need more parsing by your brain than visual representations. Plus they are limited in their “dimensionality”: text just has one dimension, it´s sequential. Alternatives and parallelism are hard to encode in text. In addition the functional design using numbered lists lacks data. It´s not visible what´s the input, output, and state of the processing steps. That´s why functional design should be done using a lightweight visual notation. No tool is necessary to draw such designs. Use pen and paper; a flipchart, a whiteboard, or even a napkin is sufficient. Visualizing processes The building block of the functional design notation is a functional unit. I mostly draw it like this: Something is done, it´s clear what goes in, it´s clear what comes out, and it´s clear what the processing step requires in terms of state or hardware. Whenever input flows into a functional unit it gets processed and output is produced and/or a side effect occurs. Flowing data is the driver of something happening. That´s why I call this approach to functional design Flow Design. It´s about data flow instead of control flow. Control flow like in algorithms is of no concern to functional design. Thinking about control flow simply is too low level. Once you start with control flow you easily get bogged down by tons of details. That´s what you want to avoid during design. Design is supposed to be quick, broad brush, abstract. It should give overview. But what about all the details? As Robert C. Martin rightly said: “Programming is abot detail”. Detail is a matter of code. Once you start coding the processing steps you designed you can worry about all the detail you want. Functional design does not eliminate all the nitty gritty. It just postpones tackling them. To me that´s also an example of the SRP. Function design has the responsibility to come up with a solution to a problem posed by a single function (Entry Point). And later coding has the responsibility to implement the solution down to the last detail (i.e. statement, API-call). TDD unfortunately mixes both responsibilities. It´s just coding - and thereby trying to find detailed implementations (green phase) plus getting the design right (refactoring). To me that´s one reason why TDD has failed to deliver on its promise for many developers. Using functional units as building blocks of functional design processes can be depicted very easily. Here´s the initial process for the example problem: For each processing step draw a functional unit and label it. Choose a verb or an “action phrase” as a label, not a noun. Functional design is about activities, not state or structure. Then make the output of an upstream step the input of a downstream step. Finally think about the data that should flow between the functional units. Write the data above the arrows connecting the functional units in the direction of the data flow. Enclose the data description in brackets. That way you can clearly see if all flows have already been specified. Empty brackets mean “no data is flowing”, but nevertheless a signal is sent. A name like “list” or “strings” in brackets describes the data content. Use lower case labels for that purpose. A name starting with an upper case letter like “String” or “Customer” on the other hand signifies a data type. If you like, you also can combine descriptions with data types by separating them with a colon, e.g. (list:string) or (strings:string[]). But these are just suggestions from my practice with Flow Design. You can do it differently, if you like. Just be sure to be consistent. Flows wired-up in this manner I call one-dimensional (1D). Each functional unit just has one input and/or one output. A functional unit without an output is possible. It´s like a black hole sucking up input without producing any output. Instead it produces side effects. A functional unit without an input, though, does make much sense. When should it start to work? What´s the trigger? That´s why in the above process even the first processing step has an input. If you like, view such 1D-flows as pipelines. Data is flowing through them from left to right. But as you can see, it´s not always the same data. It get´s transformed along its passage: (args) becomes a (list) which is turned into (strings). The Principle of Mutual Oblivion A very characteristic trait of flows put together from function units is: no functional units knows another one. They are all completely independent of each other. Functional units don´t know where their input is coming from (or even when it´s gonna arrive). They just specify a range of values they can process. And they promise a certain behavior upon input arriving. Also they don´t know where their output is going. They just produce it in their own time independent of other functional units. That means at least conceptually all functional units work in parallel. Functional units don´t know their “deployment context”. They now nothing about the overall flow they are place in. They are just consuming input from some upstream, and producing output for some downstream. That makes functional units very easy to test. At least as long as they don´t depend on state or resources. I call this the Principle of Mutual Oblivion (PoMO). Functional units are oblivious of others as well as an overall context/purpose. They are just parts of a whole focused on a single responsibility. How the whole is built, how a larger goal is achieved, is of no concern to the single functional units. By building software in such a manner, functional design interestingly follows nature. Nature´s building blocks for organisms also follow the PoMO. The cells forming your body do not know each other. Take a nerve cell “controlling” a muscle cell for example:[2] The nerve cell does not know anything about muscle cells, let alone the specific muscel cell it is “attached to”. Likewise the muscle cell does not know anything about nerve cells, let a lone a specific nerve cell “attached to” it. Saying “the nerve cell is controlling the muscle cell” thus only makes sense when viewing both from the outside. “Control” is a concept of the whole, not of its parts. Control is created by wiring-up parts in a certain way. Both cells are mutually oblivious. Both just follow a contract. One produces Acetylcholine (ACh) as output, the other consumes ACh as input. Where the ACh is going, where it´s coming from neither cell cares about. Million years of evolution have led to this kind of division of labor. And million years of evolution have produced organism designs (DNA) which lead to the production of these different cell types (and many others) and also to their co-location. The result: the overall behavior of an organism. How and why this happened in nature is a mystery. For our software, though, it´s clear: functional and quality requirements needs to be fulfilled. So we as developers have to become “intelligent designers” of “software cells” which we put together to form a “software organism” which responds in satisfying ways to triggers from it´s environment. My bet is: If nature gets complex organisms working by following the PoMO, who are we to not apply this recipe for success to our much simpler “machines”? So my rule is: Wherever there is functionality to be delivered, because there is a clear Entry Point into software, design the functionality like nature would do it. Build it from mutually oblivious functional units. That´s what Flow Design is about. In that way it´s even universal, I´d say. Its notation can also be applied to biology: Never mind labeling the functional units with nouns. That´s ok in Flow Design. You´ll do that occassionally for functional units on a higher level of abstraction or when their purpose is close to hardware. Getting a cockroach to roam your bedroom takes 1,000,000 nerve cells (neurons). Getting the de-duplication program to do its job just takes 5 “software cells” (functional units). Both, though, follow the same basic principle. Translating functional units into code Moving from functional design to code is no rocket science. In fact it´s straightforward. There are two simple rules: Translate an input port to a function. Translate an output port either to a return statement in that function or to a function pointer visible to that function. The simplest translation of a functional unit is a function. That´s what you saw in the above example. Functions are mutually oblivious. That why Functional Programming likes them so much. It makes them composable. Which is the reason, nature works according to the PoMO. Let´s be clear about one thing: There is no dependency injection in nature. For all of an organism´s complexity no DI container is used. Behavior is the result of smooth cooperation between mutually oblivious building blocks. Functions will often be the adequate translation for the functional units in your designs. But not always. Take for example the case, where a processing step should not always produce an output. Maybe the purpose is to filter input. Here the functional unit consumes words and produces words. But it does not pass along every word flowing in. Some words are swallowed. Think of a spell checker. It probably should not check acronyms for correctness. There are too many of them. Or words with no more than two letters. Such words are called “stop words”. In the above picture the optionality of the output is signified by the astrisk outside the brackets. It means: Any number of (word) data items can flow from the functional unit for each input data item. It might be none or one or even more. This I call a stream of data. Such behavior cannot be translated into a function where output is generated with return. Because a function always needs to return a value. So the output port is translated into a function pointer or continuation which gets passed to the subroutine when called:[3]void filter_stop_words( string word, Action<string> onNoStopWord) { if (...check if not a stop word...) onNoStopWord(word); } If you want to be nitpicky you might call such a function pointer parameter an injection. And technically you´re right. Conceptually, though, it´s not an injection. Because the subroutine is not functionally dependent on the continuation. Firstly continuations are procedures, i.e. subroutines without a return type. Remember: Flow Design is about unidirectional data flow. Secondly the name of the formal parameter is chosen in a way as to not assume anything about downstream processing steps. onNoStopWord describes a situation (or event) within the functional unit only. Translating output ports into function pointers helps keeping functional units mutually oblivious in cases where output is optional or produced asynchronically. Either pass the function pointer to the function upon call. Or make it global by putting it on the encompassing class. Then it´s called an event. In C# that´s even an explicit feature.class Filter { public void filter_stop_words( string word) { if (...check if not a stop word...) onNoStopWord(word); } public event Action<string> onNoStopWord; } When to use a continuation and when to use an event dependens on how a functional unit is used in flows and how it´s packed together with others into classes. You´ll see examples further down the Flow Design road. Another example of 1D functional design Let´s see Flow Design once more in action using the visual notation. How about the famous word wrap kata? Robert C. Martin has posted a much cited solution including an extensive reasoning behind his TDD approach. So maybe you want to compare it to Flow Design. The function signature given is:string WordWrap(string text, int maxLineLength) {...} That´s not an Entry Point since we don´t see an application with an environment and users. Nevertheless it´s a function which is supposed to provide a certain functionality. The text passed in has to be reformatted. The input is a single line of arbitrary length consisting of words separated by spaces. The output should consist of one or more lines of a maximum length specified. If a word is longer than a the maximum line length it can be split in multiple parts each fitting in a line. Flow Design Let´s start by brainstorming the process to accomplish the feat of reformatting the text. What´s needed? Words need to be assembled into lines Words need to be extracted from the input text The resulting lines need to be assembled into the output text Words too long to fit in a line need to be split Does sound about right? I guess so. And it shows a kind of priority. Long words are a special case. So maybe there is a hint for an incremental design here. First let´s tackle “average words” (words not longer than a line). Here´s the Flow Design for this increment: The the first three bullet points turned into functional units with explicit data added. As the signature requires a text is transformed into another text. See the input of the first functional unit and the output of the last functional unit. In between no text flows, but words and lines. That´s good to see because thereby the domain is clearly represented in the design. The requirements are talking about words and lines and here they are. But note the asterisk! It´s not outside the brackets but inside. That means it´s not a stream of words or lines, but lists or sequences. For each text a sequence of words is output. For each sequence of words a sequence of lines is produced. The asterisk is used to abstract from the concrete implementation. Like with streams. Whether the list of words gets implemented as an array or an IEnumerable is not important during design. It´s an implementation detail. Does any processing step require further refinement? I don´t think so. They all look pretty “atomic” to me. And if not… I can always backtrack and refine a process step using functional design later once I´ve gained more insight into a sub-problem. Implementation The implementation is straightforward as you can imagine. The processing steps can all be translated into functions. Each can be tested easily and separately. Each has a focused responsibility. And the process flow becomes just a sequence of function calls: Easy to understand. It clearly states how word wrapping works - on a high level of abstraction. And it´s easy to evolve as you´ll see. Flow Design - Increment 2 So far only texts consisting of “average words” are wrapped correctly. Words not fitting in a line will result in lines too long. Wrapping long words is a feature of the requested functionality. Whether it´s there or not makes a difference to the user. To quickly get feedback I decided to first implement a solution without this feature. But now it´s time to add it to deliver the full scope. Fortunately Flow Design automatically leads to code following the Open Closed Principle (OCP). It´s easy to extend it - instead of changing well tested code. How´s that possible? Flow Design allows for extension of functionality by inserting functional units into the flow. That way existing functional units need not be changed. The data flow arrow between functional units is a natural extension point. No need to resort to the Strategy Pattern. No need to think ahead where extions might need to be made in the future. I just “phase in” the remaining processing step: Since neither Extract words nor Reformat know of their environment neither needs to be touched due to the “detour”. The new processing step accepts the output of the existing upstream step and produces data compatible with the existing downstream step. Implementation - Increment 2 A trivial implementation checking the assumption if this works does not do anything to split long words. The input is just passed on: Note how clean WordWrap() stays. The solution is easy to understand. A developer looking at this code sometime in the future, when a new feature needs to be build in, quickly sees how long words are dealt with. Compare this to Robert C. Martin´s solution:[4] How does this solution handle long words? Long words are not even part of the domain language present in the code. At least I need considerable time to understand the approach. Admittedly the Flow Design solution with the full implementation of long word splitting is longer than Robert C. Martin´s. At least it seems. Because his solution does not cover all the “word wrap situations” the Flow Design solution handles. Some lines would need to be added to be on par, I guess. But even then… Is a difference in LOC that important as long as it´s in the same ball park? I value understandability and openness for extension higher than saving on the last line of code. Simplicity is not just less code, it´s also clarity in design. But don´t take my word for it. Try Flow Design on larger problems and compare for yourself. What´s the easier, more straightforward way to clean code? And keep in mind: You ain´t seen all yet ;-) There´s more to Flow Design than described in this chapter. In closing I hope I was able to give you a impression of functional design that makes you hungry for more. To me it´s an inevitable step in software development. Jumping from requirements to code does not scale. And it leads to dirty code all to quickly. Some thought should be invested first. Where there is a clear Entry Point visible, it´s functionality should be designed using data flows. Because with data flows abstraction is possible. For more background on why that´s necessary read my blog article here. For now let me point out to you - if you haven´t already noticed - that Flow Design is a general purpose declarative language. It´s “programming by intention” (Shalloway et al.). Just write down how you think the solution should work on a high level of abstraction. This breaks down a large problem in smaller problems. And by following the PoMO the solutions to those smaller problems are independent of each other. So they are easy to test. Or you could even think about getting them implemented in parallel by different team members. Flow Design not only increases evolvability, but also helps becoming more productive. All team members can participate in functional design. This goes beyon collective code ownership. We´re talking collective design/architecture ownership. Because with Flow Design there is a common visual language to talk about functional design - which is the foundation for all other design activities.   PS: If you like what you read, consider getting my ebook “The Incremental Architekt´s Napkin”. It´s where I compile all the articles in this series for easier reading. I like the strictness of Function Programming - but I also find it quite hard to live by. And it certainly is not what millions of programmers are used to. Also to me it seems, the real world is full of state and side effects. So why give them such a bad image? That´s why functional design takes a more pragmatic approach. State and side effects are ok for processing steps - but be sure to follow the SRP. Don´t put too much of it into a single processing step. ? Image taken from www.physioweb.org ? My code samples are written in C#. C# sports typed function pointers called delegates. Action is such a function pointer type matching functions with signature void someName(T t). Other languages provide similar ways to work with functions as first class citizens - even Java now in version 8. I trust you find a way to map this detail of my translation to your favorite programming language. I know it works for Java, C++, Ruby, JavaScript, Python, Go. And if you´re using a Functional Programming language it´s of course a no brainer. ? Taken from his blog post “The Craftsman 62, The Dark Path”. ?

    Read the article

  • Getting Selected Dropdown content to show in a form-generated email

    - by fmz
    I have a small contact form: <form method="post" action="contact.php" name="contactform" id="contactform"> <fieldset> <legend>Please fill in the following form to contact us</legend> <label for="name"><span class="required">*</span> Your Name</label> <input name="name" type="text" id="name" size="30" value="" /> <br /> <label for="company"><span class="required">*</span> Company</label> <input name="company" type="text" id="name" size="30" value="" /> <br /> <label for="email"><span class="required">*</span> Email</label> <input name="email" type="text" id="email" size="30" value="" /> <br /> <label for="phone"><span class="required">*</span> Phone</label> <input name="phone" type="text" id="phone" size="30" value="" /> <br /> <label for="purpose"><span class="required">*</span> Purpose</label> <select id="purpose" style="width: 300px; height:35px;"> <option value="I am interested in your services">I am interested in your services!</option> <option value="I am interested in a partnership">I am interested in a partnership!</option> <option value="I am interested in a job">I am interested in a job!</option> </select> <br /> <label for=comments><span class="required">*</span> Comments</label> <textarea name="comments" cols="40" rows="3" id="comments" style="width: 350px;"></textarea> <p><span class="required">*</span> Please help us control spam.</p> <label for=verify accesskey=V>&nbsp;&nbsp;&nbsp;3 + 1 =</label> <input name="verify" type="text" id="verify" size="4" value="" style="width: 30px;" /><br /><br /> <input type="submit" class="submit" id="submit" value="Submit" /> </fieldset> </form> I want to send the results of the form in a php generated email. Everything is coming through except the selected contents of the "purpose" drop down. Here is the PHP: <?php if(!$_POST) exit; $name = $_POST['name']; $company = $_POST['company']; $email = $_POST['email']; $phone = $_POST['phone']; $purpose = $_POST['purpose']; $comments = $_POST['comments']; $verify = $_POST['verify']; if(trim($name) == '') { echo '<div class="error_message">Attention! You must enter your name.</div>'; exit(); } else if(trim($company) == '') { echo '<div class="error_message">Attention! Please enter your company name.</div>'; exit(); } else if(trim($email) == '') { echo '<div class="error_message">Attention! Please enter a valid email address.</div>'; exit(); } else if(trim($phone) == '') { echo '<div class="error_message">Attention! Please enter a valid phone number.</div>'; exit(); } else if(!isEmail($email)) { echo '<div class="error_message">Attention! You have enter an invalid e-mail address, try again.</div>'; exit(); } if(trim($comments) == '') { echo '<div class="error_message">Attention! Please enter your message.</div>'; exit(); } else if(trim($verify) == '') { echo '<div class="error_message">Attention! Please enter the verification number.</div>'; exit(); } else if(trim($verify) != '4') { echo '<div class="error_message">Attention! The verification number you entered is incorrect.</div>'; exit(); } if($error == '') { if(get_magic_quotes_gpc()) { $comments = stripslashes($comments); } // Configuration option. // Enter the email address that you want to emails to be sent to. // Example $address = "[email protected]"; $address = "[email protected]"; // Configuration option. // i.e. The standard subject will appear as, "You've been contacted by John Doe." // Example, $e_subject = '$name . ' has contacted you via Your Website.'; $e_subject = 'You\'ve been contacted by ' . $name . '.'; // Configuration option. // You can change this if you feel that you need to. // Developers, you may wish to add more fields to the form, in which case you must be sure to add them here. $e_body = "You have been contacted by $name.\r\n\n"; $e_content = "Comments: \"$comments\"\r\n\n"; $e_company = "Company: $company\r\n\n"; $e_purpose = "Reason for contact: $purpose\r\n"; $e_reply = "You can contact $name via email, $email or via phone $phone"; $msg = $e_body . $e_content . $e_company . $e_purpose . $e_reply; if(mail($address, $e_subject, $msg, "From: $email\r\nReply-To: $email\r\nReturn-Path: $email\r\n")) { // Email has sent successfully, echo a success page. echo "<fieldset>"; echo "<div id='success_page'>"; echo "<h1>Email Sent Successfully.</h1>"; echo "<p>Thank you <strong>$name</strong>, your message has been submitted to us.</p>"; echo "</div>"; echo "</fieldset>"; } else { echo 'ERROR!'; } } function isEmail($email) { // Email address verification, do not edit. return(preg_match("/^[-_.[:alnum:]]+@((([[:alnum:]]|[[:alnum:]][[:alnum:]-]*[[:alnum:]])\.)+(ad|ae|aero|af|ag|ai|al|am|an|ao|aq|ar|arpa|as|at|au|aw|az|ba|bb|bd|be|bf|bg|bh|bi|biz|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|com|coop|cr|cs|cu|cv|cx|cy|cz|de|dj|dk|dm|do|dz|ec|edu|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gh|gi|gl|gm|gn|gov|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|in|info|int|io|iq|ir|is|it|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|mg|mh|mil|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|museum|mv|mw|mx|my|mz|na|name|nc|ne|net|nf|ng|ni|nl|no|np|nr|nt|nu|nz|om|org|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|pro|ps|pt|pw|py|qa|re|ro|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sy|sz|tc|td|tf|tg|th|tj|tk|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|um|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)$|(([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5])\.){3}([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5]))$/i",$email)); } ?> What am I missing? Thanks.

    Read the article

  • ruby regex, parsing html

    - by danwoods
    Hello all, I'm trying to parse some returned html to look for currently playing movies. The pattern I'm trying to match looks like: <span dir=ltr>Clash of the Titans</span> Of which there are several in the returned html. (the html is huge, I've posted a sample at the bottom) I'm trying get an array of the movie titles with the following command: titles = listings_html.split(/(<span dir=ltr>).*(<\/span>)/) But I'm not getting the results I'm expecting. Can anyone see a problem with my approach or regex? Returned html (I believe the 'markdown'formating will render the some of the html, but this is just an example): <script>window.gbar={};(function(){function h(a,b,d){var c="on"+b;if(a.addEventListener)a.addEventListener(b,d,false);else if(a.attachEvent)a.attachEvent(c,d);else{var f=a[c];a[c]=function(){var e=f.apply(this,arguments),g=d.apply(this,arguments);return e==undefined?g:g==undefined?e:g&&e}}};var i=window.gbar,k,l,m;function n(a){var b=window.encodeURIComponent&&(document.forms[0].q||"").value;if(b)a.href=a.href.replace(/([?&])q=[^&]*|$/,function(d,c){return(c||"&")+"q="+encodeURIComponent(b)})}i.qs=n;function o(a,b,d,c,f,e){var g=document.getElementById(a);if(g){var j=g.style;j.left=c?"auto":b+"px";j.right=c?b+"px":"auto";j.top=d+"px";j.visibility=l?"hidden":"visible";if(f&&e){j.width=f+"px";j.height=e+"px"}else{o(k,b,d,c,g.offsetWidth,g.offsetHeight);l=l?"":a}}}i.tg=function(a){a=a||window.event;var b,d=a.target||a.srcElement;a.cancelBubble=true;if(k!=null)p(d);else{b=document.createElement(Array.every||window.createPopup?"iframe":"div");b.frameBorder="0";k=b.id="gbs";b.src="javascript:''";d.parentNode.appendChild(b);h(document,"click",i.close);p(d);i.alld&&i.alld(function(){var c=document.getElementById("gbli");if(c){var f=c.parentNode;q(f,c);var e=c.prevSibling;f.removeChild(c);i.removeExtraDelimiters(f,e);b.style.height=f.offsetHeight+"px"}})}};function r(a){var b,d=document.defaultView;if(d&&d.getComputedStyle){if(a=d.getComputedStyle(a,""))b=a.direction}else b=a.currentStyle?a.currentStyle.direction:a.style.direction;return b=="rtl"}function p(a){var b=0;if(a.className!="gb3")a=a.parentNode;var d=a.getAttribute("aria-owns")||"gbi",c=a.offsetWidth,f=a.offsetTop>20?46:24,e=false;do b+=a.offsetLeft||0;while(a=a.offsetParent);a=(document.documentElement.clientWidth||document.body.clientWidth)-b-c;c=r(document.body);if(d=="gbi"){var g=document.getElementById("gbi");q(g,document.getElementById("gbli")||g.firstChild);if(c){b=a;e=true}}else if(!c){b=a;e=true}l!=d&&i.close();o(d,b,f,e)}i.close=function(){l&&o(l,0,0)};function s(a,b,d){if(!m){m="gb2";if(i.alld){var c=i.findClassName(a);if(c)m=c}}a.insertBefore(b,d).className=m}function q(a,b){for(var d,c=window.navExtra;c&&(d=c.pop());)s(a,d,b)}i.addLink=function(a,b,d){if((b=document.getElementById(b))&&a){a.className="gb4";var c=document.createElement("span");c.appendChild(a);c.appendChild(document.createTextNode(" | "));c.id=d;b.appendChild(c)}}})();if(!window.google)window.google={};if(!window.google.movies)window.google.movies={};window.google.movies.registerFixdir=function(){var c="[\u0000- !-@[-{-\u00bf\u00d7\u00f7\u02b9-\u02ff\u2000-\u2bff]",g=new RegExp("^"+c+"([0-9]"+c+"$|[A-Za-z\u00c0-\u00d6\u00d8-\u00f6\u00f8-\u02b8\u0300-\u0590\u0800-\u1fff\u2c00-\ufb1c\ufdfe-\ufe6f\ufefd-\uffff])"),h=new RegExp("^"+c+"$");function e(d,a){if(!a)a=d&&d.target?d.target:window.event.srcElement;a.dir=g.test(a.value)?"ltr":(h.test(a.value)?"":"rtl")} var i=[document.getElementsByName("q")[0],document.getElementById("mtq")];for(var f=0,b;b=i[f];f++)if(b){b.onkeyup=e;e(null,b)}}; Movie Showtimes - Google Search.fl:link{}a:link,.w,a.w:link,.w a:link{color:#00c}a:visited{color:#551a8b}a:active{color:red}.t a:link,.t a:active,.t a:visited,.t{color:#000}.left{width:12em}.box{background:#fff}.nopadding{padding:0}.k{background:#36c}.z{display:none}.x{width:3em}.y{width:23em}.b{color:#00c;font-size:12pt;font-weight:bold}.i,.i:link{color:#a90a08}.n a{color:#000;font-size:10pt}.n .b a{color:#00c}.n .i{font-size:10pt;font-weight:bold}.h{cursor:pointer}body{background:#fff;font:82% Arial,Helvetica,sans-serif;margin:3px 0 0;padding:0}table{border-collapse:collapse;border-spacing:0}img{border:0}td,th{vertical-align:top}h1,h2{font-size:100%;margin:0}a{color:#00c}/ CSS for page */#title_bar{background:#f0f7f9;border-top:1px solid #6b90da;padding-bottom:4px;padding-left:8px;padding-top:4px}#google_bar{margin:3px 10px}#search_form{margin:3px 10px}#left_nav{border-right:1px solid #c9d7f1;margin-top:11px;position:absolute;left:9px;width:13.4em}#left_nav .section{margin-bottom:1.2em}.hidden{visibility:hidden}#results{height:auto !important;height:350px;margin-left:15em;min-height:350px;min-width:800px;width:expression(document.body.clientWidth<1000?"800px":"99.9%")}.name{font-size:124%;margin:0}.times{clear:both;margin:0}.address{margin:0}#movie_results{overflow:auto}.movie_results{margin-top:11px}.movie{clear:both;margin-bottom:40px}.movie .header{padding-left:8px}.movie .img{border:1px solid #ccc;float:left;margin-bottom:10px}.movie .desc{margin-bottom:15px;max-width:42em}.movie h2{font-size:124%;margin-bottom:2px}.movie .info{margin-bottom:10px}.movie .syn{margin-bottom:10px}.movie .section_title{background:#f0f7f9;clear:both;font-size:108%;margin-bottom:11px;margin-top:11px;padding-bottom:4px;padding-left:8px;padding-top:5px}.movie .showtimes{margin-bottom:8px;padding-left:8px}.movie .show_left{width:49%}.movie .show_right{width:49%}.movie .theater{padding-bottom:15px}.theater{clear:both;padding-bottom:1px}.theater_after_icon{padding-left:25px}.theater .show_left{width:49%}.theater .show_right{width:49%}.theater h2{font-size:124%;margin-bottom:2px}.theater .icon{float:left;height:3em;margin-right:5px}.theater .closure{font-size:100%}.theater .info{font-size:100%;padding-bottom:5px;padding-top:5px}.theater .movie{margin-bottom:8px;margin-right:8px;max-width:42em}.theater .movie .desc{margin-bottom:5px;margin-left:0}.theater .movie .info{margin-top:0}.theater .showtimes{margin-bottom:40px;margin-top:8px}#theater_map{right:0;left:0;position:relative;top:0}#theater_static_map{border:1px solid #c9d7f1;margin:10px}.map_marker .name{margin-top:10px}.photo{border:1px solid #ccc;margin-bottom:20px;margin-left:8px}.show_left{float:left;margin:0;width:49.999%}.show_right{float:right;margin:0;width:50%}.show_more{clear:both;font-size:124%;margin:0}.show_more a{color:#77c}.reviews{margin-bottom:8px;padding-left:8px}.review{margin-bottom:5px}.review .publisher{color:green}.review .date{color:#6f6f6f}.trailer{margin-bottom:8px;padding-left:8px}.clear{clear:both}.iconA{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 0}.iconB{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -38px}.iconC{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -76px}.iconD{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -114px}.iconE{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -152px}.iconF{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -190px}.iconG{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -228px}.iconH{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -266px}.iconI{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -304px}.iconJ{background:url(http://maps.gstatic.com/mapfiles/red_icons_A_J.png) repeat 0 -342px}.iconK{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 0}.iconL{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -38px}.iconM{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -76px}.iconN{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -114px}.iconO{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -152px}.iconP{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -190px}.iconQ{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -228px}.iconR{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -266px}.iconS{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -304px}.iconT{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -342px}.iconU{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -380px}.iconV{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -418px}.iconW{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -456px}.iconX{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -494px}.iconY{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -532px}.iconZ{background:url(http://maps.gstatic.com/mapfiles/red_icons_K_Z.png) repeat 0 -570px}#gbar,#guser{font-size:13px;padding-top:1px !important}#gbar{float:left;height:22px}#guser{padding-bottom:7px !important;text-align:right}.gbh,.gbd{border-top:1px solid #c9d7f1;font-size:1px}.gbh{height:0;position:absolute;top:24px;width:100%}#gbs,.gbm{background:#fff;left:0;position:absolute;text-align:left;visibility:hidden;z-index:1000}.gbm{border:1px solid;border-color:#c9d7f1 #36c #36c #a2bae7;z-index:1001}.gb1{margin-right:.5em}.gb1,.gb3{zoom:1}.gb2{display:block;padding:.2em .5em;}.gb2,.gb3{text-decoration:none;border-bottom:none}a.gb1,a.gb2,a.gb3,a.gb4{color:#00c !important}.gbi .gb3,.gbi .gb2,.gbi .gb4{color:#dd8e27 !important}.gbf .gb3,.gbf .gb2,.gbf .gb4{color:#900 !important}a.gb2:hover{background:#36c;color:#fff !important}Web Images Videos Maps News Shopping Gmail more ▼Books Finance Translate Scholar Blogs YouTube Calendar Photos Documents Reader Sites Groups even more » [email protected] | Google Account settings | Sign out     Advanced Search  PreferencesShowtimes for Murfreesboro, TN 37130Change Location› Today › Tomorrow › Monday › Tuesday› Theaters › Movies› Show list view › Show map viewPremiere 6 Theater810 Northwest Broad Street, Murfreesboro, TN - (615) 896-4100Clash of the Titans? - 1hr 50min?? - Rated PG-13?? - Action/Adventure? - Trailer - IMDb2:10  4:15  6:15  8:20  10:25pmDiary of a Wimpy Kid? - 1hr 33min?? - Rated PG?? - Comedy/Drama? - Trailer - IMDb2:00  3:50  6:00  7:50  9:40pmHow to Train Your Dragon?1hr 38min?? - Rated PG?? - Family/Animation? - IMDb2:00  3:55  6:00  7:55  9:50pmThe Bounty Hunter? - 1hr 46min?? - Rated PG-13?? - Action/Adventure/Comedy/Romance? - Trailer - IMDb2:15  4:15  6:25  8:25  10:30pmThe Last Song? - 1hr 47min?? - Rated PG?? - Drama? - Trailer - IMDb2:20  4:15  6:30  8:35  10:35pmTyler Perry's Why Did I Get Married Too?2hr 1min?? - Rated PG-13?? - Comedy?2:20  4:35  7:30  9:45pmContinental Cinema 5450 US Highway 231 N, Troy, AL - (334) 808-4225Clash of the Titans 3D? - 1hr 50min?? - Rated PG-13?? - Action/Adventure? - IMDb1:00  4:00  7:00  9:30pmHow to Train Your Dragon 3D? - 1hr 38min?? - Rated PG?? - Family/Animation? - IMDb1:05  4:05  7:05  9:25pmThe Bounty Hunter? - 1hr 46min?? - Rated PG-13?? - Action/Adventure/Comedy/Romance? - Trailer - IMDb1:00  4:00  7:00  9:30pmThe Last Song? - 1hr 47min?? - Rated PG?? - Drama? - Trailer - IMDb1:05  4:05  7:05  9:25pmTyler Perry's Why Did I Get Married Too?2hr 1min?? - Rated PG-13?? - Comedy?12:55  3:55  6:55  9:35pmMall Cinema - Hartford KYUS Hwy 231 South 62 East, Hartford, KY - (270) 298-3315Clash of the Titans? - 1hr 50min?? - Rated PG-13?? - Action/Adventure? - Trailer - IMDb5:00  7:00  9:00pmHow to Train Your Dragon?1hr 38min?? - Rated PG?? - Family/Animation? - IMDb5:00  7:00  9:00pmCarmike Wynnsong 16 - Murfreesboro2626 Cason Square Boulevard, Murfreesboro, TN - (615) 893-2253The Last Song? - 1hr 47min?? - Rated PG?? - Drama? - Trailer - IMDb12:15  1:00  2:45  4:00  5:15  7:00  7:45 

    Read the article

  • XSLT templates and recursion

    - by user333411
    Hi All, Im new to XSLT and am having some problems trying to format an XML document which has recursive nodes. My XML Code: Hopefully my XML shows: All <item> are nested with <items> An item can have either just attributes, or sub nodes The level to which <item> nodes are nested can be infinently deep <?xml version="1.0" encoding="utf-8" ?> - <items> <item groupID="1" name="Home" url="//" /> - <item groupID="2" name="Guides" url="/Guides/"> - <items> - <item groupID="26" name="Online-Poker-Guide" url="/Guides/Online-Poker-Guide/"> - <items> - <item> <id>107</id> - <title> - <![CDATA[ Poker Betting - Online Poker Betting Structures ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/online-poker-betting-structures ]]> </url> </item> - <item> <id>114</id> - <title> - <![CDATA[ Beginners&#39; Poker - Poker Hand Ranking ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/online-poker-hand-ranking ]]> </url> </item> - <item> <id>115</id> - <title> - <![CDATA[ Poker Terms - 4th Street and 5th Street ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/online-poker-poker-terms ]]> </url> </item> - <item> <id>116</id> - <title> - <![CDATA[ Popular Poker - The Popularity of Texas Hold&#39;em ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/online-poker-popularity-texas-holdem ]]> </url> </item> - <item> <id>364</id> - <title> - <![CDATA[ The Impact of Traditional Poker on Online Poker (and vice versa) ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/online-poker-tradional-vs-online ]]> </url> </item> - <item> <id>365</id> - <title> - <![CDATA[ The Ultimate, Absolute Online Poker Scandal ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/online-poker-scandal ]]> </url> </item> </items> - <items> - <item groupID="27" name="Beginners-Poker" url="/Guides/Online-Poker-Guide/Beginners-Poker/"> - <items> + <item> <id>101</id> - <title> - <![CDATA[ Poker Betting - All-in On the Flop ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/poker-betting-all-in-on-the-flop ]]> </url> </item> + <item> <id>102</id> - <title> - <![CDATA[ Beginners&#39; Poker - Choosing an Online Poker Room ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/beginners-poker-choosing-a-room ]]> </url> </item> + <item> <id>105</id> - <title> - <![CDATA[ Beginners&#39; Poker - Choosing What Type of Poker to Play ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/beginners-poker-choosing-type-to-play ]]> </url> </item> + <item> <id>106</id> - <title> - <![CDATA[ Online Poker - Different Types of Online Poker ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/online-poker ]]> </url> </item> + <item> <id>109</id> - <title> - <![CDATA[ Online Poker - Opening an Account at an Online Poker Site ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/online-poker-opening-an-account ]]> </url> </item> + <item> <id>111</id> - <title> - <![CDATA[ Beginners&#39; Poker - Poker Glossary ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/beginners-poker-glossary ]]> </url> </item> + <item> <id>117</id> - <title> - <![CDATA[ Poker Betting - What is a Blind? ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/poker-betting-what-is-a-blind ]]> </url> </item> - <item> <id>118</id> - <title> - <![CDATA[ Poker Betting - What is an Ante? ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/poker-betting-what-is-an-ante ]]> </url> </item> + <item> <id>119</id> - <title> - <![CDATA[ Beginners Poker - What is Bluffing? ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/online-poker-what-is-bluffing ]]> </url> </item> - <item> <id>120</id> - <title> - <![CDATA[ Poker Games - What is Community Card Poker? ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/online-poker-what-is-community-card-poker ]]> </url> </item> - <item> <id>121</id> - <title> - <![CDATA[ Online Poker - What is Online Poker? ]]> </title> - <url> - <![CDATA[ /Guides/Online-Poker-Guide/Beginners-Poker/online-poker-what-is-online-poker ]]> </url> </item> </items> </item> </items> </item> </items> </item> </items> The XSL code: <?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" indent="yes"/> <xsl:template name="loop"> <xsl:for-each select="items/item"> <ul> <li><xsl:value-of select="@name" /></li> <xsl:if test="@name and child::node()"> <ul> <xsl:for-each select="items/item"> <li><xsl:value-of select="@name" />test</li> </xsl:for-each> </ul> <xsl:call-template name="loop" /> </xsl:if> <xsl:if test="child::node() and not(@name)"> <xsl:for-each select="/items"> <li><xsl:value-of select="id" /></li> </xsl:for-each> </xsl:if> </ul> </xsl:for-each> <xsl:for-each select="item/items/item"> <li>hi</li> </xsl:for-each> </xsl:template> <xsl:template match="/" name="test"> <xsl:call-template name="loop" /> </xsl:template> </xsl:stylesheet> Im trying to write the XSL so that every <items> node will render a <ul> and every <items> node will render an <li>. The XSL needs to be recursive because i cant tell how deep the nested nodes will go. Can anyone help? Regards, Al

    Read the article

  • How to Submit Form Given Specific Json Response

    - by dentalhero
    I'm new to Json, so please excuse the newb question. I have a form in which I'm conducting an Ajax post to submit address information to a backend script for validation. Here's the form: <form name="Form" id="Forms" method="post" action="WebCatPageServer.exe" class="uniForm"> <input name="Action" type="hidden" value="SHIPTOVALIDATE"/> <input name="IsAjax" type="hidden" value="Yes"/> <!-- <input name="Action" type="hidden" value="VerifyOrder"/>--> <fieldset class="inlineLabels top"> <h2>Order Details</h2> <div class="ctrlHolder first"> <label for="orderdesc">Order Description</label> <input name="Order Desc" id="OrderDesc" type="text" class="textInput small" tabindex="1" value=""/> </div> <div class="ctrlHolder"> <label for="po">PO # <span class="redasterisk">*</span></label> <input name="Cust Po" id="PoJobNo" type="text" class="textInput small required" maxlength="20" tabindex="2" value="dgnfg"/> </div> <!-- <div class="ctrlHolder"> <label for="jobname">Job Name</label> <input name="Job Name" id="CustJobName" type="text" class="textInput small" maxlength="15" tabindex="3" value=""/> </div> --> <div class="ctrlHolder"> <label for="shipvia">Ship Via <span class="redasterisk">*</span></label> <select name="Ship Via" id="shipvia" class="selectInput small required" tabindex="4"/> <option value="" class="default">Select Ship Method</option> <option value="OT - Our Truck" class="del" selected>Our Truck</option> <option value="WC - Will Call" class="pick">Will Call</option> </select> </div> <div class="ctrlHolder" id="pickupdate"> <label for="datepickup">Requested Pickup Date <span class="redasterisk">*</span></label> <input name="datepickup" id="datepickup" type="text" class="textInput small" tabindex="5" value="11/09/2012"> </div> <div class="ctrlHolder" id="shipdate"> <label for="dateship">Requested Delivery Date <span class="redasterisk">*</span></label> <input name="dateship" id="dateship" type="text" class="textInput small" value="" tabindex="6"> </div> <div class="ctrlHolder" id="shipto"> <label for="ShipTo">Ship To <span class="redasterisk">*</span></label> <select name="ShipTos" id="ShipTos" class="selectInput auto required" tabindex="7"> <option value="">Select an Option</option> <option value="ShipToManual" class="manual">Manually Enter Address</option> <option value="0">A ACTION AIR*, 5241 YANCEYVILLE, COLUMBIA, SC 29214-0001</option> <option value="1">A ACTION AIR*, 649 spring lane, sanford, NC 27330</option> <option value="2">A ACTION AIR*, 1313 south briggs avenue, durham, NC 27703</option> <option value="3">A ACTION AIR*, 112 cricket hill lane, cary, NC 27513</option> <option value="4">A ACTION AIR*, 2911 duke homestead road, durham, NC 27705</option> <option value="5">A ACTION AIR*, chickem poop, atlanta, GA 60609</option> </select> <br /> </div> </fieldset> <fieldset class="inlineLabels" id="shipinfo"> <h2>Shipping Information</h2> <div class="ctrlHolder first"> <label for="YourName">Your Name <span class="redasterisk">*</span></label> <input name="Your Name" id="Your_Name" type="text" class="textInput small required" tabindex="8" value="" /> </div> <div class="ctrlHolder"> <label for="CompanyName">Company Name <span class="redasterisk">*</span></label> <input name="Company Name" id="CompanyName" type="text" class="textInput small required" tabindex="9" value="A ACTION AIR*"/> </div> <div class="ctrlHolder"> <label for="Address1">Address 1 <span class="redasterisk">*</span></label> <input name="Address_1" id="Address_1" type="text" maxlength="30" class="textInput small required" tabindex="10" value="5241 YANCEYVILLE"/> </div> <div class="ctrlHolder"> <label for="Address2">Address 2</label> <input name="Address_2" id="Address_2" type="text" maxlength="30" class="textInput small" tabindex="11" value=""/> </div> <div class="ctrlHolder"> <label for="City">City <span class="redasterisk">*</span></label> <input name="City" id="City" type="text" maxlength="25" class="textInput small required" tabindex="12" value="COLUMBIA"/> </div> <div class="ctrlHolder"> <label for="State">State <span class="redasterisk">*</span></label> <select name="State" id="State" class="selectInput small required" tabindex="13"> <option value="">Select State</option> <option value="AL">Alabama</option> <option value="AK">Alaska</option> <option value="AZ">Arizona</option> <option value="AR">Arkansas</option> <option value="CA">California</option> <option value="CO">Colorado</option> <option value="CT">Connecticut</option> <option value="DE">Delaware</option> <option value="FL">Florida</option> <option value="GA">Georgia</option> <option value="HI">Hawaii</option> <option value="ID">Idaho</option> <option value="IL">Illinois</option> <option value="IN">Indiana</option> <option value="IA">Iowa</option> <option value="KS">Kansas</option> <option value="KY">Kentucky</option> <option value="LA">Louisiana</option> <option value="ME">Maine</option> <option value="MD">Maryland</option> <option value="MA">Massachussetts</option> <option value="MI">Michigan</option> <option value="MN">Minnesota</option> <option value="MS">Mississippi</option> <option value="MO">Missouri</option> <option value="MT">Montana</option> <option value="NE">Nebraska</option> <option value="NV">Nevada</option> <option value="NH">New Hampshire</option> <option value="NJ">New Jersey</option> <option value="NM">New Mexico</option> <option value="NY">New York</option> <option value="NC">North Carolina</option> <option value="ND">North Dakota</option> <option value="OH">Ohio</option> <option value="OK">Oklahoma</option> <option value="OR">Oregon</option> <option value="PA">Pennsylvania</option> <option value="RI">Rhode Island</option> <option value="SC" selected>South Carolina</option> <option value="SD">South Dakota</option> <option value="TN">Tennessee</option> <option value="TX">Texas</option> <option value="UT">Utah</option> <option value="VT">Vermont</option> <option value="VA">Virginia</option> <option value="WA">Washington</option> <option value="WV">West Virginia</option> <option value="WI">Wisconsin</option> <option value="WY">Wyoming</option> </select> </div> <div class="ctrlHolder"> <label for="ZipCode">Zip Code <span class="redasterisk">*</span></label> <input name="Zip" id="Zip" type="text" maxlength="10" class="textInput small required zipcode" tabindex="14" value=""/> </div> <div class="ctrlHolder"> <label for="Phone">Phone <span class="redasterisk">*</span></label> <input name="Phone Number" id="Phone" type="text" class="textInput small required phone" alt="phone-us" tabindex="15" value="(336)954-5009"/> </div> <div class="ctrlHolder"> <label for="Fax">Fax</label> <input name="FaxNumber" id="Fax Number" type="text" class="textInput small fax" alt="phone-us" tabindex="16" value=""/> </div> <div class="ctrlHolder"> <label for="">E-mail <span class="redasterisk">*</span></label> <input name="Email" id="Email" type="text" class="textInput small required email" tabindex="17" value=""/> </div> </fieldset> <fieldset class="inlineLabels"> <h2>Order/Shipping Notes</h2> <div class="ctrlHolder first"> <label for="notes">Order Notes </label> <textarea name="OrderNotes" id="ta" cols="26" rows="7" tabindex="18"></textarea><br /> <p class="formHint"><b>(Maximum characters: 175) &nbsp; <span id="charLeft"></span> &nbsp; Characters left</b><br /> (Cross streets, special instructions, etc.)</p> <br /> </div> </fieldset> <fieldset class="inlineLabels"> <h2>Continue To Next Step</h2> <div class="buttonHolder"> <label for="freightmsg">**Applicable freight charges will be applied at the time of invoicing.**</label> <input name="continuetocheckout" type="submit" class="button red smallrounded" value="Continue &gt;" alt="Continue to Next Step" tabindex="20"/> </div> </fieldset> </form> AJAX Call Here's the AJAX call: $(function() { $("#Forms").submit(function() { $.ajax({ type: 'post', url: 'WebCatPageServer.exe', dataType : 'json', data: $("#Forms").serialize(), complete:function(data){ alert(data); } }); return false; }); }); JSON Response Here's the JSON response: {"DidValidate":true,"Company Name":"A ACTION AIR*","AddrLine1":"5241 YANCEYVILLE","AddrLine2":"","City":"COLUMBIA","State":"SC","Zip":"","Modified":false,"AddressError":false,"ZipError":false} Question: How do I submit the form programatically if both AddressError and ZipError return with a false?

    Read the article

  • Please help! Every Post link links to the most recent post Wordpress

    - by kwek-kwek
    I got the site up on time, with one blog post up. Later I added another one and tested it. Big problem! Any link that used to take you to the old post (ie: side-bar "Recent Posts" links) now takes you to the newest one. I tested it by adding a third post, and got the same result. This is a custom wordpress theme and I have a, page.php <?php get_header(); ?> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <div id="BodyWrap"> <!--MAIN CONT--> <div id="mainCont"> <?php get_sidebar(); ?> <?php if (is_page(array('home'))) { ;?> <div id="rotateBanner"> <div id="slide-holder"> <div id="slide-runner"> <img id="slide-img-1" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial2.jpg" class="slide" alt="" /> <img id="slide-img-5" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial5.jpg" class="slide" alt="" /> <img id="slide-img-2" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial1.jpg" class="slide" alt="" /> <img id="slide-img-6" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial6.jpg" class="slide" alt="" /> <img id="slide-img-3" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial3.jpg" class="slide" alt="" /> <img id="slide-img-7" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial7.jpg" class="slide" alt="" /> <img id="slide-img-4" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial4.jpg" class="slide" alt="" /> <img id="slide-img-8" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial8.jpg" class="slide" alt="" /> <div id="slide-controls"> <p id="slide-client" class="text" style="display:none;"><span></span></p> <p id="slide-desc" class="text" style="display:none;"></p> <p id="slide-nav" style="display:none;"></p> </div> </div> <script type="text/javascript"> if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-5","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-6","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-3","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-7","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-4","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-8","client":"nature beauty","desc":"nature beauty photography"}]; </script> </div> </div> <?php } ?> <?php if (is_page(array('accueil'))) { ;?> <div id="rotateBanner"> <div id="slide-holder"> <div id="slide-runner"> <img id="slide-img-1" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial1-fr.jpg" class="slide" alt="" /> <img id="slide-img-5" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial5-fr.jpg" class="slide" alt="" /> <img id="slide-img-2" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial2-fr.jpg" class="slide" alt="" /> <img id="slide-img-6" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial6-fr.jpg" class="slide" alt="" /> <img id="slide-img-3" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial3-fr.jpg" class="slide" alt="" /> <img id="slide-img-7" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial7-fr.jpg" class="slide" alt="" /> <img id="slide-img-4" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial4-fr.jpg" class="slide" alt="" /> <img id="slide-img-8" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial8-fr.jpg" class="slide" alt="" /> <div id="slide-controls"> <p id="slide-client" class="text" style="display:none;"><span></span></p> <p id="slide-desc" class="text" style="display:none;"></p> <p id="slide-nav" style="display:none;"></p> </div> </div> <script type="text/javascript"> if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-5","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-6","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-3","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-7","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-4","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-8","client":"nature beauty","desc":"nature beauty photography"}]; </script> </div> </div> <?php } ?> <?php if (is_page(array('contact-us'))) { ;?> <div id="rotateBanner"> <?php custom_field_image() ?> </div> <?php } ?> <div id="mainCopy"> <div id="content"> <h2> <?php if (is_page('home','accueil')) : ?> <?php else : ?> <?php single_post_title(); ?> <?php endif; ?></h2> <?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?> <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?> </div> </div> <?php if (is_page(array('home','accueil'))) { ;?> <div id="rightCol2"> <div id="Fworks"> <h2>Featured work</h2> <li><img src="<?php bloginfo('template_url'); ?>/images/portage-thumb.jpg" width="234" height="92" border="0" alt="" /></li> <li><a href="<?php bloginfo('url'); ?>our-work/foundation-on-antivirals"><img src="<?php bloginfo('template_url'); ?>/images/fav-thumb.jpg" width="234" height="92" border="0" alt="" /></a></li> <li><img src="<?php bloginfo('template_url'); ?>/images/danslejardin-thumb.jpg" width="234" height="92" border="0" alt="" /></li> </div> <div id="NewEvents"> <?php if ( (strtolower(ICL_LANGUAGE_CODE) == 'en') ) {echo("<h2>News &amp; Events</h2");} ?> <?php if ( (strtolower(ICL_LANGUAGE_CODE) == 'fr')) echo("<h2>Nouvelles</h2") ?> <div id="NewsListings"> <ul> <?php //dbem_get_events_list("limit=5&scope=al&order=DESC"); ?> <?php include('events.php');?> </ul> </div> </div> </div> <?php } ?> </div> </div> <?php endwhile; endif; ?> <?php get_footer(); ?> single.php <?php /** * @package WordPress * @subpackage Default_Theme */ get_header(); ?> <div id="BodyWrap"> <!--MAIN CONT--> <div id="mainCont"> <?php get_sidebar(); ?> <?php if (is_page(array('home','contact-us'))) { ;?> <div id="rotateBanner"> <?php custom_field_image() ?> </div> <?php } ?> <div id="mainCopy"> <div id="content" class="widecolumn" role="main"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <!-- <div class="navigation"> <div class="alignleft"><?php previous_post_link('&laquo; %link') ?></div> <div class="alignright"><?php next_post_link('%link &raquo;') ?></div> </div> <br class="clr" />--> <div <?php post_class() ?> id="post-<?php the_ID(); ?>"> <h2><?php the_title(); ?></h2> <div class="entry"> <?php the_content('<p class="serif">Read the rest of this entry &raquo;</p>'); ?> <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?> <?php the_tags( '<p>Tags: ', ', ', '</p>'); ?> <!--<p class="postmetadata alt"> <small> This entry was posted <?php /* This is commented, because it requires a little adjusting sometimes. You'll need to download this plugin, and follow the instructions: http://binarybonsai.com/wordpress/time-since/ */ /* $entry_datetime = abs(strtotime($post->post_date) - (60*120)); echo time_since($entry_datetime); echo ' ago'; */ ?> on <?php the_time('l, F jS, Y') ?> at <?php the_time() ?> and is filed under <?php the_category(', ') ?>. You can follow any responses to this entry through the <?php post_comments_feed_link('RSS 2.0'); ?> feed. <?php if ( comments_open() && pings_open() ) { // Both Comments and Pings are open ?> You can <a href="#respond">leave a response</a>, or <a href="<?php trackback_url(); ?>" rel="trackback">trackback</a> from your own site. <?php } elseif ( !comments_open() && pings_open() ) { // Only Pings are Open ?> Responses are currently closed, but you can <a href="<?php trackback_url(); ?> " rel="trackback">trackback</a> from your own site. <?php } elseif ( comments_open() && !pings_open() ) { // Comments are open, Pings are not ?> You can skip to the end and leave a response. Pinging is currently not allowed. <?php } elseif ( !comments_open() && !pings_open() ) { // Neither Comments, nor Pings are open ?> Both comments and pings are currently closed. <?php } edit_post_link('Edit this entry','','.'); ?> </small> </p>--> </div> </div> <?php comments_template(); ?> <?php endwhile; else: ?> <p>Sorry, no posts matched your criteria.</p> <?php endif; ?> </div> </div> </div> </div> <?php get_footer(); ?> index.php <?php get_header(); ?> <!--MAIN WRAP--> <div id="BodyWrap"> <!--MAIN CONT--> <div id="mainCont"> <?php get_sidebar(); ?> <div id="mainCopy"> <div id="content"> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div id="BGHeadTitle"><h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2></div> <?php the_content(); ?> <p><?php the_time('F j, Y'); ?> at <?php the_time('g:i a'); ?> | <?php the_category(', '); ?> | <?php comments_number('No comment', '1 comment', '% comments'); ?></p> <?php comments_template(); // Get wp-comments.php template ?> <?php endwhile; else: ?> <h2>Woops...</h2> <p>Sorry, no posts we're found.</p> <?php endif; ?> <p align="center"><?php posts_nav_link(); ?></p> </div> </div> </div> </div> <?php get_footer(); ?> my recent post code : <ul> <?php query_posts('cat=3,4,5&posts_per_page=5&order=ASC&orderby=date'); if ( have_posts() ) : while ( have_posts() ) : the_post()?> <li> <span class="date"><?php the_time('M j') ?></span> <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a> </li> <?php endwhile; ?> <?php rewind_posts(); ?> </ul> I am really stuck the site went live and when I was working on the testserver I only noticed it.view the site here »

    Read the article

  • problem with google chrome

    - by user365559
    hi. i have javscript file for history management.IT is not supported by chrome when i am trying to navigate to back page with backbutton in the browser.I can see the url change but it doesnt go to preceeding page. BrowserHistoryUtils = { addEvent: function(elm, evType, fn, useCapture) { useCapture = useCapture || false; if (elm.addEventListener) { elm.addEventListener(evType, fn, useCapture); return true; } else if (elm.attachEvent) { var r = elm.attachEvent('on' + evType, fn); return r; } else { elm['on' + evType] = fn; } } } BrowserHistory = (function() { // type of browser var browser = { ie: false, firefox: false, safari: false, opera: false, version: -1 }; // if setDefaultURL has been called, our first clue // that the SWF is ready and listening //var swfReady = false; // the URL we'll send to the SWF once it is ready //var pendingURL = ''; // Default app state URL to use when no fragment ID present var defaultHash = ''; // Last-known app state URL var currentHref = document.location.href; // Initial URL (used only by IE) var initialHref = document.location.href; // Initial URL (used only by IE) var initialHash = document.location.hash; // History frame source URL prefix (used only by IE) var historyFrameSourcePrefix = 'history/historyFrame.html?'; // History maintenance (used only by Safari) var currentHistoryLength = -1; var historyHash = []; var initialState = createState(initialHref, initialHref + '#' + initialHash, initialHash); var backStack = []; var forwardStack = []; var currentObjectId = null; //UserAgent detection var useragent = navigator.userAgent.toLowerCase(); if (useragent.indexOf("opera") != -1) { browser.opera = true; } else if (useragent.indexOf("msie") != -1) { browser.ie = true; browser.version = parseFloat(useragent.substring(useragent.indexOf('msie') + 4)); } else if (useragent.indexOf("safari") != -1) { browser.safari = true; browser.version = parseFloat(useragent.substring(useragent.indexOf('safari') + 7)); } else if (useragent.indexOf("gecko") != -1) { browser.firefox = true; } if (browser.ie == true && browser.version == 7) { window["_ie_firstload"] = false; } // Accessor functions for obtaining specific elements of the page. function getHistoryFrame() { return document.getElementById('ie_historyFrame'); } function getAnchorElement() { return document.getElementById('firefox_anchorDiv'); } function getFormElement() { return document.getElementById('safari_formDiv'); } function getRememberElement() { return document.getElementById("safari_remember_field"); } // Get the Flash player object for performing ExternalInterface callbacks. // Updated for changes to SWFObject2. function getPlayer(id) { if (id && document.getElementById(id)) { var r = document.getElementById(id); if (typeof r.SetVariable != "undefined") { return r; } else { var o = r.getElementsByTagName("object"); var e = r.getElementsByTagName("embed"); if (o.length > 0 && typeof o[0].SetVariable != "undefined") { return o[0]; } else if (e.length > 0 && typeof e[0].SetVariable != "undefined") { return e[0]; } } } else { var o = document.getElementsByTagName("object"); var e = document.getElementsByTagName("embed"); if (e.length > 0 && typeof e[0].SetVariable != "undefined") { return e[0]; } else if (o.length > 0 && typeof o[0].SetVariable != "undefined") { return o[0]; } else if (o.length > 1 && typeof o[1].SetVariable != "undefined") { return o[1]; } } return undefined; } function getPlayers() { var players = []; if (players.length == 0) { var tmp = document.getElementsByTagName('object'); players = tmp; } if (players.length == 0 || players[0].object == null) { var tmp = document.getElementsByTagName('embed'); players = tmp; } return players; } function getIframeHash() { var doc = getHistoryFrame().contentWindow.document; var hash = String(doc.location.search); if (hash.length == 1 && hash.charAt(0) == "?") { hash = ""; } else if (hash.length >= 2 && hash.charAt(0) == "?") { hash = hash.substring(1); } return hash; } /* Get the current location hash excluding the '#' symbol. */ function getHash() { // It would be nice if we could use document.location.hash here, // but it's faulty sometimes. var idx = document.location.href.indexOf('#'); return (idx >= 0) ? document.location.href.substr(idx+1) : ''; } /* Get the current location hash excluding the '#' symbol. */ function setHash(hash) { // It would be nice if we could use document.location.hash here, // but it's faulty sometimes. if (hash == '') hash = '#' document.location.hash = hash; } function createState(baseUrl, newUrl, flexAppUrl) { return { 'baseUrl': baseUrl, 'newUrl': newUrl, 'flexAppUrl': flexAppUrl, 'title': null }; } /* Add a history entry to the browser. * baseUrl: the portion of the location prior to the '#' * newUrl: the entire new URL, including '#' and following fragment * flexAppUrl: the portion of the location following the '#' only */ function addHistoryEntry(baseUrl, newUrl, flexAppUrl) { //delete all the history entries forwardStack = []; if (browser.ie) { //Check to see if we are being asked to do a navigate for the first //history entry, and if so ignore, because it's coming from the creation //of the history iframe if (flexAppUrl == defaultHash && document.location.href == initialHref && window['_ie_firstload']) { currentHref = initialHref; return; } if ((!flexAppUrl || flexAppUrl == defaultHash) && window['_ie_firstload']) { newUrl = baseUrl + '#' + defaultHash; flexAppUrl = defaultHash; } else { // for IE, tell the history frame to go somewhere without a '#' // in order to get this entry into the browser history. getHistoryFrame().src = historyFrameSourcePrefix + flexAppUrl; } setHash(flexAppUrl); } else { //ADR if (backStack.length == 0 && initialState.flexAppUrl == flexAppUrl) { initialState = createState(baseUrl, newUrl, flexAppUrl); } else if(backStack.length > 0 && backStack[backStack.length - 1].flexAppUrl == flexAppUrl) { backStack[backStack.length - 1] = createState(baseUrl, newUrl, flexAppUrl); } if (browser.safari) { // for Safari, submit a form whose action points to the desired URL if (browser.version <= 419.3) { var file = window.location.pathname.toString(); file = file.substring(file.lastIndexOf("/")+1); getFormElement().innerHTML = '<form name="historyForm" action="'+file+'#' + flexAppUrl + '" method="GET"></form>'; //get the current elements and add them to the form var qs = window.location.search.substring(1); var qs_arr = qs.split("&"); for (var i = 0; i < qs_arr.length; i++) { var tmp = qs_arr[i].split("="); var elem = document.createElement("input"); elem.type = "hidden"; elem.name = tmp[0]; elem.value = tmp[1]; document.forms.historyForm.appendChild(elem); } document.forms.historyForm.submit(); } else { top.location.hash = flexAppUrl; } // We also have to maintain the history by hand for Safari historyHash[history.length] = flexAppUrl; _storeStates(); } else { // Otherwise, write an anchor into the page and tell the browser to go there addAnchor(flexAppUrl); setHash(flexAppUrl); } } backStack.push(createState(baseUrl, newUrl, flexAppUrl)); } function _storeStates() { if (browser.safari) { getRememberElement().value = historyHash.join(","); } } function handleBackButton() { //The "current" page is always at the top of the history stack. var current = backStack.pop(); if (!current) { return; } var last = backStack[backStack.length - 1]; if (!last && backStack.length == 0){ last = initialState; } forwardStack.push(current); } function handleForwardButton() { //summary: private method. Do not call this directly. var last = forwardStack.pop(); if (!last) { return; } backStack.push(last); } function handleArbitraryUrl() { //delete all the history entries forwardStack = []; } /* Called periodically to poll to see if we need to detect navigation that has occurred */ function checkForUrlChange() { if (browser.ie) { if (currentHref != document.location.href && currentHref + '#' != document.location.href) { //This occurs when the user has navigated to a specific URL //within the app, and didn't use browser back/forward //IE seems to have a bug where it stops updating the URL it //shows the end-user at this point, but programatically it //appears to be correct. Do a full app reload to get around //this issue. if (browser.version < 7) { currentHref = document.location.href; document.location.reload(); } else { if (getHash() != getIframeHash()) { // this.iframe.src = this.blankURL + hash; var sourceToSet = historyFrameSourcePrefix + getHash(); getHistoryFrame().src = sourceToSet; } } } } if (browser.safari) { // For Safari, we have to check to see if history.length changed. if (currentHistoryLength >= 0 && history.length != currentHistoryLength) { //alert("did change: " + history.length + ", " + historyHash.length + "|" + historyHash[history.length] + "|>" + historyHash.join("|")); // If it did change, then we have to look the old state up // in our hand-maintained array since document.location.hash // won't have changed, then call back into BrowserManager. currentHistoryLength = history.length; var flexAppUrl = historyHash[currentHistoryLength]; if (flexAppUrl == '') { //flexAppUrl = defaultHash; } //ADR: to fix multiple if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { var pl = getPlayers(); for (var i = 0; i < pl.length; i++) { pl[i].browserURLChange(flexAppUrl); } } else { getPlayer().browserURLChange(flexAppUrl); } _storeStates(); } } if (browser.firefox) { if (currentHref != document.location.href) { var bsl = backStack.length; var urlActions = { back: false, forward: false, set: false } if ((window.location.hash == initialHash || window.location.href == initialHref) && (bsl == 1)) { urlActions.back = true; // FIXME: could this ever be a forward button? // we can't clear it because we still need to check for forwards. Ugg. // clearInterval(this.locationTimer); handleBackButton(); } // first check to see if we could have gone forward. We always halt on // a no-hash item. if (forwardStack.length > 0) { if (forwardStack[forwardStack.length-1].flexAppUrl == getHash()) { urlActions.forward = true; handleForwardButton(); } } // ok, that didn't work, try someplace back in the history stack if ((bsl >= 2) && (backStack[bsl - 2])) { if (backStack[bsl - 2].flexAppUrl == getHash()) { urlActions.back = true; handleBackButton(); } } if (!urlActions.back && !urlActions.forward) { var foundInStacks = { back: -1, forward: -1 } for (var i = 0; i < backStack.length; i++) { if (backStack[i].flexAppUrl == getHash() && i != (bsl - 2)) { arbitraryUrl = true; foundInStacks.back = i; } } for (var i = 0; i < forwardStack.length; i++) { if (forwardStack[i].flexAppUrl == getHash() && i != (bsl - 2)) { arbitraryUrl = true; foundInStacks.forward = i; } } handleArbitraryUrl(); } // Firefox changed; do a callback into BrowserManager to tell it. currentHref = document.location.href; var flexAppUrl = getHash(); if (flexAppUrl == '') { //flexAppUrl = defaultHash; } //ADR: to fix multiple if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { var pl = getPlayers(); for (var i = 0; i < pl.length; i++) { pl[i].browserURLChange(flexAppUrl); } } else { getPlayer().browserURLChange(flexAppUrl); } } } //setTimeout(checkForUrlChange, 50); } /* Write an anchor into the page to legitimize it as a URL for Firefox et al. */ function addAnchor(flexAppUrl) { if (document.getElementsByName(flexAppUrl).length == 0) { getAnchorElement().innerHTML += "<a name='" + flexAppUrl + "'>" + flexAppUrl + "</a>"; } } var _initialize = function () { if (browser.ie) { var scripts = document.getElementsByTagName('script'); for (var i = 0, s; s = scripts[i]; i++) { if (s.src.indexOf("history.js") > -1) { var iframe_location = (new String(s.src)).replace("history.js", "historyFrame.html"); } } historyFrameSourcePrefix = iframe_location + "?"; var src = historyFrameSourcePrefix; var iframe = document.createElement("iframe"); iframe.id = 'ie_historyFrame'; iframe.name = 'ie_historyFrame'; //iframe.src = historyFrameSourcePrefix; try { document.body.appendChild(iframe); } catch(e) { setTimeout(function() { document.body.appendChild(iframe); }, 0); } } if (browser.safari) { var rememberDiv = document.createElement("div"); rememberDiv.id = 'safari_rememberDiv'; document.body.appendChild(rememberDiv); rememberDiv.innerHTML = '<input type="text" id="safari_remember_field" style="width: 500px;">'; var formDiv = document.createElement("div"); formDiv.id = 'safari_formDiv'; document.body.appendChild(formDiv); var reloader_content = document.createElement('div'); reloader_content.id = 'safarireloader'; var scripts = document.getElementsByTagName('script'); for (var i = 0, s; s = scripts[i]; i++) { if (s.src.indexOf("history.js") > -1) { html = (new String(s.src)).replace(".js", ".html"); } } reloader_content.innerHTML = '<iframe id="safarireloader-iframe" src="about:blank" frameborder="no" scrolling="no"></iframe>'; document.body.appendChild(reloader_content); reloader_content.style.position = 'absolute'; reloader_content.style.left = reloader_content.style.top = '-9999px'; iframe = reloader_content.getElementsByTagName('iframe')[0]; if (document.getElementById("safari_remember_field").value != "" ) { historyHash = document.getElementById("safari_remember_field").value.split(","); } } if (browser.firefox) { var anchorDiv = document.createElement("div"); anchorDiv.id = 'firefox_anchorDiv'; document.body.appendChild(anchorDiv); } //setTimeout(checkForUrlChange, 50); } return { historyHash: historyHash, backStack: function() { return backStack; }, forwardStack: function() { return forwardStack }, getPlayer: getPlayer, initialize: function(src) { _initialize(src); }, setURL: function(url) { document.location.href = url; }, getURL: function() { return document.location.href; }, getTitle: function() { return document.title; }, setTitle: function(title) { try { backStack[backStack.length - 1].title = title; } catch(e) { } //if on safari, set the title to be the empty string. if (browser.safari) { if (title == "") { try { var tmp = window.location.href.toString(); title = tmp.substring((tmp.lastIndexOf("/")+1), tmp.lastIndexOf("#")); } catch(e) { title = ""; } } } document.title = title; }, setDefaultURL: function(def) { defaultHash = def; def = getHash(); //trailing ? is important else an extra frame gets added to the history //when navigating back to the first page. Alternatively could check //in history frame navigation to compare # and ?. if (browser.ie) { window['_ie_firstload'] = true; var sourceToSet = historyFrameSourcePrefix + def; var func = function() { getHistoryFrame().src = sourceToSet; window.location.replace("#" + def); setInterval(checkForUrlChange, 50); } try { func(); } catch(e) { window.setTimeout(function() { func(); }, 0); } } if (browser.safari) { currentHistoryLength = history.length; if (historyHash.length == 0) { historyHash[currentHistoryLength] = def; var newloc = "#" + def; window.location.replace(newloc); } else { //alert(historyHash[historyHash.length-1]); } //setHash(def); setInterval(checkForUrlChange, 50); } if (browser.firefox || browser.opera) { var reg = new RegExp("#" + def + "$"); if (window.location.toString().match(reg)) { } else { var newloc ="#" + def; window.location.replace(newloc); } setInterval(checkForUrlChange, 50); //setHash(def); } }, /* Set the current browser URL; called from inside BrowserManager to propagate * the application state out to the container. */ setBrowserURL: function(flexAppUrl, objectId) { if (browser.ie && typeof objectId != "undefined") { currentObjectId = objectId; } //fromIframe = fromIframe || false; //fromFlex = fromFlex || false; //alert("setBrowserURL: " + flexAppUrl); //flexAppUrl = (flexAppUrl == "") ? defaultHash : flexAppUrl ; var pos = document.location.href.indexOf('#'); var baseUrl = pos != -1 ? document.location.href.substr(0, pos) : document.location.href; var newUrl = baseUrl + '#' + flexAppUrl; if (document.location.href != newUrl && document.location.href + '#' != newUrl) { currentHref = newUrl; addHistoryEntry(baseUrl, newUrl, flexAppUrl); currentHistoryLength = history.length; } return false; }, browserURLChange: function(flexAppUrl) { var objectId = null; if (browser.ie && currentObjectId != null) { objectId = currentObjectId; } pendingURL = ''; if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { var pl = getPlayers(); for (var i = 0; i < pl.length; i++) { try { pl[i].browserURLChange(flexAppUrl); } catch(e) { } } } else { try { getPlayer(objectId).browserURLChange(flexAppUrl); } catch(e) { } } currentObjectId = null; } } })(); // Initialization // Automated unit testing and other diagnostics function setURL(url) { document.location.href = url; } function backButton() { history.back(); } function forwardButton() { history.forward(); } function goForwardOrBackInHistory(step) { history.go(step); } //BrowserHistoryUtils.addEvent(window, "load", function() { BrowserHistory.initialize(); }); (function(i) { var u =navigator.userAgent;var e=/*@cc_on!@*/false; var st = setTimeout; if(/webkit/i.test(u)){ st(function(){ var dr=document.readyState; if(dr=="loaded"||dr=="complete"){i()} else{st(arguments.callee,10);}},10); } else if((/mozilla/i.test(u)&&!/(compati)/.test(u)) || (/opera/i.test(u))){ document.addEventListener("DOMContentLoaded",i,false); } else if(e){ (function(){ var t=document.createElement('doc:rdy'); try{t.doScroll('left'); i();t=null; }catch(e){st(arguments.callee,0);}})(); } else{ window.onload=i; } })( function() {BrowserHistory.initialize();} );

    Read the article

  • In Email, Image (img) Source (src) Tags are rewritten as relative links. How to fix?

    - by Noah Goodrich
    I'm working on sending out an html based email, and every time it sends the image src tags and some of the anchor href tags are modified to be relative url's. Update 2: This is happening between when the body of the email is generated and sent and when it arrives in my inbox. Update: I am using Postfix on a LAMPP server. In addition, I am using Zend_Mail to send the emails out. For example, I have a link: src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/header.jpg" And it gets rewritten as: src="../../../../images/email/highpoint_2009_04/header.jpg" What can cause this to occur and how is it corrected? Email headers: Return-Path: <[email protected]> X-Original-To: [email protected] Delivered-To: [email protected] Received: by mail.example.com (Postfix, from userid 0) id 6BF012252; Tue, 14 Apr 2009 12:15:20 -0600 (MDT) To: Gabriel <[email protected]> Subject: Free Map to Sales Success From: Somebody <[email protected]> Date: Tue, 14 Apr 2009 12:15:20 -0600 Content-Type: text/html; charset="utf-8" Content-Transfer-Encoding: multipart/related Content-Disposition: inline Message-Id: <[email protected]> Original content to be sent out: <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td valign="top"> <a href="http://www.furnituretrainingcompany.com"> <img moz-do-not-send="true" alt="The Furniture Training Company - Know More. Sell More." src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/header.jpg" border="0" height="123" width="600"> </a> </td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td valign="top"><img alt="Visit us at High Point to receive your free training poster" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/hero.jpg" moz-do-not-send="true" height="150" width="600"><br> </td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer_content_left.jpg" moz-do-not-send="true" height="30" width="30"><br> </td> <td bgcolor="#ffffff" valign="top"><font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" color="#000000" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><big><small><big><b>See you at Market</b></big><br> </small></big></big></big></big></font> <font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" color="#000000" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><big><small><br> </small></big></big></big></big></font><small><font face="Helvetica, Arial, sans-serif">Visit our space to get your free Map to Sales Success poster! This unique 24 X 36 color poster is your guide to developing high volume salespeople with larger tickets. Find us in the new NHFA Retailer Resource Center located in the Plaza. <br> <br> Don&#8217;t miss Mark Lacy&#8217;s entertaining seminar "Help Wanted! My Sales Associates Can&#8217;t Sell Water to a Thirsty Camel." He&#8217;ll reveal powerful secrets for turning sales associates into furniture experts that will sell. See him Saturday, April 25th at 11:30 AM in the seminar room of the new NHFA Retail Resource Center in the Plaza. <br> <br> Stop by our space to learn how our ingenious internet-delivered training courses are easy to use, guaranteed to work, and cheaper than the daily donuts. Over 95% report increased sales. <br> <br> Plan to see us at High Point. </font></small> <font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" color="#000000" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><big><small><small><br> <br> <br> <br> </small></small></big></big></big></big></font><small><font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" color="#000000" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><small> </small></big></big></big></font></small> <a href="http://www.furnituretrainingcompany.com/map"><img alt="Find out more" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/image_content_left.jpg" moz-do-not-send="true" border="0" height="67" width="326"></a><br> <br> </td> <td bgcolor="#ffffff" valign="top"> <img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer_content_middle.jpg" moz-do-not-send="true" height="28" width="28"><br> </td> <td bgcolor="#ffffff" valign="top"><img alt="Roadmap to Sales Success poster" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/image_content_right.jpg" moz-do-not-send="true" height="267" width="186"><br> <font face="Helvetica, Arial, sans-serif"><small><font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" color="#000000" size="1"><big><big><big><small><b>Road Map to Sales Success<br> </b><br> </small></big></big></big></font>This beautiful poster is yours free for simply stopping by and visiting with us at High Point. <span class="moz-txt-slash">Our space is located inside the </span>new NHFA Retailer Resource Center in the Plaza Suites, 222 South Main St, 1st Floor. We will be at market from Sat April 25th until Thur April 30th. </small></font><br> </td> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer_content_right.jpg" moz-do-not-send="true" height="30" width="30"><br> <br> </td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/disclaimer_divider.jpg" moz-do-not-send="true" height="25" width="600"><br> </td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer_disclaimer_left.jpg" moz-do-not-send="true"></td> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer_disclaimer_middle.jpg" moz-do-not-send="true"><br> <font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" color="#666666" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><big><small><small><small>If you are not attending the High Point market in April but would still like to receive a free Road Map to Sales Success poster visit us on the web at <u><a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="http://www.furnituretrainingcompany.com">www.furnituretrainingcompany.com</a></u>, or to speak with a Furniture Training Company representative, call toll free (866) 755-5996. We do not offer free shipping outside of the U.S. and Canada. Retailers outside of the U.S. and Canada may call for more information. Limit one free Road Map to Sales Success per company. Other copies of the poster may be purchased on our web site.<br> <br> </small></small></small></big></big></big></big></font> <font color="#666666"><small><font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><small><small>We hope you found this message to be useful. However, if you'd rather not receive future emails of this sort from The Furniture Training Company, please <a moz-do-not-send="true" href="http://www.furnituretraining.com/contact">click here to unsubscribe</a>.<br> <br> </small></small></big></big></big></font></small><small><font originaltag="yes" style="font-size: 9px; font-family: Verdana,Arial,Helvetica,sans-serif;" face="Verdana, Arial, Helvetica, sans-serif" size="1"><big><big><big><small><small>&copy;Copyright 2009 The Furniture Training Company.<br> 1770 North Research Park Way, <br> North Logan, UT 84341. <br> All Rights Reserved.</small></small></big></big></big></font></small></font><br> </td> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer_disclaimer_right.jpg" moz-do-not-send="true"></td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td bgcolor="#ffffff" valign="top"><img alt="" src="http://www.furnituretrainingcompany.com/images/email/highpoint_2009_04/footer.jpg" moz-do-not-send="true"> </td> </tr> </tbody> </table> <br> <br> Content that gets sent: <table border=3D"0" cellspacing=3D"0" cellpadding=3D"0" width=3D"600" al= ign=3D"center">=0D=0A<tbody>=0D=0A<tr>=0D=0A<td valign=3D"top"><a href= =3D"http://www.furnituretrainingcompany.com"> <img src=3D"http://www.fur= nituretrainingcompany.com/images/email/highpoint_2009_04/header.jpg" bor= der=3D"0" alt=3D"The Furniture Training Company - Know More. Sell More."= width=3D"600" height=3D"123" /> </a></td>=0D=0A</tr>=0D=0A</tbody>=0D= =0A</table>=0D=0A<table border=3D"0" cellspacing=3D"0" cellpadding=3D"0"= width=3D"600" align=3D"center">=0D=0A<tbody>=0D=0A<tr>=0D=0A<td valign= =3D"top"><img src=3D"http://www.furnituretrainingcompany.com/images/emai= l/highpoint_2009_04/hero.jpg" alt=3D"Visit us at High Point to receive y= our free training poster" width=3D"600" height=3D"150" /><br /></td>=0D= =0A</tr>=0D=0A</tbody>=0D=0A</table>=0D=0A<table border=3D"0" cellspacin= g=3D"0" cellpadding=3D"0" width=3D"600" align=3D"center">=0D=0A<tbody>= =0D=0A<tr>=0D=0A<td valign=3D"top" bgcolor=3D"#ffffff"><img src=3D"http:= //www.furnituretrainingcompany.com/images/email/highpoint_2009_04/spacer= _content_left.jpg" alt=3D"" width=3D"30" height=3D"30" /><br /></td>=0D= =0A<td valign=3D"top" bgcolor=3D"#ffffff"><span style=3D"font-size: xx-s= mall; font-family: Verdana,Arial,Helvetica,sans-serif; color: #000000;">= <big><big><big><big><small><big><strong>See you at Market</strong></big>= <br /> </small></big></big></big></big></span> <span style=3D"font-size:= xx-small; font-family: Verdana,Arial,Helvetica,sans-serif; color: #0000= 00;"><big><big><big><big><small><br /> </small></big></big></big></big><= /span><small><span style=3D"font-family: Helvetica,Arial,sans-serif;">Vi= sit our space to get your free Map to Sales Success poster! This unique= 24 X 36 color poster is your guide to developing high volume salespeopl= e with larger tickets. Find us in the new NHFA Retailer Resource Center= located in the Plaza. <br /> <br /> Don&rsquo;t miss Mark Lacy&rsquo;s= entertaining seminar "Help Wanted! My Sales Associates Can&rsquo;t Sell= Water to a Thirsty Camel." He&rsquo;ll reveal powerful secrets for turn= ing sales associates into furniture experts that will sell. See him Satu= rday, April 25th at 11:30 AM in the seminar room of the new NHFA Retail= Resource Center in the Plaza. <br /> <br /> Stop by our space to learn= how our ingenious internet-delivered training courses are easy to use,= guaranteed to work, and cheaper than the daily donuts. Over 95% report= increased sales. <br /> <br /> Plan to see us at High Point. </span></s= mall> <span style=3D"font-size: xx-small; font-family: Verdana,Arial,Hel= vetica,sans-serif; color: #000000;"><big><big><big><big><small><small><b= r /> <br /> <br /> <br /> </small></small></big></big></big></big></span= ><small><span style=3D"font-size: xx-small; font-family: Verdana,Arial,H= elvetica,sans-serif; color: #000000;"><big><big><big><small> </small></b= ig></big></big></span></small> <a href=3D"http://www.furnituretrainingco= mpany.com/map"><img src=3D"http://www.furnituretrainingcompany.com/image= s/email/highpoint_2009_04/image_content_left.jpg" border=3D"0" alt=3D"Fi= nd out more" width=3D"326" height=3D"67" /></a><br /> <br /></td>=0D=0A<= td valign=3D"top" bgcolor=3D"#ffffff"><img src=3D"http://www.furnituretr= ainingcompany.com/images/email/highpoint_2009_04/spacer_content_middle.j= pg" alt=3D"" width=3D"28" height=3D"28" /><br /></td>=0D=0A<td valign=3D= "top" bgcolor=3D"#ffffff"><img src=3D"http://www.furnituretrainingcompan= y.com/images/email/highpoint_2009_04/image_content_right.jpg" alt=3D"Roa= dmap to Sales Success poster" width=3D"186" height=3D"267" /><br /> <spa= n style=3D"font-family: Helvetica,Arial,sans-serif;"><small><span style= =3D"font-size: xx-small; color: #000000;"><big><big><big><small><strong>= Road Map to Sales Success<br /> </strong><br /> </small></big></big></bi= g></span>This beautiful poster is yours free for simply stopping by and= visiting with us at High Point. <span class=3D"moz-txt-slash">Our space= is located inside the </span>new NHFA Retailer Resource Center in the P= laza Suites, 222 South Main St, 1st Floor. We will be at market from Sat= April 25th until Thur April 30th. </small></span><br /></td>=0D=0A<td v= align=3D"top" bgcolor=3D"#ffffff"><img src=3D"http://www.furnituretraini= ngcompany.com/images/email/highpoint_2009_04/spacer_content_right.jpg" a= lt=3D"" width=3D"30" height=3D"30" /><br /> <br /></td>=0D=0A</tr>=0D=0A= </tbody>=0D=0A</table>=0D=0A<table border=3D"0" cellspacing=3D"0" cellpa= dding=3D"0" width=3D"600" align=3D"center">=0D=0A<tbody>=0D=0A<tr>=0D=0A= <td valign=3D"top" bgcolor=3D"#ffffff"><img src=3D"http://www.furnituret= rainingcompany.com/images/email/highpoint_2009_04/disclaimer_divider.jpg= " alt=3D"" width=3D"600" height=3D"25" /><br /></td>=0D=0A</tr>=0D=0A</t= body>=0D=0A</table>=0D=0A<table border=3D"0" cellspacing=3D"0" cellpaddi= ng=3D"0" width=3D"600" align=3D"center">=0D=0A<tbody>=0D=0A<tr>=0D=0A<td= valign=3D"top" bgcolor=3D"#ffffff"><img src=3D"http://www.furnituretrai= ningcompany.com/images/email/highpoint_2009_04/spacer_disclaimer_left.jp= g" alt=3D"" /></td>=0D=0A<td valign=3D"top" bgcolor=3D"#ffffff"><img src= =3D"http://www.furnituretrainingcompany.com/images/email/highpoint_2009_= 04/spacer_disclaimer_middle.jpg" alt=3D"" /><br /> <span style=3D"font-s= ize: xx-small; font-family: Verdana,Arial,Helvetica,sans-serif; color: #= 666666;"><big><big><big><big><small><small><small>If you are not attendi= ng the High Point market in April but would still like to receive a free= Road Map to Sales Success poster visit us on the web at <span style=3D"= text-decoration: underline;"><a class=3D"moz-txt-link-abbreviated" href= =3D"http://www.furnituretrainingcompany.com">www.furnituretrainingcompan= y.com</a></span>, or to speak with a Furniture Training Company represen= tative, call toll free (866) 755-5996. We do not offer free shipping out= side of the U.S. and Canada. Retailers outside of the U.S. and Canada ma= y call for more information. Limit one free Road Map to Sales Success pe= r company. Other copies of the poster may be purchased on our web site.<= br /> <br /> </small></small></small></big></big></big></big></span> <sp= an style=3D"color: #666666;"><small><span style=3D"font-size: xx-small;= font-family: Verdana,Arial,Helvetica,sans-serif;"><big><big><big><small= ><small>We hope you found this message to be useful. However, if you'd r= ather not receive future emails of this sort from The Furniture Training= Company, please <a href=3D"http://www.furnituretraining.com/contact">cl= ick here to unsubscribe</a>.<br /> <br /> </small></small></big></big></= big></span></small><small><span style=3D"font-size: xx-small; font-famil= y: Verdana,Arial,Helvetica,sans-serif;"><big><big><big><small><small>&co= py;Copyright 2009 The Furniture Training Company.<br /> 1770 North Resea= rch Park Way, <br /> North Logan, UT 84341. <br /> All Rights Reserved.<= /small></small></big></big></big></span></small></span><br /></td>=0D=0A= <td valign=3D"top" bgcolor=3D"#ffffff"><img src=3D"http://www.furnituret= rainingcompany.com/images/email/highpoint_2009_04/spacer_disclaimer_righ= t.jpg" alt=3D"" /></td>=0D=0A</tr>=0D=0A</tbody>=0D=0A</table>=0D=0A<tab= le border=3D"0" cellspacing=3D"0" cellpadding=3D"0" width=3D"600" align= =3D"center">=0D=0A<tbody>=0D=0A<tr>=0D=0A<td valign=3D"top" bgcolor=3D"#= ffffff"><img src=3D"http://www.furnituretrainingcompany.com/images/email= /highpoint_2009_04/footer.jpg" alt=3D"" /></td>=0D=0A</tr>=0D=0A</tbody>= =0D=0A</table>=0D=0A<p><br /></p><br><hr><a href=3D'http://localhost/ftc= /app/unsubscribe.php?action=3DoptOut&pid=3D6121&cid=3D19&email=3Dmarkl@f= urnituretrainingcompany.com'>Click to Unsubscribe</a>

    Read the article

< Previous Page | 36 37 38 39 40