JavaScript - Help Opening An Application From Javascript
Hello,
I need your help, I have the following code below, and its giving me an error saying: "The system cannot find the file specified". Code: <html> <script language="javascript" type="text/javascript"> function start_ccm(){ var wsh = new ActiveXObject('WScript.Shell'); wsh.exec("C:\Program Files\WorkDynamics Technologies\ccmApplications\ccmMercury.exe") } </script> </head> <body> <input id="Button1" onclick="start_ccm()" type="button" value="START" /> </body> </html> There is nothing wrong with the location, but my best guess are the spaces in the file path. Any help with this is greatly appreciated. Cheers, J Similar TutorialsIf I want to launch an application in DOS it is START notepad.exe How do I launch the application in Javascript? thanks Hello all, I want to screen scrape a citrix application using server side java script. Currently I am making use of WScript.Shell ActiveXObject and try the following : var objShell =new ActiveXObject("WScript.Shell"); objShell.AppActivate("Metaframe Presentation Server"); // this is the title of the citrix dialog that opens up once the application gets launched. objShell.SendKeys ("{ENTER}") Using AppActivate, the focus is transferred to the dialog mentioned above, but then the SendKeys do not work. Do I need to do it differently? Please provide your valuable help. Hey Guys, I feel like a complete idiot posting this, but I clearly am missing something. I'm trying to open a window with the specs below but all it does is open a standard sized window. Any help would be greatly appreciated. Code: <SCRIPT LANGUAGE="javascript"> function open_window() { window.open ('https://domain.com/document.php','newwindow',config='height=418,width=590,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=no') } </SCRIPT> <p><a onclick="open_window()"><img src="images/image.png" width="142" height="113" /></a></p> Dear friends, I am using a Javascript which perfectly worked in all relevant browsers, including IE6 and IE7. Its advantage has been to be able to specify the window-size + to decide, whether there should be scrollbars or the option to resize it. It is also fully standards-compliant. It opens a new popup window and is triggered via the rel="popup" or rel="popup nofollow" attributes in the specified external links, e.g.: Code: <a href="http://www.codingforums.com/" rel="popup">CodingForums</a> <a href="http://www.codingforums.com/" rel="popup nofollow">CodingForums</a> The code however does not do its job in IE8. It follows the link, but does so in the old window, not a new popup window, and thus recurs to standard behavior of links. Here is the Javascript-Code, included in the header: Code: var properties = { width: 900, height: 450, scrollbars: 'yes', resizable: 'yes' }; function popup(){ var link = this.getAttribute( 'href' ); var prop_str = ''; for( prop in properties ){ prop_str = prop_str + prop + '=' + properties[prop] + ','; } prop_str = prop_str.substr( 0, prop_str.length - 1 ); var newWindow = window.open( link, '_blank', prop_str ); if( newWindow ){ if( newWindow.focus ) newWindow.focus(); return false; } return true; } function setupPopups(){ var links = document.getElementsByTagName( 'a' ); for( var i=0; i<links.length; i++ ){ if( links[i].getAttribute( 'rel' ) && (links[i].getAttribute( 'rel' ) == 'popup' || links[i].getAttribute( 'rel' ) == 'popup nofollow')) links[i].onclick = popup; } } window.onload = function(){ setupPopups(); } Since I am not an expert, I would greatly appreciate help to make this efficent code workable in IE8. Thanks in advance! CodeMat I am currently designing a website for our public library. I have added a card catalog search bar on the side of every page. Our catalog software company has supplied the code. After embedding it, I previewed each page to make sure it was working properly. At the time, it worked fine. Since then, I have added other elements to the homepage such as a Twitter feed and a Flickr slideshow. Now, when I attempt to search in the catalog search bar on the homepage, it opens two tabs, but only in Firefox. Our IT person from the software company suggested I make a copy of the page and strip the code down to see what the problem is. After doing this, I have made no headway. Even with the catalog as the only code left on the page, other than text, it still opens two tabs. The following is the code embedded on the homepage: Code: <div> <script type='text/javascript'> function gotoserver() { sn = document.getElementById('server').value; redirecturl = 'http://webopac.infovisionsoftware.com/stephenville/default.aspx?Title='+sn; window.open(redirecturl) //document.location.href=redirecturl; } </script> <input type='text' name='server' id='server' /> <input type='submit' id='mySearch' value='Go' onclick='javascript:gotoserver();' /> </div> I would appreciate any advice given. Thank you for your time. Hi, We are having a website which shows the HTML5 video once click on the Video link it display the video in the same page where the innerhtml of the div accept it. document.getElementById("video_div").innerHTML = QT_WritePoster_XHTML('Click to Play', tabs[currentTab].articles[currentArticle].video+'-poster.jpg',tabs[currentTab].articles[currentArticle].video+'.mov',536, 256, '','controller', 'true','autoplay', 'true','bgcolor', 'black','scale', 'aspect'); It display the video in all the browser accept Safari and in IPhone. Once this QT_WritePoster_XHTML line is encountered while clicking on the Video link of the application it opens the video mentioned in the QT_WritePoster_XHTML on the new blank video but not in the innerhtml with the Application. Please let us know what to do to support this code with the application. Please note that this problem is coming only for Safari Apple. Thanks in advance. How would you Integrate 2 or more Software/Applications via API to build a New Membership Site Software? Also use FB, Twitter & G+ Authentication in addition to Registration via Email Address What is the Process like? What to look out for and how to Document the Workflow? hello... I'm sorry, i did read the advises, and i've been through the forum, trying to figure out where to look... but i dont know where to find it... so, i'm sorry if my help request will sound silly,,, i'm only looking for someone that will want to point me in the right direction... and i'll try to do my best on my own ... we want to offer personalized tshirts... so we do need a way for the customer to choose size, color, subject and text and check all this in real time... someone that is doing something that we want is http://www.vistaprint.com/embroidere...aspx?xnav=top# in your opininion, is that vistaprint application a java? pls, could you point me in the right direction to understand that? thanks to anyone that will want to help me Ok so I am building a quiz application that I want to let people hit continue and it would save through MySQL database what radio buttons have been selected. IE: What is your username? (o) No Answer [hidden] () Randy () Randy3 () Randy53215 () Randy2 This is just an example of how we would like it setup and if nothing is selected (as shown above) it would calculate that no answer was selected and save all the results of which were selected. So it would see that No Answer was selected and it would skip it and check all the rest. (Generally we have 4 answers). So it would save something like this... () No Answer [hidden] () Randy () Randy3 (o) Randy53215 () Randy2 Does anyone have any idea on how to go about this? Have a link to a page or some personal Javascript source that could do this? My javascript abilities are close to nothing. I can manipulate a bit to get it to work but that's about it. Any help would be greatly appreciated. Can someone explain how to deploy an application in red5 webapps directory? On a remote server? Or is this something I'd have to hire a consultant for? Thanks Hi Everyone, Here is the question: How do I make my website viewable and usable by everyone on my network (in other words, locally)? See below for details. I'm working on a web-application (primarily Javascript and html) that will be located in a folder that everyone has access to at my company. This page is a fairly basic (a person signs-in, their name appears in a table below....the table is constantly growing). My goal is to make everyone able to dynamically add to this table. They need to be able to refresh the table and see it in its current state, and add their names to and continue growing the table. Of course, if I just place my basic web application in the folder everyone has access to, they open it to its original state. I appreciate any response. I'm VERY new to JavaScript and html, though I'm pretty well versed in a few other programming languages (VBA and MATLAB particularly), so I apologize if this is a very basic question. I'll copy in my working code so far, if that helps give a better visualization of what I mean. Code: <html> <STYLE TYPE="text/css"> body{margin: 0; padding: 0} tr.headerT { font-family: Calibri; font-size: 16pt; color: white; text-align: center } input.entryname{width: 150px;} select.optionitem{width: 150px;} .odd{background-color: white; height: 25px;} .even{background-color: E1E1E1; height: 25px;} .sidebar{background-color: AFD7E7;} </STYLE> <script language="JavaScript"> function getDate() { var TimeArray = new Date(); var o_Month = TimeArray.getMonth() + 1; var o_Day = TimeArray.getDate(); var o_Year = TimeArray.getFullYear(); o_Date = o_Month + "/" + o_Day + "/" + o_Year return o_Date } function getTime() { var TimeArray = new Date(); var o_Hours = TimeArray.getHours(); var o_Minutes = TimeArray.getMinutes(); var o_Seconds = TimeArray.getSeconds(); if (o_Hours < 10) {o_Hours = "0" + o_Hours} if (o_Minutes < 10) {o_Minutes = "0" + o_Minutes} if (o_Seconds < 10) {o_Seconds = "0" + o_Seconds} o_Time = o_Hours + ":" + o_Minutes + ":" + o_Seconds return o_Time } function Test2(tableID, selectID, inputID, selectID2) { var table = document.getElementById(tableID); var rowCount = table.rows.length; var row =table.insertRow(rowCount-1); var RowStyle = table.getElementsByTagName("tr"); var Cell1 = row.insertCell(0); var Cell2 = row.insertCell(1); var Cell3 = row.insertCell(2); var Cell4 = row.insertCell(3); var Cell5 = row.insertCell(4); var Cell6 = row.insertCell(5); var Cell7 = row.insertCell(6); var Cell8 = row.insertCell(7); var Cell9 = row.insertCell(8); var entered_name = document.getElementById(inputID).value; var selected_index = document.getElementById(selectID).selectedIndex; var selected_value = document.getElementById(selectID).options[selected_index].value; var index2 = document.getElementById(selectID2); index2.options[index2.options.length] = new Option(entered_name); index2.options[(index2.options.length)-1].value = entered_name; Cell1.className = "sidebar"; Cell2.innerHTML = getDate(); Cell2.align = "center"; Cell3.innerHTML = getTime(); Cell3.align = "center"; Cell4.innerHTML = selected_value; Cell4.align = "center"; Cell5.innerHTML = entered_name; Cell5.align = "center"; Cell9.className = "sidebar"; if((rowCount-1)%2==0){ RowStyle[rowCount-1].className = "even"; }else{ RowStyle[rowCount-1].className = "odd"; } } function Test3(tableID, selectID_rep, selectID_mem) { var dat_table = document.getElementById(tableID); var rowCount = dat_table.rows.length; var mem_select = document.getElementById(selectID_mem); var mem_index = mem_select.selectedIndex; var mem_value = mem_select.options[mem_index].value; var rep_select = document.getElementById(selectID_rep); var rep_index = rep_select.selectedIndex; var rep_value = rep_select.options[rep_index].value; for (i = 0; i<(rowCount-1); i++) { if(dat_table.rows[i].cells[4].innerHTML==mem_value) { if(dat_table.rows[i].cells[5].innerHTML=="") { dat_table.rows[i].cells[5].innerHTML = rep_value; dat_table.rows[i].cells[5].align = "center"; dat_table.rows[i].cells[6].innerHTML = getTime(); dat_table.rows[i].cells[6].align = "center"; } else if(dat_table.rows[i].cells[5].innerHTML==rep_value) { dat_table.rows[i].cells[7].innerHTML = getTime(); dat_table.rows[i].cells[7].align = "center"; mem_select.removeChild(mem_select.options[mem_index]); } } } } </script> <head> <form> <table width = 100% height = 120 border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "white" id="shell" align ="center"> <tr align ="right"> <td rowspan="5" align="left" valign="top"> <IMG SRC="Logo.jpg"> </td> <td rowspan="2" colspan="2"> <IMG SRC="Title_SignIn.jpg"> </td> <td colspan="2" > <IMG SRC="Title_Staff.jpg"> </td> <td width = "10%">   </td> </tr> <tr align ="right" valign = "top" style = "height: 30px"> <td width = "30%"> Select Member:  </td> <td width = "10%"> <select name = "select_member" style = "width: 200px"> </select> </td> <td> </td> </tr> <tr align ="right" valign = "top" style = "height: 30px"> <td width = "10%"> Name:   </td> <td width = "10%"> <input type="text" name="full_name" class="entryname"> </td> <td> Representative:   </td> <td> <select name = "select_rep" style = "width: 200px"> <option value="Rep A">RV Watson</option> <option value="Rep B">Daisy Bauer</option> <option value="Rep C">Mike Andrews</option> </select> </td> </tr> <tr align ="right" valign = "top" style "hieght: 30px"> <td> Reason:   </td> <td> <select name = "reason" class = "optionitem"> <option value="Eligibility">Eligibility</option> <option value="Sick Leave">Sick Leave</option> <option value="Claims">Claims</option> <option value="Pension">Pension</option> </select></td> <td> Password:   </td> <td> Password Box </td> </tr> <tr align ="right" style = "height: 30px"> <td>   </td> <td> <input type="button" value="Sign In" name="btnSignIn" onClick="Test2('thetable', 'reason', 'full_name', 'select_member')"> </td> <td>   </td> <td> <input type="button" value="Sign Member In / Out" name="btnStaff" onClick="Test3('thetable', 'select_rep', 'select_member')"> </td> </tr> </form> </head> <table id ="thetable" width = "100%" height = "100%" border="0" valign="center" cellspacing="0" cellpadding="0" bgcolor="white" id="shell" align="center"> <tr class = "headerT" bgcolor="gray" height = "40"> <td style = "width = 50px"> </td> <td style = "width = 100px">DATE</td> <td style = "width = 150px">TIME</td> <td style = "width = 100px">REASON</td> <td style = "width = 200px">NAME</td> <td style = "width = 200px">REPRESENTATIVE</td> <td style = "width = 150px">START TIME</td> <td style = "width = 150px">END TIME</td> <td> </td> </tr> <tr> <td colspan="1" bgcolor = "AFD7E7"> </td> <td colspan="7" ></td> <td colspan="1" bgcolor = "AFD7E7"> </td> </tr> </table> </body> </html> Hi, Can anyone tell me How to send values from application resources.properties file to a java script function in a jsp Thanks in Advance, John Ven I want to open a new tab "http://www.example.com/" when the user presses a key. How can this be done?
You can see the website here with all the code to make it easier for you to diagnose what is happening: Code: http://www.fdfdaa.com/desktop/desktop.html When you go to the start menu and select anything on the left side, you will see that windows open 100% of the screen by default. I did that by adding maximized:true but that doesn't appear to be working for the icons on the desktop itself. If you click on one of those 4 icons on the desktop though, it isn't opening at 100% for some reason. You can see my classes file here as well: Code: http://www.fdfdaa.com/desktop/classes.js Any help will be greatly appreciated. Thank you for your time! Hello all, I'm trying to open up an internal link from my leftnav div into my content div. I used the following JS code from my book but im not quite sure how to make it all work. Any thoughts appreciated. Thank you Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--header script starts here --> <script type="text/javascript"> window.onload = initlinks; function initlinks() { for (var i = 0; i < document.links.length; i++) { document.links[i].onclick = setContent; } } function setContent() { document.getElementById("content").contentWindow.document.location.href = this.href; return false; } </script> <style type="text/css"> html, body { margin: 0; padding: 0; } #container { width: 90%; margin: 10px auto; background-color: #fff; color: #333; border: 1px solid gray; line-height: 130%; } #header { height: 60px; background-color: #ddd; border-bottom: 1px solid gray; } #leftnav { float: left; width: 160px; height: 380px; margin: 0; padding: 1em; } #content { margin-left: 200px; border-left: 1px solid gray; padding: 1em; height: 380px; } </style> <title>JavaScript</title> </head> <body> <div id="container"> <div id="header"> <h1>JavaScript</h1> </div> <div id="leftnav"> <p> <a href='#'>Load Content</a> <br /><br /> <a href='#'>Load Content</a> <br /><br /> <a href='#'>Load Content</a> <br /><br /> <a href='#'>Load Content</a> <br /><br /> <a href='#'>Load Content</a> <br /><br /> </p> </div> <!--Div to load content into--> <div id="content"> <h2>Subheading</h2> <p> Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel erat volutpat. </p> </div> </div> </body> </html> Hi, I need to open a PDF file via a web page. Basically, I want to have a textbox where I type in a filename and then click submit and it will open that document. For example, I need to open a PDF document... I need to have a text box where I can input "test1" for example, click "GO" and it will add the "C:/test/" + textbox value + ".pdf" and open it in the browser. I could do it in PHP but this is going to run on a local machine with no serverside so I assume JS will be the way forward. Any ideas? Many Thanks MJFCAD Ok, newbie here. Like, REAL new. Anyway, used some script for an animated drop down menu from clarklab.net. I want users to click on menu to expand to sub's, but I can't figure out how to fix it from expanding every single one. I also want users to be able to close back up. Help? I am ready to jump. Thanks Here is the site, vertical navigation on left side: Here's ma' code Code: <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function () { $("ul.menu_body li:even").addClass("alt"); $('.menu_head').click(function () { $('ul.menu_body').slideToggle('medium'); }); $('ul.menu_body li a').mouseover(function () { $(this).animate({ fontSize: "14px", paddingLeft: "20px" }, 50 ); }); $('ul.menu_body li a').mouseout(function () { $(this).animate({ fontSize: "12px", paddingLeft: "10px" }, 50 ); }); }); </script> Code: <div class="container"> <div class="menu_head_nodrop"><p><a href="administrativeservices.html">Administrative Services</a></p> </div> <div class="menu_head_nodrop"> <p><a href="birthdeathcertificates.html">Birth & Death Records</a></p> </div><div class="menu_head"> <p>Construction Programs</p> </div> <ul class="menu_body"> <li><a href="manufacturedhomes.html">Manufactured Homes Installation</a></li> <li><a href="plumbingprogram.html">Plumbing Inspections</a></li> <li><a href="healthyhomes.html">Healthy Homes</a></li> </ul><div class="menu_head"> <p>Environmental Health</p> </div><ul class="menu_body"> <li><a href="environmentalhealth.html">Beach Monitoring</a></li> <li><a href="rabies.html">Rabies Control</a></li> <li><a href="foodprotection.html">Food Service</a></li> <li><a href="householdsewage.html">Sewage Treatment Systems</a></li> <li><a href="Radon.html">Radon</a></li> <li><a href="leadsafety.html">Lead Safety</a></li> <li><a href="manufacturedhome.html">Manufactured Home Parks</a></li> <li><a href="marinas.html">Marinas</a></li> <li><a href="http://0052c90.netsolhost.com/nuisance.html">Nuisance Complaints</a></li> <li><a href="privatewater.html">Private Water Systems</a></li> <li><a href="poolandspa.html">Public Swimming Pools & Spas</a></li> <li><a href="realestatesurveys.html">Real Estate Surveys</a></li> <li><a href="rvparks.html">RV Parks & Campgrounds</a></li> <li><a href="http://www.odh.ohio.gov/odhPrograms/eh/schooleh/sehmain.aspx" target="_blank">Schools</a></li> <li><a href="tattooandbody.html">Tattoo & Body Piercing</a></li> </ul><div class="menu_head"> <p>Health Education & Outreach</p> </div><ul class="menu_body"> <li><a href="communityhealth.html">Community Health</a></li> <li><a href="http://www.scrubclub.org/home.aspx" target="_blank">Handwashing</a></li> <li><a href="healthyhomes.html">Healthy Homes</a></li> <li><a href="leadsafety.html">Lead Safety</a></li> <li><a href="lifeskills.html">LifeSkills</a> <li><a href="schoolwellness.html">School Wellness</a> <li><a href="smokefreeworkplace.html">Smoke Free Workplace</a></li> <li><a href="teenpregnancy.html">Teen Pregnancy Prevention</a></li> </ul><div class="menu_head"> <p>Nursing & Clinic Services</p> </div><ul class="menu_body"> <li><a href="familypractice.html">Family Practice Services</a></li> <li><a href="bccpinfo.html">Breast & Cervical Cancer Program</a></li> <li><a href="childrenshealth.html">Sports & Work Physicals</a></li> <li><a href="specialneedschildren.html">Children with Special Needs</a></li> <li><a href="communicabledisease.html">Communicable Disease</a></li> <li><a href="familyplanningclinic.html">Family Planning</a></li> <li><a href="helpmegrow.html">Help Me Grow</a></li> <li><a href="HIVAIDS.html">HIV/AIDS Testing</a></li> <li><a href="homehealthcare.html">Home Health Care</a></li> <li><a href="immunizationfaqs.html">Immunization/Shots</a></li> <li><a href="leadscreeningandtesting.html">Lead Screening & Testing</a></li> <li><a href="prenatalclinic.html">Pregnancy Testing & Assistance</a></li> <li><a href="schoolnursing.html">School Nursing</a></li> <li><a href="seniorclinic.html">Senior Clinic</a></li> <li><a href="specialtyclinics.html">Outreach Clinics</a></li> <li><a href="HIVAIDS.html">STD Clinic</a></li> <li><a href="tbtesting.html">TB Testing</a></li> </ul><div class="menu_head"> <p>Public Health Preparedness</p> </div><ul class="menu_body"> <li><a href="publichealth.html">General Information</a></li> <li><a href="medicalreservecorps.html">Medical Reserve Corps</a></li> </ul><div class="menu_head"> <p>WIC</p> </div><ul class="menu_body"> <li><a href="wic.html">WIC Services</a></li> <li><a href="http://www.odh.ohio.gov/odhPrograms/ns/wicn/wic1.aspx" target="_blank">Learn More About WIC</a></li> </ul> </div> is there a way in HTML or Javascript to open a new window and force it to be a new Window, not a new tab? and also avoid popup blockers??
Hi, I am having some problems with this modified version of Lightbox. I had a programmer implement this into the site and then one day it just stopped working. I'm trying to fix it myself, with no success. To view the problem go to: http://www.uscgq.com/question/deck/2 and click the red flag icon. The lightbox opens, but only shows the "Loading" message. I have isolated the problem to somewhere in the Lightbox.js just don't know where or what it is. Any help is greatly appreciated! Code: /* Created By: Chris Campbell Website: http://particletree.com Date: 2/1/2006 Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/ */ /*-------------------------------GLOBAL VARIABLES------------------------------------*/ var detect = navigator.userAgent.toLowerCase(); var OS,browser,version,total,thestring; /*-----------------------------------------------------------------------------------------------*/ //Browser detect script origionally created by Peter Paul Koch at http://www.quirksmode.org/ function getBrowserInfo() { if (checkIt('konqueror')) { browser = "Konqueror"; OS = "Linux"; } else if (checkIt('safari')) browser = "Safari" else if (checkIt('omniweb')) browser = "OmniWeb" else if (checkIt('opera')) browser = "Opera" else if (checkIt('webtv')) browser = "WebTV"; else if (checkIt('icab')) browser = "iCab" else if (checkIt('msie')) browser = "Internet Explorer" else if (!checkIt('compatible')) { browser = "Netscape Navigator" version = detect.charAt(8); } else browser = "An unknown browser"; if (!version) version = detect.charAt(place + thestring.length); if (!OS) { if (checkIt('linux')) OS = "Linux"; else if (checkIt('x11')) OS = "Unix"; else if (checkIt('mac')) OS = "Mac" else if (checkIt('win')) OS = "Windows" else OS = "an unknown operating system"; } } function checkIt(string) { place = detect.indexOf(string) + 1; thestring = string; return place; } /*-----------------------------------------------------------------------------------------------*/ Event.observe(window, 'load', initialize, false); Event.observe(window, 'load', getBrowserInfo, false); Event.observe(window, 'unload', Event.unloadCache, false); var lightbox = Class.create(); lightbox.prototype = { yPos : 0, xPos : 0, initialize: function(ctrl) { this.content = ctrl.href; Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false); ctrl.onclick = function(){return false;}; }, // Turn everything on - mainly the IE fixes activate: function(){ if (browser == 'Internet Explorer'){ this.getScroll(); this.prepareIE('100%', 'hidden'); this.setScroll(0,0); this.hideSelects('hidden'); } this.displayLightbox("block"); }, // Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox prepareIE: function(height, overflow){ bod = document.getElementsByTagName('body')[0]; bod.style.height = height; bod.style.overflow = overflow; htm = document.getElementsByTagName('html')[0]; htm.style.height = height; htm.style.overflow = overflow; }, // In IE, select elements hover on top of the lightbox hideSelects: function(visibility){ selects = document.getElementsByTagName('select'); for(i = 0; i < selects.length; i++) { selects[i].style.visibility = visibility; } }, // Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/ getScroll: function(){ if (self.pageYOffset) { this.yPos = self.pageYOffset; } else if (document.documentElement && document.documentElement.scrollTop){ this.yPos = document.documentElement.scrollTop; } else if (document.body) { this.yPos = document.body.scrollTop; } }, setScroll: function(x, y){ window.scrollTo(x, y); }, displayLightbox: function(display){ $('overlay').style.display = display; $('lightbox').style.display = display; if(display != 'none') this.loadInfo(); }, // Begin Ajax request based off of the href of the clicked linked loadInfo: function() { var myAjax = new Ajax.Request( this.content, {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)} ); }, // Display Ajax response processInfo: function(response){ console.log('calling process info'); if($('lbHeader')) Element.remove($('lbHeader')); info = "<div id=\"lbHeader\"><a href=\"javascript: closeLightboxes();\">close</a> or hit ESC</div><div id='lbContent'>" + response.responseText + "</div>"; new Insertion.Before($('lbLoadMessage'), info) $('lightbox').className = "done"; this.actions(); }, // Search through new links within the lightbox, and attach click event actions: function(){ lbActions = document.getElementsByClassName('lbAction'); for(i = 0; i < lbActions.length; i++) { Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false); lbActions[i].onclick = function(){return false;}; } }, // Example of creating your own functionality once lightbox is initiated insert: function(e){ link = Event.element(e).parentNode; Element.remove($('lbContent')); var myAjax = new Ajax.Request( link.href, {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)} ); }, // Example of creating your own functionality once lightbox is initiated deactivate: function(){ if($('lbHeader')) Element.remove($('lbHeader')); Element.remove($('lbContent')); if (browser == "Internet Explorer"){ this.setScroll(0,this.yPos); this.prepareIE("auto", "auto"); this.hideSelects("visible"); } this.displayLightbox("none"); } } /*-----------------------------------------------------------------------------------------------*/ // Onload, make all links that need to trigger a lightbox active function initialize(){ addLightboxMarkup(); lbox = document.getElementsByClassName('lbOn'); for(i = 0; i < lbox.length; i++) { valid = new lightbox(lbox[i]); } } // Add in markup necessary to make this work. Basically two divs: // Overlay holds the shadow // Lightbox is the centered square that the content is put into. function addLightboxMarkup() { bod = document.getElementsByTagName('body')[0]; overlay = document.createElement('div'); overlay.id = 'overlay'; lb = document.createElement('div'); lb.id = 'lightbox'; lb.className = 'loading'; lb.innerHTML = '<div id="lbLoadMessage">' + '<p>Loading</p>' + '</div>'; bod.appendChild(overlay); bod.appendChild(lb); } // Send AJAX Call function sendForm(url) { new Ajax.Updater('lbContent', url, { method: 'post', parameters: Form.serialize($('content_form'),true) }); } // Function to destroy lightbox elements function closeLightboxes() { if(lightbox.prototype) lightbox.prototype.displayLightbox('none'); if($('lbHeader')) Element.remove($('lbHeader')); if($('lbContent')) Element.remove($('lbContent')); } // Close the lightbox if ESC is pressed document.onkeypress=function(e){ var KeyID = (window.event) ? event.keyCode : e.keyCode; if(KeyID == 27) { closeLightboxes(); } } |