Dear Veseo,

Thank you for being Torch-Bearer,

I must confess that I am not a good coder, but I am good at adaptation.

I was thinking to offload webpage from Arduino to any damn web-server as Arduino is not suitable for this kind of workload.

the Arduino sketch remains same for IDE 1.01 other than you have to substitute "Server" to "Ethernetserver" and "Client" to "EthernetClient".
Attached below Arduino sketch and  Htmlpart.zip.

1. Upload AjaxUI.ino to arduino
2. Extract htmlpart.zip to your Pc/Mac/Phone/Tablet
3. Open Index.htm in your browser give password 4587 and hit submit. (don't press enter/return)
4. connect LED on pin 9 and GND
5. Have Fun

Warm Regards

Capper

Quote from: nikkpap on July 11, 2012, 02:42:49 AM
i have to say very nice UI but very slow i tried to modify little bit like to use background-color grey instead of png i did a png reduce but still very slow.

can someone make faster...? any ideas?? can we add all the spare digital pins  too ? and how? i cant even change the led names if i do this i lost the on of png...

and something last nice round png but its more easy to draw a cicle or a square like RED on OFF and Green or Blue on ON ?????? thanks for your effort keep up.... bravo

yeah  I noticed it was slow too but I think it is browser dependant. I tried it on Dolphin browser for android and it was slow but using the stock android browser it was a little bit faster.

in terms of different buttons I found these

http://images.clipartof.com/small/1086756-Clipart-3d-Toggle-Switches-With-Chrome-Bases-Royalty-Free-Vector-Illustration.jpg

and

http://us.123rf.com/400wm/400/400/enki/enki1112/enki111200044/11768340-green-toggle-switch-on-metallic-surface.jpg

its tricky changing the buttons because the names need to match with the original files if you want to avoid mucking around with the code.

For Image Animation (Sprite) use following Generator and feed them 2 separate PNG /JPG images 1. "ON" 2. "OFF" in a compressed ZIP file
http://spritegen.website-performance.org/


Change in "style.css" file on SD Card as per CSS generartor output... in following lines

Code:

/*
  Copyright 2010 Ovidiu Predescu <ovidiu@gmail.com>
  Date: December 2010
  */
div.light a {

margin-left: auto;
margin-right: 50;
background-image:url('toggle.png'); // "File Name for your SPRITED Image"
display: block;
float: right;
}

a.off { background-position: 0 0; width: 89px; height: 31px; } ]  // Position copied from output of the SPIRTE Generator
a.on { background-position: 0 -63px; width: 89px; height: 31px; }  // Position copied from output of the SPIRTE Generator

new Modification!
New UI!!
New, Anything!!!

Yes dear u can and u must do the new

Turkeybaster, to change the UI there is  no need to learn java. just change the style.css (you need to learn CSS but that's a cakewalk).

two external library used is
1. tinywebserver
2. Flash

Dear turkeybaster

1. Code is attached to 1st post, you need to login to see the attachment (Register first if you haven't)
2. standard Wiznet based Ethernet shield with SD card slot with any Micro-SD card to store files on it.
3 and a very special thing called fun!!!

tried both the example that's why it is clearly ,entioned in he heading of the post but tried severl days and night without perfect result. please help me to achieve my goal

but where to put in this jungle of Code?

code is cool but need some genius hand to be supercool

Dear Friends
I have two problems with this sketch
1. I need to put a delay for 1 second then turn it off with the help of millis(); for my LED5 to use with an electric latch to unlock the door.
2. I want to put a hardware debounce button for LED 1 to LED 4 to control it from inside the room.

Kindly Guide me on these problems.

Can Some Genius Shorten the code as i have repeated the code 5 times for 5 different Buttons...

Attached File below with all resources,  u need to login to see the files and u have to install tinywebserver library along with flash 4 library.

thanks Pablos for pointing out. My objective was accomplished by adding five times the code. but i am a SUPERBAD coder :-)

Can you upload /attache the corrected code  for me to study?

Thanks again for you comment, I am learning arduino and Italiano everyday because of good people  like you

[BlinkLED5 for Arduino IDF 1.01 attached Below]

BlinkLED5 for Arduino IDF 1.01 attached Below

You need to login to see the file attached Below

sorry, I just located my problem. In TinyWebServer.cpp I changed #include SD.h to SdFat
Now, all good

Thanks brilliant!!
Any ideas about how to display analogue values or variables?
I'm learning (slowly) but not fast enough.

Can you share the code for IDF 1.0

dear ericgu

ide used is 0.22

working on ide 1.0 but didn't find enough knowledge base for the same. If you or somebody help me to port it to ide 1.0, i will be obliged.

http://arduino.cc/forum/index.php/topic,97750.0.html

use this