Search Results

Search found 2851 results on 115 pages for 'min'.

Page 114/115 | < Previous Page | 110 111 112 113 114 115  | Next Page >

  • JAVA image transfer problem

    - by user579098
    Hi, I have a school assignment, to send a jpg image,split it into groups of 100 bytes, corrupt it, use a CRC check to locate the errors and re-transmit until it eventually is built back into its original form. It's practically ready, however when I check out the new images, they appear with errors.. I would really appreciate if someone could look at my code below and maybe locate this logical mistake as I can't understand what the problem is because everything looks ok :S For the file with all the data needed including photos and error patterns one could download it from this link:http://rapidshare.com/#!download|932tl2|443122762|Data.zip|739 Thanks in advance, Stefan p.s dont forget to change the paths in the code for the image and error files package networks; import java.io.*; // for file reader import java.util.zip.CRC32; // CRC32 IEEE (Ethernet) public class Main { /** * Reads a whole file into an array of bytes. * @param file The file in question. * @return Array of bytes containing file data. * @throws IOException Message contains why it failed. */ public static byte[] readFileArray(File file) throws IOException { InputStream is = new FileInputStream(file); byte[] data=new byte[(int)file.length()]; is.read(data); is.close(); return data; } /** * Writes (or overwrites if exists) a file with data from an array of bytes. * @param file The file in question. * @param data Array of bytes containing the new file data. * @throws IOException Message contains why it failed. */ public static void writeFileArray(File file, byte[] data) throws IOException { OutputStream os = new FileOutputStream(file,false); os.write(data); os.close(); } /** * Converts a long value to an array of bytes. * @param data The target variable. * @return Byte array conversion of data. * @see http://www.daniweb.com/code/snippet216874.html */ public static byte[] toByta(long data) { return new byte[] { (byte)((data >> 56) & 0xff), (byte)((data >> 48) & 0xff), (byte)((data >> 40) & 0xff), (byte)((data >> 32) & 0xff), (byte)((data >> 24) & 0xff), (byte)((data >> 16) & 0xff), (byte)((data >> 8) & 0xff), (byte)((data >> 0) & 0xff), }; } /** * Converts a an array of bytes to long value. * @param data The target variable. * @return Long value conversion of data. * @see http://www.daniweb.com/code/snippet216874.html */ public static long toLong(byte[] data) { if (data == null || data.length != 8) return 0x0; return (long)( // (Below) convert to longs before shift because digits // are lost with ints beyond the 32-bit limit (long)(0xff & data[0]) << 56 | (long)(0xff & data[1]) << 48 | (long)(0xff & data[2]) << 40 | (long)(0xff & data[3]) << 32 | (long)(0xff & data[4]) << 24 | (long)(0xff & data[5]) << 16 | (long)(0xff & data[6]) << 8 | (long)(0xff & data[7]) << 0 ); } public static byte[] nextNoise(){ byte[] result=new byte[100]; // copy a frame's worth of data (or remaining data if it is less than frame length) int read=Math.min(err_data.length-err_pstn, 100); System.arraycopy(err_data, err_pstn, result, 0, read); // if read data is less than frame length, reset position and add remaining data if(read<100){ err_pstn=100-read; System.arraycopy(err_data, 0, result, read, err_pstn); }else // otherwise, increase position err_pstn+=100; // return noise segment return result; } /** * Given some original data, it is purposefully corrupted according to a * second data array (which is read from a file). In pseudocode: * corrupt = original xor corruptor * @param data The original data. * @return The new (corrupted) data. */ public static byte[] corruptData(byte[] data){ // get the next noise sequence byte[] noise = nextNoise(); // finally, xor data with noise and return result for(int i=0; i<100; i++)data[i]^=noise[i]; return data; } /** * Given an array of data, a packet is created. In pseudocode: * frame = corrupt(data) + crc(data) * @param data The original frame data. * @return The resulting frame data. */ public static byte[] buildFrame(byte[] data){ // pack = [data]+crc32([data]) byte[] hash = new byte[8]; // calculate crc32 of data and copy it to byte array CRC32 crc = new CRC32(); crc.update(data); hash=toByta(crc.getValue()); // create a byte array holding the final packet byte[] pack = new byte[data.length+hash.length]; // create the corrupted data byte[] crpt = new byte[data.length]; crpt = corruptData(data); // copy corrupted data into pack System.arraycopy(crpt, 0, pack, 0, crpt.length); // copy hash into pack System.arraycopy(hash, 0, pack, data.length, hash.length); // return pack return pack; } /** * Verifies frame contents. * @param frame The frame data (data+crc32). * @return True if frame is valid, false otherwise. */ public static boolean verifyFrame(byte[] frame){ // allocate hash and data variables byte[] hash=new byte[8]; byte[] data=new byte[frame.length-hash.length]; // read frame into hash and data variables System.arraycopy(frame, frame.length-hash.length, hash, 0, hash.length); System.arraycopy(frame, 0, data, 0, frame.length-hash.length); // get crc32 of data CRC32 crc = new CRC32(); crc.update(data); // compare crc32 of data with crc32 of frame return crc.getValue()==toLong(hash); } /** * Transfers a file through a channel in frames and reconstructs it into a new file. * @param jpg_file File name of target file to transfer. * @param err_file The channel noise file used to simulate corruption. * @param out_file The name of the newly-created file. * @throws IOException */ public static void transferFile(String jpg_file, String err_file, String out_file) throws IOException { // read file data into global variables jpg_data = readFileArray(new File(jpg_file)); err_data = readFileArray(new File(err_file)); err_pstn = 0; // variable that will hold the final (transfered) data byte[] out_data = new byte[jpg_data.length]; // holds the current frame data byte[] frame_orig = new byte[100]; byte[] frame_sent = new byte[100]; // send file in chunks (frames) of 100 bytes for(int i=0; i<Math.ceil(jpg_data.length/100); i++){ // copy jpg data into frame and init first-time switch System.arraycopy(jpg_data, i*100, frame_orig, 0, 100); boolean not_first=false; System.out.print("Packet #"+i+": "); // repeat getting same frame until frame crc matches with frame content do { if(not_first)System.out.print("F"); frame_sent=buildFrame(frame_orig); not_first=true; }while(!verifyFrame(frame_sent)); // usually, you'd constrain this by time to prevent infinite loops (in // case the channel is so wacked up it doesn't get a single packet right) // copy frame to image file System.out.println("S"); System.arraycopy(frame_sent, 0, out_data, i*100, 100); } System.out.println("\nDone."); writeFileArray(new File(out_file),out_data); } // global variables for file data and pointer public static byte[] jpg_data; public static byte[] err_data; public static int err_pstn=0; public static void main(String[] args) throws IOException { // list of jpg files String[] jpg_file={ "C:\\Users\\Stefan\\Desktop\\Data\\Images\\photo1.jpg", "C:\\Users\\Stefan\\Desktop\\Data\\Images\\photo2.jpg", "C:\\Users\\Stefan\\Desktop\\Data\\Images\\photo3.jpg", "C:\\Users\\Stefan\\Desktop\\Data\\Images\\photo4.jpg" }; // list of error patterns String[] err_file={ "C:\\Users\\Stefan\\Desktop\\Data\\Error Pattern\\Error Pattern 1.DAT", "C:\\Users\\Stefan\\Desktop\\Data\\Error Pattern\\Error Pattern 2.DAT", "C:\\Users\\Stefan\\Desktop\\Data\\Error Pattern\\Error Pattern 3.DAT", "C:\\Users\\Stefan\\Desktop\\Data\\Error Pattern\\Error Pattern 4.DAT" }; // loop through all jpg/channel combinations and run tests for(int x=0; x<jpg_file.length; x++){ for(int y=0; y<err_file.length; y++){ System.out.println("Transfering photo"+(x+1)+".jpg using Pattern "+(y+1)+"..."); transferFile(jpg_file[x],err_file[y],jpg_file[x].replace("photo","CH#"+y+"_photo")); } } } }

    Read the article

  • Jquery Flexslider - can't see navigational images (manualControl)

    - by Kim Thomas
    I've spent a lot of time looking at the post on 3/13/12 re: manual controls, but isn't getting me all the way there...probably because I don't know jquery. Sorry, newbie on board. I'm trying to get the right/left arrows to show, as well as the 1, 2, 3...at the bottom. They are there, I see the lists on Firebug, just don't know how to add them to the "hook" (?) so they appear. Here is the code I have in header: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script src="jquery.flexslider.js"></script> <script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider({ animation: "slide", slideshow: false, controlNav: true, manualControls: ".flex-control-nav li a", controlsContainer: ".flex-container" }); }); </script> Here is my html: <div class="flex-container"> <div class="flexslider"> <ul class="slides"> <li><img src="images/tah_home.jpg" alt="taylor art house home page" width="600" height="320"/> <p class="flex-caption">Taylor Art House Home Page</p></li> <li><img src="images/tah_blog.jpg" alt="taylor art house blog page" width="600" height="320" /> <p class="flex-caption">We created a blog that fits seemlessly into Taylor Art House's look</p></li> <li><img src="images/tah_artwork_page.jpg" alt="taylor art house art page" width="600" height="320" /> <p class="flex-caption">One of Taylor Art House's gallery pages, using a Wordpress plugin</p></li> <li><img src="images/tah_arch_portfolio.jpg" alt="jon taylor architecture portfolio page" width="600" height="320" /> <p class="flex-caption">We created links to toggle from TAH to Jon Taylor Architecture</p></li> </ul> </div><!--end flexsider--> </div><!--end flex-container--> Here is the Flexslider CSS: /* * jQuery FlexSlider v1.8 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php */ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .flexslider { width: 100%; margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img { max-width: 100%; display: block; } .flex-pauseplay span { text-transform: capitalize; } /* Clearfix for the .slides element */ .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .slides { display: block; } * html .slides { height: 1%; } /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child { display: block; } /* FlexSlider Default Theme *********************************/ .flexslider { width: 600px; background: #fff; border: 4px solid #999; position: relative; margin: 30px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1; } .flexslider .slides { zoom: 1; } .flexslider .slides > li { position: relative; } /* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */ .flex-container { zoom: 1; position: relative; margin-left:100px; } /* Caption style */ /* IE rgba() hack */ .flex-caption { background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1; } .flex-caption { width: 96%; padding: 2%; margin: 0; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px; } /* Direction Nav */ .flex-direction-nav { height: 0; } .flex-direction-nav li a { width: 52px; height: 52px; margin: -13px 0 0; display: block; background: url(theme/bg_direction_nav.png) no-repeat; position: absolute; top: 50%; cursor: pointer; text-indent: -999em; } .flex-direction-nav li .next { background-position: -52px 0; right: -21px; } .flex-direction-nav li .prev { left: -20px; } .flex-direction-nav li .disabled { opacity: .3; filter:alpha(opacity=30); cursor: default; } /* Control Nav */ .flex-control-nav { width: 100%; position: absolute; bottom: -30px; text-align: center; } .flex-control-nav li { margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline; } .flex-control-nav li:first-child { margin: 0; } .flex-control-nav li a { width: 13px; height: 13px; display: block; background: url(theme/bg_control_nav.png) no-repeat; cursor: pointer; text-indent: -999em; } .flex-control-nav li a:hover { background-position: 0 -13px; } .flex-control-nav li a.active { background-position: 0 -26px; cursor: default; } Here is how it appears in Firebug: <div class="flex-container"> <div class="flexslider" style="overflow: hidden;"> <ul class="slides" style="width: 1200%; margin-left: -1800px;"> <li class="clone" style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li class="clone" style="width: 600px; float: left; display: block;"> </ul> </div> <ol class="flex-control-nav"> <li> <a class="">1</a> </li> <li> <li> <li> </ol> <ul class="flex-direction-nav"> <li> <a class="prev" href="#">Previous</a> </li> <li> <a class="next" href="#">Next</a> </li> </ul> </div> Finally, here is a link to the jsFiddle file (I saw someone wanted that in other flexslider post): http://jsfiddle.net/kthms/Wxmsp/ Link to page: http://www.kajortdesigns.com/tah.php I've tried every combo of class from the CSS in the manualControl: "", but I'm just guessing. If anyone can help this newbie out, I would be very appreciative. Explicit instructions are always appreciated.

    Read the article

  • jquery jumps to top on click event, return false or prevenDefault doesn't work

    - by Sebsemillia
    Hi, I have written a simple jquery script for a content slider. My problem is that the screen always jumps to the top position of the parent div when sliding the content. I've tried return false and preventDefault to cope with this effect, but the two just make the script not work anymore, nothing happens when I click the links.. So here is the jquery code: $(document).ready(function (){ var itemCount = $('.container div').size(); var itemWidth = $('.container div').width(); $('.container').wrap('<div id="AboutSlider"></div>'); $('#AboutSlider').css({'width':'640px', 'overflow':'hidden', 'position':'relative', 'height':'400px'}); $('#AboutSlider .container').css({'width':itemCount*itemWidth+'px', 'position':'absolute', 'height':'400px'}); $('.container .aboutContent').css({'padding-left':'0px'}); $('#AboutSlider .aboutContent').css({'width':'640px', 'float':'left', 'min-height':'400px'}); $('#AboutNav a').click(function(){ var integer = $(this).attr('rel'); $('#AboutSlider .container').animate({left:-640*(parseInt(integer)-1)}) $('#AboutNav a').each(function(){ $(this).removeClass('active'); if($(this).hasClass('button'+integer)){ $(this).addClass('active')} }); }); }); And here the respective html bit: <div id="Dienstleistungen"> <div class="left_column"> <h2>Meine Dienstleistungen</h2> <h3>KOMPETENZEN</h3> <ul id="AboutNav"> <li><h1><a href="#Kompetenzen" class="button1 active" rel="1" title="Frontend Entwicklung | Sebastian B&ouml;hme">&Uuml;berblick</a></h1></li> <li><h1><a href="#Frontend" class="button2" rel="2" title="Frontend Entwicklung | Sebastian B&ouml;hme">Frontend Entwicklung</a></h1></li> <li><h1><a href="#CMS" class="button3" rel="3" title="Content Management Systeme &amp; Online Shops | Sebastian B&ouml;hme">Content Management Systeme &amp; Online Shops</a></h1></li> <li><h1><a href="#SEO" class="button4" rel="4" title="Suchmaschinenoptimierung (SEO) | Sebastian B&ouml;hme">Suchmaschinenoptimierung (SEO)</a></h1></li> <li><h1><a href="#ScreenDesign" class="button5" rel="5" title="Screen Design | Sebastian B&ouml;hme">Screen Design</a></h1></li> <li><h1><a href="#Hand" class="button6" rel="6" title="Alles aus einer Hand | Sebastian B&ouml;hme">Alles aus einer Hand</a></h1></li> </ul> </div> <div class="container"> <div id="Kompetenzen" class="aboutContent right_columns"> <h1>&Uuml;berblick</h1> <p>Phasellus in massa. Curabitur dolor eros, gravida et, hendrerit ac, cursus non, massa. Aliquam lorem. In hac habitasse platea dictumst. Cras eu mauris. Quisque lacus. Donec ipsum. Nullam vitae sem at nunc pharetra ultricies. Vivamus elit eros, ullamcorper a, adipiscing sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> <p>Teng sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> </div> <hr /> <div id="Frontend" class="aboutContent right_column "> <h1>Frontend Entwicklung</h1> <p>Phasellus in massa. Curabitur dolor eros, gravida et, hendrerit ac, cursus non, massa. Aliquam lorem. In hac habitasse platea dictumst. Cras eu mauris. Quisque lacus. Donec ipsum. Nullam vitae sem at nunc pharetra ultricies. Vivamus elit eros, ullamcorper a, adipiscing sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> <p>Teng sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> </div> <hr /> <div id="CMS" class="aboutContent right_column "> <h1>Content Management Systeme &amp; Online Shops</h1> <p>Phasellus in massa. Curabitur dolor eros, gravida et, hendrerit ac, cursus non, massa. Aliquam lorem. In hac habitasse platea dictumst. Cras eu mauris. Quisque lacus. Donec ipsum. Nullam vitae sem at nunc pharetra ultricies. Vivamus elit eros, ullamcorper a, adipiscing sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> <p>Teng sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> </div> <hr /> <div id="SEO" class="aboutContent right_column "> <h1>Suchmaschinenoptimierung (SEO)</h1> <p>Phasellus in massa. Curabitur dolor eros, gravida et, hendrerit ac, cursus non, massa. Aliquam lorem. In hac habitasse platea dictumst. Cras eu mauris. Quisque lacus. Donec ipsum. Nullam vitae sem at nunc pharetra ultricies. Vivamus elit eros, ullamcorper a, adipiscing sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> <p>Teng sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> </div> <hr /> <div id="ScreenDesign" class="aboutContent right_column "> <h1>Screen Design</h1> <p>Phasellus in massa. Curabitur dolor eros, gravida et, hendrerit ac, cursus non, massa. Aliquam lorem. In hac habitasse platea dictumst. Cras eu mauris. Quisque lacus. Donec ipsum. Nullam vitae sem at nunc pharetra ultricies. Vivamus elit eros, ullamcorper a, adipiscing sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> <p>Teng sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> </div> <hr /> <div id="Hand" class="aboutContent right_column"> <h1>Alles aus einer Hand</h1> <p>Curabitur dolor eros, gravida et, hendrerit ac, cursus non, massa. Aliquam lorem. In hac habitasse platea dictumst. Cras eu mauris. Quisque lacus. Donec ipsum. Nullam vitae sem at nunc pharetra ultricies. Vivamus elit eros, ullamcorper a, adipiscing sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> <p>Teng sit amet, porttitor ut, nibh. Maecenas adipiscing mollis massa. Nunc ut dui eget nulla venenatis aliquet. Sed luctus posuere justo. Cras vehicula varius turpis. Vivamus eros metus, tristique sit amet, molestie dignissim, malesuada et, urna. </p> </div> </div><!-- AboutSlider --> </div><!-- Dienstleistungen --> somebody got any idea? Thanks a lot in advance!!

    Read the article

  • RUN FUNCTION AFTER SOMETIME IN JQUERY & AUTOMATIC SLICING OF IMAGES

    - by user2697032
    I am not being able to start the automatic slicing of images, it is happening only after a click, how should i modify my code so that i get to change the slicing of the images automatically. <!DOCTYPE html> <html lang="en"> <head> <title>Slicebox - 3D Image Slider</title> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="Slicebox - 3D Image Slider with Fallback" /> <meta name="keywords" content="jquery, css3, 3d, webkit, fallback, slider, css3, 3d transforms, slices, rotate, box, automatic" /> <meta name="author" content="Pedro Botelho for Codrops" /> <link rel="shortcut icon" href="../favicon.ico"> <link rel="stylesheet" type="text/css" href="css/demo.css" /> <link rel="stylesheet" type="text/css" href="css/slicebox.css" /> <link rel="stylesheet" type="text/css" href="css/custom.css" /> <script type="text/javascript" src="js/modernizr.custom.46884.js"></script> </head> <body onload="funct()"> <div class="container"> <div class="codrops-top clearfix"> <a href="http://tympanus.net/Development/AutomaticImageMontage/"><span>&laquo; Previous Demo: </span>Automatic Image Montage</a> <span class="right"> <a target="_blank" href="http://www.flickr.com/photos/strupler/">Images by <strong>ND Strupler</strong></a> <a href="http://tympanus.net/codrops/?p=5657"><strong>Back to the Codrops Article</strong></a> </span> </div> <h1>Slicebox <span>A fresh 3D image slider with graceful fallback</span></h1> <div class="more"> <ul id="sb-examples"> <li>More examples:</li> <li class="selected"><a href="index.html">Example 1</a></li> <li><a href="index2.html">Example 2</a></li> <li><a href="index3.html">Example 3</a></li> <li><a href="index4.html">Example 4</a></li> </ul> </div> <div class="wrapper" id="checkthis"> <ul id="sb-slider" class="sb-slider"> <li> <a href="http://www.flickr.com/photos/strupler/2969141180" target="_blank"><img src="images/1.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Creative Lifesaver</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968268187" target="_blank"><img src="images/2.jpg" alt="image2"/></a> <div class="sb-description"> <h3>Honest Entertainer</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968114825" target="_blank"><img src="images/3.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Brave Astronaut</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968122059" target="_blank"><img src="images/4.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Affectionate Decision Maker</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2969119944" target="_blank"><img src="images/5.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Faithful Investor</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968126177" target="_blank"><img src="images/6.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Groundbreaking Artist</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968945158" target="_blank"><img src="images/7.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Selfless Philantropist</h3> </div> </li> </ul> <div id="shadow" class="shadow"></div> <div id="nav-arrows" class="nav-arrows"> <a href="#x">Next</a> <a href="#y">Previous</a> </div> <div id="nav-dots" class="nav-dots"> <span class="nav-dot-current"></span> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> </div> </div><!-- /wrapper --> <p class="info"><strong>Example 1:</strong> Default settings</p> </div> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.slicebox.js"></script> <script type="text/javascript"> $(function() { var Page = (function() { var $navArrows = $( '#nav-arrows' ).hide(), $navDots = $( '#nav-dots' ).hide(), $nav = $navDots.children( 'span' ), $shadow = $( '#shadow' ).hide(), slicebox = $( '#sb-slider' ).slicebox( { onReady : function() { $navArrows.show(); $navDots.show(); $shadow.show(); }, onBeforeChange : function( pos ) { $nav.removeClass( 'nav-dot-current' ); $nav.eq( pos ).addClass( 'nav-dot-current' ); } } ), init = function() { initEvents(); }, initEvents = function() { // add navigation events $navArrows.children( ':first' ).on( 'click', function() { setInterval("callme()", 1000); return false; } ); //$(function(){ //callme(); //}); function callme(){ //$('#checkit').append("callme loaded<br />"); slicebox.next(); setInterval("callme()", 1000); } $navArrows.children( ':last' ).on( 'click', function() { slicebox.previous(); return false; } ); $nav.each( function( i ) { $( this ).on( 'click', function( event ) { var $dot = $( this ); if( !slicebox.isActive() ) { $nav.removeClass( 'nav-dot-current' ); $dot.addClass( 'nav-dot-current' ); } slicebox.jump( i + 1 ); return false; } ); } ); }; return { init : init }; })(); Page.init(); }); </script> <script> // make sure the "myContainer" id in the script is the same id of the div $(document).ready(function() { slicebox.next(); $('#nav-arrows').sbslider(); // this is the piece of code that will do the magic thing }); </script> </body> </html> I am not being able to start the automatic slicing of images, it is happening only after a click, how should i modify my code so that i get to change the slicing of the images automatically.

    Read the article

  • Image re sizing not working after rotation in Html5 canvas

    - by Deepu the Don
    In my HTML 5 + Javascript application, we can drag, re size and rotate image in Html 5 canvas. But after doing rotation, re sizing is not working. (I think it i related to finding dx,dy,not sure). Please help me to fix the code given below. Thanks in advance. <!doctype html> <html> <head> <style> #canvas{ border:red dashed #ccc; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> <script> $(function(){ var canvas=document.getElementById("canvas"),ctx=canvas.getContext("2d"),canvasOffset=$("#canvas").offset(); var offsetX=canvasOffset.left,offsetY=canvasOffset.top,startX,startY,isDown=false,pi2=Math.PI*2; var resizerRadius=8,rr=resizerRadius*resizerRadius,draggingResizer={x:0,y:0},imageX=50,imageY=50; var imageWidth,imageHeight,imageRight,imageBottom,draggingImage=false,startX,startY,doRotation=false; var r=0,rotImg = new Image(); rotImg.src="rotation.jpg"; var img=new Image(); img.onload=function(){ imageWidth=img.width; imageHeight=img.height; imageRight=imageX+imageWidth; imageBottom=imageY+imageHeight; w=img.width/2; h=img.height/2; draw(true,false); } img.src="https://dl.dropboxusercontent.com/u/139992952/stackoverflow/facesSmall.png"; function draw(withAnchors,withBorders){ ctx.fillStyle="black"; ctx.clearRect(0,0,canvas.width,canvas.height); ctx.save(); ctx.translate(imageX,imageY); ctx.translate(imageWidth/2,imageHeight/2); ctx.rotate(r); ctx.translate(-imageX,-imageY); ctx.translate(-imageWidth/2,-imageHeight/2); ctx.drawImage(img,0,0,img.width,img.height,imageX,imageY,imageWidth,imageHeight); ctx.restore(); if(withAnchors){ drawDragAnchor(imageX,imageY); drawDragAnchor(imageRight,imageY); drawDragAnchor(imageRight,imageBottom); drawDragAnchor(imageX,imageBottom); } if(withBorders){ ctx.save(); ctx.translate(imageX,imageY); ctx.translate(imageWidth/2,imageHeight/2); ctx.rotate(r); ctx.translate(-imageX,-imageY); ctx.translate(-imageWidth/2,-imageHeight/2); ctx.beginPath(); ctx.moveTo(imageX,imageY); ctx.lineTo(imageRight,imageY); ctx.lineTo(imageRight,imageBottom); ctx.lineTo(imageX,imageBottom); ctx.closePath(); ctx.stroke(); ctx.restore(); } ctx.fillStyle="blue"; ctx.save(); ctx.translate(imageX,imageY); ctx.translate(imageWidth/2,imageHeight/2); ctx.rotate(r); ctx.translate(-imageX,-imageY); ctx.translate(-imageWidth/2,-imageHeight/2); ctx.beginPath(); ctx.moveTo(imageRight+15,imageY-10); ctx.lineTo(imageRight+45,imageY-10); ctx.lineTo(imageRight+45,imageY+20); ctx.lineTo(imageRight+15,imageY+20); ctx.fill(); ctx.closePath(); ctx.restore(); } function drawDragAnchor(x,y){ ctx.save(); ctx.translate(imageX,imageY); ctx.translate(imageWidth/2,imageHeight/2); ctx.rotate(r); ctx.translate(-imageX,-imageY); ctx.translate(-imageWidth/2,-imageHeight/2); ctx.beginPath(); ctx.arc(x,y,resizerRadius,0,pi2,false); ctx.closePath(); ctx.fill(); ctx.restore(); } function anchorHitTest(x,y){ var dx,dy; dx=x-imageX; dy=y-imageY; if(dx*dx+dy*dy<=rr){ return(0); } // top-right dx=x-imageRight; dy=y-imageY; if(dx*dx+dy*dy<=rr){ return(1); } // bottom-right dx=x-imageRight; dy=y-imageBottom; if(dx*dx+dy*dy<=rr){ return(2); } // bottom-left dx=x-imageX; dy=y-imageBottom; if(dx*dx+dy*dy<=rr){ return(3); } return(-1); } function hitImage(x,y){ return(x>imageX && x<imageX+imageWidth && y>imageY && y<imageY+imageHeight); } function handleMouseDown(e){ startX=parseInt(e.clientX-offsetX); startY=parseInt(e.clientY-offsetY); draggingResizer= anchorHitTest(startX,startY); draggingImage= draggingResizer<0 && hitImage(startX,startY); doRotation = draggingResizer<0 && !draggingImage && ctx.isPointInPath(startX,startY); } function handleMouseUp(e){ draggingResizer=-1; draggingImage=false; doRotation=false; draw(true,false); } function handleMouseOut(e){ handleMouseUp(e); } function handleMouseMove(e){ mouseX=parseInt(e.clientX-offsetX); mouseY=parseInt(e.clientY-offsetY); if(draggingResizer>-1){ switch(draggingResizer){ case 0: //top-left imageX=mouseX; imageWidth=imageRight-mouseX; imageY=mouseY; imageHeight=imageBottom-mouseY; break; case 1: //top-right imageY=mouseY; imageWidth=mouseX-imageX; imageHeight=imageBottom-mouseY; break; case 2: //bottom-right imageWidth=mouseX-imageX; imageHeight=mouseY-imageY; break; case 3: //bottom-left imageX=mouseX; imageWidth=imageRight-mouseX; imageHeight=mouseY-imageY; break; } if(imageWidth<25) imageWidth=25; if(imageHeight<25) imageHeight=25; imageRight=imageX+imageWidth; imageBottom=imageY+imageHeight; draw(true,true); }else if(draggingImage){ imageClick=false; var dx=mouseX-startX; var dy=mouseY-startY; imageX+=dx; imageY+=dy; imageRight+=dx; imageBottom+=dy; startX=mouseX; startY=mouseY; draw(false,true); }else if(doRotation){ var dx=mouseX-imageX; var dy=mouseY-imageY; r=Math.atan2(dy,dx); draw(false,true); } } $("#canvas").mousedown(function(e){handleMouseDown(e);}); $("#canvas").mousemove(function(e){handleMouseMove(e);}); $("#canvas").mouseup(function(e){handleMouseUp(e);}); $("#canvas").mouseout(function(e){handleMouseOut(e);}); }); </script> </head> <body> <canvas id="canvas" width=800 height=500></canvas> </body> </html>

    Read the article

  • Jquery change text ajax request problem

    - by blasteralfred
    Hi, I have an html file as coded below. <!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> <style> .style1 { background-color: #c3d9ff; font-family:arial,sans-serif; } .style2 { text-align: center; font-weight: bold; } .style3 { background-color: #FFFFFF; font-family:arial,sans-serif; text-align: center; font-weight: bold; } .style4 { background-color: #FFFFFF; font-family:arial,sans-serif; text-align: left; } body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:15px; background-color: ; } .action_button { font-weight:bold; float:right; } </style> <script type="text/javascript" src="jquery-1.4.4.min.js"></script> <script type="text/javascript">$(function() { $('.action_button').click(function() { var $button = $(this); $.ajax({ type: 'POST', url: 'action.php', data: 'id='+ $(this).attr('id'), cache: false, success: function(result) { var $row = $button.closest('tr'); var $col = $row.find('.clickme2'); $row.fadeOut('fast', function() { if (result == 'ACTIVATED') { $button.text('Activate'); $col.text('Active'); } else if (result == 'INACTIVATED') { $button.text('Inactivate'); $col.text('Inactive'); } }).fadeIn(); } }); return false; }); }); </script> </head> <body> <table style="width: 90%" align="center" class="style1"> <tr> <td colspan="7" class="style2">MANAGER</td> </tr> <tr> <td class="style3" style="width: 139px">Col1</td> <td class="style3" style="width: 139px">Col2</td> <td class="style3" style="width: 139px">Col3</td> <td class="style3" style="width: 139px">Col4</td> <td class="style3" style="width: 139px">Col5</td> <td class="style3" style="width: 200px">Col6</td> <td class="style3" style="">Action</td> </tr> </table> <td id="main" class="main"> <td class="update"> <table style="width: 90%" align="center" class="style1"> <tr> <td class="style4" style="width: 139px">DataA1</td> <td class="style4" style="width: 139px">DataA2</td> <td class="style4" style="width: 139px">DataA3</td> <td class="style4" style="width: 139px">DataA4</td> <td class="style4 clickme2" style="width: 139px">Inactive</td> <td class="style4" style="width: 200px">DataA6</td> <td> <button href="#" id="DataA1" class="action_button" style="width:80px;height:"> Activate</button> </td> </tr> <tr> <td class="style4" style="width: 139px">DataB1</td> <td class="style4" style="width: 139px">DataB2</td> <td class="style4" style="width: 139px">DataB3</td> <td class="style4" style="width: 139px">DataB4</td> <td class="style4 clickme2" style="width: 139px">Inactive</td> <td class="style4" style="width: 200px">DataB6</td> <td> <button href="#" id="DataB1" class="action_button" style="width:80px;height:"> Activate</button> </td> </tr> <tr> <td class="style4" style="width: 139px">DataC1</td> <td class="style4" style="width: 139px">DataC2</td> <td class="style4" style="width: 139px">DataC3</td> <td class="style4" style="width: 139px">DataC4</td> <td class="style4 clickme2" style="width: 139px">Active</td> <td class="style4" style="width: 200px">DataC6</td> <td> <button href="#" id="DataC1" class="action_button" style="width:80px;height:"> Inactivate</button> </td> </tr> <tr> <td class="style4" style="width: 139px">DataD1</td> <td class="style4" style="width: 139px">DataD2</td> <td class="style4" style="width: 139px">DataD3</td> <td class="style4" style="width: 139px">DataD4</td> <td class="style4 clickme2" style="width: 139px">Active</td> <td class="style4" style="width: 200px">DataD6</td> <td> <button href="#" id="DataD1" class="action_button" style="width:80px;height:"> Inactivate</button> </td> </tr> <tr> <td class="style4" style="width: 139px">DataE1</td> <td class="style4" style="width: 139px">DataE2</td> <td class="style4" style="width: 139px">DataE3</td> <td class="style4" style="width: 139px">DataE4</td> <td class="style4 clickme2" style="width: 139px">Inactive</td> <td class="style4" style="width: 200px">DataE6</td> <td> <button href="#" id="DataE1" class="action_button" style="width:80px;height:"> Activate</button> </td> </tr> </table> </td> </td> </body> </html> The fage contain a table with 5 rows with a button at the end of the row. On click, the button submits data to a php file and then changes text and blurs according to the response from php file. The blur function and change text function in col5 is working well. But the change text function in button got really buggy. The button text should change accordingly. the text of button "Activate" should change to "Inactivate" and the text of button "Inactivate" should change to "Activate" on click / successful submission.. This is not working.. Below is the php file code <?php $id = $_POST[id]; if($id=="DataA1"){ echo "ACTIVATED"; } if($id=="DataB1"){ echo "ACTIVATED"; } if($id=="DataE1"){ echo "ACTIVATED"; } if($id=="DataC1"){ echo "INACTIVATED"; } if($id=="DataD1"){ echo "INACTIVATED"; } ?> Thanks in advance.. :) blasteralfred

    Read the article

  • Intro Bar like stack overflow

    - by Dasa
    I have a simple top bar using jquery like the one on stackoverflow, but i want it to only appear on the first time a person visits the website. below is the HTML followed by the "bxSlider.js" file <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="bxSlider.js"></script> <title>topbar</title> <style type="text/css" media="screen"> #message { font-family:Arial,Helvetica,sans-serif; position:fixed; top:0px; left:0px; width:100%; z-index:105; text-align:center; color:white; padding:2px 0px 2px 0px; background-color:#8E1609; } #example1 { text-align: center; width: 80%; } .close-notify { white-space: nowrap; float:right; margin-right:10px; color:#fff; text-decoration:none; padding-left:3px; padding-right:3px } .close-notify a { color: #fff; } h4, p { margin:0px; padding:0px; } </style> </head> <body> <DIV ID='message' style="display: none;"> <DIV ID="example1"> <DIV CLASS="item"> <h4>Head 1</h4> <p>Text 1</p> </div><!-- end item --> <DIV CLASS="item"> <h4>Head 2</h4> <p>Text 2</p> </div><!-- end item --> </div><!-- end example1 --> <a href="#" CLASS="close-notify" onclick="closeNotice()">X</a> </div> <script type="text/javascript"> $(document).ready(function() { $("#message").fadeIn("slow"); $('#example1').bxSlider({ mode: 'slide', speed: 250, wrapper_CLASS: 'example1_container' }); }); function closeNotice() { $("#message").fadeOut("slow"); } </script> </body> </html> /** * * * bxSlider: Content slider / fade / ticker using the jQuery javascript library. * * Author: Steven Wanderski * Email: [email protected] * URL: http://bxslider.com * * **/ jQuery.fn.bxSlider = function(options){ ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Declare variables and functions ///////////////////////////////////////////////////////////////////////////////////////////////////////////// var defaults = { mode: 'slide', speed: 500, auto: false, auto_direction: 'left', pause: 2500, controls: true, prev_text: 'prev', next_text: 'next', width: $(this).children().width(), prev_img: '', next_img: '', ticker_direction: 'left', wrapper_class: 'container' }; options = $.extend(defaults, options); if(options.mode == 'ticker'){ options.auto = true; } var $this = $(this); var $parent_width = options.width; var current = 0; var is_working = false; var child_count = $this.children().size(); var i = 0; var j = 0; var k = 0; function animate_next(){ is_working = true; $this.animate({'left':'-' + $parent_width * 2 + 'px'}, options.speed, function(){ $this.css({'left':'-' + $parent_width + 'px'}).children(':first').appendTo($this); is_working = false; }); } function animate_prev(){ is_working = true; $this.animate({'left': 0}, options.speed, function(){ $this.css({'left':'-' + $parent_width + 'px'}).children(':last').insertBefore($this.children(':first')); is_working = false; }); } function fade(direction){ if(direction == 'next'){ var last_before_switch = child_count - 1; var start_over = 0; var incr = k + 1; }else if(direction == 'prev'){ var last_before_switch = 0; var start_over = child_count -1; var incr = k - 1; } is_working = true; if(k == last_before_switch){ $this.children().eq(k).fadeTo(options.speed, 0); $this.children().eq(start_over).fadeTo(options.speed, 1, function(){ is_working = false; k = start_over; }); }else{ $this.children().eq(k).fadeTo(options.speed, 0); $this.children().eq(incr).fadeTo(options.speed, 1, function(){ is_working = false; k = incr; }); } } function add_controls(){ ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Check if user selected images to use for next / prev ///////////////////////////////////////////////////////////////////////////////////////////////////////////// if(options.prev_img != '' || options.next_img != ''){ $this.parent().append('<a class="slider_prev" href=""><img src="' + options.prev_img + '" alt=""/></a><a class="slider_next" href=""><img src="' + options.next_img + '" alt="" /></a>'); }else{ $this.parent().append('<a class="slider_prev" href="">' + options.prev_text + '</a><a class="slider_next" href="">' + options.next_text + '</a>'); } $this.parent().find('.slider_prev').css({'float':'left', 'outline':'0', 'color':'yellow'}); $this.parent().find('.slider_next').css({'float':'right', 'outline':'0', 'color':'yellow'}); ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Accomodate padding-top for controls when elements are absolutely positioned (only in fade mode) ///////////////////////////////////////////////////////////////////////////////////////////////////////////// if(options.mode == 'fade'){ $this.parent().find('.slider_prev').css({'paddingTop' : $this.children().height()}) $this.parent().find('.slider_next').css({'paddingTop' : $this.children().height()}) } ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Actions when user clicks next / prev buttons ///////////////////////////////////////////////////////////////////////////////////////////////////////////// $this.parent().find('.slider_next').click(function(){ if(!is_working){ if(options.mode == 'slide'){ animate_next(); if(options.auto){ clearInterval($.t); $.t = setInterval(function(){animate_next();}, options.pause); } }else if(options.mode == 'fade'){ fade('next'); if(options.auto){ clearInterval($.t); $.t = setInterval(function(){fade('next');}, options.pause); } } } return false; }); $this.parent().find('.slider_prev').click(function(){ if(!is_working){ if(options.mode == 'slide'){ animate_prev(); if(options.auto){ clearInterval($.t); $.t = setInterval(function(){animate_prev();}, options.pause); } }else if(options.mode == 'fade'){ fade('prev'); if(options.auto){ clearInterval($.t); $.t = setInterval(function(){fade('prev');}, options.pause); } } } return false; }); } function ticker() { if(options.ticker_direction == 'left'){ $this.animate({'left':'-' + $parent_width * 2 + 'px'}, options.speed, 'linear', function(){ $this.css({'left':'-' + $parent_width + 'px'}).children(':first').appendTo($this); ticker(); }); }else if(options.ticker_direction == 'right'){ $this.animate({'left': 0}, options.speed, 'linear', function(){ $this.css({'left':'-' + $parent_width + 'px'}).children(':last').insertBefore($this.children(':first')); ticker(); }); } } ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Create content wrapper and set CSS ///////////////////////////////////////////////////////////////////////////////////////////////////////////// $this.wrap('<div class="' + options.wrapper_class + '"></div>'); //console.log($this.parent().css('paddingTop')); if(options.mode == 'slide' || options.mode == 'ticker'){ $this.parent().css({ 'overflow' : 'hidden', 'position' : 'relative', 'margin' : '0 auto', 'width' : options.width + 'px' }); $this.css({ 'width' : '999999px', 'position' : 'relative', 'left' : '-' + $parent_width + 'px' }); $this.children().css({ 'float' : 'left', 'width' : $parent_width }); $this.children(':last').insertBefore($this.children(':first')); }else if(options.mode == 'fade'){ $this.parent().css({ 'overflow' : 'hidden', 'position' : 'relative', 'width' : options.width + 'px' //'height' : $this.children().height() }); if(!options.controls){ $this.parent().css({'height' : $this.children().height()}); } $this.children().css({ 'position' : 'absolute', 'width' : $parent_width, 'listStyle' : 'none', 'opacity' : 0 }); $this.children(':first').css({ 'opacity' : 1 }); } ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Check if user selected "auto" ///////////////////////////////////////////////////////////////////////////////////////////////////////////// if(!options.auto){ add_controls(); }else{ if(options.mode == 'ticker'){ ticker(); }else{ ///////////////////////////////////////////////////////////////////////////////////////////////////////////// // Set a timed interval ///////////////////////////////////////////////////////////////////////////////////////////////////////////// if(options.mode == 'slide'){ if(options.auto_direction == 'left'){ $.t = setInterval(function(){animate_next();}, options.pause); }else if(options.auto_direction == 'right'){ $.t = setInterval(function(){animate_prev();}, options.pause); } }else if(options.mode == 'fade'){ if(options.auto_direction == 'left'){ $.t = setInterval(function(){fade('next');}, options.pause); }else if(options.auto_direction == 'right'){ $.t = setInterval(function(){fade('prev');}, options.pause); } } if(options.controls){ add_controls(); } } } }

    Read the article

  • HTML/jQuery/CSS Drop Down Menu Issue / Safari

    - by mmundiff
    I have a drop down menu that is coded in HTML, CSS, and jQuery and it works fine in Firefox and IE but not in Safari, and also not in Firefox on Mac. The drop down displays inline as opposed to list-item for the drop down in Safari. Any ideas why? <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript" > $(document).ready(function(){ $('#menu li').hover( function() { //$('ul', this).css('display', 'block'); $('ul', this).fadeIn(200); var src = $('img.item', this).attr('src').match(/[^\.]+/) + '_over.png'; $('img.item', this).attr('src', src); }, function() { //$('ul', this).css('display', 'none'); $('ul', this).fadeOut(350); var src = $('img.item', this).attr('src').replace('_over', ''); $('img.item', this).attr('src', src); }); }); </script> <style type="text/css"> /* General */ body { arial, sans-serif; background-color: white; } * { padding: 0; margin: 0; } #menu{ white-space:nowrap; list-style:none; margin-left: 1px; } #menu ul { list-style: none; position:absolute; left:0; display:none; margin:0 -3px 0 -1px; padding:0; background: #000000; z-index: 500; margin-top: -4px; } #menu li{ display:inline; float: left; /* Added */ position:relative; } #menu li a { display: block; } #menu ul li { width:116px; float:left; border-top:1px dotted #666666; display: block; } #menu li ul { display: none; border-top: 1px black solid; text-align: left; } #menu ul a:hover { text-decoration:none; background: #efda83; color: #000000; } #menu ul a { text-decoration:none; display:block; height:15px; padding: 8px 5px; color:#efda83; font-size: 12px; } img{ border: 0 none; } .clear{ clear: both; } </style> </head> <body> <div> <ul id="menu"> <li ><a href="index.php"><img src="images/ssr_nav_home.png" class="item" alt="Home" /></a> </li> <li ><a href="about.php"><img src="images/ssr_nav_about.png" class="item" alt="About" /></a> <ul> <li><a href="about_contributors.php">Contributors</a></li> <li><a href="about_behind.php">Behind the Exhibit</a></li> <li><a href="about_sponsors.php">Sponsors</a></li> </ul> <div class="clear"></div> </li> <li ><a href="exhibit_intro.php"><img class="item" src="images/ssr_nav_exhibit.png" alt="Exhibit" /></a> <ul> <li><a href="exhibit_intro.php">Intro</a></li> <li><a href="exhibit_silkroad.php">Silk Road</a></li> <li><a href="exhibit_western_regions.php">Western Regions</a></li> <li><a href="exhibit_daily_life.php">Daily Life</a></li> <li><a href="exhibit_burial_practices.php">Burial Practices</a></li> <li><a href="exhibit_relevance.php">Relevance</a></li> </ul> <div class="clear"></div> </li> <li ><a href="visit.php"><img class="item" src="images/ssr_nav_visit.png" alt="Visit" /></a> <ul> <li><a href="visit_tickets.php">Tickets</a></li> <li><a href="visit_specials.php">Special Offers</a></li> <li><a href="visit_tours.php">Tours</a></li> <li><a href="visit_groups.php">Groups</a></li> </ul> <div class="clear"></div> </li> <li ><a href="events.php"><img class="item" src="images/ssr_nav_events.png" alt="Events" /></a> <ul> <li><a href="events_lectures.php">Lecture Series</a></li> <li><a href="events_symposium.php">Symposium</a></li> <li><a href="kids_and_family.php">Kids &amp; Family</a></li> <li><a href="events_calendar.php">Event Calendar</a></li> </ul> <div class="clear"></div> </li> <li ><a href="gallery.php"><img class="item" src="images/ssr_nav_images.png" alt="Gallery" /></a></li> <li ><a href="resources.php"><img class="item" src="images/ssr_nav_resources.png" alt="Resources" /></a> <ul> <li><a href="resources_teachers.php">For Teachers</a></li> <li><a href="kids_and_family.php">Kids &amp; Family</a></li> <li><a href="http://www.penn.museum/podcasts-and-videos/819-secrets-of-the-silk-road.html" rel="external">Podcasts &amp; Videos</a></li> <!-- <li><a href="map.php">Silk Road Map</a></li> <li><a href="resources_timeline.php">Timeline</a></li> --> <li><a href="resources_quiz.php">Quiz</a></li> <li><a href="glossary.php">Glossary</a></li> <li><a href="blogs.php">Blog</a></li> </ul> <div class="clear"></div> </li> <li ><a href="press.php"><img class="item" src="images/ssr_nav_press.png" alt="Press" /></a> <ul> <li><a href="press_release.php">Press Release</a></li> <li><a href="press_images.php">Press Images</a></li> <li><a href="press_bloggers.php">Bloggers</a></li> </ul> <div class="clear"></div> </li> </ul> </div> </body> </html>

    Read the article

  • Drop Down not even showing up in IE6

    - by blackessej
    I've got a drop down menu here that just plain won't show up in IE6. The site works perfectly in every other browser. Seems daft to lose sleep over IE6, I know, but the site is for a demographic who could very well still be using it. Here's the CSS: html { height:100%; } body, p, a, ul, li, ol, h1, h2, h3, h4, h5, h6 { margin:0; padding:0; } body { behavior:url("csshover3.htc"); font-size:14px; font-family:Arial, Helvetica, sans-serif; background-color:#d3d3d3; height:100%; } h1 { font-size:18px; color:#752eca; text-decoration:none; } h2 { font-size:14px; color:#909090; text-decoration:none!important; } p { text-indent:20px; color:#000; } p a { color:#000; text-decoration:underline; } p.foot { text-indent:0px; } p.link { font-size:18px; color:#30F; text-decoration:underline!important; } a { color:#4d2288; text-decoration:none; outline:none; } a:visited { color:#4d2288; } p a:hover { text-decoration:underline!important; } ul#nav { padding:5px; margin:0px auto; width:100%; } ul#nav li a { display:block; font-weight:bold; padding:2px 10px; background:#bacddb; } ul#nav li a:hover { background:#888; color:#fff; } li { list-style:none; float:left; position:relative; width:225px; text-align:center; margin:0px auto; margin-right:4px; border:1px solid #4d2288; } li ul { display:none; position:relative; width:auto; top:0; left:0; margin-left:-1px; } li>ul { top:auto; left:auto; border-top:none; } li:hover ul, li.over ul { display:block; } ul#nav li.current a { background:#b8ab28; } ul#nav li.current a:hover { background:#888; } img { margin:10px 0 5px; } *html img { margin:20px; } .coltextimg { position:relative; float:left; background-position:left bottom; padding:0px 20px 10px 0px; border:none; } #maincontent { width:940px; margin:0px auto; postition:absolute; } *html #maincontent { margin-left:42px; } #header { float:left; width:100%; height:auto!important; height:100%; min-height:100%; margin:0px auto; background-image:url(images/banner_test.jpg); background-repeat:no-repeat; border:2px solid #752eca; -webkit-border-top-left-radius:10px; -webkit-border-top-right-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; border-top-left-radius:10px; border-top-right-radius:10px; } .colmask { position:relative; margin-top:160px; clear:both; float:left; width:100%; overflow:hidden; } .colright, .colmid { float:left; width:100%; position:relative; } .col1, .col2 { float:left; position:relative; padding:10px 0 1em 0; overflow:hidden; } .twocol { background:#fff; } .twocol .colmid { right:45%; background:#fff; } .twocol .col1 { width:51%; left:47%; text-align:justify; z-index:0; } .twocol .col2 { width:41%; left:51%; text-align:justify; z-index:0; } .twocol .colimg { border:2px solid #a0a0a0; } .twocol .colvid1 { width:360px; height:240px; } .twocol .colvid2 { width:360px; height:240px; } #footer { text-align:center; font-size:9px; padding:10px 0 1em 0; clear:both; width:100%; height:100%; } *html #footer { height:43px; } #footer p a { text-decoration:none; } #lyr_ddmenu { position:absolute; z-index:1; height:10px; top:120px; float:left; width:1000px; margin:0px auto; padding:5px; } #contact { position:absolute; float:right; font-size:10px; } A.Controls:link { color:#666666; text-decoration:none; font-weight:bold; } A.Controls:visited { color:#666666; text-decoration:none; font-weight:bold; } A.Controls:active { color:#666666; text-decoration:none; font-weight:bold; } A.Controls:hover { color:#be0000; text-decoration:none; font-weight:bold; } And here's the html I'm having the specific problem with: <div id="maincontent"> <div id="header"> <div id="lyr_ddmenu"> <ul id="nav"> <li class="current"><href here...</a> <ul class="sub"> <li><href here...</a></li> <li><href here...</a></li> <li><href here...</a></li> <li><href here...</a></li> <li><href here...</a></li> </ul></li> <li><href here...</a></li> <ul class="sub"> <li><href here...</a></li> <li><href here...</a></li> <li><href here...</a></li> <li><href here...</a></li> </ul></li> <li><href here...</a></li> <li><href here...</a></li> <ul class="sub"> <li><href here...</a></li> </ul></li> </ul> </div> Thanks!

    Read the article

  • Help with Collapse and Expand Accordion at same time using JQuery (demo)

    - by Evan
    I'm stuck on an Expand/Collapse accordion using JQuery. After the initial headline is clicked and it expands, if you click to another headline it will collapse the former headline completely FIRST then it will expand the headline you clicked. This collapse first then expand second technique is very distracting and what should happen is as the headline is expanding it should collapse the initial headline. What am I missing? You can experience a demo here: http://media.apus.edu/it/evan-testing/accordion.htm Below is all my work Javascript <script src="http://www.apus.edu/bin/l/y/jquery-1.3.2.min.js" type="text/javascript"></script> <script type="text/javascript"> //<!-- $(document).ready(function() { $(".accordian>li.expanded").removeClass("expanded"); $(".accordian>li h2").addClass("jse").click(function() { var doOpen = !$(this).parent().hasClass('expanded'); var openContainers = $(".accordian>li.expanded").length>0; var targetNode = this; if(openContainers) { $(".accordian>li.expanded h2") .parent() .removeClass('expanded') .end() .nextAll() .slideUp(100,function(){ if($(".accordian>li.expanded").length==0) performOpen(doOpen,targetNode); }); } else { performOpen(doOpen,targetNode); } // if containers are open, proceed on callback // else proceed immediately }).nextAll().slideUp(100); }); function performOpen(doOpen,whichNode) { if(doOpen) { $('html,body').animate({scrollTop: $(whichNode).offset().top}, 1000); //target code $(whichNode).nextAll().slideDown(100).parent().addClass('expanded'); } } //--> </script> CSS <style> .accordian { list-style : none; padding : 0px; margin : 0px; font-size : 12px; } .accordian li { list-style : none; padding : 0px; margin : 0px; } .accordian li a:hover { text-decoration : underline; } .accordian li h2 { cursor : auto; text-decoration : none; padding : 0px 0px 4px 22px; } .accordian li h2.jse { background-image : url(http://www.apus.edu/bin/m/p/toggle_arrow.gif); background-position : 4px -35px; background-repeat : no-repeat; } .accordian li h2:hover { cursor : pointer; text-decoration : underline; } .accordian li li { margin-bottom : 5px; margin-left : 0px; margin-top : 0px; padding : 0px; } .accordian li p { display : block; padding-top : 0px; padding-bottom : 15px; padding-left : 10px; margin-left : 30px; margin-top : 0px; } .accordian li ul { margin-bottom : 30px; margin-top : 0px; padding-top : 0px; padding-left : 0px; margin-left : 0px; } .accordian li.expanded h2.jse { background-position : 4px -5px; } .accordianContainer { margin-top : 0px; padding-top : 0px; } .accordianContainer h2 { padding : 3px; } .accordian_nolist { list-style : none; } </style> HTML <table height="120"><tr><td>&nbsp;</td></tr></table> <div class="accordianContainer"> <ul class="accordian"> <li><h2>Title 1 Goes here - Example</h2> <ul><li> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> </li></ul> </li> </ul> </div> <div class="accordianContainer"> <ul class="accordian"> <li><h2>Title 2 Goes here - Example</h2> <ul><li> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> </li></ul> </li> </ul> </div> <div class="accordianContainer"> <ul class="accordian"> <li><h2>Title 3 Goes here - Example</h2> <ul><li> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> </li></ul> </li> </ul> </div> <div class="accordianContainer"> <ul class="accordian"> <li><h2>Title 4 Goes here - Example</h2> <ul><li> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> </li></ul> </li> </ul> </div> <div class="accordianContainer"> <ul class="accordian"> <li><h2>Title 5 Goes here - Example</h2> <ul><li> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> this is where content goes<BR>this is where content goes<BR>this is where content goes<BR> </li></ul> </li> </ul> </div>

    Read the article

  • Fitting an Image to Screen on Rotation iPhone / iPad ?

    - by user356937
    I have been playing around with one of the iPhone examples from Apple' web site (ScrollViewSuite) . I am trying to tweak it a bit so that when I rotate the the iPad the image will fit into the screen in landscape mode vertical. I have been successful in getting the image to rotate, but the image is larger than the height of the landscape screen, so the bottom is below the screen. I would like to image to scale to the height of the landscape screen. I have been playing around with various autoSizingMask attributes without success. The imageView is called "zoomView" this is the actual image which loads into a scrollView called imageScrollView. I am trying to achieve the screen to rotate and look like this.... olsonvox.com/photos/correct.png However, this is what My screen is looking like. olsonvox.com/photos/incorrect.png I would really appreciate some advice or guidance. Below is the RootViewController.m for the project. Blade # import "RootViewController.h" #define ZOOM_VIEW_TAG 100 #define ZOOM_STEP 1.5 #define THUMB_HEIGHT 150 #define THUMB_V_PADDING 25 #define THUMB_H_PADDING 25 #define CREDIT_LABEL_HEIGHT 25 #define AUTOSCROLL_THRESHOLD 30 @interface RootViewController (ViewHandlingMethods) - (void)toggleThumbView; - (void)pickImageNamed:(NSString *)name; - (NSArray *)imageNames; - (void)createThumbScrollViewIfNecessary; - (void)createSlideUpViewIfNecessary; @end @interface RootViewController (AutoscrollingMethods) - (void)maybeAutoscrollForThumb:(ThumbImageView *)thumb; - (void)autoscrollTimerFired:(NSTimer *)timer; - (void)legalizeAutoscrollDistance; - (float)autoscrollDistanceForProximityToEdge:(float)proximity; @end @interface RootViewController (UtilityMethods) - (CGRect)zoomRectForScale:(float)scale withCenter:(CGPoint)center; @end @implementation RootViewController - (void)loadView { [super loadView]; imageScrollView = [[UIScrollView alloc] initWithFrame:[[self view]bounds]]; // this code makes the image resize to the width and height properly. imageScrollView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin| UIViewAutoresizingFlexibleBottomMargin| UIViewAutoresizingFlexibleBottomMargin; // TRY SETTNG CENTER HERE SOMEHOW&gt;.... [imageScrollView setBackgroundColor:[UIColor blackColor]]; [imageScrollView setDelegate:self]; [imageScrollView setBouncesZoom:YES]; [[self view] addSubview:imageScrollView]; [self toggleThumbView]; // intitializes with the first image. [self pickImageNamed:@"lookbook1"]; } - (void)dealloc { [imageScrollView release]; [slideUpView release]; [thumbScrollView release]; [super dealloc]; } #pragma mark UIScrollViewDelegate methods - (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView { UIView *view = nil; if (scrollView == imageScrollView) { view = [imageScrollView viewWithTag:ZOOM_VIEW_TAG]; } return view; } /************************************** NOTE **************************************/ /* The following delegate method works around a known bug in zoomToRect:animated: */ /* In the next release after 3.0 this workaround will no longer be necessary */ /**********************************************************************************/ - (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale { [scrollView setZoomScale:scale+0.01 animated:NO]; [scrollView setZoomScale:scale animated:NO]; } #pragma mark TapDetectingImageViewDelegate methods - (void)tapDetectingImageView:(TapDetectingImageView *)view gotSingleTapAtPoint:(CGPoint)tapPoint { // Single tap shows or hides drawer of thumbnails. [self toggleThumbView]; } - (void)tapDetectingImageView:(TapDetectingImageView *)view gotDoubleTapAtPoint:(CGPoint)tapPoint { // double tap zooms in float newScale = [imageScrollView zoomScale] * ZOOM_STEP; CGRect zoomRect = [self zoomRectForScale:newScale withCenter:tapPoint]; [imageScrollView zoomToRect:zoomRect animated:YES]; } - (void)tapDetectingImageView:(TapDetectingImageView *)view gotTwoFingerTapAtPoint:(CGPoint)tapPoint { // two-finger tap zooms out float newScale = [imageScrollView zoomScale] / ZOOM_STEP; CGRect zoomRect = [self zoomRectForScale:newScale withCenter:tapPoint]; [imageScrollView zoomToRect:zoomRect animated:YES]; } #pragma mark ThumbImageViewDelegate methods - (void)thumbImageViewWasTapped:(ThumbImageView *)tiv { [self pickImageNamed:[tiv imageName]]; [self toggleThumbView]; } - (void)thumbImageViewStartedTracking:(ThumbImageView *)tiv { [thumbScrollView bringSubviewToFront:tiv]; } // CONTROLS DRAGGING AND DROPPING THUMBNAILS... - (void)thumbImageViewMoved:(ThumbImageView *)draggingThumb { // check if we've moved close enough to an edge to autoscroll, or far enough away to stop autoscrolling [self maybeAutoscrollForThumb:draggingThumb]; /* The rest of this method handles the reordering of thumbnails in the thumbScrollView. See */ /* ThumbImageView.h and ThumbImageView.m for more information about how this works. */ // we'll reorder only if the thumb is overlapping the scroll view if (CGRectIntersectsRect([draggingThumb frame], [thumbScrollView bounds])) { BOOL draggingRight = [draggingThumb frame].origin.x &gt; [draggingThumb home].origin.x ? YES : NO; /* we're going to shift over all the thumbs who live between the home of the moving thumb */ /* and the current touch location. A thumb counts as living in this area if the midpoint */ /* of its home is contained in the area. */ NSMutableArray *thumbsToShift = [[NSMutableArray alloc] init]; // get the touch location in the coordinate system of the scroll view CGPoint touchLocation = [draggingThumb convertPoint:[draggingThumb touchLocation] toView:thumbScrollView]; // calculate minimum and maximum boundaries of the affected area float minX = draggingRight ? CGRectGetMaxX([draggingThumb home]) : touchLocation.x; float maxX = draggingRight ? touchLocation.x : CGRectGetMinX([draggingThumb home]); // iterate through thumbnails and see which ones need to move over for (ThumbImageView *thumb in [thumbScrollView subviews]) { // skip the thumb being dragged if (thumb == draggingThumb) continue; // skip non-thumb subviews of the scroll view (such as the scroll indicators) if (! [thumb isMemberOfClass:[ThumbImageView class]]) continue; float thumbMidpoint = CGRectGetMidX([thumb home]); if (thumbMidpoint &gt;= minX &amp;&amp; thumbMidpoint &lt;= maxX) { [thumbsToShift addObject:thumb]; } } // shift over the other thumbs to make room for the dragging thumb. (if we're dragging right, they shift to the left) float otherThumbShift = ([draggingThumb home].size.width + THUMB_H_PADDING) * (draggingRight ? -1 : 1); // as we shift over the other thumbs, we'll calculate how much the dragging thumb's home is going to move float draggingThumbShift = 0.0; // send each of the shifting thumbs to its new home for (ThumbImageView *otherThumb in thumbsToShift) { CGRect home = [otherThumb home]; home.origin.x += otherThumbShift; [otherThumb setHome:home]; [otherThumb goHome]; draggingThumbShift += ([otherThumb frame].size.width + THUMB_H_PADDING) * (draggingRight ? 1 : -1); } // change the home of the dragging thumb, but don't send it there because it's still being dragged CGRect home = [draggingThumb home]; home.origin.x += draggingThumbShift; [draggingThumb setHome:home]; } } - (void)thumbImageViewStoppedTracking:(ThumbImageView *)tiv { // if the user lets go of the thumb image view, stop autoscrolling [autoscrollTimer invalidate]; autoscrollTimer = nil; } #pragma mark Autoscrolling methods - (void)maybeAutoscrollForThumb:(ThumbImageView *)thumb { autoscrollDistance = 0; // only autoscroll if the thumb is overlapping the thumbScrollView if (CGRectIntersectsRect([thumb frame], [thumbScrollView bounds])) { CGPoint touchLocation = [thumb convertPoint:[thumb touchLocation] toView:thumbScrollView]; float distanceFromLeftEdge = touchLocation.x - CGRectGetMinX([thumbScrollView bounds]); float distanceFromRightEdge = CGRectGetMaxX([thumbScrollView bounds]) - touchLocation.x; if (distanceFromLeftEdge &lt; AUTOSCROLL_THRESHOLD) { autoscrollDistance = [self autoscrollDistanceForProximityToEdge:distanceFromLeftEdge] * -1; // if scrolling left, distance is negative } else if (distanceFromRightEdge &lt; AUTOSCROLL_THRESHOLD) { autoscrollDistance = [self autoscrollDistanceForProximityToEdge:distanceFromRightEdge]; } } // if no autoscrolling, stop and clear timer if (autoscrollDistance == 0) { [autoscrollTimer invalidate]; autoscrollTimer = nil; } // otherwise create and start timer (if we don't already have a timer going) else if (autoscrollTimer == nil) { autoscrollTimer = [NSTimer scheduledTimerWithTimeInterval:(1.0 / 60.0) target:self selector:@selector(autoscrollTimerFired:) userInfo:thumb repeats:YES]; } } - (float)autoscrollDistanceForProximityToEdge:(float)proximity { // the scroll distance grows as the proximity to the edge decreases, so that moving the thumb // further over results in faster scrolling. return ceilf((AUTOSCROLL_THRESHOLD - proximity) / 5.0); } - (void)legalizeAutoscrollDistance { // makes sure the autoscroll distance won't result in scrolling past the content of the scroll view float minimumLegalDistance = [thumbScrollView contentOffset].x * -1; float maximumLegalDistance = [thumbScrollView contentSize].width - ([thumbScrollView frame].size.width + [thumbScrollView contentOffset].x); autoscrollDistance = MAX(autoscrollDistance, minimumLegalDistance); autoscrollDistance = MIN(autoscrollDistance, maximumLegalDistance); } - (void)autoscrollTimerFired:(NSTimer*)timer { [self legalizeAutoscrollDistance]; // autoscroll by changing content offset CGPoint contentOffset = [thumbScrollView contentOffset]; contentOffset.x += autoscrollDistance; [thumbScrollView setContentOffset:contentOffset]; // adjust thumb position so it appears to stay still ThumbImageView *thumb = (ThumbImageView *)[timer userInfo]; [thumb moveByOffset:CGPointMake(autoscrollDistance, 0)]; } #pragma mark View handling methods - (void)toggleThumbView { [self createSlideUpViewIfNecessary]; // no-op if slideUpView has already been created CGRect frame = [slideUpView frame]; if (thumbViewShowing) { frame.origin.y = 0; } else { frame.origin.y = -225; } [UIView beginAnimations:nil context:nil]; [UIView setAnimationDuration:0.3]; [slideUpView setFrame:frame]; [UIView commitAnimations]; thumbViewShowing = !thumbViewShowing; } - (void)pickImageNamed:(NSString *)name { // first remove previous image view, if any [[imageScrollView viewWithTag:ZOOM_VIEW_TAG] removeFromSuperview]; UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"%@.jpg", name]]; TapDetectingImageView *zoomView = [[TapDetectingImageView alloc] initWithImage:image]; zoomView.autoresizingMask = UIViewAutoresizingFlexibleWidth ; [zoomView setDelegate:self]; [zoomView setTag:ZOOM_VIEW_TAG]; [imageScrollView addSubview:zoomView]; [imageScrollView setContentSize:[zoomView frame].size]; [zoomView release]; // choose minimum scale so image width fits screen float minScale = [imageScrollView frame].size.width / [zoomView frame].size.width; [imageScrollView setMinimumZoomScale:minScale]; [imageScrollView setZoomScale:minScale]; [imageScrollView setContentOffset:CGPointZero]; } - (NSArray *)imageNames { // the filenames are stored in a plist in the app bundle, so create array by reading this plist NSString *path = [[NSBundle mainBundle] pathForResource:@"Images" ofType:@"plist"]; NSData *plistData = [NSData dataWithContentsOfFile:path]; NSString *error; NSPropertyListFormat format; NSArray *imageNames = [NSPropertyListSerialization propertyListFromData:plistData mutabilityOption:NSPropertyListImmutable format:&amp;format errorDescription:&amp;error]; if (!imageNames) { NSLog(@"Failed to read image names. Error: %@", error); [error release]; } return imageNames; } - (void)createSlideUpViewIfNecessary { if (!slideUpView) { [self createThumbScrollViewIfNecessary]; CGRect bounds = [[self view] bounds]; float thumbHeight = [thumbScrollView frame].size.height; float labelHeight = CREDIT_LABEL_HEIGHT; // create label giving credit for images UILabel *creditLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, thumbHeight, bounds.size.width, labelHeight)]; [creditLabel setBackgroundColor:[UIColor clearColor]]; [creditLabel setTextColor:[UIColor whiteColor]]; // [creditLabel setFont:[UIFont fontWithName:@"Helvetica" size:16]]; // [creditLabel setText:@"SAMPLE TEXT"]; [creditLabel setTextAlignment:UITextAlignmentCenter]; // create container view that will hold scroll view and label CGRect frame = CGRectMake(0.0, -225.00, bounds.size.width+256, thumbHeight + labelHeight); slideUpView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleTopMargin; slideUpView = [[UIView alloc] initWithFrame:frame]; [slideUpView setBackgroundColor:[UIColor blackColor]]; [slideUpView setOpaque:NO]; [slideUpView setAlpha:.75]; [[self view] addSubview:slideUpView]; // add subviews to container view [slideUpView addSubview:thumbScrollView]; [slideUpView addSubview:creditLabel]; [creditLabel release]; } } - (void)createThumbScrollViewIfNecessary { if (!thumbScrollView) { float scrollViewHeight = THUMB_HEIGHT + THUMB_V_PADDING; float scrollViewWidth = [[self view] bounds].size.width; thumbScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, scrollViewWidth, scrollViewHeight)]; [thumbScrollView setCanCancelContentTouches:NO]; [thumbScrollView setClipsToBounds:NO]; // now place all the thumb views as subviews of the scroll view // and in the course of doing so calculate the content width float xPosition = THUMB_H_PADDING; for (NSString *name in [self imageNames]) { UIImage *thumbImage = [UIImage imageNamed:[NSString stringWithFormat:@"%@_thumb.jpg", name]]; if (thumbImage) { ThumbImageView *thumbView = [[ThumbImageView alloc] initWithImage:thumbImage]; [thumbView setDelegate:self]; [thumbView setImageName:name]; CGRect frame = [thumbView frame]; frame.origin.y = THUMB_V_PADDING; frame.origin.x = xPosition; [thumbView setFrame:frame]; [thumbView setHome:frame]; [thumbScrollView addSubview:thumbView]; [thumbView release]; xPosition += (frame.size.width + THUMB_H_PADDING); } } [thumbScrollView setContentSize:CGSizeMake(xPosition, scrollViewHeight)]; } } #pragma mark Utility methods - (CGRect)zoomRectForScale:(float)scale withCenter:(CGPoint)center { CGRect zoomRect; // the zoom rect is in the content view's coordinates. // At a zoom scale of 1.0, it would be the size of the imageScrollView's bounds. // As the zoom scale decreases, so more content is visible, the size of the rect grows. zoomRect.size.height = [imageScrollView frame].size.height / scale; zoomRect.size.width = [imageScrollView frame].size.width / scale; // choose an origin so as to get the right center. zoomRect.origin.x = center.x - (zoomRect.size.width / 2.0); zoomRect.origin.y = center.y - (zoomRect.size.height / 2.0); return zoomRect; } #pragma mark - #pragma mark Rotation support // Ensure that the view controller supports rotation and that the split view can therefore show in both portrait and landscape. - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation { return YES; } @end

    Read the article

  • c# Truncate HTML safely for article summary

    - by WickedW
    Hi All, Does anyone have a c# variation of this? This is so I can take some html and display it without breaking as a summary lead in to an article? http://stackoverflow.com/questions/1193500/php-truncate-html-ignoring-tags Save me from reinventing the wheel! Thank you very much ---------- edit ------------------ Sorry, new here, and your right, should have phrased the question better, heres a bit more info I wish to take a html string and truncate it to a set number of words (or even char length) so I can then show the start of it as a summary (which then leads to the main article). I wish to preserve the html so I can show the links etc in preview. The main issue I have to solve is the fact that we may well end up with unclosed html tags if we truncate in the middle of 1 or more tags! The idea I have for solution is to a) truncate the html to N words (words better but chars ok) first (be sure not to stop in the middle of a tag and truncate a require attribute) b) work through the opened html tags in this truncated string (maybe stick them on stack as I go?) c) then work through the closing tags and ensure they match the ones on stack as I pop them off? d) if any open tags left on stack after this, then write them to end of truncated string and html should be good to go!!!! -- edit 12112009 Here is what I have bumbled together so far as a unittest file in VS2008, this 'may' help someone in future My hack attempts based on Jan code are at top for char version + word version (DISCLAIMER: this is dirty rough code!! on my part) I assume working with 'well-formed' HTML in all cases (but not necessarily a full document with a root node as per XML version) Abels XML version is at bottom, but not yet got round to fully getting tests to run on this yet (plus need to understand the code) ... I will update when I get chance to refine having trouble with posting code? is there no upload facility on stack? Thanks for all comments :) using System; using System.Collections.Generic; using System.Text.RegularExpressions; using System.Xml; using System.Xml.XPath; using Microsoft.VisualStudio.TestTools.UnitTesting; namespace PINET40TestProject { [TestClass] public class UtilityUnitTest { public static string TruncateHTMLSafeishChar(string text, int charCount) { bool inTag = false; int cntr = 0; int cntrContent = 0; // loop through html, counting only viewable content foreach (Char c in text) { if (cntrContent == charCount) break; cntr++; if (c == '<') { inTag = true; continue; } if (c == '>') { inTag = false; continue; } if (!inTag) cntrContent++; } string substr = text.Substring(0, cntr); //search for nonclosed tags MatchCollection openedTags = new Regex("<[^/](.|\n)*?>").Matches(substr); MatchCollection closedTags = new Regex("<[/](.|\n)*?>").Matches(substr); // create stack Stack<string> opentagsStack = new Stack<string>(); Stack<string> closedtagsStack = new Stack<string>(); // to be honest, this seemed like a good idea then I got lost along the way // so logic is probably hanging by a thread!! foreach (Match tag in openedTags) { string openedtag = tag.Value.Substring(1, tag.Value.Length - 2); // strip any attributes, sure we can use regex for this! if (openedtag.IndexOf(" ") >= 0) { openedtag = openedtag.Substring(0, openedtag.IndexOf(" ")); } // ignore brs as self-closed if (openedtag.Trim() != "br") { opentagsStack.Push(openedtag); } } foreach (Match tag in closedTags) { string closedtag = tag.Value.Substring(2, tag.Value.Length - 3); closedtagsStack.Push(closedtag); } if (closedtagsStack.Count < opentagsStack.Count) { while (opentagsStack.Count > 0) { string tagstr = opentagsStack.Pop(); if (closedtagsStack.Count == 0 || tagstr != closedtagsStack.Peek()) { substr += "</" + tagstr + ">"; } else { closedtagsStack.Pop(); } } } return substr; } public static string TruncateHTMLSafeishWord(string text, int wordCount) { bool inTag = false; int cntr = 0; int cntrWords = 0; Char lastc = ' '; // loop through html, counting only viewable content foreach (Char c in text) { if (cntrWords == wordCount) break; cntr++; if (c == '<') { inTag = true; continue; } if (c == '>') { inTag = false; continue; } if (!inTag) { // do not count double spaces, and a space not in a tag counts as a word if (c == 32 && lastc != 32) cntrWords++; } } string substr = text.Substring(0, cntr) + " ..."; //search for nonclosed tags MatchCollection openedTags = new Regex("<[^/](.|\n)*?>").Matches(substr); MatchCollection closedTags = new Regex("<[/](.|\n)*?>").Matches(substr); // create stack Stack<string> opentagsStack = new Stack<string>(); Stack<string> closedtagsStack = new Stack<string>(); foreach (Match tag in openedTags) { string openedtag = tag.Value.Substring(1, tag.Value.Length - 2); // strip any attributes, sure we can use regex for this! if (openedtag.IndexOf(" ") >= 0) { openedtag = openedtag.Substring(0, openedtag.IndexOf(" ")); } // ignore brs as self-closed if (openedtag.Trim() != "br") { opentagsStack.Push(openedtag); } } foreach (Match tag in closedTags) { string closedtag = tag.Value.Substring(2, tag.Value.Length - 3); closedtagsStack.Push(closedtag); } if (closedtagsStack.Count < opentagsStack.Count) { while (opentagsStack.Count > 0) { string tagstr = opentagsStack.Pop(); if (closedtagsStack.Count == 0 || tagstr != closedtagsStack.Peek()) { substr += "</" + tagstr + ">"; } else { closedtagsStack.Pop(); } } } return substr; } public static string TruncateHTMLSafeishCharXML(string text, int charCount) { // your data, probably comes from somewhere, or as params to a methodint XmlDocument xml = new XmlDocument(); xml.LoadXml(text); // create a navigator, this is our primary tool XPathNavigator navigator = xml.CreateNavigator(); XPathNavigator breakPoint = null; // find the text node we need: while (navigator.MoveToFollowing(XPathNodeType.Text)) { string lastText = navigator.Value.Substring(0, Math.Min(charCount, navigator.Value.Length)); charCount -= navigator.Value.Length; if (charCount <= 0) { // truncate the last text. Here goes your "search word boundary" code: navigator.SetValue(lastText); breakPoint = navigator.Clone(); break; } } // first remove text nodes, because Microsoft unfortunately merges them without asking while (navigator.MoveToFollowing(XPathNodeType.Text)) { if (navigator.ComparePosition(breakPoint) == XmlNodeOrder.After) { navigator.DeleteSelf(); } } // moves to parent, then move the rest navigator.MoveTo(breakPoint); while (navigator.MoveToFollowing(XPathNodeType.Element)) { if (navigator.ComparePosition(breakPoint) == XmlNodeOrder.After) { navigator.DeleteSelf(); } } // moves to parent // then remove *all* empty nodes to clean up (not necessary): // TODO, add empty elements like <br />, <img /> as exclusion navigator.MoveToRoot(); while (navigator.MoveToFollowing(XPathNodeType.Element)) { while (!navigator.HasChildren && (navigator.Value ?? "").Trim() == "") { navigator.DeleteSelf(); } } // moves to parent navigator.MoveToRoot(); return navigator.InnerXml; } [TestMethod] public void TestTruncateHTMLSafeish() { // Case where we just make it to start of HREF (so effectively an empty link) // 'simple' nested none attributed tags Assert.AreEqual(@"<h1>1234</h1><b><i>56789</i>012</b>", TruncateHTMLSafeishChar( @"<h1>1234</h1><b><i>56789</i>012345</b>", 12)); // In middle of a! Assert.AreEqual(@"<h1>1234</h1><a href=""testurl""><b>567</b></a>", TruncateHTMLSafeishChar( @"<h1>1234</h1><a href=""testurl""><b>5678</b></a><i><strong>some italic nested in string</strong></i>", 7)); // more Assert.AreEqual(@"<div><b><i><strong>1</strong></i></b></div>", TruncateHTMLSafeishChar( @"<div><b><i><strong>12</strong></i></b></div>", 1)); // br Assert.AreEqual(@"<h1>1 3 5</h1><br />6", TruncateHTMLSafeishChar( @"<h1>1 3 5</h1><br />678<br />", 6)); } [TestMethod] public void TestTruncateHTMLSafeishWord() { // zero case Assert.AreEqual(@" ...", TruncateHTMLSafeishWord( @"", 5)); // 'simple' nested none attributed tags Assert.AreEqual(@"<h1>one two <br /></h1><b><i>three ...</i></b>", TruncateHTMLSafeishWord( @"<h1>one two <br /></h1><b><i>three </i>four</b>", 3), "we have added ' ...' to end of summary"); // In middle of a! Assert.AreEqual(@"<h1>one two three </h1><a href=""testurl""><b class=""mrclass"">four ...</b></a>", TruncateHTMLSafeishWord( @"<h1>one two three </h1><a href=""testurl""><b class=""mrclass"">four five </b></a><i><strong>some italic nested in string</strong></i>", 4)); // start of h1 Assert.AreEqual(@"<h1>one two three ...</h1>", TruncateHTMLSafeishWord( @"<h1>one two three </h1><a href=""testurl""><b>four five </b></a><i><strong>some italic nested in string</strong></i>", 3)); // more than words available Assert.AreEqual(@"<h1>one two three </h1><a href=""testurl""><b>four five </b></a><i><strong>some italic nested in string</strong></i> ...", TruncateHTMLSafeishWord( @"<h1>one two three </h1><a href=""testurl""><b>four five </b></a><i><strong>some italic nested in string</strong></i>", 99)); } [TestMethod] public void TestTruncateHTMLSafeishWordXML() { // zero case Assert.AreEqual(@" ...", TruncateHTMLSafeishWord( @"", 5)); // 'simple' nested none attributed tags string output = TruncateHTMLSafeishCharXML( @"<body><h1>one two </h1><b><i>three </i>four</b></body>", 13); Assert.AreEqual(@"<body>\r\n <h1>one two </h1>\r\n <b>\r\n <i>three</i>\r\n </b>\r\n</body>", output, "XML version, no ... yet and addeds '\r\n + spaces?' to format document"); // In middle of a! Assert.AreEqual(@"<h1>one two three </h1><a href=""testurl""><b class=""mrclass"">four ...</b></a>", TruncateHTMLSafeishCharXML( @"<body><h1>one two three </h1><a href=""testurl""><b class=""mrclass"">four five </b></a><i><strong>some italic nested in string</strong></i></body>", 4)); // start of h1 Assert.AreEqual(@"<h1>one two three ...</h1>", TruncateHTMLSafeishCharXML( @"<h1>one two three </h1><a href=""testurl""><b>four five </b></a><i><strong>some italic nested in string</strong></i>", 3)); // more than words available Assert.AreEqual(@"<h1>one two three </h1><a href=""testurl""><b>four five </b></a><i><strong>some italic nested in string</strong></i> ...", TruncateHTMLSafeishCharXML( @"<h1>one two three </h1><a href=""testurl""><b>four five </b></a><i><strong>some italic nested in string</strong></i>", 99)); } } }

    Read the article

  • Very different I/O performance in C++ on Windows

    - by Mr.Gate
    Hi all, I'm a new user and my english is not so good so I hope to be clear. We're facing a performance problem using large files (1GB or more) expecially (as it seems) when you try to grow them in size. Anyway... to verify our sensations we tryed the following (on Win 7 64Bit, 4core, 8GB Ram, 32 bit code compiled with VC2008) a) Open an unexisting file. Write it from the beginning up to 1Gb in 1Mb slots. Now you have a 1Gb file. Now randomize 10000 positions within that file, seek to that position and write 50 bytes in each position, no matter what you write. Close the file and look at the results. Time to create the file is quite fast (about 0.3"), time to write 10000 times is fast all the same (about 0.03"). Very good, this is the beginnig. Now try something else... b) Open an unexisting file, seek to 1Gb-1byte and write just 1 byte. Now you have another 1Gb file. Follow the next steps exactly same way of case 'a', close the file and look at the results. Time to create the file is the faster you can imagine (about 0.00009") but write time is something you can't believe.... about 90"!!!!! b.1) Open an unexisting file, don't write any byte. Act as before, ramdomizing, seeking and writing, close the file and look at the result. Time to write is long all the same: about 90"!!!!! Ok... this is quite amazing. But there's more! c) Open again the file you crated in case 'a', don't truncate it... randomize again 10000 positions and act as before. You're fast as before, about 0,03" to write 10000 times. This sounds Ok... try another step. d) Now open the file you created in case 'b', don't truncate it... randomize again 10000 positions and act as before. You're slow again and again, but the time is reduced to... 45"!! Maybe, trying again, the time will reduce. I actually wonder why... Any Idea? The following is part of the code I used to test what I told in previuos cases (you'll have to change someting in order to have a clean compilation, I just cut & paste from some source code, sorry). The sample can read and write, in random, ordered or reverse ordered mode, but write only in random order is the clearest test. We tryed using std::fstream but also using directly CreateFile(), WriteFile() and so on the results are the same (even if std::fstream is actually a little slower). Parameters for case 'a' = -f_tempdir_\casea.dat -n10000 -t -p -w Parameters for case 'b' = -f_tempdir_\caseb.dat -n10000 -t -v -w Parameters for case 'b.1' = -f_tempdir_\caseb.dat -n10000 -t -w Parameters for case 'c' = -f_tempdir_\casea.dat -n10000 -w Parameters for case 'd' = -f_tempdir_\caseb.dat -n10000 -w Run the test (and even others) and see... // iotest.cpp : Defines the entry point for the console application. // #include <windows.h> #include <iostream> #include <set> #include <vector> #include "stdafx.h" double RealTime_Microsecs() { LARGE_INTEGER fr = {0, 0}; LARGE_INTEGER ti = {0, 0}; double time = 0.0; QueryPerformanceCounter(&ti); QueryPerformanceFrequency(&fr); time = (double) ti.QuadPart / (double) fr.QuadPart; return time; } int main(int argc, char* argv[]) { std::string sFileName ; size_t stSize, stTimes, stBytes ; int retval = 0 ; char *p = NULL ; char *pPattern = NULL ; char *pReadBuf = NULL ; try { // Default stSize = 1<<30 ; // 1Gb stTimes = 1000 ; stBytes = 50 ; bool bTruncate = false ; bool bPre = false ; bool bPreFast = false ; bool bOrdered = false ; bool bReverse = false ; bool bWriteOnly = false ; // Comsumo i parametri for(int index=1; index < argc; ++index) { if ( '-' != argv[index][0] ) throw ; switch(argv[index][1]) { case 'f': sFileName = argv[index]+2 ; break ; case 's': stSize = xw::str::strtol(argv[index]+2) ; break ; case 'n': stTimes = xw::str::strtol(argv[index]+2) ; break ; case 'b':stBytes = xw::str::strtol(argv[index]+2) ; break ; case 't': bTruncate = true ; break ; case 'p' : bPre = true, bPreFast = false ; break ; case 'v' : bPreFast = true, bPre = false ; break ; case 'o' : bOrdered = true, bReverse = false ; break ; case 'r' : bReverse = true, bOrdered = false ; break ; case 'w' : bWriteOnly = true ; break ; default: throw ; break ; } } if ( sFileName.empty() ) { std::cout << "Usage: -f<File Name> -s<File Size> -n<Number of Reads and Writes> -b<Bytes per Read and Write> -t -p -v -o -r -w" << std::endl ; std::cout << "-t truncates the file, -p pre load the file, -v pre load 'veloce', -o writes in order mode, -r write in reverse order mode, -w Write Only" << std::endl ; std::cout << "Default: 1Gb, 1000 times, 50 bytes" << std::endl ; throw ; } if ( !stSize || !stTimes || !stBytes ) { std::cout << "Invalid Parameters" << std::endl ; return -1 ; } size_t stBestSize = 0x00100000 ; std::fstream fFile ; fFile.open(sFileName.c_str(), std::ios_base::binary|std::ios_base::out|std::ios_base::in|(bTruncate?std::ios_base::trunc:0)) ; p = new char[stBestSize] ; pPattern = new char[stBytes] ; pReadBuf = new char[stBytes] ; memset(p, 0, stBestSize) ; memset(pPattern, (int)(stBytes&0x000000ff), stBytes) ; double dTime = RealTime_Microsecs() ; size_t stCopySize, stSizeToCopy = stSize ; if ( bPre ) { do { stCopySize = std::min(stSizeToCopy, stBestSize) ; fFile.write(p, stCopySize) ; stSizeToCopy -= stCopySize ; } while (stSizeToCopy) ; std::cout << "Creating time is: " << xw::str::itoa(RealTime_Microsecs()-dTime, 5, 'f') << std::endl ; } else if ( bPreFast ) { fFile.seekp(stSize-1) ; fFile.write(p, 1) ; std::cout << "Creating Fast time is: " << xw::str::itoa(RealTime_Microsecs()-dTime, 5, 'f') << std::endl ; } size_t stPos ; ::srand((unsigned int)dTime) ; double dReadTime, dWriteTime ; stCopySize = stTimes ; std::vector<size_t> inVect ; std::vector<size_t> outVect ; std::set<size_t> outSet ; std::set<size_t> inSet ; // Prepare vector and set do { stPos = (size_t)(::rand()<<16) % stSize ; outVect.push_back(stPos) ; outSet.insert(stPos) ; stPos = (size_t)(::rand()<<16) % stSize ; inVect.push_back(stPos) ; inSet.insert(stPos) ; } while (--stCopySize) ; // Write & read using vectors if ( !bReverse && !bOrdered ) { std::vector<size_t>::iterator outI, inI ; outI = outVect.begin() ; inI = inVect.begin() ; stCopySize = stTimes ; dReadTime = 0.0 ; dWriteTime = 0.0 ; do { dTime = RealTime_Microsecs() ; fFile.seekp(*outI) ; fFile.write(pPattern, stBytes) ; dWriteTime += RealTime_Microsecs() - dTime ; ++outI ; if ( !bWriteOnly ) { dTime = RealTime_Microsecs() ; fFile.seekg(*inI) ; fFile.read(pReadBuf, stBytes) ; dReadTime += RealTime_Microsecs() - dTime ; ++inI ; } } while (--stCopySize) ; std::cout << "Write time is " << xw::str::itoa(dWriteTime, 5, 'f') << " (Ave: " << xw::str::itoa(dWriteTime/stTimes, 10, 'f') << ")" << std::endl ; if ( !bWriteOnly ) { std::cout << "Read time is " << xw::str::itoa(dReadTime, 5, 'f') << " (Ave: " << xw::str::itoa(dReadTime/stTimes, 10, 'f') << ")" << std::endl ; } } // End // Write in order if ( bOrdered ) { std::set<size_t>::iterator i = outSet.begin() ; dWriteTime = 0.0 ; stCopySize = 0 ; for(; i != outSet.end(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekp(stPos) ; fFile.write(pPattern, stBytes) ; dWriteTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Ordered Write time is " << xw::str::itoa(dWriteTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dWriteTime/stCopySize, 10, 'f') << ")" << std::endl ; if ( !bWriteOnly ) { i = inSet.begin() ; dReadTime = 0.0 ; stCopySize = 0 ; for(; i != inSet.end(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekg(stPos) ; fFile.read(pReadBuf, stBytes) ; dReadTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Ordered Read time is " << xw::str::itoa(dReadTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dReadTime/stCopySize, 10, 'f') << ")" << std::endl ; } }// End // Write in reverse order if ( bReverse ) { std::set<size_t>::reverse_iterator i = outSet.rbegin() ; dWriteTime = 0.0 ; stCopySize = 0 ; for(; i != outSet.rend(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekp(stPos) ; fFile.write(pPattern, stBytes) ; dWriteTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Reverse ordered Write time is " << xw::str::itoa(dWriteTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dWriteTime/stCopySize, 10, 'f') << ")" << std::endl ; if ( !bWriteOnly ) { i = inSet.rbegin() ; dReadTime = 0.0 ; stCopySize = 0 ; for(; i != inSet.rend(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekg(stPos) ; fFile.read(pReadBuf, stBytes) ; dReadTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Reverse ordered Read time is " << xw::str::itoa(dReadTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dReadTime/stCopySize, 10, 'f') << ")" << std::endl ; } }// End dTime = RealTime_Microsecs() ; fFile.close() ; std::cout << "Flush/Close Time is " << xw::str::itoa(RealTime_Microsecs()-dTime, 5, 'f') << std::endl ; std::cout << "Program Terminated" << std::endl ; } catch(...) { std::cout << "Something wrong or wrong parameters" << std::endl ; retval = -1 ; } if ( p ) delete []p ; if ( pPattern ) delete []pPattern ; if ( pReadBuf ) delete []pReadBuf ; return retval ; }

    Read the article

  • Passing array values using Ajax & JSP

    - by Maya
    This is my chart application... <script type="text/javascript" > function listbox_moveacross(sourceID, destID) { var src = document.getElementById(sourceID); var dest = document.getElementById(destID); for(var count=0; count < src.options.length; count++) { if(src.options[count].selected == true) { option = src.options[count]; newOption = document.createElement("option"); newOption.value = option.value; newOption.text = option.text; newOption.selected = true; try { dest.add(newOption,null); //Standard src.remove(count,null); alert("New Option Value: " + newOption.value); } catch(error) { dest.add(newOption); // IE only src.remove(count); alert("success IE User"); } count--; } } } function printValues(oSel) { len=oSel.options.length; for(var i=0;i<len;i++) { if(oSel.options[i].selected) { data+="\n"+ oSel.options[i].text + "["+ "\t" + oSel.options[i].value + "]"; } } type=document.getElementById("typeId"); type_text=type.options[type.selectedIndex].text; type_value=document.getElementById("typeId").value; } function GetSelectedItem() { len = document.chart.d.length; i = 0; chosen = ""; for (i = 0; i < len; i++) { if (document.chart.d[i].selected) { chosen = chosen + document.chart.d[i].value + "\n" } } return chosen } $(document).ready(function() { var d; var current_month; var month; var str; var w; var sel; var sel_data; var sel_data_value; $('.submit').click(function(){ // to get current month d=new Date(); month=new Array(12); month[0]="January"; month[1]="February"; month[2]="March"; month[3]="April"; month[4]="May"; month[5]="June"; month[6]="July"; month[7]="August"; month[8]="September"; month[9]="October"; month[10]="November"; month[11]="December"; current_month=d.getMonth(); str=month[d.getMonth()]; w=document.chart.periodId.selectedIndex; // to get selected index value.... sel=document.chart.periodId.options[w].text; // to get selected index value text... for(i=sel;i>=1;i--) { alert(month[i]); } sel_data=document.chart.d.selectedIndex; sel_data_value=document.chart.d.options[sel_data].text; var data_len=document.chart.d.length; var j=0; var chosen=""; for(j=0;j<data_len;j++) { if(document.chart.d.options[i].selected) { chosen=chosen+document.chart.d.options[i].value; } } chart = new Highcharts.Chart({ chart: { renderTo: 'container', defaultSeriesType: 'column' }, title: { text: document.chart.chartTitle.value }, subtitle: { text: 'Source: WorldClimate.com' }, xAxis: { categories: month }, yAxis: { min: 0, title: {text: 'Count' } }, legend: { layout: 'vertical', backgroundColor: '#FFFFFF', align: 'left', verticalAlign: 'top', x: 100, y: 70, floating: true, shadow: true }, tooltip: { formatter: function() { return ''+ this.x +': '+ this.y +' mm'; } }, plotOptions: { column: { pointPadding: 0.2, borderWidth: 0 } }, series: [{ name: sel_data_value, data: [50, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] }, { name: 'New York', data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3] }, { name: 'London', data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2] }, { name: 'Berlin', data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1] }] }); }); }); </script> <%! Connection con = null; Statement stmt = null; ResultSet rs = null; String url = "jdbc:postgresql://192.168.1.196:5432/autocube3"; String user = "autocube"; String pass = "autocube"; String query = ""; int mid; %> <% ChartCategory chartCategory = new ChartCategory(); chartCategory.setBar_name("vehicle reporting"); chartCategory.setMonth("3"); chartCategory.setValue("1000"); if (request.getParameter("mid") != null) { mid = Integer.parseInt(request.getParameter("mid")); } else { mid = 0; } Class.forName("org.postgresql.Driver"); con = DriverManager.getConnection(url, user, pass); System.out.println("Connected to Database"); stmt = con.createStatement(); rs = stmt.executeQuery("select code,description from plant"); %> </head> <body> <form method="post" name="chart"> <fieldset> <legend>Chart Options</legend> <br /> <!-- Plant Select box --> <label for="hstate">Plant:</label> <select name="plantId" size="1" id="plantId" > <!--onchange="selectPlant(this)" --> <% while (rs.next()) { %> <option value="<%=rs.getString("code")%>"><%=rs.getString("description")%></option> <% } String plant = request.getParameter("hstate"); System.out.println("Selected Plant" + request.getParameterValues("plantId")); %> </select> <br /> <label for="hcountry">Period</label> <select name="periodId" id="periodId"> <option value="0">1</option> <option value="1">2</option> <option value="2">3</option> <option value="3">4</option> <option value="4">5</option> <option value="5">6</option> <option value="6">7</option> <option value="7">8</option> <option value="8">9</option> <option value="9">10</option> <option value="10">11</option> <option value="11">12</option> </select> <br/> <!--Interval --> <label for="hstate" >Interval</label> <select name="intervalId" id="intervalId"> <option value="day">Day</option> <option value="month" selected>Month</option> </select> </fieldset> <fieldset> <legend>Chart Data</legend> <br/> <br/> <table > <tbody> <tr> <td> &emsp;<select multiple name="data" size="5" id="s" style="width: 230px; height: 130px;" > <% String[] list = ReportField.getList(); for (int i = 0; i < list.length; i++) { String field = ReportField.getFieldName(list[i]); %> <option value="<%=field%>"><%=list[i]%></option> <% //System.out.println("Names :" + list[i]); //System.out.println("Field Names :" + field); } %> </select> </td> <td> <input type="button" value=">>" onclick="listbox_moveacross('s', 'd')" /><br/> <input type="button" value="<<" onclick="listbox_moveacross('d', 's')" /> &emsp; </td> <td> &emsp; <select name="selectedData" size="5" id="d" style="width: 230px; height: 130px;"> </select></td> <% for (int i = 0; i <= 4; i++) { String arr = request.getParameter("selectedData"); System.out.println("Arrya" + arr); } %> </tr> </tbody> </table> <br/> </fieldset> <fieldset> <legend>Chart Info</legend> <br/> <label for="hstate" >Type</label> <select name="typeId" id="typeId"> <option value="" selected>select...</option> <option value="bar">Bar</option> <option value="pie" >Pie</option> <option value="line" >Line</option> </select> <br/> <label for="uname" id="titleId">Title </label> <input class="text" type="text" name="chartTitle"/> <br /> <label for="uemail2">Pin to Dash board:</label> <input class="text" type="checkbox" id="pinId" name="pinId"/> </fieldset> <input class="submit" type="button" value="Submit" /> <!--onclick="printValues(s)"--> </form> <div id="container" style="width: 800px; height: 400px; margin: 0 auto"> </div> </body> </html> using javascript function, am storing the selected listbox values in 'sel_data_value'. I need to pass this selected array values to database to retrieve values regarding selection. How can i do this using ajax. i don know how to pass array values in ajax and retrieve it from database. Thanks.

    Read the article

  • Very different IO performance in C/C++

    - by Roberto Tirabassi
    Hi all, I'm a new user and my english is not so good so I hope to be clear. We're facing a performance problem using large files (1GB or more) expecially (as it seems) when you try to grow them in size. Anyway... to verify our sensations we tryed the following (on Win 7 64Bit, 4core, 8GB Ram, 32 bit code compiled with VC2008) a) Open an unexisting file. Write it from the beginning up to 1Gb in 1Mb slots. Now you have a 1Gb file. Now randomize 10000 positions within that file, seek to that position and write 50 bytes in each position, no matter what you write. Close the file and look at the results. Time to create the file is quite fast (about 0.3"), time to write 10000 times is fast all the same (about 0.03"). Very good, this is the beginnig. Now try something else... b) Open an unexisting file, seek to 1Gb-1byte and write just 1 byte. Now you have another 1Gb file. Follow the next steps exactly same way of case 'a', close the file and look at the results. Time to create the file is the faster you can imagine (about 0.00009") but write time is something you can't believe.... about 90"!!!!! b.1) Open an unexisting file, don't write any byte. Act as before, ramdomizing, seeking and writing, close the file and look at the result. Time to write is long all the same: about 90"!!!!! Ok... this is quite amazing. But there's more! c) Open again the file you crated in case 'a', don't truncate it... randomize again 10000 positions and act as before. You're fast as before, about 0,03" to write 10000 times. This sounds Ok... try another step. d) Now open the file you created in case 'b', don't truncate it... randomize again 10000 positions and act as before. You're slow again and again, but the time is reduced to... 45"!! Maybe, trying again, the time will reduce. I actually wonder why... Any Idea? The following is part of the code I used to test what I told in previuos cases (you'll have to change someting in order to have a clean compilation, I just cut & paste from some source code, sorry). The sample can read and write, in random, ordered or reverse ordered mode, but write only in random order is the clearest test. We tryed using std::fstream but also using directly CreateFile(), WriteFile() and so on the results are the same (even if std::fstream is actually a little slower). Parameters for case 'a' = -f_tempdir_\casea.dat -n10000 -t -p -w Parameters for case 'b' = -f_tempdir_\caseb.dat -n10000 -t -v -w Parameters for case 'b.1' = -f_tempdir_\caseb.dat -n10000 -t -w Parameters for case 'c' = -f_tempdir_\casea.dat -n10000 -w Parameters for case 'd' = -f_tempdir_\caseb.dat -n10000 -w Run the test (and even others) and see... // iotest.cpp : Defines the entry point for the console application. // #include <windows.h> #include <iostream> #include <set> #include <vector> #include "stdafx.h" double RealTime_Microsecs() { LARGE_INTEGER fr = {0, 0}; LARGE_INTEGER ti = {0, 0}; double time = 0.0; QueryPerformanceCounter(&ti); QueryPerformanceFrequency(&fr); time = (double) ti.QuadPart / (double) fr.QuadPart; return time; } int main(int argc, char* argv[]) { std::string sFileName ; size_t stSize, stTimes, stBytes ; int retval = 0 ; char *p = NULL ; char *pPattern = NULL ; char *pReadBuf = NULL ; try { // Default stSize = 1<<30 ; // 1Gb stTimes = 1000 ; stBytes = 50 ; bool bTruncate = false ; bool bPre = false ; bool bPreFast = false ; bool bOrdered = false ; bool bReverse = false ; bool bWriteOnly = false ; // Comsumo i parametri for(int index=1; index < argc; ++index) { if ( '-' != argv[index][0] ) throw ; switch(argv[index][1]) { case 'f': sFileName = argv[index]+2 ; break ; case 's': stSize = xw::str::strtol(argv[index]+2) ; break ; case 'n': stTimes = xw::str::strtol(argv[index]+2) ; break ; case 'b':stBytes = xw::str::strtol(argv[index]+2) ; break ; case 't': bTruncate = true ; break ; case 'p' : bPre = true, bPreFast = false ; break ; case 'v' : bPreFast = true, bPre = false ; break ; case 'o' : bOrdered = true, bReverse = false ; break ; case 'r' : bReverse = true, bOrdered = false ; break ; case 'w' : bWriteOnly = true ; break ; default: throw ; break ; } } if ( sFileName.empty() ) { std::cout << "Usage: -f<File Name> -s<File Size> -n<Number of Reads and Writes> -b<Bytes per Read and Write> -t -p -v -o -r -w" << std::endl ; std::cout << "-t truncates the file, -p pre load the file, -v pre load 'veloce', -o writes in order mode, -r write in reverse order mode, -w Write Only" << std::endl ; std::cout << "Default: 1Gb, 1000 times, 50 bytes" << std::endl ; throw ; } if ( !stSize || !stTimes || !stBytes ) { std::cout << "Invalid Parameters" << std::endl ; return -1 ; } size_t stBestSize = 0x00100000 ; std::fstream fFile ; fFile.open(sFileName.c_str(), std::ios_base::binary|std::ios_base::out|std::ios_base::in|(bTruncate?std::ios_base::trunc:0)) ; p = new char[stBestSize] ; pPattern = new char[stBytes] ; pReadBuf = new char[stBytes] ; memset(p, 0, stBestSize) ; memset(pPattern, (int)(stBytes&0x000000ff), stBytes) ; double dTime = RealTime_Microsecs() ; size_t stCopySize, stSizeToCopy = stSize ; if ( bPre ) { do { stCopySize = std::min(stSizeToCopy, stBestSize) ; fFile.write(p, stCopySize) ; stSizeToCopy -= stCopySize ; } while (stSizeToCopy) ; std::cout << "Creating time is: " << xw::str::itoa(RealTime_Microsecs()-dTime, 5, 'f') << std::endl ; } else if ( bPreFast ) { fFile.seekp(stSize-1) ; fFile.write(p, 1) ; std::cout << "Creating Fast time is: " << xw::str::itoa(RealTime_Microsecs()-dTime, 5, 'f') << std::endl ; } size_t stPos ; ::srand((unsigned int)dTime) ; double dReadTime, dWriteTime ; stCopySize = stTimes ; std::vector<size_t> inVect ; std::vector<size_t> outVect ; std::set<size_t> outSet ; std::set<size_t> inSet ; // Prepare vector and set do { stPos = (size_t)(::rand()<<16) % stSize ; outVect.push_back(stPos) ; outSet.insert(stPos) ; stPos = (size_t)(::rand()<<16) % stSize ; inVect.push_back(stPos) ; inSet.insert(stPos) ; } while (--stCopySize) ; // Write & read using vectors if ( !bReverse && !bOrdered ) { std::vector<size_t>::iterator outI, inI ; outI = outVect.begin() ; inI = inVect.begin() ; stCopySize = stTimes ; dReadTime = 0.0 ; dWriteTime = 0.0 ; do { dTime = RealTime_Microsecs() ; fFile.seekp(*outI) ; fFile.write(pPattern, stBytes) ; dWriteTime += RealTime_Microsecs() - dTime ; ++outI ; if ( !bWriteOnly ) { dTime = RealTime_Microsecs() ; fFile.seekg(*inI) ; fFile.read(pReadBuf, stBytes) ; dReadTime += RealTime_Microsecs() - dTime ; ++inI ; } } while (--stCopySize) ; std::cout << "Write time is " << xw::str::itoa(dWriteTime, 5, 'f') << " (Ave: " << xw::str::itoa(dWriteTime/stTimes, 10, 'f') << ")" << std::endl ; if ( !bWriteOnly ) { std::cout << "Read time is " << xw::str::itoa(dReadTime, 5, 'f') << " (Ave: " << xw::str::itoa(dReadTime/stTimes, 10, 'f') << ")" << std::endl ; } } // End // Write in order if ( bOrdered ) { std::set<size_t>::iterator i = outSet.begin() ; dWriteTime = 0.0 ; stCopySize = 0 ; for(; i != outSet.end(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekp(stPos) ; fFile.write(pPattern, stBytes) ; dWriteTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Ordered Write time is " << xw::str::itoa(dWriteTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dWriteTime/stCopySize, 10, 'f') << ")" << std::endl ; if ( !bWriteOnly ) { i = inSet.begin() ; dReadTime = 0.0 ; stCopySize = 0 ; for(; i != inSet.end(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekg(stPos) ; fFile.read(pReadBuf, stBytes) ; dReadTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Ordered Read time is " << xw::str::itoa(dReadTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dReadTime/stCopySize, 10, 'f') << ")" << std::endl ; } }// End // Write in reverse order if ( bReverse ) { std::set<size_t>::reverse_iterator i = outSet.rbegin() ; dWriteTime = 0.0 ; stCopySize = 0 ; for(; i != outSet.rend(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekp(stPos) ; fFile.write(pPattern, stBytes) ; dWriteTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Reverse ordered Write time is " << xw::str::itoa(dWriteTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dWriteTime/stCopySize, 10, 'f') << ")" << std::endl ; if ( !bWriteOnly ) { i = inSet.rbegin() ; dReadTime = 0.0 ; stCopySize = 0 ; for(; i != inSet.rend(); ++i) { stPos = *i ; dTime = RealTime_Microsecs() ; fFile.seekg(stPos) ; fFile.read(pReadBuf, stBytes) ; dReadTime += RealTime_Microsecs() - dTime ; ++stCopySize ; } std::cout << "Reverse ordered Read time is " << xw::str::itoa(dReadTime, 5, 'f') << " in " << xw::str::itoa(stCopySize) << " (Ave: " << xw::str::itoa(dReadTime/stCopySize, 10, 'f') << ")" << std::endl ; } }// End dTime = RealTime_Microsecs() ; fFile.close() ; std::cout << "Flush/Close Time is " << xw::str::itoa(RealTime_Microsecs()-dTime, 5, 'f') << std::endl ; std::cout << "Program Terminated" << std::endl ; } catch(...) { std::cout << "Something wrong or wrong parameters" << std::endl ; retval = -1 ; } if ( p ) delete []p ; if ( pPattern ) delete []pPattern ; if ( pReadBuf ) delete []pReadBuf ; return retval ; }

    Read the article

  • How I can add JScroll bar to NavigableImagePanel which is an Image panel with an small navigation vi

    - by Sarah Kho
    Hi, I have the following NavigableImagePanel, it is under BSD license and I found it in the web. What I want to do with this panel is as follow: I want to add a JScrollPane to it in order to show images in their full size and let the users to re-center the image using the small navigation panel. Right now, the panel resize the images to fit them in the current panel size. I want it to load the image in its real size and let users to navigate to different parts of the image using the navigation panel. Source code for the panel: import java.awt.AWTEvent; import java.awt.BorderLayout; import java.awt.Color; import java.awt.Dimension; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.GraphicsEnvironment; import java.awt.Image; import java.awt.Point; import java.awt.Rectangle; import java.awt.RenderingHints; import java.awt.Toolkit; import java.awt.event.ComponentAdapter; import java.awt.event.ComponentEvent; import java.awt.event.MouseAdapter; import java.awt.event.MouseEvent; import java.awt.event.MouseMotionListener; import java.awt.event.MouseWheelEvent; import java.awt.event.MouseWheelListener; import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; import java.util.Arrays; import javax.imageio.ImageIO; import javax.swing.JFrame; import javax.swing.JOptionPane; import javax.swing.JPanel; import javax.swing.SwingUtilities; /** * @author pxt * */ public class NavigableImagePanel extends JPanel { /** * <p>Identifies a change to the zoom level.</p> */ public static final String ZOOM_LEVEL_CHANGED_PROPERTY = "zoomLevel"; /** * <p>Identifies a change to the zoom increment.</p> */ public static final String ZOOM_INCREMENT_CHANGED_PROPERTY = "zoomIncrement"; /** * <p>Identifies that the image in the panel has changed.</p> */ public static final String IMAGE_CHANGED_PROPERTY = "image"; private static final double SCREEN_NAV_IMAGE_FACTOR = 0.15; // 15% of panel's width private static final double NAV_IMAGE_FACTOR = 0.3; // 30% of panel's width private static final double HIGH_QUALITY_RENDERING_SCALE_THRESHOLD = 1.0; private static final Object INTERPOLATION_TYPE = RenderingHints.VALUE_INTERPOLATION_BILINEAR; private double zoomIncrement = 0.2; private double zoomFactor = 1.0 + zoomIncrement; private double navZoomFactor = 1.0 + zoomIncrement; private BufferedImage image; private BufferedImage navigationImage; private int navImageWidth; private int navImageHeight; private double initialScale = 0.0; private double scale = 0.0; private double navScale = 0.0; private int originX = 0; private int originY = 0; private Point mousePosition; private Dimension previousPanelSize; private boolean navigationImageEnabled = true; private boolean highQualityRenderingEnabled = true; private WheelZoomDevice wheelZoomDevice = null; private ButtonZoomDevice buttonZoomDevice = null; /** * <p>Defines zoom devices.</p> */ public static class ZoomDevice { /** * <p>Identifies that the panel does not implement zooming, * but the component using the panel does (programmatic zooming method).</p> */ public static final ZoomDevice NONE = new ZoomDevice("none"); /** * <p>Identifies the left and right mouse buttons as the zooming device.</p> */ public static final ZoomDevice MOUSE_BUTTON = new ZoomDevice("mouseButton"); /** * <p>Identifies the mouse scroll wheel as the zooming device.</p> */ public static final ZoomDevice MOUSE_WHEEL = new ZoomDevice("mouseWheel"); private String zoomDevice; private ZoomDevice(String zoomDevice) { this.zoomDevice = zoomDevice; } public String toString() { return zoomDevice; } } //This class is required for high precision image coordinates translation. private class Coords { public double x; public double y; public Coords(double x, double y) { this.x = x; this.y = y; } public int getIntX() { return (int)Math.round(x); } public int getIntY() { return (int)Math.round(y); } public String toString() { return "[Coords: x=" + x + ",y=" + y + "]"; } } private class WheelZoomDevice implements MouseWheelListener { public void mouseWheelMoved(MouseWheelEvent e) { Point p = e.getPoint(); boolean zoomIn = (e.getWheelRotation() < 0); if (isInNavigationImage(p)) { if (zoomIn) { navZoomFactor = 1.0 + zoomIncrement; } else { navZoomFactor = 1.0 - zoomIncrement; } zoomNavigationImage(); } else if (isInImage(p)) { if (zoomIn) { zoomFactor = 1.0 + zoomIncrement; } else { zoomFactor = 1.0 - zoomIncrement; } zoomImage(); } } } private class ButtonZoomDevice extends MouseAdapter { public void mouseClicked(MouseEvent e) { Point p = e.getPoint(); if (SwingUtilities.isRightMouseButton(e)) { if (isInNavigationImage(p)) { navZoomFactor = 1.0 - zoomIncrement; zoomNavigationImage(); } else if (isInImage(p)) { zoomFactor = 1.0 - zoomIncrement; zoomImage(); } } else { if (isInNavigationImage(p)) { navZoomFactor = 1.0 + zoomIncrement; zoomNavigationImage(); } else if (isInImage(p)) { zoomFactor = 1.0 + zoomIncrement; zoomImage(); } } } } /** * <p>Creates a new navigable image panel with no default image and * the mouse scroll wheel as the zooming device.</p> */ public NavigableImagePanel() { setOpaque(false); addComponentListener(new ComponentAdapter() { public void componentResized(ComponentEvent e) { if (scale > 0.0) { if (isFullImageInPanel()) { centerImage(); } else if (isImageEdgeInPanel()) { scaleOrigin(); } if (isNavigationImageEnabled()) { createNavigationImage(); } repaint(); } previousPanelSize = getSize(); } }); addMouseListener(new MouseAdapter() { public void mousePressed(MouseEvent e) { if (SwingUtilities.isLeftMouseButton(e)) { if (isInNavigationImage(e.getPoint())) { Point p = e.getPoint(); displayImageAt(p); } } } public void mouseClicked(MouseEvent e){ if (e.getClickCount() == 2) { resetImage(); } } }); addMouseMotionListener(new MouseMotionListener() { public void mouseDragged(MouseEvent e) { if (SwingUtilities.isLeftMouseButton(e) && !isInNavigationImage(e.getPoint())) { Point p = e.getPoint(); moveImage(p); } } public void mouseMoved(MouseEvent e) { //we need the mouse position so that after zooming //that position of the image is maintained mousePosition = e.getPoint(); } }); setZoomDevice(ZoomDevice.MOUSE_WHEEL); } /** * <p>Creates a new navigable image panel with the specified image * and the mouse scroll wheel as the zooming device.</p> */ public NavigableImagePanel(BufferedImage image) throws IOException { this(); setImage(image); } private void addWheelZoomDevice() { if (wheelZoomDevice == null) { wheelZoomDevice = new WheelZoomDevice(); addMouseWheelListener(wheelZoomDevice); } } private void addButtonZoomDevice() { if (buttonZoomDevice == null) { buttonZoomDevice = new ButtonZoomDevice(); addMouseListener(buttonZoomDevice); } } private void removeWheelZoomDevice() { if (wheelZoomDevice != null) { removeMouseWheelListener(wheelZoomDevice); wheelZoomDevice = null; } } private void removeButtonZoomDevice() { if (buttonZoomDevice != null) { removeMouseListener(buttonZoomDevice); buttonZoomDevice = null; } } /** * <p>Sets a new zoom device.</p> * * @param newZoomDevice specifies the type of a new zoom device. */ public void setZoomDevice(ZoomDevice newZoomDevice) { if (newZoomDevice == ZoomDevice.NONE) { removeWheelZoomDevice(); removeButtonZoomDevice(); } else if (newZoomDevice == ZoomDevice.MOUSE_BUTTON) { removeWheelZoomDevice(); addButtonZoomDevice(); } else if (newZoomDevice == ZoomDevice.MOUSE_WHEEL) { removeButtonZoomDevice(); addWheelZoomDevice(); } } /** * <p>Gets the current zoom device.</p> */ public ZoomDevice getZoomDevice() { if (buttonZoomDevice != null) { return ZoomDevice.MOUSE_BUTTON; } else if (wheelZoomDevice != null) { return ZoomDevice.MOUSE_WHEEL; } else { return ZoomDevice.NONE; } } //Called from paintComponent() when a new image is set. private void initializeParams() { double xScale = (double)getWidth() / image.getWidth(); double yScale = (double)getHeight() / image.getHeight(); initialScale = Math.min(xScale, yScale); scale = initialScale; //An image is initially centered centerImage(); if (isNavigationImageEnabled()) { createNavigationImage(); } } //Centers the current image in the panel. private void centerImage() { originX = (int)(getWidth() - getScreenImageWidth()) / 2; originY = (int)(getHeight() - getScreenImageHeight()) / 2; } //Creates and renders the navigation image in the upper let corner of the panel. private void createNavigationImage() { //We keep the original navigation image larger than initially //displayed to allow for zooming into it without pixellation effect. navImageWidth = (int)(getWidth() * NAV_IMAGE_FACTOR); navImageHeight = navImageWidth * image.getHeight() / image.getWidth(); int scrNavImageWidth = (int)(getWidth() * SCREEN_NAV_IMAGE_FACTOR); int scrNavImageHeight = scrNavImageWidth * image.getHeight() / image.getWidth(); navScale = (double)scrNavImageWidth / navImageWidth; navigationImage = new BufferedImage(navImageWidth, navImageHeight, image.getType()); Graphics g = navigationImage.getGraphics(); g.drawImage(image, 0, 0, navImageWidth, navImageHeight, null); } /** * <p>Sets an image for display in the panel.</p> * * @param image an image to be set in the panel */ public void setImage(BufferedImage image) { BufferedImage oldImage = this.image; this.image = image; //Reset scale so that initializeParameters() is called in paintComponent() //for the new image. scale = 0.0; firePropertyChange(IMAGE_CHANGED_PROPERTY, (Image)oldImage, (Image)image); repaint(); } /** * <p>resets an image to the centre of the panel</p> * */ public void resetImage() { BufferedImage oldImage = this.image; this.image = image; //Reset scale so that initializeParameters() is called in paintComponent() //for the new image. scale = 0.0; firePropertyChange(IMAGE_CHANGED_PROPERTY, (Image)oldImage, (Image)image); repaint(); } /** * <p>Tests whether an image uses the standard RGB color space.</p> */ public static boolean isStandardRGBImage(BufferedImage bImage) { return bImage.getColorModel().getColorSpace().isCS_sRGB(); } //Converts this panel's coordinates into the original image coordinates private Coords panelToImageCoords(Point p) { return new Coords((p.x - originX) / scale, (p.y - originY) / scale); } //Converts the original image coordinates into this panel's coordinates private Coords imageToPanelCoords(Coords p) { return new Coords((p.x * scale) + originX, (p.y * scale) + originY); } //Converts the navigation image coordinates into the zoomed image coordinates private Point navToZoomedImageCoords(Point p) { int x = p.x * getScreenImageWidth() / getScreenNavImageWidth(); int y = p.y * getScreenImageHeight() / getScreenNavImageHeight(); return new Point(x, y); } //The user clicked within the navigation image and this part of the image //is displayed in the panel. //The clicked point of the image is centered in the panel. private void displayImageAt(Point p) { Point scrImagePoint = navToZoomedImageCoords(p); originX = -(scrImagePoint.x - getWidth() / 2); originY = -(scrImagePoint.y - getHeight() / 2); repaint(); } //Tests whether a given point in the panel falls within the image boundaries. private boolean isInImage(Point p) { Coords coords = panelToImageCoords(p); int x = coords.getIntX(); int y = coords.getIntY(); return (x >= 0 && x < image.getWidth() && y >= 0 && y < image.getHeight()); } //Tests whether a given point in the panel falls within the navigation image //boundaries. private boolean isInNavigationImage(Point p) { return (isNavigationImageEnabled() && p.x < getScreenNavImageWidth() && p.y < getScreenNavImageHeight()); } //Used when the image is resized. private boolean isImageEdgeInPanel() { if (previousPanelSize == null) { return false; } return (originX > 0 && originX < previousPanelSize.width || originY > 0 && originY < previousPanelSize.height); } //Tests whether the image is displayed in its entirety in the panel. private boolean isFullImageInPanel() { return (originX >= 0 && (originX + getScreenImageWidth()) < getWidth() && originY >= 0 && (originY + getScreenImageHeight()) < getHeight()); } /** * <p>Indicates whether the high quality rendering feature is enabled.</p> * * @return true if high quality rendering is enabled, false otherwise. */ public boolean isHighQualityRenderingEnabled() { return highQualityRenderingEnabled; } /** * <p>Enables/disables high quality rendering.</p> * * @param enabled enables/disables high quality rendering */ public void setHighQualityRenderingEnabled(boolean enabled) { highQualityRenderingEnabled = enabled; } //High quality rendering kicks in when when a scaled image is larger //than the original image. In other words, //when image decimation stops and interpolation starts. private boolean isHighQualityRendering() { return (highQualityRenderingEnabled && scale > HIGH_QUALITY_RENDERING_SCALE_THRESHOLD); } /** * <p>Indicates whether navigation image is enabled.<p> * * @return true when navigation image is enabled, false otherwise. */ public boolean isNavigationImageEnabled() { return navigationImageEnabled; } /** * <p>Enables/disables navigation with the navigation image.</p> * <p>Navigation image should be disabled when custom, programmatic navigation * is implemented.</p> * * @param enabled true when navigation image is enabled, false otherwise. */ public void setNavigationImageEnabled(boolean enabled) { navigationImageEnabled = enabled; repaint(); } //Used when the panel is resized private void scaleOrigin() { originX = originX * getWidth() / previousPanelSize.width; originY = originY * getHeight() / previousPanelSize.height; repaint(); } //Converts the specified zoom level to scale. private double zoomToScale(double zoom) { return initialScale * zoom; } /** * <p>Gets the current zoom level.</p> * * @return the current zoom level */ public double getZoom() { return scale / initialScale; } /** * <p>Sets the zoom level used to display the image.</p> * <p>This method is used in programmatic zooming. The zooming center is * the point of the image closest to the center of the panel. * After a new zoom level is set the image is repainted.</p> * * @param newZoom the zoom level used to display this panel's image. */ public void setZoom(double newZoom) { Point zoomingCenter = new Point(getWidth() / 2, getHeight() / 2); setZoom(newZoom, zoomingCenter); } /** * <p>Sets the zoom level used to display the image, and the zooming center, * around which zooming is done.</p> * <p>This method is used in programmatic zooming. * After a new zoom level is set the image is repainted.</p> * * @param newZoom the zoom level used to display this panel's image. */ public void setZoom(double newZoom, Point zoomingCenter) { Coords imageP = panelToImageCoords(zoomingCenter); if (imageP.x < 0.0) { imageP.x = 0.0; } if (imageP.y < 0.0) { imageP.y = 0.0; } if (imageP.x >= image.getWidth()) { imageP.x = image.getWidth() - 1.0; } if (imageP.y >= image.getHeight()) { imageP.y = image.getHeight() - 1.0; } Coords correctedP = imageToPanelCoords(imageP); double oldZoom = getZoom(); scale = zoomToScale(newZoom); Coords panelP = imageToPanelCoords(imageP); originX += (correctedP.getIntX() - (int)panelP.x); originY += (correctedP.getIntY() - (int)panelP.y); firePropertyChange(ZOOM_LEVEL_CHANGED_PROPERTY, new Double(oldZoom), new Double(getZoom())); repaint(); } /** * <p>Gets the current zoom increment.</p> * * @return the current zoom increment */ public double getZoomIncrement() { return zoomIncrement; } /** * <p>Sets a new zoom increment value.</p> * * @param newZoomIncrement new zoom increment value */ public void setZoomIncrement(double newZoomIncrement) { double oldZoomIncrement = zoomIncrement; zoomIncrement = newZoomIncrement; firePropertyChange(ZOOM_INCREMENT_CHANGED_PROPERTY, new Double(oldZoomIncrement), new Double(zoomIncrement)); } //Zooms an image in the panel by repainting it at the new zoom level. //The current mouse position is the zooming center. private void zoomImage() { Coords imageP = panelToImageCoords(mousePosition); double oldZoom = getZoom(); scale *= zoomFactor; Coords panelP = imageToPanelCoords(imageP); originX += (mousePosition.x - (int)panelP.x); originY += (mousePosition.y - (int)panelP.y); firePropertyChange(ZOOM_LEVEL_CHANGED_PROPERTY, new Double(oldZoom), new Double(getZoom())); repaint(); } //Zooms the navigation image private void zoomNavigationImage() { navScale *= navZoomFactor; repaint(); } /** * <p>Gets the image origin.</p> * <p>Image origin is defined as the upper, left corner of the image in * the panel's coordinate system.</p> * @return the point of the upper, left corner of the image in the panel's coordinates * system. */ public Point getImageOrigin() { return new Point(originX, originY); } /** * <p>Sets the image origin.</p> * <p>Image origin is defined as the upper, left corner of the image in * the panel's coordinate system. After a new origin is set, the image is repainted. * This method is used for programmatic image navigation.</p>

    Read the article

  • problem with sIFR 3 not displaying in IE just getting XXX

    - by user288306
    I am having a problem with sIFR 3 not displaying in IE. I get 3 larges black XXX in IE yet it displays fine in Firefox. I have checked i do have the most recent version of flash installed correctly. Here is the code on the page <div id="features"> <div id="mainmessage_advertisers"><h2>Advertisers</h2><br /><br /><h3><a href="">Reach your customers where they browse. Buy directly from top web publishers.</a></h3><br /><br /><br /><a href=""><img src="img/buyads.gif" border="0"></a></div> <div id="mainmessage_publishers"><h2>Publishers</h2><br /><br /><h3>Take control of your ad space and start generating more revenue than <u>ever before</u>.</h3><br /><br /><br /><a href=""><img src="img/sellads.gif" border="0"></a></div> </div>` Here is the code from my global.css #mainmessage_advertisers { width: 395px; height: 200px; padding: 90px 50px; border: 1px; float: left; } #mainmessage_publishers { width: 395px; height: 200px; padding: 90px 50px; float: right; } and here is what i have in my sifr.js /*********************************************************************** SIFR 3.0 (BETA 1) FUNCTIONS ************************************************************************/ var parseSelector=(function(){var _1=/\s*,\s*/;var _2=/\s*([\s>+~(),]|^|$)\s*/g;var _3=/([\s>+~,]|[^(]\+|^)([#.:@])/g;var _4=/^[^\s>+~]/;var _5=/[\s#.:>+~()@]|[^\s#.:>+~()@]+/g;function parseSelector(_6,_7){_7=_7||document.documentElement;var _8=_6.split(_1),_9=[];for(var i=0;i<_8.length;i++){var _b=[_7],_c=toStream(_8[i]);for(var j=0;j<_c.length;){var _e=_c[j++],_f=_c[j++],_10="";if(_c[j]=="("){while(_c[j++]!=")"&&j<_c.length){_10+=_c[j]}_10=_10.slice(0,-1)}_b=select(_b,_e,_f,_10)}_9=_9.concat(_b)}return _9}function toStream(_11){var _12=_11.replace(_2,"$1").replace(_3,"$1*$2");if(_4.test(_12)){_12=" "+_12}return _12.match(_5)||[]}function select(_13,_14,_15,_16){return (_17[_14])?_17[_14](_13,_15,_16):[]}var _18={toArray:function(_19){var a=[];for(var i=0;i<_19.length;i++){a.push(_19[i])}return a}};var dom={isTag:function(_1d,tag){return (tag=="*")||(tag.toLowerCase()==_1d.nodeName.toLowerCase())},previousSiblingElement:function(_1f){do{_1f=_1f.previousSibling}while(_1f&&_1f.nodeType!=1);return _1f},nextSiblingElement:function(_20){do{_20=_20.nextSibling}while(_20&&_20.nodeType!=1);return _20},hasClass:function(_21,_22){return (_22.className||"").match("(^|\\s)"+_21+"(\\s|$)")},getByTag:function(tag,_24){return _24.getElementsByTagName(tag)}};var _17={"#":function(_25,_26){for(var i=0;i<_25.length;i++){if(_25[i].getAttribute("id")==_26){return [_25[i]]}}return []}," ":function(_28,_29){var _2a=[];for(var i=0;i<_28.length;i++){_2a=_2a.concat(_18.toArray(dom.getByTag(_29,_28[i])))}return _2a},">":function(_2c,_2d){var _2e=[];for(var i=0,_30;i<_2c.length;i++){_30=_2c[i];for(var j=0,_32;j<_30.childNodes.length;j++){_32=_30.childNodes[j];if(_32.nodeType==1&&dom.isTag(_32,_2d)){_2e.push(_32)}}}return _2e},".":function(_33,_34){var _35=[];for(var i=0,_37;i<_33.length;i++){_37=_33[i];if(dom.hasClass([_34],_37)){_35.push(_37)}}return _35},":":function(_38,_39,_3a){return (pseudoClasses[_39])?pseudoClasses[_39](_38,_3a):[]}};parseSelector.selectors=_17;parseSelector.pseudoClasses={};parseSelector.util=_18;parseSelector.dom=dom;return parseSelector})(); var sIFR=new function(){var _3b=this;var _3c="sIFR-active";var _3d="sIFR-replaced";var _3e="sIFR-flash";var _3f="sIFR-ignore";var _40="sIFR-alternate";var _41="sIFR-class";var _42="sIFR-layout";var _43="http://www.w3.org/1999/xhtml";var _44=6;var _45=126;var _46=8;var _47="SIFR-PREFETCHED";var _48=" ";this.isActive=false;this.isEnabled=true;this.hideElements=true;this.replaceNonDisplayed=false;this.preserveSingleWhitespace=false;this.fixWrap=true;this.registerEvents=true;this.setPrefetchCookie=true;this.cookiePath="/";this.domains=[];this.fromLocal=true;this.forceClear=false;this.forceWidth=true;this.fitExactly=false;this.forceTextTransform=true;this.useDomContentLoaded=true;this.debugMode=false;this.hasFlashClassSet=false;var _49=0;var _4a=false,_4b=false;var dom=new function(){this.getBody=function(){var _4d=document.getElementsByTagName("body");if(_4d.length==1){return _4d[0]}return null};this.addClass=function(_4e,_4f){if(_4f){_4f.className=((_4f.className||"")==""?"":_4f.className+" ")+_4e}};this.removeClass=function(_50,_51){if(_51){_51.className=_51.className.replace(new RegExp("(^|\\s)"+_50+"(\\s|$)"),"").replace(/^\s+|(\s)\s+/g,"$1")}};this.hasClass=function(_52,_53){return new RegExp("(^|\\s)"+_52+"(\\s|$)").test(_53.className)};this.create=function(_54){if(document.createElementNS){return document.createElementNS(_43,_54)}return document.createElement(_54)};this.setInnerHtml=function(_55,_56){if(ua.innerHtmlSupport){_55.innerHTML=_56}else{if(ua.xhtmlSupport){_56=["<root xmlns=\"",_43,"\">",_56,"</root>"].join("");var xml=(new DOMParser()).parseFromString(_56,"text/xml");xml=document.importNode(xml.documentElement,true);while(_55.firstChild){_55.removeChild(_55.firstChild)}while(xml.firstChild){_55.appendChild(xml.firstChild)}}}};this.getComputedStyle=function(_58,_59){var _5a;if(document.defaultView&&document.defaultView.getComputedStyle){_5a=document.defaultView.getComputedStyle(_58,null)[_59]}else{if(_58.currentStyle){_5a=_58.currentStyle[_59]}}return _5a||""};this.getStyleAsInt=function(_5b,_5c,_5d){var _5e=this.getComputedStyle(_5b,_5c);if(_5d&&!/px$/.test(_5e)){return 0}_5e=parseInt(_5e);return isNaN(_5e)?0:_5e};this.getZoom=function(){return _5f.zoom.getLatest()}};this.dom=dom;var ua=new function(){var ua=navigator.userAgent.toLowerCase();var _62=(navigator.product||"").toLowerCase();this.macintosh=ua.indexOf("mac")>-1;this.windows=ua.indexOf("windows")>-1;this.quicktime=false;this.opera=ua.indexOf("opera")>-1;this.konqueror=_62.indexOf("konqueror")>-1;this.ie=false/*@cc_on || true @*/;this.ieSupported=this.ie&&!/ppc|smartphone|iemobile|msie\s5\.5/.test(ua)/*@cc_on && @_jscript_version >= 5.5 @*/;this.ieWin=this.ie&&this.windows/*@cc_on && @_jscript_version >= 5.1 @*/;this.windows=this.windows&&(!this.ie||this.ieWin);this.ieMac=this.ie&&this.macintosh/*@cc_on && @_jscript_version < 5.1 @*/;this.macintosh=this.macintosh&&(!this.ie||this.ieMac);this.safari=ua.indexOf("safari")>-1;this.webkit=ua.indexOf("applewebkit")>-1&&!this.konqueror;this.khtml=this.webkit||this.konqueror;this.gecko=!this.webkit&&_62=="gecko";this.operaVersion=this.opera&&/.*opera(\s|\/)(\d+\.\d+)/.exec(ua)?parseInt(RegExp.$2):0;this.webkitVersion=this.webkit&&/.*applewebkit\/(\d+).*/.exec(ua)?parseInt(RegExp.$1):0;this.geckoBuildDate=this.gecko&&/.*gecko\/(\d{8}).*/.exec(ua)?parseInt(RegExp.$1):0;this.konquerorVersion=this.konqueror&&/.*konqueror\/(\d\.\d).*/.exec(ua)?parseInt(RegExp.$1):0;this.flashVersion=0;if(this.ieWin){var axo;var _64=false;try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash.7")}catch(e){try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash.6");this.flashVersion=6;axo.AllowScriptAccess="always"}catch(e){_64=this.flashVersion==6}if(!_64){try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash")}catch(e){}}}if(!_64&&axo){this.flashVersion=parseFloat(/([\d,?]+)/.exec(axo.GetVariable("$version"))[1].replace(/,/g,"."))}}else{if(navigator.plugins&&navigator.plugins["Shockwave Flash"]){var _65=navigator.plugins["Shockwave Flash"];this.flashVersion=parseFloat(/(\d+\.?\d*)/.exec(_65.description)[1]);var i=0;while(this.flashVersion>=_46&&i<navigator.mimeTypes.length){var _67=navigator.mimeTypes[i];if(_67.type=="application/x-shockwave-flash"&&_67.enabledPlugin.description.toLowerCase().indexOf("quicktime")>-1){this.flashVersion=0;this.quicktime=true}i++}}}this.flash=this.flashVersion>=_46;this.transparencySupport=this.macintosh||this.windows;this.computedStyleSupport=this.ie||document.defaultView&&document.defaultView.getComputedStyle&&(!this.gecko||this.geckoBuildDate>=20030624);this.css=true;if(this.computedStyleSupport){try{var _68=document.getElementsByTagName("head")[0];_68.style.backgroundColor="#FF0000";var _69=dom.getComputedStyle(_68,"backgroundColor");this.css=!_69||/\#F{2}0{4}|rgb\(255,\s?0,\s?0\)/i.test(_69);_68=null}catch(e){}}this.xhtmlSupport=!!window.DOMParser&&!!document.importNode;this.innerHtmlSupport;try{var n=dom.create("span");if(!this.ieMac){n.innerHTML="x"}this.innerHtmlSupport=n.innerHTML=="x"}catch(e){this.innerHtmlSupport=false}this.zoomSupport=!!(this.opera&&document.documentElement);this.geckoXml=this.gecko&&(document.contentType||"").indexOf("xml")>-1;this.requiresPrefetch=this.ieWin||this.khtml;this.verifiedKonqueror=false;this.supported=this.flash&&this.css&&(!this.ie||this.ieSupported)&&(!this.opera||this.operaVersion>=8)&&(!this.webkit||this.webkitVersion>=412)&&(!this.konqueror||this.konquerorVersion>3.5)&&this.computedStyleSupport&&(this.innerHtmlSupport||!this.khtml&&this.xhtmlSupport)};this.ua=ua;var _6b=new function(){function capitalize($){return $.toUpperCase()}this.normalize=function(str){if(_3b.preserveSingleWhitespace){return str.replace(/\s/g,_48)}return str.replace(/(\s)\s+/g,"$1")};this.textTransform=function(_6e,str){switch(_6e){case "uppercase":str=str.toUpperCase();break;case "lowercase":str=str.toLowerCase();break;case "capitalize":var _70=str;str=str.replace(/^\w|\s\w/g,capitalize);if(str.indexOf("function capitalize")!=-1){var _71=_70.replace(/(^|\s)(\w)/g,"$1$1$2$2").split(/^\w|\s\w/g);str="";for(var i=0;i<_71.length;i++){str+=_71[i].charAt(0).toUpperCase()+_71[i].substring(1)}}break}return str};this.toHexString=function(str){if(typeof (str)!="string"||!str.charAt(0)=="#"||str.length!=4&&str.length!=7){return str}str=str.replace(/#/,"");if(str.length==3){str=str.replace(/(.)(.)(.)/,"$1$1$2$2$3$3")}return "0x"+str};this.toJson=function(obj){var _75="";switch(typeof (obj)){case "string":_75="\""+obj+"\"";break;case "number":case "boolean":_75=obj.toString();break;case "object":_75=[];for(var _76 in obj){if(obj[_76]==Object.prototype[_76]){continue}_75.push("\""+_76+"\":"+_6b.toJson(obj[_76]))}_75="{"+_75.join(",")+"}";break}return _75};this.convertCssArg=function(arg){if(!arg){return {}}if(typeof (arg)=="object"){if(arg.constructor==Array){arg=arg.join("")}else{return arg}}var obj={};var _79=arg.split("}");for(var i=0;i<_79.length;i++){var $=_79[i].match(/([^\s{]+)\s*\{(.+)\s*;?\s*/);if(!$||$.length!=3){continue}if(!obj[$[1]]){obj[$[1]]={}}var _7c=$[2].split(";");for(var j=0;j<_7c.length;j++){var $2=_7c[j].match(/\s*([^:\s]+)\s*\:\s*([^\s;]+)/);if(!$2||$2.length!=3){continue}obj[$[1]][$2[1]]=$2[2]}}return obj};this.extractFromCss=function(css,_80,_81,_82){var _83=null;if(css&&css[_80]&&css[_80][_81]){_83=css[_80][_81];if(_82){delete css[_80][_81]}}return _83};this.cssToString=function(arg){var css=[];for(var _86 in arg){var _87=arg[_86];if(_87==Object.prototype[_86]){continue}css.push(_86,"{");for(var _88 in _87){if(_87[_88]==Object.prototype[_88]){continue}css.push(_88,":",_87[_88],";")}css.push("}")}return escape(css.join(""))}};this.util=_6b;var _5f={};_5f.fragmentIdentifier=new function(){this.fix=true;var _89;this.cache=function(){_89=document.title};function doFix(){document.title=_89}this.restore=function(){if(this.fix){setTimeout(doFix,0)}}};_5f.synchronizer=new function(){this.isBlocked=false;this.block=function(){this.isBlocked=true};this.unblock=function(){this.isBlocked=false;_8a.replaceAll()}};_5f.zoom=new function(){var _8b=100;this.getLatest=function(){return _8b};if(ua.zoomSupport&&ua.opera){var _8c=document.createElement("div");_8c.style.position="fixed";_8c.style.left="-65536px";_8c.style.top="0";_8c.style.height="100%";_8c.style.width="1px";_8c.style.zIndex="-32";document.documentElement.appendChild(_8c);function updateZoom(){if(!_8c){return}var _8d=window.innerHeight/_8c.offsetHeight;var _8e=Math.round(_8d*100)%10;if(_8e>5){_8d=Math.round(_8d*100)+10-_8e}else{_8d=Math.round(_8d*100)-_8e}_8b=isNaN(_8d)?100:_8d;_5f.synchronizer.unblock();document.documentElement.removeChild(_8c);_8c=null}_5f.synchronizer.block();setTimeout(updateZoom,54)}};this.hacks=_5f;var _8f={kwargs:[],replaceAll:function(){for(var i=0;i<this.kwargs.length;i++){_3b.replace(this.kwargs[i])}this.kwargs=[]}};var _8a={kwargs:[],replaceAll:_8f.replaceAll};function isValidDomain(){if(_3b.domains.length==0){return true}var _91="";try{_91=document.domain}catch(e){}if(_3b.fromLocal&&sIFR.domains[0]!="localhost"){sIFR.domains.unshift("localhost")}for(var i=0;i<_3b.domains.length;i++){if(_3b.domains[i]=="*"||_3b.domains[i]==_91){return true}}return false}this.activate=function(){if(!ua.supported||!this.isEnabled||this.isActive||!isValidDomain()){return}this.isActive=true;if(this.hideElements){this.setFlashClass()}if(ua.ieWin&&_5f.fragmentIdentifier.fix&&window.location.hash!=""){_5f.fragmentIdentifier.cache()}else{_5f.fragmentIdentifier.fix=false}if(!this.registerEvents){return}function handler(evt){_3b.initialize();if(evt&&evt.type=="load"){if(document.removeEventListener){document.removeEventListener("DOMContentLoaded",handler,false);document.removeEventListener("load",handler,false)}if(window.removeEventListener){window.removeEventListener("load",handler,false)}}}if(window.addEventListener){if(_3b.useDomContentLoaded&&ua.gecko){document.addEventListener("DOMContentLoaded",handler,false)}window.addEventListener("load",handler,false)}else{if(ua.ieWin){if(_3b.useDomContentLoaded&&!_4a){document.write("<scr"+"ipt id=__sifr_ie_onload defer src=//:></script>");document.getElementById("__sifr_ie_onload").onreadystatechange=function(){if(this.readyState=="complete"){handler();this.removeNode()}}}window.attachEvent("onload",handler)}}};this.setFlashClass=function(){if(this.hasFlashClassSet){return}dom.addClass(_3c,dom.getBody()||document.documentElement);this.hasFlashClassSet=true};this.removeFlashClass=function(){if(!this.hasFlashClassSet){return}dom.removeClass(_3c,dom.getBody());dom.removeClass(_3c,document.documentElement);this.hasFlashClassSet=false};this.initialize=function(){if(_4b||!this.isActive||!this.isEnabled){return}_4b=true;_8f.replaceAll();clearPrefetch()};function getSource(src){if(typeof (src)!="string"){if(src.src){src=src.src}if(typeof (src)!="string"){var _95=[];for(var _96 in src){if(src[_96]!=Object.prototype[_96]){_95.push(_96)}}_95.sort().reverse();var _97="";var i=-1;while(!_97&&++i<_95.length){if(parseFloat(_95[i])<=ua.flashVersion){_97=src[_95[i]]}}src=_97}}if(!src&&_3b.debugMode){throw new Error("sIFR: Could not determine appropriate source")}if(ua.ie&&src.charAt(0)=="/"){src=window.location.toString().replace(/([^:]+)(:\/?\/?)([^\/]+).*/,"$1$2$3")+src}return src}this.prefetch=function(){if(!ua.requiresPrefetch||!ua.supported||!this.isEnabled||!isValidDomain()){return}if(this.setPrefetchCookie&&new RegExp(";?"+_47+"=true;?").test(document.cookie)){return}try{_4a=true;if(ua.ieWin){prefetchIexplore(arguments)}else{prefetchLight(arguments)}if(this.setPrefetchCookie){document.cookie=_47+"=true;path="+this.cookiePath}}catch(e){if(_3b.debugMode){throw e}}};function prefetchIexplore(_99){for(var i=0;i<_99.length;i++){document.write("<embed src=\""+getSource(_99[i])+"\" sIFR-prefetch=\"true\" style=\"display:none;\">")}}function prefetchLight(_9b){for(var i=0;i<_9b.length;i++){new Image().src=getSource(_9b[i])}}function clearPrefetch(){if(!ua.ieWin||!_4a){return}try{var _9d=document.getElementsByTagName("embed");for(var i=_9d.length-1;i>=0;i--){var _9f=_9d[i];if(_9f.getAttribute("sIFR-prefetch")=="true"){_9f.parentNode.removeChild(_9f)}}}catch(e){}}function getRatio(_a0){if(_a0<=10){return 1.55}if(_a0<=19){return 1.45}if(_a0<=32){return 1.35}if(_a0<=71){return 1.3}return 1.25}function getFilters(obj){var _a2=[];for(var _a3 in obj){if(obj[_a3]==Object.prototype[_a3]){continue}var _a4=obj[_a3];_a3=[_a3.replace(/filter/i,"")+"Filter"];for(var _a5 in _a4){if(_a4[_a5]==Object.prototype[_a5]){continue}_a3.push(_a5+":"+escape(_6b.toJson(_6b.toHexString(_a4[_a5]))))}_a2.push(_a3.join(","))}return _a2.join(";")}this.replace=function(_a6,_a7){if(!ua.supported){return}if(_a7){for(var _a8 in _a6){if(typeof (_a7[_a8])=="undefined"){_a7[_a8]=_a6[_a8]}}_a6=_a7}if(!_4b){return _8f.kwargs.push(_a6)}if(_5f.synchronizer.isBlocked){return _8a.kwargs.push(_a6)}var _a9=_a6.elements;if(!_a9&&parseSelector){_a9=parseSelector(_a6.selector)}if(_a9.length==0){return}this.setFlashClass();var src=getSource(_a6.src);var css=_6b.convertCssArg(_a6.css);var _ac=getFilters(_a6.filters);var _ad=(_a6.forceClear==null)?_3b.forceClear:_a6.forceClear;var _ae=(_a6.fitExactly==null)?_3b.fitExactly:_a6.fitExactly;var _af=_ae||(_a6.forceWidth==null?_3b.forceWidth:_a6.forceWidth);var _b0=parseInt(_6b.extractFromCss(css,".sIFR-root","leading"))||0;var _b1=_6b.extractFromCss(css,".sIFR-root","background-color",true)||"#FFFFFF";var _b2=_6b.extractFromCss(css,".sIFR-root","opacity",true)||"100";if(parseFloat(_b2)<1){_b2=100*parseFloat(_b2)}var _b3=_6b.extractFromCss(css,".sIFR-root","kerning",true)||"";var _b4=_a6.gridFitType||_6b.extractFromCss(css,".sIFR-root","text-align")=="right"?"subpixel":"pixel";var _b5=_3b.forceTextTransform?_6b.extractFromCss(css,".sIFR-root","text-transform",true)||"none":"none";var _b6="";if(_ae){_6b.extractFromCss(css,".sIFR-root","text-align",true)}if(!_a6.modifyCss){_b6=_6b.cssToString(css)}var _b7=_a6.wmode||"";if(_b7=="transparent"){if(!ua.transparencySupport){_b7="opaque"}else{_b1="transparent"}}for(var i=0;i<_a9.length;i++){var _b9=_a9[i];if(!ua.verifiedKonqueror){if(dom.getComputedStyle(_b9,"lineHeight").match(/e\+08px/)){ua.supported=_3b.isEnabled=false;this.removeFlashClass();return}ua.verifiedKonqueror=true}if(dom.hasClass(_3d,_b9)||dom.hasClass(_3f,_b9)){continue}var _ba=false;if(!_b9.offsetHeight||!_b9.offsetWidth){if(!_3b.replaceNonDisplayed){continue}_b9.style.display="block";if(!_b9.offsetHeight||!_b9.offsetWidth){_b9.style.display="";continue}_ba=true}if(_ad&&ua.gecko){_b9.style.clear="both"}var _bb=null;if(_3b.fixWrap&&ua.ie&&dom.getComputedStyle(_b9,"display")=="block"){_bb=_b9.innerHTML;dom.setInnerHtml(_b9,"X")}var _bc=dom.getStyleAsInt(_b9,"width",ua.ie);if(ua.ie&&_bc==0){var _bd=dom.getStyleAsInt(_b9,"paddingRight",true);var _be=dom.getStyleAsInt(_b9,"paddingLeft",true);var _bf=dom.getStyleAsInt(_b9,"borderRightWidth",true);var _c0=dom.getStyleAsInt(_b9,"borderLeftWidth",true);_bc=_b9.offsetWidth-_be-_bd-_c0-_bf}if(_bb&&_3b.fixWrap&&ua.ie){dom.setInnerHtml(_b9,_bb)}var _c1,_c2;if(!ua.ie){_c1=dom.getStyleAsInt(_b9,"lineHeight");_c2=Math.floor(dom.getStyleAsInt(_b9,"height")/_c1)}else{if(ua.ie){var _bb=_b9.innerHTML;_b9.style.visibility="visible";_b9.style.overflow="visible";_b9.style.position="static";_b9.style.zoom="normal";_b9.style.writingMode="lr-tb";_b9.style.width=_b9.style.height="auto";_b9.style.maxWidth=_b9.style.maxHeight=_b9.style.styleFloat="none";var _c3=_b9;var _c4=_b9.currentStyle.hasLayout;if(_c4){dom.setInnerHtml(_b9,"<div class=\""+_42+"\">X<br />X<br />X</div>");_c3=_b9.firstChild}else{dom.setInnerHtml(_b9,"X<br />X<br />X")}var _c5=_c3.getClientRects();_c1=_c5[1].bottom-_c5[1].top;_c1=Math.ceil(_c1*0.8);if(_c4){dom.setInnerHtml(_b9,"<div class=\""+_42+"\">"+_bb+"</div>");_c3=_b9.firstChild}else{dom.setInnerHtml(_b9,_bb)}_c5=_c3.getClientRects();_c2=_c5.length;if(_c4){dom.setInnerHtml(_b9,_bb)}_b9.style.visibility=_b9.style.width=_b9.style.height=_b9.style.maxWidth=_b9.style.maxHeight=_b9.style.overflow=_b9.style.styleFloat=_b9.style.position=_b9.style.zoom=_b9.style.writingMode=""}}if(_ba){_b9.style.display=""}if(_ad&&ua.gecko){_b9.style.clear=""}_c1=Math.max(_44,_c1);_c1=Math.min(_45,_c1);if(isNaN(_c2)||!isFinite(_c2)){_c2=1}var _c6=Math.round(_c2*_c1);if(_c2>1&&_b0){_c6+=Math.round((_c2-1)*_b0)}var _c7=dom.create("span");_c7.className=_40;var _c8=_b9.cloneNode(true);for(var j=0,l=_c8.childNodes.length;j<l;j++){_c7.appendChild(_c8.childNodes[j].cloneNode(true))}if(_a6.modifyContent){_a6.modifyContent(_c8,_a6.selector)}if(_a6.modifyCss){_b6=_a6.modifyCss(css,_c8,_a6.selector)}var _cb=handleContent(_c8,_b5);if(_a6.modifyContentString){_cb=_a6.modifyContentString(_cb,_a6.selector)}if(_cb==""){continue}var _cc=["content="+_cb.replace(/\</g,"&lt;").replace(/>/g,"&gt;"),"width="+_bc,"height="+_c6,"fitexactly="+(_ae?"true":""),"tunewidth="+(_a6.tuneWidth||""),"tuneheight="+(_a6.tuneHeight||""),"offsetleft="+(_a6.offsetLeft||""),"offsettop="+(_a6.offsetTop||""),"thickness="+(_a6.thickness||""),"sharpness="+(_a6.sharpness||""),"kerning="+_b3,"gridfittype="+_b4,"zoomsupport="+ua.zoomSupport,"filters="+_ac,"opacity="+_b2,"blendmode="+(_a6.blendMode||""),"size="+_c1,"zoom="+dom.getZoom(),"css="+_b6];_cc=encodeURI(_cc.join("&amp;"));var _cd="sIFR_callback_"+_49++;var _ce={flashNode:null};window[_cd+"_DoFSCommand"]=(function(_cf){return function(_d0,arg){if(/(FSCommand\:)?resize/.test(_d0)){var $=arg.split(":");_cf.flashNode.setAttribute($[0],$[1]);if(ua.khtml){_cf.flashNode.innerHTML+=""}}}})(_ce);_c6=Math.round(_c2*getRatio(_c1)*_c1);var _d3=_af?_bc:"100%";var _d4;if(ua.ie){_d4=["<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" id=\"",_cd,"\" sifr=\"true\" width=\"",_d3,"\" height=\"",_c6,"\" class=\"",_3e,"\">","<param name=\"movie\" value=\"",src,"\"></param>","<param name=\"flashvars\" value=\"",_cc,"\"></param>","<param name=\"allowScriptAccess\" value=\"always\"></param>","<param name=\"quality\" value=\"best\"></param>","<param name=\"wmode\" value=\"",_b7,"\"></param>","<param name=\"bgcolor\" value=\"",_b1,"\"></param>","<param name=\"name\" value=\"",_cd,"\"></param>","</object>","<scr","ipt event=FSCommand(info,args) for=",_cd,">",_cd,"_DoFSCommand(info, args);","</","script>"].join("")}else{_d4=["<embed class=\"",_3e,"\" type=\"application/x-shockwave-flash\" src=\"",src,"\" quality=\"best\" flashvars=\"",_cc,"\" width=\"",_d3,"\" height=\"",_c6,"\" wmode=\"",_b7,"\" bgcolor=\"",_b1,"\" name=\"",_cd,"\" allowScriptAccess=\"always\" sifr=\"true\"></embed>"].join("")}dom.setInnerHtml(_b9,_d4);_ce.flashNode=_b9.firstChild;_b9.appendChild(_c7);dom.addClass(_3d,_b9);if(_a6.onReplacement){_a6.onReplacement(_ce.flashNode)}}_5f.fragmentIdentifier.restore()};function handleContent(_d5,_d6){var _d7=[],_d8=[];var _d9=_d5.childNodes;var i=0;while(i<_d9.length){var _db=_d9[i];if(_db.nodeType==3){var _dc=_6b.normalize(_db.nodeValue);_dc=_6b.textTransform(_d6,_dc);_d8.push(_dc.replace(/\%/g,"%25").replace(/\&/g,"%26").replace(/\,/g,"%2C").replace(/\+/g,"%2B"))}if(_db.nodeType==1){var _dd=[];var _de=_db.nodeName.toLowerCase();var _df=_db.className||"";if(/\s+/.test(_df)){if(_df.indexOf(_41)){_df=_df.match("(\\s|^)"+_41+"-([^\\s$]*)(\\s|$)")[2]}else{_df=_df.match(/^([^\s]+)/)[1]}}if(_df!=""){_dd.push("class=\""+_df+"\"")}if(_de=="a"){var _e0=_db.getAttribute("href")||"";var _e1=_db.getAttribute("target")||"";_dd.push("href=\""+_e0+"\"","target=\""+_e1+"\"")}_d8.push("<"+_de+(_dd.length>0?" ":"")+escape(_dd.join(" "))+">");if(_db.hasChildNodes()){_d7.push(i);i=0;_d9=_db.childNodes;continue}else{if(!/^(br|img)$/i.test(_db.nodeName)){_d8.push("</",_db.nodeName.toLowerCase(),">")}}}if(_d7.length>0&&!_db.nextSibling){do{i=_d7.pop();_d9=_db.parentNode.parentNode.childNodes;_db=_d9[i];if(_db){_d8.push("</",_db.nodeName.toLowerCase(),">")}}while(i<_d9.length&&_d7.length>0)}i++}return _d8.join("").replace(/\n|\r/g,"")}}; sIFR.prefetch({ src: 'swf/sifr/helvetica.swf' }); sIFR.activate(); sIFR.replace({ selector: 'h2, h3', src: 'swf/sifr/helvetica.swf', wmode: 'transparent', css: { '.sIFR-root' : { 'color': '#000000', 'font-weight': 'bold', 'letter-spacing': '-1' }, 'a': { 'text-decoration': 'none' }, 'a:link': { 'color': '#000000' }, 'a:hover': { 'color': '#000000' }, '.span': { 'color': '#979797' }, 'label': { 'color': '#E11818' } } }); sIFR.replace({ selector: 'h4', src: 'swf/sifr/helvetica.swf', wmode: 'transparent', css: { '.sIFR-root' : { 'color': '#7E7E7E', 'font-weight': 'bold', 'letter-spacing': '-0.8' }, 'a': { 'text-decoration': 'none' }, 'a:link': { 'color': '#7E7E7E' }, 'a:hover': { 'color': '#7E7E7E' }, 'label': { 'color': '#E11818' } } }); sIFR.replace({ selector: '#cart p', src: 'swf/sifr/helvetica-lt.swf', wmode: 'transparent', css: { '.sIFR-root' : { 'color': '#979797', 'font-weight': 'bold', 'letter-spacing': '-0.8' }, 'a': { 'text-decoration': 'none' }, 'a:link': { 'color': '#979797' }, 'a:hover': { 'color': '#000000' }, 'label': { 'color': '#979797' } } }); Thank you in advance for your help!

    Read the article

  • Conway's Game of Life - C++ and Qt

    - by Jeff Bridge
    I've done all of the layouts and have most of the code written even. But, I'm stuck in two places. 1) I'm not quite sure how to set up the timer. Am I using it correctly in the gridwindow class? And, am I used the timer functions/signals/slots correctly with the other gridwindow functions. 2) In GridWindow's timerFired() function, I'm having trouble checking/creating the vector-vectors. I wrote out in the comments in that function exactly what I am trying to do. Any help would be much appreciated. main.cpp // Main file for running the grid window application. #include <QApplication> #include "gridwindow.h" //#include "timerwindow.h" #include <stdexcept> #include <string> #include <fstream> #include <sstream> #include <iostream> void Welcome(); // Welcome Function - Prints upon running program; outputs program name, student name/id, class section. void Rules(); // Rules Function: Prints the rules for Conway's Game of Life. using namespace std; // A simple main method to create the window class and then pop it up on the screen. int main(int argc, char *argv[]) { Welcome(); // Calls Welcome function to print student/assignment info. Rules(); // Prints Conway's Game Rules. QApplication app(argc, argv); // Creates the overall windowed application. int rows = 25, cols = 35; //The number of rows & columns in the game grid. GridWindow widget(NULL,rows,cols); // Creates the actual window (for the grid). widget.show(); // Shows the window on the screen. return app.exec(); // Goes into visual loop; starts executing GUI. } // Welcome Function: Prints my name/id, my class number, the assignment, and the program name. void Welcome() { cout << endl; cout << "-------------------------------------------------------------------------------------------------" << endl; cout << "Name/ID - Gabe Audick #7681539807" << endl; cout << "Class/Assignment - CSCI-102 Disccusion 29915: Homework Assignment #4" << endl; cout << "-------------------------------------------------------------------------------------------------" << endl << endl; } // Rules Function: Prints the rules for Conway's Game of Life. void Rules() { cout << "Welcome to Conway's Game of Life." << endl; cout << "Game Rules:" << endl; cout << "\t 1) Any living cell with fewer than two living neighbours dies, as if caused by underpopulation." << endl; cout << "\t 2) Any live cell with more than three live neighbours dies, as if by overcrowding." << endl; cout << "\t 3) Any live cell with two or three live neighbours lives on to the next generation." << endl; cout << "\t 4) Any dead cell with exactly three live neighbours becomes a live cell." << endl << endl; cout << "Enjoy." << endl << endl; } gridcell.h // A header file for a class representing a single cell in a grid of cells. #ifndef GRIDCELL_H_ #define GRIDCELL_H_ #include <QPalette> #include <QColor> #include <QPushButton> #include <Qt> #include <QWidget> #include <QFrame> #include <QHBoxLayout> #include <iostream> // An enum representing the two different states a cell can have. enum CellType { DEAD, // DEAD = Dead Cell. --> Color = White. LIVE // LIVE = Living Cell. ---> Color = White. }; /* Class: GridCell. A class representing a single cell in a grid. Each cell is implemented as a QT QFrame that contains a single QPushButton. The button is sized so that it takes up the entire frame. Each cell also keeps track of what type of cell it is based on the CellType enum. */ class GridCell : public QFrame { Q_OBJECT // Macro allowing us to have signals & slots on this object. private: QPushButton* button; // The button inside the cell that gives its clickability. CellType type; // The type of cell (DEAD or LIVE.) public slots: void handleClick(); // Callback for handling a click on the current cell. void setType(CellType type); // Cell type mutator. Calls the "redrawCell" function. signals: void typeChanged(CellType type); // Signal to notify listeners when the cell type has changed. public: GridCell(QWidget *parent = NULL); // Constructor for creating a cell. Takes parent widget or default parent to NULL. virtual ~GridCell(); // Destructor. void redrawCell(); // Redraws cell: Sets new type/color. CellType getType() const; //Simple getter for the cell type. private: Qt::GlobalColor getColorForCellType(); // Helper method. Returns color that cell should be based from its value. }; #endif gridcell.cpp #include <iostream> #include "gridcell.h" #include "utility.h" using namespace std; // Constructor: Creates a grid cell. GridCell::GridCell(QWidget *parent) : QFrame(parent) { this->type = DEAD; // Default: Cell is DEAD (white). setFrameStyle(QFrame::Box); // Set the frame style. This is what gives each box its black border. this->button = new QPushButton(this); //Creates button that fills entirety of each grid cell. this->button->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding); // Expands button to fill space. this->button->setMinimumSize(19,19); //width,height // Min height and width of button. QHBoxLayout *layout = new QHBoxLayout(); //Creates a simple layout to hold our button and add the button to it. layout->addWidget(this->button); setLayout(layout); layout->setStretchFactor(this->button,1); // Lets the buttons expand all the way to the edges of the current frame with no space leftover layout->setContentsMargins(0,0,0,0); layout->setSpacing(0); connect(this->button,SIGNAL(clicked()),this,SLOT(handleClick())); // Connects clicked signal with handleClick slot. redrawCell(); // Calls function to redraw (set new type for) the cell. } // Basic destructor. GridCell::~GridCell() { delete this->button; } // Accessor for the cell type. CellType GridCell::getType() const { return(this->type); } // Mutator for the cell type. Also has the side effect of causing the cell to be redrawn on the GUI. void GridCell::setType(CellType type) { this->type = type; redrawCell(); } // Handler slot for button clicks. This method is called whenever the user clicks on this cell in the grid. void GridCell::handleClick() { // When clicked on... if(this->type == DEAD) // If type is DEAD (white), change to LIVE (black). type = LIVE; else type = DEAD; // If type is LIVE (black), change to DEAD (white). setType(type); // Sets new type (color). setType Calls redrawCell() to recolor. } // Method to check cell type and return the color of that type. Qt::GlobalColor GridCell::getColorForCellType() { switch(this->type) { default: case DEAD: return Qt::white; case LIVE: return Qt::black; } } // Helper method. Forces current cell to be redrawn on the GUI. Called whenever the setType method is invoked. void GridCell::redrawCell() { Qt::GlobalColor gc = getColorForCellType(); //Find out what color this cell should be. this->button->setPalette(QPalette(gc,gc)); //Force the button in the cell to be the proper color. this->button->setAutoFillBackground(true); this->button->setFlat(true); //Force QT to NOT draw the borders on the button } gridwindow.h // A header file for a QT window that holds a grid of cells. #ifndef GRIDWINDOW_H_ #define GRIDWINDOW_H_ #include <vector> #include <QWidget> #include <QTimer> #include <QGridLayout> #include <QLabel> #include <QApplication> #include "gridcell.h" /* class GridWindow: This is the class representing the whole window that comes up when this program runs. It contains a header section with a title, a middle section of MxN cells and a bottom section with buttons. */ class GridWindow : public QWidget { Q_OBJECT // Macro to allow this object to have signals & slots. private: std::vector<std::vector<GridCell*> > cells; // A 2D vector containing pointers to all the cells in the grid. QLabel *title; // A pointer to the Title text on the window. QTimer *timer; // Creates timer object. public slots: void handleClear(); // Handler function for clicking the Clear button. void handleStart(); // Handler function for clicking the Start button. void handlePause(); // Handler function for clicking the Pause button. void timerFired(); // Method called whenever timer fires. public: GridWindow(QWidget *parent = NULL,int rows=3,int cols=3); // Constructor. virtual ~GridWindow(); // Destructor. std::vector<std::vector<GridCell*> >& getCells(); // Accessor for the array of grid cells. private: QHBoxLayout* setupHeader(); // Helper function to construct the GUI header. QGridLayout* setupGrid(int rows,int cols); // Helper function to constructor the GUI's grid. QHBoxLayout* setupButtonRow(); // Helper function to setup the row of buttons at the bottom. }; #endif gridwindow.cpp #include <iostream> #include "gridwindow.h" using namespace std; // Constructor for window. It constructs the three portions of the GUI and lays them out vertically. GridWindow::GridWindow(QWidget *parent,int rows,int cols) : QWidget(parent) { QHBoxLayout *header = setupHeader(); // Setup the title at the top. QGridLayout *grid = setupGrid(rows,cols); // Setup the grid of colored cells in the middle. QHBoxLayout *buttonRow = setupButtonRow(); // Setup the row of buttons across the bottom. QVBoxLayout *layout = new QVBoxLayout(); // Puts everything together. layout->addLayout(header); layout->addLayout(grid); layout->addLayout(buttonRow); setLayout(layout); } // Destructor. GridWindow::~GridWindow() { delete title; } // Builds header section of the GUI. QHBoxLayout* GridWindow::setupHeader() { QHBoxLayout *header = new QHBoxLayout(); // Creates horizontal box. header->setAlignment(Qt::AlignHCenter); this->title = new QLabel("CONWAY'S GAME OF LIFE",this); // Creates big, bold, centered label (title): "Conway's Game of Life." this->title->setAlignment(Qt::AlignHCenter); this->title->setFont(QFont("Arial", 32, QFont::Bold)); header->addWidget(this->title); // Adds widget to layout. return header; // Returns header to grid window. } // Builds the grid of cells. This method populates the grid's 2D array of GridCells with MxN cells. QGridLayout* GridWindow::setupGrid(int rows,int cols) { QGridLayout *grid = new QGridLayout(); // Creates grid layout. grid->setHorizontalSpacing(0); // No empty spaces. Cells should be contiguous. grid->setVerticalSpacing(0); grid->setSpacing(0); grid->setAlignment(Qt::AlignHCenter); for(int i=0; i < rows; i++) //Each row is a vector of grid cells. { std::vector<GridCell*> row; // Creates new vector for current row. cells.push_back(row); for(int j=0; j < cols; j++) { GridCell *cell = new GridCell(); // Creates and adds new cell to row. cells.at(i).push_back(cell); grid->addWidget(cell,i,j); // Adds to cell to grid layout. Column expands vertically. grid->setColumnStretch(j,1); } grid->setRowStretch(i,1); // Sets row expansion horizontally. } return grid; // Returns grid. } // Builds footer section of the GUI. QHBoxLayout* GridWindow::setupButtonRow() { QHBoxLayout *buttonRow = new QHBoxLayout(); // Creates horizontal box for buttons. buttonRow->setAlignment(Qt::AlignHCenter); // Clear Button - Clears cell; sets them all to DEAD/white. QPushButton *clearButton = new QPushButton("CLEAR"); clearButton->setFixedSize(100,25); connect(clearButton, SIGNAL(clicked()), this, SLOT(handleClear())); buttonRow->addWidget(clearButton); // Start Button - Starts game when user clicks. Or, resumes game after being paused. QPushButton *startButton = new QPushButton("START/RESUME"); startButton->setFixedSize(100,25); connect(startButton, SIGNAL(clicked()), this, SLOT(handleStart())); buttonRow->addWidget(startButton); // Pause Button - Pauses simulation of game. QPushButton *pauseButton = new QPushButton("PAUSE"); pauseButton->setFixedSize(100,25); connect(pauseButton, SIGNAL(clicked()), this, SLOT(handlePause())); buttonRow->addWidget(pauseButton); // Quit Button - Exits program. QPushButton *quitButton = new QPushButton("EXIT"); quitButton->setFixedSize(100,25); connect(quitButton, SIGNAL(clicked()), qApp, SLOT(quit())); buttonRow->addWidget(quitButton); return buttonRow; // Returns bottom of layout. } /* SLOT method for handling clicks on the "clear" button. Receives "clicked" signals on the "Clear" button and sets all cells to DEAD. */ void GridWindow::handleClear() { for(unsigned int row=0; row < cells.size(); row++) // Loops through current rows' cells. { for(unsigned int col=0; col < cells[row].size(); col++) { GridCell *cell = cells[row][col]; // Grab the current cell & set its value to dead. cell->setType(DEAD); } } } /* SLOT method for handling clicks on the "start" button. Receives "clicked" signals on the "start" button and begins game simulation. */ void GridWindow::handleStart() { this->timer = new QTimer(this); // Creates new timer. connect(this->timer, SIGNAL(timeout()), this, SLOT(timerFired())); // Connect "timerFired" method class to the "timeout" signal fired by the timer. this->timer->start(500); // Timer to fire every 500 milliseconds. } /* SLOT method for handling clicks on the "pause" button. Receives "clicked" signals on the "pause" button and stops the game simulation. */ void GridWindow::handlePause() { this->timer->stop(); // Stops the timer. delete this->timer; // Deletes timer. } // Accessor method - Gets the 2D vector of grid cells. std::vector<std::vector<GridCell*> >& GridWindow::getCells() { return this->cells; } void GridWindow::timerFired() { // I'm not sure how to write this code. // I want to take the original vector-vector, and also make a new, empty vector-vector of the same size. // I would then go through the code below with the original vector, and apply the rules to the new vector-vector. // Finally, I would make the new vector-vecotr the original vector-vector. (That would be one step in the simulation.) cout << cells[1][2]; /* for (unsigned int m = 0; m < original.size(); m++) { for (unsigned int n = 0; n < original.at(m).size(); n++) { unsigned int neighbors = 0; //Begin counting number of neighbors. if (original[m-1][n-1].getType() == LIVE) // If a cell next to [i][j] is LIVE, add one to the neighbor count. neighbors += 1; if (original[m-1][n].getType() == LIVE) neighbors += 1; if (original[m-1][n+1].getType() == LIVE) neighbors += 1; if (original[m][n-1].getType() == LIVE) neighbors += 1; if (original[m][n+1].getType() == LIVE) neighbors += 1; if (original[m+1][n-1].getType() == LIVE) neighbors += 1; if (original[m+1][n].getType() == LIVE) neighbors += 1; if (original[m+1][n+1].getType() == LIVE) neighbors += 1; if (original[m][n].getType() == LIVE && neighbors < 2) // Apply game rules to cells: Create new, updated grid with the roundtwo vector. roundtwo[m][n].setType(LIVE); else if (original[m][n].getType() == LIVE && neighbors > 3) roundtwo[m][n].setType(DEAD); else if (original[m][n].getType() == LIVE && (neighbors == 2 || neighbors == 3)) roundtwo[m][n].setType(LIVE); else if (original[m][n].getType() == DEAD && neighbors == 3) roundtwo[m][n].setType(LIVE); } }*/ }

    Read the article

  • C++ - Conway's Game of Life & Stepping Backwards

    - by Gabe
    I was able to create a version Conway's Game of Life that either stepped forward each click, or just ran forward using a timer. (I'm doing this using Qt.) Now, I need to be able to save all previous game grids, so that I can step backwards by clicking a button. I'm trying to use a stack, and it seems like I'm pushing the old gridcells onto the stack correctly. But when I run it in QT, the grids don't change when I click BACK. I've tried different things for the last three hours, to no avail. Any ideas? gridwindow.cpp - My problem should be in here somewhere. Probably the handleBack() func. #include <iostream> #include "gridwindow.h" using namespace std; // Constructor for window. It constructs the three portions of the GUI and lays them out vertically. GridWindow::GridWindow(QWidget *parent,int rows,int cols) : QWidget(parent) { QHBoxLayout *header = setupHeader(); // Setup the title at the top. QGridLayout *grid = setupGrid(rows,cols); // Setup the grid of colored cells in the middle. QHBoxLayout *buttonRow = setupButtonRow(); // Setup the row of buttons across the bottom. QVBoxLayout *layout = new QVBoxLayout(); // Puts everything together. layout->addLayout(header); layout->addLayout(grid); layout->addLayout(buttonRow); setLayout(layout); } // Destructor. GridWindow::~GridWindow() { delete title; } // Builds header section of the GUI. QHBoxLayout* GridWindow::setupHeader() { QHBoxLayout *header = new QHBoxLayout(); // Creates horizontal box. header->setAlignment(Qt::AlignHCenter); this->title = new QLabel("CONWAY'S GAME OF LIFE",this); // Creates big, bold, centered label (title): "Conway's Game of Life." this->title->setAlignment(Qt::AlignHCenter); this->title->setFont(QFont("Arial", 32, QFont::Bold)); header->addWidget(this->title); // Adds widget to layout. return header; // Returns header to grid window. } // Builds the grid of cells. This method populates the grid's 2D array of GridCells with MxN cells. QGridLayout* GridWindow::setupGrid(int rows,int cols) { isRunning = false; QGridLayout *grid = new QGridLayout(); // Creates grid layout. grid->setHorizontalSpacing(0); // No empty spaces. Cells should be contiguous. grid->setVerticalSpacing(0); grid->setSpacing(0); grid->setAlignment(Qt::AlignHCenter); for(int i=0; i < rows; i++) //Each row is a vector of grid cells. { std::vector<GridCell*> row; // Creates new vector for current row. cells.push_back(row); for(int j=0; j < cols; j++) { GridCell *cell = new GridCell(); // Creates and adds new cell to row. cells.at(i).push_back(cell); grid->addWidget(cell,i,j); // Adds to cell to grid layout. Column expands vertically. grid->setColumnStretch(j,1); } grid->setRowStretch(i,1); // Sets row expansion horizontally. } return grid; // Returns grid. } // Builds footer section of the GUI. QHBoxLayout* GridWindow::setupButtonRow() { QHBoxLayout *buttonRow = new QHBoxLayout(); // Creates horizontal box for buttons. buttonRow->setAlignment(Qt::AlignHCenter); // Clear Button - Clears cell; sets them all to DEAD/white. QPushButton *clearButton = new QPushButton("CLEAR"); clearButton->setFixedSize(100,25); connect(clearButton, SIGNAL(clicked()), this, SLOT(handlePause())); // Pauses timer before clearing. connect(clearButton, SIGNAL(clicked()), this, SLOT(handleClear())); // Connects to clear function to make all cells DEAD/white. buttonRow->addWidget(clearButton); // Forward Button - Steps one step forward. QPushButton *forwardButton = new QPushButton("FORWARD"); forwardButton->setFixedSize(100,25); connect(forwardButton, SIGNAL(clicked()), this, SLOT(handleForward())); // Signals to handleForward function.. buttonRow->addWidget(forwardButton); // Back Button - Steps one step backward. QPushButton *backButton = new QPushButton("BACK"); backButton->setFixedSize(100,25); connect(backButton, SIGNAL(clicked()), this, SLOT(handleBack())); // Signals to handleBack funciton. buttonRow->addWidget(backButton); // Start Button - Starts game when user clicks. Or, resumes game after being paused. QPushButton *startButton = new QPushButton("START/RESUME"); startButton->setFixedSize(100,25); connect(startButton, SIGNAL(clicked()), this, SLOT(handlePause())); // Deletes current timer if there is one. Then restarts everything. connect(startButton, SIGNAL(clicked()), this, SLOT(handleStart())); // Signals to handleStart function. buttonRow->addWidget(startButton); // Pause Button - Pauses simulation of game. QPushButton *pauseButton = new QPushButton("PAUSE"); pauseButton->setFixedSize(100,25); connect(pauseButton, SIGNAL(clicked()), this, SLOT(handlePause())); // Signals to pause function which pauses timer. buttonRow->addWidget(pauseButton); // Quit Button - Exits program. QPushButton *quitButton = new QPushButton("EXIT"); quitButton->setFixedSize(100,25); connect(quitButton, SIGNAL(clicked()), qApp, SLOT(quit())); // Signals the quit slot which ends the program. buttonRow->addWidget(quitButton); return buttonRow; // Returns bottom of layout. } /* SLOT method for handling clicks on the "clear" button. Receives "clicked" signals on the "Clear" button and sets all cells to DEAD. */ void GridWindow::handleClear() { for(unsigned int row=0; row < cells.size(); row++) // Loops through current rows' cells. { for(unsigned int col=0; col < cells[row].size(); col++) // Loops through the rows'columns' cells. { GridCell *cell = cells[row][col]; // Grab the current cell & set its value to dead. cell->setType(DEAD); } } } /* SLOT method for handling clicks on the "start" button. Receives "clicked" signals on the "start" button and begins game simulation. */ void GridWindow::handleStart() { isRunning = true; // It is running. Sets isRunning to true. this->timer = new QTimer(this); // Creates new timer. connect(this->timer, SIGNAL(timeout()), this, SLOT(timerFired())); // Connect "timerFired" method class to the "timeout" signal fired by the timer. this->timer->start(500); // Timer to fire every 500 milliseconds. } /* SLOT method for handling clicks on the "pause" button. Receives "clicked" signals on the "pause" button and stops the game simulation. */ void GridWindow::handlePause() { if(isRunning) // If it is running... this->timer->stop(); // Stops the timer. isRunning = false; // Set to false. } void GridWindow::handleForward() { if(isRunning); // If it's running, do nothing. else timerFired(); // It not running, step forward one step. } void GridWindow::handleBack() { std::vector<std::vector<GridCell*> > cells2; if(isRunning); // If it's running, do nothing. else if(backStack.empty()) cout << "EMPTYYY" << endl; else { cells2 = backStack.peek(); for (unsigned int f = 0; f < cells.size(); f++) // Loop through cells' rows. { for (unsigned int g = 0; g < cells.at(f).size(); g++) // Loop through cells columns. { cells[f][g]->setType(cells2[f][g]->getType()); // Set cells[f][g]'s type to cells2[f][g]'s type. } } cout << "PRE=POP" << endl; backStack.pop(); cout << "OYYYY" << endl; } } // Accessor method - Gets the 2D vector of grid cells. std::vector<std::vector<GridCell*> >& GridWindow::getCells() { return this->cells; } /* TimerFired function: 1) 2D-Vector cells2 is declared. 2) cells2 is initliazed with loops/push_backs so that all its cells are DEAD. 3) We loop through cells, and count the number of LIVE neighbors next to a given cell. --> Depending on how many cells are living, we choose if the cell should be LIVE or DEAD in the next simulation, according to the rules. -----> We save the cell type in cell2 at the same indice (the same row and column cell in cells2). 4) After check all the cells (and save the next round values in cells 2), we set cells's gridcells equal to cells2 gridcells. --> This causes the cells to be redrawn with cells2 types (white or black). */ void GridWindow::timerFired() { backStack.push(cells); std::vector<std::vector<GridCell*> > cells2; // Holds new values for 2D vector. These are the next simulation round of cell types. for(unsigned int i = 0; i < cells.size(); i++) // Loop through the rows of cells2. (Same size as cells' rows.) { vector<GridCell*> row; // Creates Gridcell* vector to push_back into cells2. cells2.push_back(row); // Pushes back row vectors into cells2. for(unsigned int j = 0; j < cells[i].size(); j++) // Loop through the columns (the cells in each row). { GridCell *cell = new GridCell(); // Creates new GridCell. cell->setType(DEAD); // Sets cell type to DEAD/white. cells2.at(i).push_back(cell); // Pushes back the DEAD cell into cells2. } // This makes a gridwindow the same size as cells with all DEAD cells. } for (unsigned int m = 0; m < cells.size(); m++) // Loop through cells' rows. { for (unsigned int n = 0; n < cells.at(m).size(); n++) // Loop through cells' columns. { unsigned int neighbors = 0; // Counter for number of LIVE neighbors for a given cell. // We know check all different variations of cells[i][j] to count the number of living neighbors for each cell. // We check m > 0 and/or n > 0 to make sure we don't access negative indexes (ex: cells[-1][0].) // We check m < size to make sure we don't try to access rows out of the vector (ex: row 5, if only 4 rows). // We check n < row size to make sure we don't access column item out of the vector (ex: 10th item in a column of only 9 items). // If we find that the Type = 1 (it is LIVE), then we add 1 to the neighbor. // Else - we add nothing to the neighbor counter. // Neighbor is the number of LIVE cells next to the current cell. if(m > 0 && n > 0) { if (cells[m-1][n-1]->getType() == 1) neighbors += 1; } if(m > 0) { if (cells[m-1][n]->getType() == 1) neighbors += 1; if(n < (cells.at(m).size() - 1)) { if (cells[m-1][n+1]->getType() == 1) neighbors += 1; } } if(n > 0) { if (cells[m][n-1]->getType() == 1) neighbors += 1; if(m < (cells.size() - 1)) { if (cells[m+1][n-1]->getType() == 1) neighbors += 1; } } if(n < (cells.at(m).size() - 1)) { if (cells[m][n+1]->getType() == 1) neighbors += 1; } if(m < (cells.size() - 1)) { if (cells[m+1][n]->getType() == 1) neighbors += 1; } if(m < (cells.size() - 1) && n < (cells.at(m).size() - 1)) { if (cells[m+1][n+1]->getType() == 1) neighbors += 1; } // Done checking number of neighbors for cells[m][n] // Now we change cells2 if it should switch in the next simulation step. // cells2 holds the values of what cells should be on the next iteration of the game. // We can't change cells right now, or it would through off our other cell values. // Apply game rules to cells: Create new, updated grid with the roundtwo vector. // Note - LIVE is 1; DEAD is 0. if (cells[m][n]->getType() == 1 && neighbors < 2) // If cell is LIVE and has less than 2 LIVE neighbors -> Set to DEAD. cells2[m][n]->setType(DEAD); else if (cells[m][n]->getType() == 1 && neighbors > 3) // If cell is LIVE and has more than 3 LIVE neighbors -> Set to DEAD. cells2[m][n]->setType(DEAD); else if (cells[m][n]->getType() == 1 && (neighbors == 2 || neighbors == 3)) // If cell is LIVE and has 2 or 3 LIVE neighbors -> Set to LIVE. cells2[m][n]->setType(LIVE); else if (cells[m][n]->getType() == 0 && neighbors == 3) // If cell is DEAD and has 3 LIVE neighbors -> Set to LIVE. cells2[m][n]->setType(LIVE); } } // Now we've gone through all of cells, and saved the new values in cells2. // Now we loop through cells and set all the cells' types to those of cells2. for (unsigned int f = 0; f < cells.size(); f++) // Loop through cells' rows. { for (unsigned int g = 0; g < cells.at(f).size(); g++) // Loop through cells columns. { cells[f][g]->setType(cells2[f][g]->getType()); // Set cells[f][g]'s type to cells2[f][g]'s type. } } } stack.h - Here's my stack. #ifndef STACK_H_ #define STACK_H_ #include <iostream> #include "node.h" template <typename T> class Stack { private: Node<T>* top; int listSize; public: Stack(); int size() const; bool empty() const; void push(const T& value); void pop(); T& peek() const; }; template <typename T> Stack<T>::Stack() : top(NULL) { listSize = 0; } template <typename T> int Stack<T>::size() const { return listSize; } template <typename T> bool Stack<T>::empty() const { if(listSize == 0) return true; else return false; } template <typename T> void Stack<T>::push(const T& value) { Node<T>* newOne = new Node<T>(value); newOne->next = top; top = newOne; listSize++; } template <typename T> void Stack<T>::pop() { Node<T>* oldT = top; top = top->next; delete oldT; listSize--; } template <typename T> T& Stack<T>::peek() const { return top->data; // Returns data in top item. } #endif gridcell.cpp - Gridcell implementation #include <iostream> #include "gridcell.h" using namespace std; // Constructor: Creates a grid cell. GridCell::GridCell(QWidget *parent) : QFrame(parent) { this->type = DEAD; // Default: Cell is DEAD (white). setFrameStyle(QFrame::Box); // Set the frame style. This is what gives each box its black border. this->button = new QPushButton(this); //Creates button that fills entirety of each grid cell. this->button->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding); // Expands button to fill space. this->button->setMinimumSize(19,19); //width,height // Min height and width of button. QHBoxLayout *layout = new QHBoxLayout(); //Creates a simple layout to hold our button and add the button to it. layout->addWidget(this->button); setLayout(layout); layout->setStretchFactor(this->button,1); // Lets the buttons expand all the way to the edges of the current frame with no space leftover layout->setContentsMargins(0,0,0,0); layout->setSpacing(0); connect(this->button,SIGNAL(clicked()),this,SLOT(handleClick())); // Connects clicked signal with handleClick slot. redrawCell(); // Calls function to redraw (set new type for) the cell. } // Basic destructor. GridCell::~GridCell() { delete this->button; } // Accessor for the cell type. CellType GridCell::getType() const { return(this->type); } // Mutator for the cell type. Also has the side effect of causing the cell to be redrawn on the GUI. void GridCell::setType(CellType type) { this->type = type; redrawCell(); // Sets type and redraws cell. } // Handler slot for button clicks. This method is called whenever the user clicks on this cell in the grid. void GridCell::handleClick() { // When clicked on... if(this->type == DEAD) // If type is DEAD (white), change to LIVE (black). type = LIVE; else type = DEAD; // If type is LIVE (black), change to DEAD (white). setType(type); // Sets new type (color). setType Calls redrawCell() to recolor. } // Method to check cell type and return the color of that type. Qt::GlobalColor GridCell::getColorForCellType() { switch(this->type) { default: case DEAD: return Qt::white; case LIVE: return Qt::black; } } // Helper method. Forces current cell to be redrawn on the GUI. Called whenever the setType method is invoked. void GridCell::redrawCell() { Qt::GlobalColor gc = getColorForCellType(); //Find out what color this cell should be. this->button->setPalette(QPalette(gc,gc)); //Force the button in the cell to be the proper color. this->button->setAutoFillBackground(true); this->button->setFlat(true); //Force QT to NOT draw the borders on the button } Thanks a lot. Let me know if you need anything else.

    Read the article

  • Why my application ask for a codec to pla the MVI(.MOV) video files while i can play them on WMP and QuickTime?

    - by Daniel Lip
    I have an application i did some time ago when im loading the video file its ok when trying to play/use the file im getting the messageBox message say that its need a codec to use gspot or search the internet. Wehn im playing this files on my hard disk with Windows Media Play or either QuickTime there is no problems. The Video files for example name are: MVI_2483 in the file name properties i see its type: Quick Time Movie (.MOV) In my application im using DirectShowLib-2005.dll this is the class im using in my case to extract the video file im using it in my application to extract only lightnings from the video file name. In Form1 i have a button click event that just starting the action: private void button8_Click(object sender, EventArgs e) { viewToolStripMenuItem.Enabled = false; fileToolStripMenuItem.Enabled = false; button2.Enabled = false; label14.Visible = false; label15.Visible = false; label21.Visible = false; label22.Visible = false; label24.Visible = false; label25.Visible = false; ExtractAutomatic = true; DirectoryInfo info = new DirectoryInfo(_videoFile); string dirName = info.Name; automaticModeDirectory = dirName + "_Automatic"; subDirectoryName = _outputDir + "\\" + automaticModeDirectory; if (secondPass == true) { Start(true); } Start(false); } This is the function start in Form1: private void Start(bool secondpass) { setpicture(-1); if (Directory.Exists(_outputDir) && secondpass == false) { } else { Directory.CreateDirectory(_outputDir); } if (ExtractAutomatic == true) { string subDirectory_Automatic_Name = _outputDir + "\\" + automaticModeDirectory; Directory.CreateDirectory(subDirectory_Automatic_Name); f = new WmvAdapter(_videoFile, Path.Combine(subDirectory_Automatic_Name)); } else { string subDirectory_Manual_Name; if (Directory.Exists(subDirectoryName)) { subDirectory_Manual_Name = subDirectoryName; f = new WmvAdapter(_videoFile, Path.Combine(subDirectory_Manual_Name)); } else { subDirectory_Manual_Name = _outputDir + "\\" + averagesListTextFileDirectory + "_Manual"; Directory.CreateDirectory(subDirectory_Manual_Name); f = new WmvAdapter(_videoFile, Path.Combine(subDirectory_Manual_Name)); } } button1.Enabled = false; f.Secondpass = secondpass; f.FramesToSave = _fts; f.FrameCountAvailable += new WmvAdapter.FrameCountEventHandler(f_FrameCountAvailable); f.StatusChanged += new WmvAdapter.EventHandler(f_StatusChanged); f.ProgressChanged += new WmvAdapter.ProgressEventHandler(f_ProgressChanged); this.Text = "Processing Please Wait..."; label5.ForeColor = Color.Green; label5.Text = "Processing Please Wait"; button8.Enabled = false; button5.Enabled = false; label5.Visible = true; pictureBox1.Image = Lightnings_Extractor.Properties.Resources.Weather_Michmoret; Hrs = 0; //number of hours Min = 0; //number of Minutes Sec = 0; //number of Sec timeElapsed = 0; label10.Text = "00:00:00"; label11.Visible = false; label12.Visible = false; label9.Visible = false; label8.Visible = false; this.button1.Enabled = false; myTrackPanelss1.trackBar1.Enabled = false; this.checkBox2.Enabled = false; this.checkBox1.Enabled = false; numericUpDown1.Enabled = false; timer1.Start(); label2.Text = ""; label1.Visible = true; label2.Visible = true; label3.Visible = true; label4.Visible = true; f.Start(); } And this is the class wich is not my oqn class i just just defined it in some places wich making the problem: using System; using System.Diagnostics; using System.Drawing; using System.Drawing.Imaging; using System.IO; using System.Runtime.InteropServices; using DirectShowLib; using System.Collections.Generic; using Extracting_Frames; using System.Windows.Forms; namespace Polkan.DataSource { internal class WmvAdapter : ISampleGrabberCB, IDisposable { #region Fields_Properties_and_Events bool dis = false; int count = 0; const string fileName = @"d:\histogramValues.dat"; private IFilterGraph2 _filterGraph; private IMediaControl _mediaCtrl; private IMediaEvent _mediaEvent; private int _width; private int _height; private readonly string _outFolder; private int _frameId; //better use a custom EventHandler that passes the results of the action to the subscriber. public delegate void EventHandler(object sender, EventArgs e); public event EventHandler StatusChanged; public delegate void FrameCountEventHandler(object sender, FrameCountEventArgs e); public event FrameCountEventHandler FrameCountAvailable; public delegate void ProgressEventHandler(object sender, ProgressEventArgs e); public event ProgressEventHandler ProgressChanged; private IMediaSeeking _mSeek; private long _duration = 0; private long _avgFrameTime = 0; //just save the averages to a List (not to fs) public List<double> AveragesList { get; set; } public List<long> histogramValuesList; public bool Secondpass { get; set; } public List<int> FramesToSave { get; set; } #endregion #region Constructors and Destructors public WmvAdapter(string file, string outFolder) { _outFolder = outFolder; try { SetupGraph(file); } catch { Dispose(); MessageBox.Show("A codec is required to load this video file. Please use http://www.headbands.com/gspot/ or search the web for the correct codec"); } } ~WmvAdapter() { CloseInterfaces(); } #endregion public void Dispose() { CloseInterfaces(); } public void Start() { EstimateFrameCount(); int hr = _mediaCtrl.Run(); WaitUntilDone(); DsError.ThrowExceptionForHR(hr); } public void WaitUntilDone() { int hr; const int eAbort = unchecked((int)0x80004004); do { System.Windows.Forms.Application.DoEvents(); EventCode evCode; if (dis == true) { return; } hr = _mediaEvent.WaitForCompletion(100, out evCode); }while (hr == eAbort); DsError.ThrowExceptionForHR(hr); OnStatusChanged(); } //Edit: added events protected virtual void OnStatusChanged() { if (StatusChanged != null) StatusChanged(this, new EventArgs()); } protected virtual void OnFrameCountAvailable(long frameCount) { if (FrameCountAvailable != null) FrameCountAvailable(this, new FrameCountEventArgs() { FrameCount = frameCount }); } protected virtual void OnProgressChanged(int frameID) { if (ProgressChanged != null) ProgressChanged(this, new ProgressEventArgs() { FrameID = frameID }); } /// <summary> build the capture graph for grabber. </summary> private void SetupGraph(string file) { ISampleGrabber sampGrabber = null; IBaseFilter capFilter = null; IBaseFilter nullrenderer = null; _filterGraph = (IFilterGraph2)new FilterGraph(); _mediaCtrl = (IMediaControl)_filterGraph; _mediaEvent = (IMediaEvent)_filterGraph; _mSeek = (IMediaSeeking)_filterGraph; var mediaFilt = (IMediaFilter)_filterGraph; try { // Add the video source int hr = _filterGraph.AddSourceFilter(file, "Ds.NET FileFilter", out capFilter); DsError.ThrowExceptionForHR(hr); // Get the SampleGrabber interface sampGrabber = new SampleGrabber() as ISampleGrabber; var baseGrabFlt = sampGrabber as IBaseFilter; ConfigureSampleGrabber(sampGrabber); // Add the frame grabber to the graph hr = _filterGraph.AddFilter(baseGrabFlt, "Ds.NET Grabber"); DsError.ThrowExceptionForHR(hr); // --------------------------------- // Connect the file filter to the sample grabber // Hopefully this will be the video pin, we could check by reading it's mediatype IPin iPinOut = DsFindPin.ByDirection(capFilter, PinDirection.Output, 0); // Get the input pin from the sample grabber IPin iPinIn = DsFindPin.ByDirection(baseGrabFlt, PinDirection.Input, 0); hr = _filterGraph.Connect(iPinOut, iPinIn); DsError.ThrowExceptionForHR(hr); // Add the null renderer to the graph nullrenderer = new NullRenderer() as IBaseFilter; hr = _filterGraph.AddFilter(nullrenderer, "Null renderer"); DsError.ThrowExceptionForHR(hr); // --------------------------------- // Connect the sample grabber to the null renderer iPinOut = DsFindPin.ByDirection(baseGrabFlt, PinDirection.Output, 0); iPinIn = DsFindPin.ByDirection(nullrenderer, PinDirection.Input, 0); hr = _filterGraph.Connect(iPinOut, iPinIn); DsError.ThrowExceptionForHR(hr); // Turn off the clock. This causes the frames to be sent // thru the graph as fast as possible hr = mediaFilt.SetSyncSource(null); DsError.ThrowExceptionForHR(hr); // Read and cache the image sizes SaveSizeInfo(sampGrabber); //Edit: get the duration hr = _mSeek.GetDuration(out _duration); DsError.ThrowExceptionForHR(hr); } finally { if (capFilter != null) { Marshal.ReleaseComObject(capFilter); } if (sampGrabber != null) { Marshal.ReleaseComObject(sampGrabber); } if (nullrenderer != null) { Marshal.ReleaseComObject(nullrenderer); } GC.Collect(); } } private void EstimateFrameCount() { try { //1sec / averageFrameTime double fr = 10000000.0 / _avgFrameTime; double frameCount = fr * (_duration / 10000000.0); OnFrameCountAvailable((long)frameCount); } catch { } } public double framesCounts() { double fr = 10000000.0 / _avgFrameTime; double frameCount = fr * (_duration / 10000000.0); return frameCount; } private void SaveSizeInfo(ISampleGrabber sampGrabber) { // Get the media type from the SampleGrabber var media = new AMMediaType(); int hr = sampGrabber.GetConnectedMediaType(media); DsError.ThrowExceptionForHR(hr); if ((media.formatType != FormatType.VideoInfo) || (media.formatPtr == IntPtr.Zero)) { throw new NotSupportedException("Unknown Grabber Media Format"); } // Grab the size info var videoInfoHeader = (VideoInfoHeader)Marshal.PtrToStructure(media.formatPtr, typeof(VideoInfoHeader)); _width = videoInfoHeader.BmiHeader.Width; _height = videoInfoHeader.BmiHeader.Height; //Edit: get framerate _avgFrameTime = videoInfoHeader.AvgTimePerFrame; DsUtils.FreeAMMediaType(media); GC.Collect(); } private void ConfigureSampleGrabber(ISampleGrabber sampGrabber) { var media = new AMMediaType { majorType = MediaType.Video, subType = MediaSubType.RGB24, formatType = FormatType.VideoInfo }; int hr = sampGrabber.SetMediaType(media); DsError.ThrowExceptionForHR(hr); DsUtils.FreeAMMediaType(media); GC.Collect(); hr = sampGrabber.SetCallback(this, 1); DsError.ThrowExceptionForHR(hr); } private void CloseInterfaces() { try { if (_mediaCtrl != null) { _mediaCtrl.Stop(); _mediaCtrl = null; dis = true; } } catch (Exception ex) { Debug.WriteLine(ex); } if (_filterGraph != null) { Marshal.ReleaseComObject(_filterGraph); _filterGraph = null; } GC.Collect(); } int ISampleGrabberCB.SampleCB(double sampleTime, IMediaSample pSample) { Marshal.ReleaseComObject(pSample); return 0; } int ISampleGrabberCB.BufferCB(double sampleTime, IntPtr pBuffer, int bufferLen) { if (Form1.ExtractAutomatic == true) { using (var bitmap = new Bitmap(_width, _height, _width * 3, PixelFormat.Format24bppRgb, pBuffer)) { if (!this.Secondpass) { long[] HistogramValues = Form1.GetHistogram(bitmap); long t = Form1.GetTopLumAmount(HistogramValues, 1000); Form1.averagesTest.Add(t); } else { //this is the changed part if (_frameId > 0) { if (Form1.averagesTest[_frameId] / 1000.0 - Form1.averagesTest[_frameId - 1] / 1000.0 > 150.0) { count = 6; } if (count > 0) { bitmap.RotateFlip(RotateFlipType.Rotate180FlipX); bitmap.Save(Path.Combine(_outFolder, _frameId.ToString("D6") + ".bmp")); count --; } } } _frameId++; //let only report each 100 frames for performance if (_frameId % 100 == 0) OnProgressChanged(_frameId); } } else { using (var bitmap = new Bitmap(_width, _height, _width * 3, PixelFormat.Format24bppRgb, pBuffer)) { if (!this.Secondpass) { //get avg double average = GetAveragePixelValue(bitmap); if (AveragesList == null) AveragesList = new List<double>(); //save avg AveragesList.Add(average); //***************************\\ // for (int i = 0; i < (int)framesCounts(); i++) // { // get histogram values long[] HistogramValues = Form1.GetHistogram(bitmap); if (histogramValuesList == null) histogramValuesList = new List<long>(256); histogramValuesList.AddRange(HistogramValues); //***************************\\ //} } else { if (FramesToSave != null && FramesToSave.Contains(_frameId)) { bitmap.RotateFlip(RotateFlipType.Rotate180FlipX); bitmap.Save(Path.Combine(_outFolder, _frameId.ToString("D6") + ".bmp")); // get histogram values long[] HistogramValues = Form1.GetHistogram(bitmap); if (histogramValuesList == null) histogramValuesList = new List<long>(256); histogramValuesList.AddRange(HistogramValues); using (BinaryWriter binWriter = new BinaryWriter(File.Open(fileName, FileMode.Create))) { for (int i = 0; i < histogramValuesList.Count; i++) { binWriter.Write(histogramValuesList[(int)i]); } binWriter.Close(); } } } _frameId++; //let only report each 100 frames for performance if (_frameId % 100 == 0) OnProgressChanged(_frameId); } } return 0; } /* int ISampleGrabberCB.SampleCB(double sampleTime, IMediaSample pSample) { Marshal.ReleaseComObject(pSample); return 0; } int ISampleGrabberCB.BufferCB(double sampleTime, IntPtr pBuffer, int bufferLen) { using (var bitmap = new Bitmap(_width, _height, _width * 3, PixelFormat.Format24bppRgb, pBuffer)) { if (!this.Secondpass) { //get avg double average = GetAveragePixelValue(bitmap); if (AveragesList == null) AveragesList = new List<double>(); //save avg AveragesList.Add(average); //***************************\\ // for (int i = 0; i < (int)framesCounts(); i++) // { // get histogram values long[] HistogramValues = Form1.GetHistogram(bitmap); if (histogramValuesList == null) histogramValuesList = new List<long>(256); histogramValuesList.AddRange(HistogramValues); long t = Form1.GetTopLumAmount(HistogramValues, 1000); //***************************\\ Form1.averagesTest.Add(t); // to add this list to a text file or binary file and read the averages from the file when its is Secondpass !!!!! //} } else { if (FramesToSave != null && FramesToSave.Contains(_frameId)) { bitmap.RotateFlip(RotateFlipType.Rotate180FlipX); bitmap.Save(Path.Combine(_outFolder, _frameId.ToString("D6") + ".bmp")); // get histogram values long[] HistogramValues = Form1.GetHistogram(bitmap); if (histogramValuesList == null) histogramValuesList = new List<long>(256); histogramValuesList.AddRange(HistogramValues); using (BinaryWriter binWriter = new BinaryWriter(File.Open(fileName, FileMode.Create))) { for (int i = 0; i < histogramValuesList.Count; i++) { binWriter.Write(histogramValuesList[(int)i]); } binWriter.Close(); } } for (int x = 1; x < Form1.averagesTest.Count; x++) { double fff = Form1.averagesTest[x] / 1000.0 - Form1.averagesTest[x - 1] / 1000.0; if (Form1.averagesTest[x] / 1000.0 - Form1.averagesTest[x - 1] / 1000.0 > 180.0) { bitmap.RotateFlip(RotateFlipType.Rotate180FlipX); bitmap.Save(Path.Combine(_outFolder, _frameId.ToString("D6") + ".bmp")); _frameId++; } } } _frameId++; //let only report each 100 frames for performance if (_frameId % 100 == 0) OnProgressChanged(_frameId); } return 0; }*/ private unsafe double GetAveragePixelValue(Bitmap bmp) { BitmapData bmData = null; try { bmData = bmp.LockBits(new Rectangle(0, 0, bmp.Width, bmp.Height), ImageLockMode.ReadOnly, PixelFormat.Format24bppRgb); int stride = bmData.Stride; IntPtr scan0 = bmData.Scan0; int w = bmData.Width; int h = bmData.Height; double sum = 0; long pixels = bmp.Width * bmp.Height; byte* p = (byte*)scan0.ToPointer(); for (int y = 0; y < h; y++) { p = (byte*)scan0.ToPointer(); p += y * stride; for (int x = 0; x < w; x++) { double i = ((double)p[0] + p[1] + p[2]) / 3.0; sum += i; p += 3; } //no offset incrementation needed when getting //the pointer at the start of each row } bmp.UnlockBits(bmData); double result = sum / (double)pixels; return result; } catch { try { bmp.UnlockBits(bmData); } catch { } } return -1; } } public class FrameCountEventArgs { public long FrameCount { get; set; } } public class ProgressEventArgs { public int FrameID { get; set; } } } I remember i had this codec problem/s before and i installed the codec/'s that were needed but in this case both quick time and windows media player can play the video files so why the application cant detect and find the codec/'s on my computer ? Gspot say that the codec is AVC1 but again wmp and quicktime play the video files no problems. The video files are from my digital camera !

    Read the article

  • Android Expandable List View Update

    - by Gaurav Arora
    I am implementing a chatting application, where I have made a service to listen all the presence changed. On the change of the presence I want to update the data and I am unable to update the data that is showing in the expandable list view. Please suggest me a means to do the same. public class UserMenuActivity extends ExpandableListActivity { private XMPPConnection connection; String name,availability,subscriptionStatus; TextView tv_Status; /** Variable Define here */ private String[] data = { "View my profile", "New Multiperson Chat", "New Broad Cast Message", "New Contact Category", "New Group", "Invite to CCM", "Search", "Expand All", "Settings", "Help", "Close" }; private String[] data_Contact = { "Rename Category","Move Contact to Category", "View my profile", "New Multiperson Chat", "New Broad Cast Message", "New Contact Category", "New Group", "Invite to CCM", "Search", "Expand All", "Settings", "Help", "Close" }; private String[] data_child_contact = { "Open chat", "Delete Contact","View my profile", "New Multiperson Chat", "New Broad Cast Message", "New Contact Category", "New Group", "Invite to CCM", "Search", "Expand All", "Settings", "Help", "Close" }; private String[] menuItem = { "Chats", "Contacts", "CGM Groups", "Pending","Request" }; private List<String> menuItemList = Arrays.asList(menuItem); private int commonGroupPosition = 0; private String etAlertVal; private DatabaseHelper dbHelper; private int categoryID, listPos; /** New Code here.. */ private ArrayList<String> groupNames; private ArrayList<ArrayList<ChildItems>> childs; private UserMenuAdapter adapter; private Object object; private String[] data2 = { "PIN Michelle", "IP Call" }; private ListView mlist2; private ImageButton mimBtnMenu; private LinearLayout mllpopmenu; private View popupView; private PopupWindow popupWindow; private AlertDialog.Builder alert; private EditText input; private TextView mtvUserName, mtvUserTagLine; private ExpandableListView mExpandableListView; public static List<CategoryDataClass> categoryList; private boolean menuType = false; private String childValContact=""; public static Context context; @Override public void onBackPressed() { if (mllpopmenu.getVisibility() == View.VISIBLE) { mllpopmenu.setVisibility(View.INVISIBLE); } else { if (CCMStaticVariable.CommonConnection.isConnected()) { CCMStaticVariable.CommonConnection.disconnect(); } super.onBackPressed(); } } @SuppressWarnings("unchecked") @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_MENU) { if (mllpopmenu.getVisibility() == View.VISIBLE) { mllpopmenu.setVisibility(View.INVISIBLE); } else { if (commonGroupPosition >= 4 && menuType == true) { if(childValContact == ""){ mllpopmenu.setVisibility(View.VISIBLE); mlist2.setAdapter(new ArrayAdapter(UserMenuActivity.this, R.layout.listviewtext, R.id.tvMenuText, data_Contact)); }else{ mllpopmenu.setVisibility(View.VISIBLE); mlist2.setAdapter(new ArrayAdapter(UserMenuActivity.this, R.layout.listviewtext, R.id.tvMenuText, data_child_contact)); } } else if (commonGroupPosition == 0) { mllpopmenu.setVisibility(View.VISIBLE); mlist2.setAdapter(new ArrayAdapter(UserMenuActivity.this, R.layout.listviewtext, R.id.tvMenuText, data)); } } return true; } return super.onKeyDown(keyCode, event); } @Override public void onCreate(Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.usermenulayout); dbHelper = new DatabaseHelper(UserMenuActivity.this); //this.context = context.getApplicationContext(); XMPPConn.getContactList(); connection = CCMStaticVariable.CommonConnection; Presence userPresence = new Presence(Presence.Type.available); userPresence.setPriority(24); userPresence.setMode(Presence.Mode.away); connection.sendPacket(userPresence); } @Override protected void onResume() { super.onResume(); Presence userPresence = new Presence(Presence.Type.available); userPresence.setPriority(24); userPresence.setMode(Presence.Mode.away); connection.sendPacket(userPresence); XMPPConn.getContactList(); setExpandableListView(); } public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) { if (groupPosition == 1 && childPosition == 0) { startActivity(new Intent(UserMenuActivity.this, InvitetoCCMActivity.class)); } else if (groupPosition == 1 && childPosition != 0) { Intent intent = new Intent(UserMenuActivity.this, UserChatActivity.class); intent.putExtra("userNameVal", XMPPConn.mfriendList.get(childPosition - 1).friendName); startActivity(intent); } else if (groupPosition == 2 && childPosition == 0) { startActivity(new Intent(UserMenuActivity.this, CreateGroupActivity.class)); } else if (groupPosition == 2 && childPosition != 0) { String GROUP_NAME = childs.get(groupPosition).get(childPosition) .getName().toString(); int end = GROUP_NAME.indexOf("("); CCMStaticVariable.groupName = GROUP_NAME.substring(0, end).trim(); startActivity(new Intent(UserMenuActivity.this, GroupsActivity.class)); } else if (groupPosition >= 4) { childValContact = childs.get(groupPosition).get(childPosition).getName().trim(); showToast("user==>"+childValContact, 0); } return false; } private void setExpandableListView() { /***###############GROUP ARRAY ############################*/ final ArrayList<String> groupNames = new ArrayList<String>(); groupNames.add("Chats (2)"); groupNames.add("Contacts (" + XMPPConn.mfriendList.size() + ")"); groupNames.add("CGM Groups (" + XMPPConn.mGroupList.size() + ")"); groupNames.add("Pending (1)"); XMPPConn.getGroup(); categoryList = dbHelper.getAllCategory(); /**Group From Sever*/ if (XMPPConn.mGroupList.size() > 0) { for (int g = 0; g < XMPPConn.mGroupList.size(); g++) { XMPPConn.getGroupContact(XMPPConn.mGroupList.get(g).groupName); groupNames.add(XMPPConn.mGroupList.get(g).groupName + "(" + XMPPConn.mGroupContactList.size()+ ")"); } } if(categoryList.size() > 0){ for (int cat = 0; cat < categoryList.size(); cat++) { groupNames.add(categoryList.get(cat).getCategoryName()+ "(0)"); } } this.groupNames = groupNames; /*** ###########CHILD ARRAY * #################*/ ArrayList<ArrayList<ChildItems>> childs = new ArrayList<ArrayList<ChildItems>>(); ArrayList<ChildItems> child = new ArrayList<ChildItems>(); child.add(new ChildItems("Alisha", "Hi",0)); child.add(new ChildItems("Michelle", "Good Morning",0)); childs.add(child); child = new ArrayList<ChildItems>(); child.add(new ChildItems("", "",0)); if (XMPPConn.mfriendList.size() > 0) { for (int n = 0; n < XMPPConn.mfriendList.size(); n++) { child.add(new ChildItems(XMPPConn.mfriendList.get(n).friendNickName, XMPPConn.mfriendList.get(n).friendStatus, XMPPConn.mfriendList.get(n).friendState)); } } childs.add(child); /************** CGM Group Child here *********************/ child = new ArrayList<ChildItems>(); child.add(new ChildItems("", "",0)); if (XMPPConn.mGroupList.size() > 0) { for (int grop = 0; grop < XMPPConn.mGroupList.size(); grop++) { child.add(new ChildItems( XMPPConn.mGroupList.get(grop).groupName + " (" + XMPPConn.mGroupList.get(grop).groupUserCount + ")", "",0)); } } childs.add(child); child = new ArrayList<ChildItems>(); child.add(new ChildItems("Shuchi", "Pending (Waiting for Authorization)",0)); childs.add(child); /************************ Group Contact List *************************/ if (XMPPConn.mGroupList.size() > 0) { for (int g = 0; g < XMPPConn.mGroupList.size(); g++) { /** Contact List */ XMPPConn.getGroupContact(XMPPConn.mGroupList.get(g).groupName); child = new ArrayList<ChildItems>(); for (int con = 0; con < XMPPConn.mGroupContactList.size(); con++) { child.add(new ChildItems( XMPPConn.mGroupContactList.get(con).friendName, XMPPConn.mGroupContactList.get(con).friendStatus,0)); } childs.add(child); } } if(categoryList.size() > 0){ for (int cat = 0; cat < categoryList.size(); cat++) { child = new ArrayList<ChildItems>(); child.add(new ChildItems("-none-", "",0)); childs.add(child); } } this.childs = childs; /** Set Adapter here */ adapter = new UserMenuAdapter(this, groupNames, childs); setListAdapter(adapter); object = this; mlist2 = (ListView) findViewById(R.id.list2); mimBtnMenu = (ImageButton) findViewById(R.id.imBtnMenu); mllpopmenu = (LinearLayout) findViewById(R.id.llpopmenu); mtvUserName = (TextView) findViewById(R.id.tvUserName); mtvUserTagLine = (TextView) findViewById(R.id.tvUserTagLine); //Set User name.. System.out.println("CCMStaticVariable.loginUserName===" + CCMStaticVariable.loginUserName); if (!CCMStaticVariable.loginUserName.equalsIgnoreCase("")) { mtvUserName.setText("" + CCMStaticVariable.loginUserName); } /** Expandable List set here.. */ mExpandableListView = (ExpandableListView) this .findViewById(android.R.id.list); mExpandableListView.setOnGroupClickListener(new OnGroupClickListener() { @Override public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) { XMPPConn.getContactList(); if (parent.isGroupExpanded(groupPosition)) { commonGroupPosition = 0; }else{ commonGroupPosition = groupPosition; } String GROUP_NAME = groupNames.get(groupPosition); int end = groupNames.get(groupPosition).indexOf("("); String GROUP_NAME_VALUE = GROUP_NAME.substring(0, end).trim(); if (menuItemList.contains(GROUP_NAME_VALUE)) { menuType = false; CCMStaticVariable.groupCatName = GROUP_NAME_VALUE; } else { menuType = true; CCMStaticVariable.groupCatName = GROUP_NAME_VALUE; } long findCatId = dbHelper.getCategoryID(GROUP_NAME_VALUE); if (findCatId != 0) { categoryID = (int) findCatId; } childValContact=""; showToast("Clicked on==" + GROUP_NAME_VALUE, 0); return false; } }); /** Click on item */ mlist2.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> arg0, View arg1, int pos,long arg3) { if (commonGroupPosition >= 4) { if(childValContact == ""){ if (pos == 0) { showAlertEdit(CCMStaticVariable.groupCatName); } /** Move contact to catgory */ if (pos == 1) { startActivity(new Intent(UserMenuActivity.this,AddContactCategoryActivity.class)); } }else{ if(pos == 0){ Intent intent = new Intent(UserMenuActivity.this,UserChatActivity.class); intent.putExtra("userNameVal",childValContact); startActivity(intent); } if(pos == 1){ XMPPConn.removeEntry(childValContact); showToast("Contact deleted sucessfully", 0); Intent intent = new Intent(UserMenuActivity.this,UserMenuActivity.class); } } } else { /** MyProfile */ if (pos == 0) { startActivity(new Intent(UserMenuActivity.this, MyProfileActivity.class)); } /** New multiperson chat start */ if (pos == 1) { startActivity(new Intent(UserMenuActivity.this, NewMultipersonChatActivity.class)); } /** New Broadcast message */ if (pos == 2) { startActivity(new Intent(UserMenuActivity.this, NewBroadcastMessageActivity.class)); } /** Click on add category */ if (pos == 3) { showAlertAdd(); } if (pos == 4) { startActivity(new Intent(UserMenuActivity.this, CreateGroupActivity.class)); } if (pos == 5) { startActivity(new Intent(UserMenuActivity.this, InvitetoCCMActivity.class)); } if (pos == 6) { startActivity(new Intent(UserMenuActivity.this, SearchActivity.class)); } if (pos == 7) { onGroupExpand(2); for (int i = 0; i < groupNames.size(); i++) { mExpandableListView.expandGroup(i); } } /** Click on settings */ if (pos == 8) { startActivity(new Intent(UserMenuActivity.this, SettingsActivity.class)); } if (pos == 10) { System.exit(0); } if (pos == 14) { if (mllpopmenu.getVisibility() == View.VISIBLE) { mllpopmenu.setVisibility(View.INVISIBLE); if (popupWindow.isShowing()) { popupWindow.dismiss(); } } else { mllpopmenu.setVisibility(View.VISIBLE); mlist2.setAdapter(new ArrayAdapter( UserMenuActivity.this, R.layout.listviewtext, R.id.tvMenuText, data)); } } } } }); } /** Toast message display here.. */ private void showToast(String msg, int time) { Toast.makeText(this, msg, time).show(); } public String showSubscriptionStatus(String friend){ return friend; } } Service.class public class UpdaterService extends Service { private XMPPConnection connection; String Friend; String user = ""; @Override public IBinder onBind(Intent arg0) { // TODO Auto-generated method stub return null; } @Override public void onCreate() { // Toast.makeText(this, "My Service Created", Toast.LENGTH_LONG).show(); super.onCreate(); } @Override public void onDestroy() { // TODO Auto-generated method stub super.onDestroy(); } @Override public void onStart(Intent intent, int startId) { // TODO Auto-generated method stub showToast("My Service Started", 0); connection = getConnection(); if (connection.isConnected()) { final Roster roster = connection.getRoster(); RosterListener r1 = new RosterListener() { @Override public void presenceChanged(Presence presence) { // TODO Auto-generated method stub XMPPConn.getContactList(); } @Override public void entriesUpdated(Collection<String> arg0) { // TODO Auto-generated method stub //notification("entriesUpdated"); } @Override public void entriesDeleted(Collection<String> arg0) { // TODO Auto-generated method stub //notification("entriesDeleted"); } @Override public void entriesAdded(Collection<String> arg0) { // TODO Auto-generated method stub Iterator<String> it = arg0.iterator(); if (it.hasNext()) { user = it.next(); } RosterEntry entry = roster.getEntry(user); if(entry.getType().toString().equalsIgnoreCase("to")){ int index_of_Alpha = Friend.indexOf("@"); String subID = Friend.substring(0, index_of_Alpha); notification("Hi "+subID+" wants to add you"); } } }; if (roster != null) { roster.setSubscriptionMode(Roster.SubscriptionMode.manual); System.out.println("subscription going on"); roster.addRosterListener(r1); } } else { showToast("Connection lost-", 0); } } protected void showToast(String msg, int time) { Toast.makeText(this, msg, time).show(); } private XMPPConnection getConnection() { return CCMStaticVariable.CommonConnection; } /** Notification manager */ private void notification(CharSequence message) { String ns = Context.NOTIFICATION_SERVICE; NotificationManager mNotificationManager = (NotificationManager) getSystemService(ns); int icon = R.drawable.ic_launcher; CharSequence tickerText = message; long when = System.currentTimeMillis(); Notification notification = new Notification(icon, tickerText, when); Context context = getApplicationContext(); CharSequence contentTitle = "CCM"; CharSequence contentText = message; Intent notificationIntent = new Intent(this, ManageNotification.class); notificationIntent.putExtra("Subscriber_ID",user ); PendingIntent contentIntent = PendingIntent.getActivity(this, 0, notificationIntent, 0); notification.setLatestEventInfo(context, contentTitle, contentText, contentIntent); notification.flags |= Notification.FLAG_AUTO_CANCEL; final int HELLO_ID = 1; mNotificationManager.notify(HELLO_ID, notification); } } Here is my adapter class public class UserMenuAdapter extends BaseExpandableListAdapter { private ArrayList<String> groups; private ArrayList<ArrayList<ChildItems>> childs; private Context context; public LayoutInflater inflater; ImageView img_availabiliy; private static final int[] EMPTY_STATE_SET = {}; private static final int[] GROUP_EXPANDED_STATE_SET = {android.R.attr.state_expanded}; private static final int[][] GROUP_STATE_SETS = { EMPTY_STATE_SET, // 0 GROUP_EXPANDED_STATE_SET // 1 }; public UserMenuAdapter(Context context, ArrayList<String> groups, ArrayList<ArrayList<ChildItems>> childs) { this.context = context; this.groups = groups; this.childs = childs; inflater = LayoutInflater.from(context); } @Override public Object getChild(int groupPosition, int childPosition) { return childs.get(groupPosition).get(childPosition); } @Override public long getChildId(int groupPosition, int childPosition) { return (long) (groupPosition * 1024 + childPosition); } @Override public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) { View v = null; if (convertView != null) v = convertView; else v = inflater.inflate(R.layout.child_layout, parent, false); ChildItems ci = (ChildItems) getChild(groupPosition, childPosition); TextView tv = (TextView) v.findViewById(R.id.tvChild); tv.setText(ci.getName()); TextView tv2 = (TextView) v.findViewById(R.id.tvChild2); tv2.setText(ci.getDailyStatus()); img_availabiliy = (ImageView)v.findViewById(R.id.img_childlayout_AVAILABILITY); ImageView friendPics = (ImageView)v.findViewById(R.id.ivFriendPics); if(ci.getStatusState() == 1){ img_availabiliy.setImageResource(R.drawable.online); } else if(ci.getStatusState()==0){ img_availabiliy.setImageResource(R.drawable.offline); } else if (ci.getStatusState()==2) { img_availabiliy.setImageResource(R.drawable.away); } else if(ci.getStatusState()==3){ img_availabiliy.setImageResource(R.drawable.busy); } else{ img_availabiliy.setImageDrawable(null); } if((groupPosition == 1 && childPosition == 0)){ friendPics.setImageResource(R.drawable.inviteto_ccm); img_availabiliy.setVisibility(View.INVISIBLE); } else if(groupPosition == 2 && childPosition == 0){ friendPics.setImageResource(R.drawable.new_ccmgroup); img_availabiliy.setVisibility(View.VISIBLE); }else{ if(ci.getPicture()!= null){ Bitmap bitmap = BitmapFactory.decodeByteArray(ci.getPicture(), 0, ci.getPicture().length); bitmap = Bitmap.createScaledBitmap(bitmap, 50, 50, true); friendPics.setImageBitmap(bitmap); }else{ friendPics.setImageResource(R.drawable.avatar); } img_availabiliy.setVisibility(View.VISIBLE); } return v; } @Override public int getChildrenCount(int groupPosition) { return childs.get(groupPosition).size(); } @Override public Object getGroup(int groupPosition) { return groups.get(groupPosition); } @Override public int getGroupCount() { return groups.size(); } @Override public long getGroupId(int groupPosition) { return (long) (groupPosition * 1024); } @Override public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) { View v = null; if (convertView != null) v = convertView; else v = inflater.inflate(R.layout.group_layout, parent, false); String gt = (String) getGroup(groupPosition); TextView tv2 = (TextView) v.findViewById(R.id.tvGroup); if (gt != null) tv2.setText(gt); /**Set Image on group layout, Max/min*/ View ind = v.findViewById( R.id.explist_indicator); View groupInd = v.findViewById( R.id.llgroup); if( ind != null ) { ImageView indicator = (ImageView)ind; if( getChildrenCount( groupPosition ) == 0 ) { indicator.setVisibility( View.INVISIBLE ); } else { indicator.setVisibility( View.VISIBLE ); int stateSetIndex = ( isExpanded ? 1 : 0) ; Drawable drawable = indicator.getDrawable(); drawable.setState(GROUP_STATE_SETS[stateSetIndex]); } } if( groupInd != null ) { RelativeLayout indicator2 = (RelativeLayout)groupInd; if( getChildrenCount( groupPosition ) == 0 ) { indicator2.setVisibility( View.INVISIBLE ); } else { indicator2.setVisibility( View.VISIBLE ); int stateSetIndex = ( isExpanded ? 1 : 0) ; Drawable drawable2 = indicator2.getBackground(); drawable2.setState(GROUP_STATE_SETS[stateSetIndex]); } } return v; } @Override public boolean hasStableIds() { return true; } @Override public boolean isChildSelectable(int groupPosition, int childPosition) { return true; } public void onGroupCollapsed(int groupPosition) { } public void onGroupExpanded(int groupPosition) { } } I just want to update my list in ON PRESENCE CHANGED method in the Service class.. Please suggest me a means to do the same.

    Read the article

  • CHAT ROOMs 7 by 6

    - by user2939942
    I am looking for chatroom on one page with 7 loggedin users and 6+rows for say 42 users.these users will keep on adding wthnew users.Need urgent help.A PRETTY UNUSUAL Q FOR MOST OF U.What is MORE REQ new features: Usernames are unique to users currently chatting You can see a "currently chatting" user list There are multiple rooms for chatting <!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> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Simpla Admin</title> <link rel="stylesheet" href="resources/css/reset.css" type="text/css" media="screen" /> <link rel="stylesheet" href="resources/css/style.css" type="text/css" media="screen" /> <link rel="stylesheet" href="resources/css/invalid.css" type="text/css" media="screen" /> <script type="text/javascript" src="resources/scripts/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="resources/scripts/simpla.jquery.configuration.js"></script> <script type="text/javascript" src="resources/scripts/facebox.js"></script> <script type="text/javascript" src="resources/scripts/jquery.wysiwyg.js"></script> <script type="text/javascript" src="resources/scripts/jquery.datePicker.js"></script> <script type="text/javascript" src="resources/scripts/jquery.date.js"></script> <script language="JavaScript" type="text/javascript" src="suggest3.js"></script><script language="javascript"> function popitappup4() { var aid=document.a.cid.value; var url="followup.php?id="+aid; alert(url); newwindow=window.open(url,'name','height=480,width=480, scrollbars=yes'); if (window.focus) {newwindow.focus()} return false; } </script> <script type="text/javascript" src="highslide-with-html.js"></script> <link rel="stylesheet" type="text/css" href="highslide.css" /> <script type="text/javascript"> hs.graphicsDir = 'graphics/'; hs.outlineType = 'rounded-white'; hs.wrapperClassName = 'draggable-header'; </script> <link type="text/css" rel="stylesheet" media="all" href="css/chat.css" /> <link type="text/css" rel="stylesheet" media="all" href="css/screen.css" /> </head> <body onload="fnew()"><div id="body-wrapper"> <!-- Wrapper for the radial gradient background --> <div id="sidebar"> <link type="text/css" rel="stylesheet" media="all" href="css/chat.css" /> <link type="text/css" rel="stylesheet" media="all" href="css/screen.css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/chat.js"></script> <script type="text/javascript"> function fnew() { document.getElementById("psearch").focus(); } </script> <div id="sidebar-wrapper"> <!-- Sidebar with logo and menu --> <h1 id="sidebar-title"><a href="#"></a></h1> <!-- Logo (221px wide) --> <a href="#"><img id="logo" src="resources/images/logo.png" alt="Simpla Admin logo" /></a> <!-- Sidebar Profile links --> <form name="frm" action="opd_view1.php"> <table width="240" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="210"><div align="right" style="font-size:22px; color:#FFFFFF"><b>OPD Search</b></div></td> <td width="30"><div align="right"></div></td> </tr> <tr> <td align="right">&nbsp;</td> <td align="right">&nbsp;</td> </tr> <tr> <td align="right"><div align="right"> <input type="text" name="psearch" id="psearch" class="text-input" style="width:45mm;" /> </div></td> <td align="right"><div align="right"></div></td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td><div align="right"></div></td> <td><div align="right"></div></td> </tr> </table> </form> <div id="profile-links"> <a href="welcome.php" title="Sign Out" style="font-size:16px" ><b> </b></a> <br /> <a href="sample.php" title="Chat">Chat</a> </div></div> <!-- End #sidebar --> <div id="main-content"> <!-- Main Content Section with everything --> <noscript> <!-- Show a notification if the user has disabled javascript --> </noscript> <div style="width:100%; height: 600px; overflow-x: scroll; scrollbar-arrow-color: blue; scrollbar-face-color: #e7e7e7; scrollbar-3dlight-color: #a0a0a0; scrollbar-darkshadow-color: #888888; background-color:#FFFFFF "> <ul class="shortcut-buttons-set"> <!-- Page Head --> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drabhinit')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drabhinit</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drvarun')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drvarun</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('sameer')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>sameer</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drchetan')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drchetan</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('neema')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>neema</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drpriya')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drpriya</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drchhavi')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drchhavi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drsanjay')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drsanjay</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('ruchi')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>ruchi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drarchana')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drarchana</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drshraddha')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drshraddha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('sunita')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>sunita</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('reshma')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>reshma</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('riya')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>riya</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drritesh')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drritesh</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('rachana')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>rachana</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('sunita')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>sunita</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('kavye')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>kavye</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('paridhi')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>paridhi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('paridhi')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>paridhi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drsonika')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drsonika</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('anny')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>anny</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('nitansh')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>nitansh</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drekta')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drekta</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drritesh')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drritesh</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('neeraj')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>neeraj</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('neeraj')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>neeraj</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drneha')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drneha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('kirti')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>kirti</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drratna')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drratna</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drratana')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drratana</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drnoopur')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drnoopur</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('admin k')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>admin k</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('web')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>web</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drarti')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drarti</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drsaqib')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drsaqib</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('neelesh')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>neelesh</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('pooja')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>pooja</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drneha')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drneha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drnupur')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drnupur</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('isha')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>isha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('isha')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>isha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drnamrata')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drnamrata</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('ashish')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>ashish</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('ambrish')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>ambrish</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drrashmi')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drrashmi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drsapna')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drsapna</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('manisha')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>manisha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('Isha')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>Isha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drrashmi')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drrashmi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('Dr Meghna')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>Dr Meghna</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('akanksha')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>akanksha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drashish')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drashish</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drpriya')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drpriya</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drnitya')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drnitya</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drmanoj')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drmanoj</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('sonali')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>sonali</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drkhushbu')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drkhushbu</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drpriyanka')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drpriyanka</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drabhishek')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drabhishek</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drpoonam')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drpoonam</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drprachi')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drprachi</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drpeenal')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drpeenal</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('neerajpune')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>neerajpune</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('paridhipune')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>paridhipune</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('faeem')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>faeem</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('rahul')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>rahul</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('DrNeha')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>DrNeha</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drmrigendra')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drmrigendra</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('neetu')" rel="modal" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>neetu</span></a></li> <li> <a class="shortcut-button" href="javascript:void(0)" onClick="javascript:chatWith('drriteshpawar')" rel="modal" style=" background-color:#00FF00" ><span><img src="resources/images/icons/comment_48.png" alt="icon" width="48" height="48" /> <br/>drriteshpawar</span></a></li> </ul> </div> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/chat.js"></script> <!-- End .shortcut-buttons-set --> <div class="clear"></div> <div class="clear"></div>

    Read the article

  • HttpClient POST fails to submit the form

    - by Jayomat
    Hi, I'm writing an app to check for the bus timetable's. Therefor I need to post some data to a html page, submit it, and parse the resulting page with htmlparser. Though it may be asked a lot, can some one help me identify if 1) this page does support post/get (I think it does) 2) which fields I need to use? 3) How to make the actual request? this is my code so far: String url = "http://busspur02.aseag.de/bs.exe?Cmd=RV&Karten=true&DatumT=30&DatumM=4&DatumJ=2010&ZeitH=&ZeitM=&Suchen=%28S%29uchen&GT0=&HT0=&GT1=&HT1="; String charset = "CP1252"; System.out.println("startFrom: "+start_from); System.out.println("goTo: "+destination); //String tag.v List<NameValuePair> params = new ArrayList<NameValuePair>(); params.add(new BasicNameValuePair("HTO", start_from)); params.add(new BasicNameValuePair("HT1", destination)); params.add(new BasicNameValuePair("GTO", "Aachen")); params.add(new BasicNameValuePair("GT1", "Aachen")); params.add(new BasicNameValuePair("DatumT", day)); params.add(new BasicNameValuePair("DatumM", month)); params.add(new BasicNameValuePair("DatumJ", year)); params.add(new BasicNameValuePair("ZeitH", hour)); params.add(new BasicNameValuePair("ZeitM", min)); UrlEncodedFormEntity query = new UrlEncodedFormEntity(params, charset); HttpPost post = new HttpPost(url); post.setEntity(query); InputStream response = new DefaultHttpClient().execute(post).getEntity().getContent(); // Now do your thing with the facebook response. String source = readText(response,"CP1252"); Log.d(TAG_AVV,response.toString()); System.out.println("STREAM "+source); One person also gave me a hint to use firebug to read what's going on at the page, but I don't really understand what to look for, or more precisely, how to use the provided information. I also find it confusing, for example, that when I enter the data by hand, the url says, for example, "....HTO=Kaiserplatz&...", but in Firebug, the same Kaiserplatz is connected to a different field, in this case: \<\td class="Start3" Kaiserplatz <\/td (I inserted \ to make it visible) The last line in my code prints the html page, but without having send a request.. it's printed as if there was no input at all... My app is almost done, I hope someone can help me out to finish it! thanks in advance EDIT: this is what the s.o.p returns: (At some point there actually is some input, but only the destination ???) 04-30 03:15:43.524: INFO/System.out(3303): STREAM <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 04-30 03:15:43.524: INFO/System.out(3303): <html> 04-30 03:15:43.524: INFO/System.out(3303): <head> 04-30 03:15:43.545: INFO/System.out(3303): <title>Busspur online</title> 04-30 03:15:43.554: INFO/System.out(3303): <base href="http://busspur02.aseag.de"> 04-30 03:15:43.554: INFO/System.out(3303): <meta name="description" content="Busspur im Internet"> 04-30 03:15:43.554: INFO/System.out(3303): <meta name="author" content="Dr. Manfred Enning"> 04-30 03:15:43.554: INFO/System.out(3303): <meta name="AUTH_TYPE" content="Basic"> 04-30 03:15:43.574: INFO/System.out(3303): <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252"> 04-30 03:15:43.574: INFO/System.out(3303): <meta HTTP-EQUIV="Content-Language" CONTENT="de"> 04-30 03:15:43.574: INFO/System.out(3303): <link rel=stylesheet type="text/css" href="busspur.css"> 04-30 03:15:43.574: INFO/System.out(3303): </head> 04-30 03:15:43.574: INFO/System.out(3303): 04-30 03:15:43.574: INFO/System.out(3303): <body> 04-30 03:15:43.574: INFO/System.out(3303): <table border="0" cellspacing="0" cellpadding="0" width="100%"> 04-30 03:15:43.574: INFO/System.out(3303): <tr> 04-30 03:15:43.584: INFO/System.out(3303): <td align="left" width="25%"><small>Version: 6.8.1.9s2<br>Datenstand: 13.04.2010 04-30 03:15:43.584: INFO/System.out(3303): 04-30 03:15:43.584: INFO/System.out(3303): <br>12.04.2010 - 12.06.2010 04-30 03:15:43.584: INFO/System.out(3303): <br>1663 04-30 03:15:43.584: INFO/System.out(3303): 3D3B9</small> 04-30 03:15:43.584: INFO/System.out(3303): </td> 04-30 03:15:43.584: INFO/System.out(3303): 04-30 03:15:43.584: INFO/System.out(3303): <td align="center" width="50%"> 04-30 03:15:43.584: INFO/System.out(3303): <a href="/bs.exe/SL?Sprache=Nederlands&amp;SID=3D3B9"><img src="http://www.busspur.de/logos/nederlands.gif" alt="Nederlands" border="0" Width="32" Height="22"></a><a href="/bs.exe/SL?Sprache=English&amp;SID=3D3B9"><img src="http://www.busspur.de/logos/english.gif" alt="English" border="0" Width="32" Height="22"></a><a href="/bs.exe/SL?Sprache=Francais&amp;SID=3D3B9"><img src="http://www.busspur.de/logos/francais.gif" alt="Francais" border="0" Width="32" Height="22"></a> 04-30 03:15:43.584: INFO/System.out(3303): </td> 04-30 03:15:43.584: INFO/System.out(3303): 04-30 03:15:43.594: INFO/System.out(3303): <td align="right" width="25%"> 04-30 03:15:43.594: INFO/System.out(3303): <a href="http://www.avv.de/"><img src="/logos/avvlogo.gif" border="0" alt="AVV"></a> 04-30 03:15:43.594: INFO/System.out(3303): </td> 04-30 03:15:43.594: INFO/System.out(3303): </tr> 04-30 03:15:43.594: INFO/System.out(3303): </table> 04-30 03:15:43.594: INFO/System.out(3303): 04-30 03:15:43.594: INFO/System.out(3303): <!-- Kopfbereich (automatisch erzeugt) --> 04-30 03:15:43.594: INFO/System.out(3303): <div align="center"> 04-30 03:15:43.594: INFO/System.out(3303): 04-30 03:15:43.604: INFO/System.out(3303): <H2>Busspur-Online <i>Verbindungsabfrage</i></H2> 04-30 03:15:43.604: INFO/System.out(3303): </div> 04-30 03:15:43.604: INFO/System.out(3303): <!-- Ende Kopfbereich --> 04-30 03:15:43.604: INFO/System.out(3303): 04-30 03:15:43.604: INFO/System.out(3303): <!-- Ausgabebereich (automatisch erzeugt) --> 04-30 03:15:43.604: INFO/System.out(3303): <div align="center"> 04-30 03:15:43.614: INFO/System.out(3303): <p></p> 04-30 03:15:43.614: INFO/System.out(3303): <p></p> 04-30 03:15:43.614: INFO/System.out(3303): 04-30 03:15:43.614: INFO/System.out(3303): 04-30 03:15:43.624: INFO/System.out(3303): </div> 04-30 03:15:43.624: INFO/System.out(3303): <!-- Ende Ausgabebereich --> 04-30 03:15:43.634: INFO/System.out(3303): 04-30 03:15:43.634: INFO/System.out(3303): <!-- Fussnotenbereich (automatisch erzeugt) --> 04-30 03:15:43.634: INFO/System.out(3303): <div align="left"> 04-30 03:15:43.634: INFO/System.out(3303): 04-30 03:15:43.634: INFO/System.out(3303): 04-30 03:15:43.634: INFO/System.out(3303): </div> 04-30 03:15:43.634: INFO/System.out(3303): <!-- Ende Fussnotenbereich --> 04-30 03:15:43.634: INFO/System.out(3303): 04-30 03:15:43.634: INFO/System.out(3303): <!-- Nachschlageliste (automatisch erzeugt) --> 04-30 03:15:43.634: INFO/System.out(3303): <div align="center"> 04-30 03:15:43.644: INFO/System.out(3303): 04-30 03:15:43.644: INFO/System.out(3303): </div> 04-30 03:15:43.644: INFO/System.out(3303): <!-- Ende Nachschlageliste --> 04-30 03:15:43.644: INFO/System.out(3303): 04-30 03:15:43.644: INFO/System.out(3303): 04-30 03:15:43.644: INFO/System.out(3303): <!-- Eingabeformular --> 04-30 03:15:43.644: INFO/System.out(3303): 04-30 03:15:43.644: INFO/System.out(3303): 04-30 03:15:43.644: INFO/System.out(3303): <!-- Eingabeformular --> 04-30 03:15:43.644: INFO/System.out(3303): <form name="Maske" action="/bs.exe" method="get"> 04-30 03:15:43.644: INFO/System.out(3303): 04-30 03:15:43.644: INFO/System.out(3303): <input type="hidden" name="SID" value="3D3B9"> 04-30 03:15:43.644: INFO/System.out(3303): <input type="hidden" name="ScreenX" value=""> 04-30 03:15:43.654: INFO/System.out(3303): <input type="hidden" name="ScreenY" value=""> 04-30 03:15:43.654: INFO/System.out(3303): <input type="hidden" class="hiddenForm" name="CMD" value="CR" /> 04-30 03:15:43.654: INFO/System.out(3303): 04-30 03:15:43.654: INFO/System.out(3303): 04-30 03:15:43.654: INFO/System.out(3303): <input TYPE="Submit" name="Suchen" value="S" tabindex="20" style="visibility:hidden"> 04-30 03:15:43.654: INFO/System.out(3303): 04-30 03:15:43.654: INFO/System.out(3303): <table align="center" border="0" cellspacing="0" cellpadding="2"> 04-30 03:15:43.654: INFO/System.out(3303): <tr> 04-30 03:15:43.654: INFO/System.out(3303): <td class="Haupt"> 04-30 03:15:43.654: INFO/System.out(3303): 04-30 03:15:43.674: INFO/System.out(3303): <table border="0" cellspacing="0" cellpadding="2"> 04-30 03:15:43.674: INFO/System.out(3303): <!-- 1.Zeile Startauswahl --> 04-30 03:15:43.674: INFO/System.out(3303): <tr> 04-30 03:15:43.674: INFO/System.out(3303): <td rowspan="2" class="Start1"> 04-30 03:15:43.674: INFO/System.out(3303): Start 04-30 03:15:43.685: INFO/System.out(3303): </td> 04-30 03:15:43.685: INFO/System.out(3303): 04-30 03:15:43.685: INFO/System.out(3303): <td class="Start2" height="25"> 04-30 03:15:43.685: INFO/System.out(3303): Stadt/Gemeinde 04-30 03:15:43.685: INFO/System.out(3303): </td> 04-30 03:15:43.685: INFO/System.out(3303): 04-30 03:15:43.685: INFO/System.out(3303): <td class="Start3"> 04-30 03:15:43.685: INFO/System.out(3303): <input type="text" name="GT0" value="" tabindex="1" /> 04-30 03:15:43.704: INFO/System.out(3303): 04-30 03:15:43.704: INFO/System.out(3303): </td> 04-30 03:15:43.704: INFO/System.out(3303): 04-30 03:15:43.704: INFO/System.out(3303): 04-30 03:15:43.704: INFO/System.out(3303): <td rowspan="2" class="Start4"> 04-30 03:15:43.714: INFO/System.out(3303): <input type="submit" name="Map0" value="Karte" tabindex="100" /> 04-30 03:15:43.724: INFO/System.out(3303): 04-30 03:15:43.724: INFO/System.out(3303): </td> 04-30 03:15:43.724: INFO/System.out(3303): 04-30 03:15:43.724: INFO/System.out(3303): 04-30 03:15:43.724: INFO/System.out(3303): </tr> 04-30 03:15:43.724: INFO/System.out(3303): 04-30 03:15:43.724: INFO/System.out(3303): <tr> 04-30 03:15:43.734: INFO/System.out(3303): <td class="Start2" height="25"> 04-30 03:15:43.734: INFO/System.out(3303): <select name="T0" id="efaT0"> 04-30 03:15:43.734: INFO/System.out(3303): <option value="A" >Adresse 04-30 03:15:43.734: INFO/System.out(3303): <option value="H" selected="selected">Haltestelle 04-30 03:15:43.734: INFO/System.out(3303): <option value="Z" >Bes. Ziel 04-30 03:15:43.734: INFO/System.out(3303): </select> 04-30 03:15:43.734: INFO/System.out(3303): 04-30 03:15:43.734: INFO/System.out(3303): </td> 04-30 03:15:43.734: INFO/System.out(3303): 04-30 03:15:43.734: INFO/System.out(3303): <td class="Start3"> 04-30 03:15:43.734: INFO/System.out(3303): <input type="text" name="HT0" value="" tabindex="2" /> 04-30 03:15:43.734: INFO/System.out(3303): 04-30 03:15:43.745: INFO/System.out(3303): </td> 04-30 03:15:43.754: INFO/System.out(3303): 04-30 03:15:43.774: INFO/System.out(3303): </tr> 04-30 03:15:43.784: INFO/System.out(3303): 04-30 03:15:43.784: INFO/System.out(3303): <!-- 2.Zeile Ziel oder ViaAuswahl --> 04-30 03:15:43.784: INFO/System.out(3303): 04-30 03:15:43.805: INFO/System.out(3303): <tr> 04-30 03:15:43.834: INFO/System.out(3303): <td rowspan="2" class="Ziel1"> 04-30 03:15:43.834: INFO/System.out(3303): Ziel 04-30 03:15:43.834: INFO/System.out(3303): </td> 04-30 03:15:43.844: INFO/System.out(3303): 04-30 03:15:43.844: INFO/System.out(3303): <td class="Ziel2" height="25"> 04-30 03:15:43.844: INFO/System.out(3303): Stadt/Gemeinde 04-30 03:15:43.844: INFO/System.out(3303): </td> 04-30 03:15:43.854: INFO/System.out(3303): 04-30 03:15:43.854: INFO/System.out(3303): <td class="Ziel3"> 04-30 03:15:43.854: INFO/System.out(3303): Aachen 04-30 03:15:43.864: INFO/System.out(3303): </td> 04-30 03:15:43.874: INFO/System.out(3303): 04-30 03:15:43.874: INFO/System.out(3303): 04-30 03:15:43.884: INFO/System.out(3303): <td rowspan="2" class="Ziel4"> 04-30 03:15:43.884: INFO/System.out(3303): <input type="submit" name="Map1" value="Karte" tabindex="101" /> 04-30 03:15:43.884: INFO/System.out(3303): 04-30 03:15:43.884: INFO/System.out(3303): </td> 04-30 03:15:43.884: INFO/System.out(3303): 04-30 03:15:43.884: INFO/System.out(3303): 04-30 03:15:43.884: INFO/System.out(3303): </tr> 04-30 03:15:43.884: INFO/System.out(3303): 04-30 03:15:43.884: INFO/System.out(3303): <tr> 04-30 03:15:43.884: INFO/System.out(3303): <td class="Ziel2" height="25"> 04-30 03:15:43.894: INFO/System.out(3303): <small></small> 04-30 03:15:43.894: INFO/System.out(3303): </td> 04-30 03:15:43.894: INFO/System.out(3303): <td class="Ziel3"> 04-30 03:15:43.894: INFO/System.out(3303): Karlsgraben 04-30 03:15:43.904: INFO/System.out(3303): </td> 04-30 03:15:43.904: INFO/System.out(3303): </tr> 04-30 03:15:43.904: INFO/System.out(3303): 04-30 03:15:43.914: INFO/System.out(3303): 04-30 03:15:43.924: INFO/System.out(3303): 04-30 03:15:43.934: INFO/System.out(3303): 04-30 03:15:43.934: INFO/System.out(3303): 04-30 03:15:43.934: INFO/System.out(3303): 04-30 03:15:43.934: INFO/System.out(3303): <!-- 3.Zeile Datum/Zeit/Intervall --> 04-30 03:15:43.934: INFO/System.out(3303): <tr> 04-30 03:15:43.944: INFO/System.out(3303): <td rowspan="3" class="Zeit1"> 04-30 03:15:43.944: INFO/System.out(3303): Zeit 04-30 03:15:43.944: INFO/System.out(3303): </td> 04-30 03:15:43.944: INFO/System.out(3303): <td class="Datum2"> 04-30 03:15:43.944: INFO/System.out(3303): Datum 04-30 03:15:43.944: INFO/System.out(3303): </td> 04-30 03:15:43.944: INFO/System.out(3303): 04-30 03:15:43.944: INFO/System.out(3303): <!-- Für Abfragen ohne Karte alternativ Zeile ohne colspan hinzufügen --> 04-30 03:15:43.954: INFO/System.out(3303): 04-30 03:15:43.964: INFO/System.out(3303): <td class="Datum3" height="25" colspan="2"> 04-30 03:15:43.984: INFO/System.out(3303): <select name="DatumT" tabindex="10" id="efaDatumT"> 04-30 03:15:43.984: INFO/System.out(3303): <option >1</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >2</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >3</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >4</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >5</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >6</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >7</option> 04-30 03:15:43.984: INFO/System.out(3303): <option >8</option> 04-30 03:15:43.994: INFO/System.out(3303): <option >9</option> 04-30 03:15:43.994: INFO/System.out(3303): <option >10</option> 04-30 03:15:43.994: INFO/System.out(3303): <option >11</option> 04-30 03:15:43.994: INFO/System.out(3303): <option >12</option> 04-30 03:15:44.005: INFO/System.out(3303): <option >13</option> 04-30 03:15:44.024: INFO/System.out(3303): <option >14</option> 04-30 03:15:44.034: INFO/System.out(3303): <option >15</option> 04-30 03:15:44.034: INFO/System.out(3303): <option >16</option> 04-30 03:15:44.034: INFO/System.out(3303): <option >17</option> 04-30 03:15:44.034: INFO/System.out(3303): <option >18</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >19</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >20</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >21</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >22</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >23</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >24</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >25</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >26</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >27</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >28</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >29</option> 04-30 03:15:44.044: INFO/System.out(3303): <option selected="selected">30</option> 04-30 03:15:44.044: INFO/System.out(3303): <option >31</option> 04-30 03:15:44.055: INFO/System.out(3303): </select> 04-30 03:15:44.055: INFO/System.out(3303): . 04-30 03:15:44.055: INFO/System.out(3303): <select name="DatumM" tabindex="11" id="efaDatumM"> 04-30 03:15:44.055: INFO/System.out(3303): <option >1</option> 04-30 03:15:44.055: INFO/System.out(3303): <option >2</option> 04-30 03:15:44.055: INFO/System.out(3303): <option >3</option> 04-30 03:15:44.064: INFO/System.out(3303): <option selected="selected">4</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >5</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >6</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >7</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >8</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >9</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >10</option> 04-30 03:15:44.064: INFO/System.out(3303): <option >11</option> 04-30 03:15:44.085: INFO/System.out(3303): <option >12</option> 04-30 03:15:44.085: INFO/System.out(3303): </select> 04-30 03:15:44.085: INFO/System.out(3303): . 04-30 03:15:44.085: INFO/System.out(3303): <select name="DatumJ" tabindex="12" id="efaDatumJ"> 04-30 03:15:44.095: INFO/System.out(3303): <option >2009</option> 04-30 03:15:44.095: INFO/System.out(3303): <option selected="selected">2010</option> 04-30 03:15:44.095: INFO/System.out(3303): <option >2011</option> 04-30 03:15:44.095: INFO/System.out(3303): </select> 04-30 03:15:44.095: INFO/System.out(3303): 04-30 03:15:44.095: INFO/System.out(3303): </td> 04-30 03:15:44.095: INFO/System.out(3303): 04-30 03:15:44.105: INFO/System.out(3303): </tr> 04-30 03:15:44.115: INFO/System.out(3303): 04-30 03:15:44.115: INFO/System.out(3303): <tr> 04-30 03:15:44.115: INFO/System.out(3303): <td class="Uhrzeit2"> 04-30 03:15:44.115: INFO/System.out(3303): <input type="radio" name="AbfAnk" value="Abf" checked />Abfahrten ab<br /> 04-30 03:15:44.115: INFO/System.out(3303): <input type="radio" name="AbfAnk" value="Ank" />Ankünfte bis 04-30 03:15:44.115: INFO/System.out(3303): 04-30 03:15:44.115: INFO/System.out(3303): </td> 04-30 03:15:44.125: INFO/System.out(3303): <td class="Uhrzeit3" height="25"> 04-30 03:15:44.125: INFO/System.out(3303): <select name="ZeitH" tabindex="14" id="efaZeitH"> 04-30 03:15:44.125: INFO/System.out(3303): <option >0</option> 04-30 03:15:44.125: INFO/System.out(3303): <option >1</option> 04-30 03:15:44.125: INFO/System.out(3303): <option >2</option> 04-30 03:15:44.135: INFO/System.out(3303): <option >3</option> 04-30 03:15:44.135: INFO/System.out(3303): <option >4</option> 04-30 03:15:44.135: INFO/System.out(3303): <option >5</option> 04-30 03:15:44.135: INFO/System.out(3303): <option >6</option> 04-30 03:15:44.135: INFO/System.out(3303): <option >7</option> 04-30 03:15:44.135: INFO/System.out(3303): <option >8</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >9</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >10</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >11</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >12</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >13</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >14</option> 04-30 03:15:44.145: INFO/System.out(3303): <option selected="selected">15</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >16</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >17</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >18</option> 04-30 03:15:44.145: INFO/System.out(3303): <option >19</option> 04-30 03:15:44.155: INFO/System.out(3303): <option >20</option> 04-30 03:15:44.155: INFO/System.out(3303): <option >21</option> 04-30 03:15:44.155: INFO/System.out(3303): <option >22</option> 04-30 03:15:44.155: INFO/System.out(3303): <option >23</option> 04-30 03:15:44.155: INFO/System.out(3303): </select> 04-30 03:15:44.155: INFO/System.out(3303): : 04-30 03:15:44.155: INFO/System.out(3303): <select name="ZeitM" tabindex="15" id="efaZeitM"> 04-30 03:15:44.155: INFO/System.out(3303): <option >00</option> 04-30 03:15:44.155: INFO/System.out(3303): <option selected="selected">15</option> 04-30 03:15:44.155: INFO/System.out(3303): <option >30</option> 04-30 03:15:44.155: INFO/System.out(3303): <option >45</option> 04-30 03:15:44.155: INFO/System.out(3303): </select> 04-30 03:15:44.155: INFO/System.out(3303): 04-30 03:15:44.155: INFO/System.out(3303): </td> 04-30 03:15:44.155: INFO/System.out(3303): 04-30 03:15:44.165: INFO/System.out(3303): <td class="Uhrzeit2">&nbsp;</td> 04-30 03:15:44.165: INFO/System.out(3303): 04-30 03:15:44.165: INFO/System.out(3303): </tr> 04-30 03:15:44.165: INFO/System.out(3303): 04-30 03:15:44.165: INFO/System.out(3303): <tr> 04-30 03:15:44.165: INFO/System.out(3303): <td class="Intervall2"> 04-30 03:15:44.165: INFO/System.out(3303): Intervall 04-30 03:15:44.165: INFO/System.out(3303): </td> 04-30 03:15:44.184: INFO/System.out(3303): 04-30 03:15:44.184: INFO/System.out(3303): <td class="Intervall3" height="25"> 04-30 03:15:44.184: INFO/System.out(3303): <select name="Intervall" tabindex="13" id="efaIntervall"> 04-30 03:15:44.184: INFO/System.out(3303): <option value="60" >1 h</option> 04-30 03:15:44.184: INFO/System.out(3303): <option value="120" >2 h</option> 04-30 03:15:44.184: INFO/System.out(3303): <option value="240" >4 h</option> 04-30 03:15:44.184: INFO/System.out(3303): <option value="480" >8 h</option> 04-30 03:15:44.184: INFO/System.out(3303): <option value="1800" >ganzer Tag</option> 04-30 03:15:44.194: INFO/System.out(3303): </select> 04-30 03:15:44.194: INFO/System.out(3303): 04-30 03:15:44.204: INFO/System.out(3303): </td> 04-30 03:15:44.204: INFO/System.out(3303): 04-30 03:15:44.204: INFO/System.out(3303): <td class="Intervall3">&nbsp; 04-30 03:15:44.204: INFO/System.out(3303): 04-30 03:15:44.204: INFO/System.out(3303): </tr> 04-30 03:15:44.204: INFO/System.out(3303): </table> 04-30 03:15:44.204: INFO/System.out(3303): 04-30 03:15:44.204: INFO/System.out(3303): </td> 04-30 03:15:44.204: INFO/System.out(3303): 04-30 03:15:44.204: INFO/System.out(3303): <td class="Schalter" valign="top"> 04-30 03:15:44.204: INFO/System.out(3303): <table class="Schalter"> 04-30 03:15:44.204: INFO/System.out(3303): <!-- Buttons --> 04-30 03:15:44.204: INFO/System.out(3303): <tr> 04-30 03:15:44.204: INFO/System.out(3303): <td class="Schalter" align="center"> 04-30 03:15:44.226: INFO/System.out(3303): <input TYPE="Submit" accesskey="s" class="SuchenBtn" name="Suchen" tabindex="20" VALUE="(S)uchen"> 04-30 03:15:44.226: INFO/System.out(3303): </td> 04-30 03:15:44.226: INFO/System.out(3303): </tr> 04-30 03:15:44.226: INFO/System.out(3303): 04-30 03:15:44.226: INFO/System.out(3303): 04-30 03:15:44.226: INFO/System.out(3303): <tr> 04-30 03:15:44.226: INFO/System.out(3303): <td class="Schalter" align="center"> 04-30 03:15:44.226: INFO/System.out(3303): <input TYPE="Submit" accesskey="o" name="Optionen" tabindex="22" VALUE="(O)ptionen"> 04-30 03:15:44.226: INFO/System.out(3303): </td> 04-30 03:15:44.226: INFO/System.out(3303): </tr> 04-30 03:15:44.226: INFO/System.out(3303): 04-30 03:15:44.226: INFO/System.out(3303): 04-30 03:15:44.226: INFO/System.out(3303): <tr> 04-30 03:15:44.226: INFO/System.out(3303): <td class="Schalter" align="center"> 04-30 03:15:44.226: INFO/System.out(3303): <input TYPE="Button" accesskey="z" tabindex="24" VALUE="(Z)urück" onClick="history.back()"> 04-30 03:15:44.226: INFO/System.out(3303): </td> 04-30 03:15:44.226: INFO/System.out(3303): </tr> 04-30 03:15:44.226: INFO/System.out(3303): <tr> 04-30 03:15:44.226: INFO/System.out(3303): <td class="Schalter" align="center"> 04-30 03:15:44.226: INFO/System.out(3303): <input TYPE="Button" accesskey="h" tabindex="25" VALUE="(H)ilfe" onClick="self.location.href='/bs.exe/FF?N=hilfe&amp;SID=3D3B9'"> 04-30 03:15:44.226: INFO/System.out(3303): </td> 04-30 03:15:44.235: INFO/System.out(3303): </tr> 04-30 03:15:44.235: INFO/System.out(3303): <tr> 04-30 03:15:44.235: INFO/System.out(3303): <td class="Schalter" align="center"> 04-30 03:15:44.235: INFO/System.out(3303): <input TYPE="Submit" accesskey="n" tabindex="26" name="Loeschen" VALUE="(N)eue Suche"> 04-30 03:15:44.235: INFO/System.out(3303): </td> 04-30 03:15:44.235: INFO/System.out(3303): </tr> 04-30 03:15:44.235: INFO/System.out(3303): 04-30 03:15:44.235: INFO/System.out(3303): <tr> 04-30 03:15:44.235: INFO/System.out(3303): 04-30 03:15:44.244: INFO/System.out(3303): <td class="Schalter" align="center"> 04-30 03:15:44.244: INFO/System.out(3303): <input TYPE="Button" accesskey="a" tabindex="27" VALUE="H(a)ltestelle" onClick="self.location.href='/bs.exe/RHFF?Karten=true?N=Result&amp;SID=3D3B9'"> 04-30 03:15:44.244: INFO/System.out(3303): </td> 04-30 03:15:44.244: INFO/System.out(3303): 04-30 03:15:44.244: INFO/System.out(3303): </tr> 04-30 03:15:44.244: INFO/System.out(3303): </table> 04-30 03:15:44.254: INFO/System.out(3303): 04-30 03:15:44.254: INFO/System.out(3303): </td> 04-30 03:15:44.254: INFO/System.out(3303): </tr> 04-30 03:15:44.254: INFO/System.out(3303): </table> 04-30 03:15:44.254: INFO/System.out(3303): </form> 04-30 03:15:44.254: INFO/System.out(3303): 04-30 03:15:44.254: INFO/System.out(3303): 04-30 03:15:44.254: INFO/System.out(3303): <!-- Meldungsbereich (automatisch erzeugt) --> 04-30 03:15:44.254: INFO/System.out(3303): <div align="center" id="meldungen"> 04-30 03:15:44.265: INFO/System.out(3303): <table class="Bedienhinweise"><tr><td rowspan="2"><img SRC="http://www.busspur.de/logos/hinweis.png" ALIGN="top" alt="Symbol" WIDTH="32" HEIGHT="20">&nbsp;</td><td rowspan="2">Start</td><td>Geben Sie den Namen der Stadt/Gemeinde ein</td></tr><tr><td>Geben Sie den Namen der Haltestelle ein</td></tr></table> 04-30 03:15:44.265: INFO/System.out(3303): </div> 04-30 03:15:44.265:

    Read the article

  • DIV is picking max-width value as width value for DIV.

    - by Lokesh
    I am facing a problem after applying max-width hack for IE7. In mozilla, width of the div is flexible and adjustable as per the image width in the div. But in IE7 it is taking the max-width as width of DIV. Below is my HTML code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <link rel="stylesheet" type="text/css" media="all" href="style/food.css" /> <!--[if IE 7]> <link rel="stylesheet" type="text/css" media="screen" href="style/ie7.css" /> <![endif]--> </head> <body> <div class="main_content_inner_ko"> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" alt="Big N&rsquo; Tasty"/><div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/chicken/PremCrispyChickenRanchBLT.png" height="115" width="115" alt="Premium Cripsy Chicken Ranch BLT"/><div class="small_title">Premium Cripsy Chicken Ranch BLT</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/chicken/PremCrispyChickenRanchBLT.png" height="115" width="115" alt="Premium Cripsy Chicken Ranch BLT"/> <div class="small_title">Premium Cripsy Chicken Ranch BLT</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/chicken/PremCrispyChickenRanchBLT.png" height="115" width="115" alt="Premium Cripsy Chicken Ranch BLT"/> <div class="small_title">Premium Cripsy Chicken Ranch BLT</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="clear"></div> </div> </body> Below is the css code: div.small_title { font-size: 10px; color: #929292; text-align: center; max-width: 115px; line-height: 13px; padding-top: 5px; margin: 0 auto; } .product_item { position: relative; float:left; min-width: 35px; max-width: 189px; width: auto !important; text-align:center; border: 1px solid #CCC; } Please help me! Cheers!! Lokesh Yadav

    Read the article

  • Modifying a HTML page to fix several "bugs" add a function to next/previous on a option dropdown

    - by Dennis Sylvian
    SOF, I've got a few problems plaguing me at the moment and am wondering if anyone could assist me with them. I'm trying to get Next Class | Previous Class to act as buttons so that when Next Class is clicked it will go to the next item in the dropdown list and for previous it would go to back one. There used to be a scroll bar that allowed me to scroll the main window left and right, it's missing because (I think it was to do with the scroll left and scroll right function) The footer at the bottom doesn't show correctly on mobile devices; for some reason it appears completely differently to as it does on a computer. The "bar" practically and the Scroll Left and Scroll buttons don't appear at all on mobile devices. The scroll left button is unable to be clicked for some reason, I'm unsure what I've done wrong. Refreshing the page resets the horizontal scroll position to far left (I'm pretty sure this relates to the scroll bar) I want to also find a way so that on mobile devices the the header will not show the placeholder image, however I can't work out what CSS media tag(s) I should be using. Latest: http://jsfiddle.net/pwv7u/ Smaller HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>DATA DATA DATA DATA DATA DATA DATA DATA</title> <style type="text/css"> <!-- @import url("nstyle.css"); --> </style> <script src="jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready( function() { for (var i=0;i<($("table").children().length);i++){ if(readCookie(i)) $($($("table").children()[i]).children()[(readCookie(i))]).toggleClass('selected').siblings().removeClass('selected'); } $("tr").click(function(){ $(this).toggleClass('selected').siblings().removeClass('selected'); if(readCookie($(this).parent().index())){ if(readCookie($(this).parent().index())==$(this).index()) eraseCookie($(this).parent().index()); else{ eraseCookie($(this).parent().index()); createCookie($(this).parent().index(),$(this).index(),1); } } else createCookie($(this).parent().index(),$(this).index(),1); }); // gather CLASS info var selector = $('.class-selector').on('change', function(){ var id = this.value; if (id!==''){ scrollToAnchor(id); } }); $('a[id^="CLASS"]').each(function(){ var id = this.id, option = $('<option>',{ value: this.id, text:this.id }); selector.append(option); }); function scrollToAnchor(aid) { var aTag = $("a[id='" + aid + "']"); $('html,body').animate({ scrollTop: aTag.offset().top - 80 }, 1); } $("a.TOPJS").click(function () { scrollToAnchor('TOP'); }); $("a.KEYJS").click(function () { scrollToAnchor('KEY'); }); $("a.def").click(function () { $('#container').animate({ "scrollLeft": "-=204" }, 200); }); $("a.abc").click(function () { $("#container").animate({ "scrollLeft": "+=204" }, 200); }); function createCookie(name,value,days) { var expires; if (days) { var date = new Date(); date.setMilliseconds(0); date.setSeconds(0); date.setMinutes(0); date.setHours(0); date.setDate(date.getDate()+days); expires = "; expires="+date.toGMTString(); } else expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length,c.length); } return null; } function eraseCookie(name) { createCookie(name,"",-1); } }); </script> </head> <body> <div id="header_container"> <div id="header"> <a href="http://site.x/" target="_blank"><img src="http://placehold.it/300x80"></a> <select class="class-selector"> <option value="">-select class-</option> </select> <div class="classcycler"> <a href="#TOP"><font color=#EFEFEF>Next Class</font></a> <font color=red>|</font> <a href="#TOP"><font color=#EFEFEF>Previous Class</font></a> </div> <div id="header1"> Semi-Transparent Image <a href="#TOP"><font color=#EFEFEF>Up to Top</font></a> | <a href="#KEY"><font color=#EFEFEF>Down to Key</font></a> </div> </div> </div> <a id="TOP"></a> <div id="container"> <table id="gradient-style"> <tbody> <thead> <tr> <th scope="col"><a id="CLASS1"></a>Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class<br>Test 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class Data 1</th> <th scope="col">Class 1<br>Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1<br>Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1 Class 1</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> (data text)</th> <th scope="col">title text</th> <th scope="col">text</th> <th scope="col">text</th> <th scope="col">title text</th> <th scope="col">title text</th> </tr> </thead> <tr class="ft3"><td>testing data</td><td>testing data</td><td>test</td><td>class b</td><td>test4</td><td><div align="left">data</div></td><td><div align="left"> </div></td><td><div align="left"></div></td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><tr> <tr class="f3"><td>test</td><td>test</td><td>test</td><td>class a</td><td>test2</td><td><div align="left"> </div></td><td><div align="left"></div></td><td><div align="left"></div></td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><tr> <thead> <tr> <th scope="col"><a id="CLASS2"></a>Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class<br>Test 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class Data 2</th> <th scope="col">Class 2<br>Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2<br>Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2 Class 2</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> (data text)</th> <th scope="col">title text</th> <th scope="col">text</th> <th scope="col">text</th> <th scope="col">title text</th> <th scope="col">title text</th> </tr> </thead> <tr class="ft3"><td>testing data</td><td>testing data</td><td>test</td><td>class f</td><td>test2</td><td><div align="left">data</div></td><td><div align="left"></div></td><td><div align="left">data</div></td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><tr> <tr><td>test</td><td>testing data</td><td>test</td><td>class f</td><td>test4</td><td><div align="left">data</div></td><td><div align="left"></div></td><td><div align="left"></div></td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><tr> <tr class="f3"><td>test</td><td>testing data</td><td>testing data</td><td>class d</td><td>test5</td><td><div align="left">data</div></td><td><div align="left"> </div></td><td><div align="left">data</div></td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><tr> <tr><td>testing data</td><td>test</td><td>test</td><td>class f</td><td>test5</td><td><div align="left"></div></td><td><div align="left"></div></td><td><div align="left">data</div></td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><tr> <tr class="f2"><td>test</td><td>test</td><td>testing data</td><td>class a</td><td>test1</td><td><div align="left">data</div></td><td><div align="left"> </div></td><td><div align="left">data</div></td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><tr> </tbody> <tfoot> <tr> <th class="alt" colspan="34" scope="col"><a id="KEY"></a><img src="http://placehold.it/300x50"></th> </tr> <tr> <td colspan="34"><em><b>DATA DATA</b> - DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA </em></td> </tr> <tr> <td class="alt" colspan="34"><em><b>DAT DATA</b> - DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA </em></td> </tr> </tfoot> </table> </div> <div id="footer_container"> <div id="footer"> <a href="http://site.x/" target="_blank"><img src="http://placehold.it/300x80"></a> <div class="footleft"> <a class="def" href="javascript: void(0);"><font color="#EFEFEF">Scroll Left</font></a> </div> <div id="footer1"> <font color="darkblue">Semi-Transparent Image</font> <i>Copyright &copy; 2013 <a href="http://site.x/" target="_blank" style="text-decoration: none"><font color=#ADD8E6>site</font></a>.</i> </div> <div id="footer2"> <i>All Rights Reserved.</i> </div> <div class="footright"> <a class="abc" href="javascript: void(0);"><font color="#EFEFEF">Scroll Right</font></a> </div> </div> </div> </body> </html> CSS gradient-style * { white-space: nowrap; } #header .class-selector { top: 10px; left: 20px; position: fixed; } #header .classcycler { top: 45px; left: 20px; position: fixed; font-size:20px; } body { line-height: 1.6em; background-color: #535353; overflow-x: scroll; } #gradient-style { font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif; font-size: 12px; margin: 0px; width: 100%; text-align: center; border-collapse: collapse; } #gradient-style th { font-size: 13px; font-weight: normal; line-height:250%; padding-left: 5px; padding-right: 5px; background: #535353 url('table-images/gradhead.png') repeat-x; border-top: 1px solid #fff; border-bottom: 1px solid #fff; color: #ffffff; } #gradient-style th.alt { font-family: "Times New Roman", Serif; text-align: left; padding: 10px; font-size: 26px; } #gradient-style td { padding-left: 5px; padding-right: 5px; border-bottom: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #fff; color: #00000; border-top: 1px solid #fff; background: #FFF url('table-images/gradback.png') repeat-x; } #gradient-style tr.ft3 td { color: #00000; background: #99cde7 url('table-images/gradoverallstudent.png') repeat-x; font-weight: bold; } #gradient-style tr.f1 td { color: #00000; background: #99cde7 url('table-images/gradbeststudent.png') repeat-x; } #gradient-style tr.f2 td { color: #00000; background: #b7e2b6 url('table-images/gradmostattentedstudent.png') repeat-x; } #gradient-style tr.f3 td { color: #00000; background: #a9cd6c url('table-images/gradleastlatestudtent.png') repeat-x; } #gradient-style tfoot tr td { background: #6FA275; font-size: 12px; color: #000; padding: 10; text-align: left; } #gradient-style tbody tr:hover td, #gradient-style tbody tr.selected td { background: #d0dafd url('table-images/gradhover.png') repeat-x; color: #339; } body { margin: 0; padding: 0; } #header_container { background: #000000 url('table-images/gradhead.png') repeat-x; border: 0px solid #666; height: 80px; left: 0; position: fixed; width: 100%; top: 0; } #header { position: relative; margin: 0 auto; width: 500px; height: 100%; text-align: center; color: #0c0aad; } #header1 { position: absolute; width: 125%; top: 50px; } #container { margin: 0 auto; overflow: auto; padding: 80px 0; width: 100%; } #content { } #footer_container { background: #000000 url('table-images/gradhead.png') repeat-x; border: 0px solid #666; bottom: 0; height: 95px; left: 0; position: fixed; width: 100%; } #footer { position: relative; margin: 0 auto; height: 100%; text-align: center; color: #FFF; } #footer1 { position: absolute; width: 103%; top: 50px; } #footer2 { position: absolute; width: 110%; top: 70px; } #footer .footleft { top: 45px; left: 2%; position: absolute; font-size:20px; } #footer .footright { top: 45px; right: 2%; position: absolute; font-size:20px; }

    Read the article

< Previous Page | 110 111 112 113 114 115  | Next Page >