Posts

Showing posts with the label html

Web ssh.

Image
Use this at your own risk as it is probably not safe to use. There are may web based ssh modules to use and this is just one of them. they are nice if you are operating from a tablet and do not have a desktop machine. Just fire up the html file, choose a server and then log in as you would with ssh. More info at:  http://weavervsworld.com/ssh/ssh.php  You will need several jar file and an html file to put it all together.  The files: mindterm312.jar  mindterm312.weavselfsign.jar  term.html Here is a typical html file that can be on a server or even a local machine. [code]  <html> <body>  <h4 class='heading'>Mindterm Applet Information</h4>     <p class='centererror'><b>Keep this window open after the applet has loaded.</b></p>    <object codetype='application/java-archive' classid='java:com.mindbright.application.MindTerm.class' archive='mindterm312.weavself...

Pic to html

Image
Especially if you have an embedded system that acts as a web server, you will want to display the pictures without using special software. This also perfor for sites where you can not upload anything besides html Here is a quick trick to turn a picture into a simple ascii html file which you can easily edit. Lets take the file switch.png. But we need a file in the .jpg format. No problem we can convert it with $ convert switch.png switch.jpg Still looks pretty much the same so far. Now to create the html file. $ jp2a --color --html --fill --background=light  switch.jpg --output=s.html We will use a simple web text only browser to display the html file. Now to try a regular web browser on a normal desktop system. Interesting... Of course you can add your own html. Later.

Ordering from the menu.

Image
Web pages with menus are sure easy to navigate. In fact, I like all the base menus in one place so that you do not have to go though a maze to get what you want. The menus are just one part of the page, so let's zoom in and see that we are looking at. The menu takes up minimal space, but expanding a pull-downs make it easy to manage. Wrote this years ago so I am sure there are much better ways to do it now, but it still works for me on a private server. The menu is pretty much a large table comprised of sections having each option menu. [code] < td > < form name =" jump1 "> < select name =" menu1 " onchange =" top.location=document.jump1.menu1.options[document.jump1.menu1 ... <!-- option value="../flatpress">Flatpress</option> <option value="../wiki">Mediawiki</option> --> < option value =" ../wordpress ">Wordpress</ option > < option value =" ...

Exacto.

Image
Exacto knife to an existing page. One nice thing is that if you find a page with an educational tool that you need, under certain circumstances, you can save the page for later use. In some cases, if it is going into an educational environment, the advertisements have to go away. That is what was done with this web page. See pictures. You will also need to save the images and then edit the code to look for them locally. for example we have a web page that has the script we want to use and the dots represent code that is not needed, we can just remote those unneeded lines lined. before: [code] <html> <body> <h1>My First Web Page</h1> ... ... ... ... .... .... <script type="text/javascript"> document.write("<p>" + Date() + "</p>"); </script> ... ... ... ... </body> </html> [/code] after; [code] <html> <body> <h1>My First...

Arduino web server - analog

Image
If you have ever loaded the ethernet software from the Arduino IDE, you will recognize this web page. This article is more about window dressing more than anything else. The Arduino comes with a nice bit of web server code that reports the results of some temperature sensors. Thought the code could use at least some minimal improvements. Also put the the Arduino web address on the dns so that it could be called by the hostname lookup instead of the ipaddress. The important part of the changed code is included. Normally you can not store images on the Arduino, but you can reference them from another site. [code] void loop() {   // listen for incoming clients   EthernetClient client = server.available();   if (client) {     Serial.println("new client");     // an http request ends with a blank line     boolean currentLineIsBlank = true;     while (client.connected()) {    ...

Italic architecture.

Image

50 shades of grey?

Image

Immortalized speaker

Image

Picture2html.

Image
Sometimes it is just nice to make a picture into an html file. Many pictures are in the .png format.  To use them to be converted to an html file they must first be converted to the .jpg format. For experimentation purposes start with a simple picture with a lot of contrast. $ convert  speaker.png  speaker.jpg By embedding the picture in a page, it prevents you from having to keep lots of separate image files. Now let us convert it to an html page. $ jp2a –color –html –fill –background=light speaker.jpg –output=hs.html You can then go in and edit the html for further enhancement. Let’s add a title and some ruler lines. Text version where you can only use characters for an image. Doing a setup like this is very usable on a server where you are not allowed to save or store images such as the Arduino. To convert a web page for use with the arduino, you will need to add a preface and an ending to each line of code.  Original code: ...

Another table

Image
Another table. Source code example: <!DOCTYPE html> < html >< head >< style >thead {color:green;} tbody {color:blue;} tfoot {color:red;} table,th,td {border:1px solid black;} </ style > </ head > < body > < table border =" 1 " style =" width:300px "> < thead > < tr > < th >Name</ th > < th >Surname</ th > < th >Telephone</ th > </ tr > </ thead > < tbody > < tr > < td >Jack</ td > < td >Sales</ td > < td >555-5555</ td > </ tr > < tr > < td >John</ td > < td >Admin</ td > < td >555-5555</ td > </ tr > < tr > < td >James</ td > < td >Sales</ td > < td >555-5555</ td > </ tr > < tbody > < tfoot > < tr > < td >Total</ td > < td >Total</ td > < td >Total</ td ...

Extracting data to a table.

Image
More than one way to skin a cat. # just a thought IFS=’%’ line=” [173]Virginia                          3-5 5-7 310 289 5-2 0-5 Lost 1″ a=`echo $line | cut -c8-28` b=`echo $line | cut -c29-31` c=`echo $line | cut -c33-35` d=`echo $line | cut -c38-40` e=`echo $line | cut -c42-44` f=`echo $line | cut -c46-48` g=`echo $line | cut -c51-53` h=`echo $line | cut -c56-61` echo “<html>”> somefile.html echo “<body>”>> somefile.html echo “<table border=1>”>> somefile.html  echo "<tr><td>School</td><td>W-L</td><td>W-L</td><td>PF</td><td>PA</td><td>Home</td><td>Away</td><td>Current streak</td></tr>" >> somefile.html echo “<tr><td>$a</td><td>$b</td><td>$c</td><td...

Html image gallery from bash

Image
Before we took a file listing and made a list in an html file ( http://computoman.blogspot.com/2014/11/file-listing-into-html-file.html ) . Must admit I do not know css, so I use what I know with simple html. This time we are going to use bash to create a picture gallery page. The main thing we want to do is to automate creation of web pages even if they are static so to speak. If things go as planned we will make an automated version of out bookmarks page http://computoman.blogspot.com/2014/09/bookmarks-plus.html . There is a lot more that could be done, but thought this was a good start.  The second picture is a more realistic size. Used filename without the extension for the alt tag. After I thought about it. this could also be used for several things including a comics section for our newspages ( http://computoman.blogspot.com/2013/12/create-your-own-newspages.html ) with a little coding changes. Comics come usually in sets of three frames Anyway here is the skeleto...

File listing into an html file.

Image
Just downloaded a bunch of PDF files and I wanted to put them on the server so they could be accessed easily. Since the pdf file list was over 200 items, did not want to go edit every line in the file manually from Your-personal-intranet-Part-2.pdf to <a href="Your-personal-intranet-Part-2.pdf">Your-personal-intranet-Part-2</a><br /> What to do? First was to make a list of the files. $ ls *.pdf > pdflist The you get: ... ... Yagi-foil-HDTV-antenna.pdf Yet-another-amplified-acoustical-guitar.pdf Yet-another-cheese-making-episode.pdf Yet-another-continuity-tester.pdf Yet-another-dtv-antenna.pdf Yet-another-simple-portable-disposable-barbecue-.pdf Yet-another-usb-coolerwarmer.pdf Yet-another-usb-lamp.pdf Your-first-Android-Application.pdf Your-personal-intranet-Part-1.pdf Your-personal-intranet-Part-2.pdf First was to make a list of the files. But then you may not want the pdf extension as part of the descriptions. So now to ...

Couple of legacy web tricks.

Image
Legacy way to combine text and a graphic. <table>     <tr>         <td>                 <img src="prof.png" alt="">        </td>        <td>06/01/2008 The Info pages are done <br> 06/09/2008 Locally on-line as of 03/05/2008 <br> 06/08/2009 Some web pages updated <br> 06/30/2010 Redoing student services web pages. <br> 09/15/2014 Menus are restructured        </td>    </tr> </table ---------------------------------- Change text in many files with one command. Say you want to duplicate some web pages to another server, but the web server names are different. That means all the links in the pages will be wrong. For example take the following simple web page: [code] <html> <t...

Bookmarks plus

Image
Bookmarks are nice , but it would be better if you had a bit more information. Bookmarks normally look like this. What if we could have a thumbnail of a picture on the page,a bit of information, and link to click on say something like this. This requires a little work, but well worth the trouble. For starters, we will work with just one entry, though the page will support three columns. The code as is. Thebookmarks,html [code]  <!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>Untitled Document</title>  <style type="text/css">  html, body {  margin: 0px;  padding: 0px;  border: 0px;  }  #container {  width: 900px;  margin: 0 0 0 20px; /* top righ...