Web Programming

For discussions about programming, programming questions/advice, and projects that don't really have anything to do with Puppy.
Message
Author
User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

Re: HTML Tables

#76 Post by Moose On The Loose »

kjdixo wrote:Useful tip Technosaurus, thanks.

Here is a basic intro to html tables.
http://css-tricks.com/complete-guide-table-element/
It also highlights some more advanced aspects and some gotchas (ie deprecated attributes).
Most of the commenters think it is a good article.
I tried and tried to get the positioning to work with CSS in the attached and finally just gave up and went back to using tables. The problem I think stems from a certain arrogance built into CSS where it thinks it knows better than I do about where things should appear. Tables are extremely modest in that they assume the Table Rows and Table Divs are arranged on a grid and exactly as specified by the web designer.

Yes, it is a silly game. I made it mostly to practice fiddling SVG on the fly.
Attachments
tangle.zip
(8.33 KiB) Downloaded 187 times

kjdixo
Posts: 153
Joined: Sun 13 Sep 2009, 21:13

#77 Post by kjdixo »

Moose On The Loose
Re. Tangle
Very inventive / ingenious that game (and code).
The first time I played the game I got interconnecting lines which I could untangle to win the game.
The above was what I expected.
I pressed the New Game button and then get only dots with no interconnecting lines.
I clicked some dots and they changed color.
So I have no lines to untangle . . . Am I missing something or do I have to imagine where the lines are?
I might have an incompatible browser setting.
Thanks

User avatar
L18L
Posts: 3479
Joined: Sat 19 Jun 2010, 18:56
Location: www.eussenheim.de/

Re: HTML Tables

#78 Post by L18L »

Moose On The Loose wrote:I tried and tried to get the positioning to work with CSS in the attached and finally just gave up and went back to using tables.
Try tableless version please
Attachments
tangle1.html.gz
remove .gz
(38.15 KiB) Downloaded 201 times

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

Re: HTML Tables

#79 Post by Moose On The Loose »

L18L wrote:
Moose On The Loose wrote:I tried and tried to get the positioning to work with CSS in the attached and finally just gave up and went back to using tables.
Try tableless version please
The zip file appears corrupt

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

#80 Post by Moose On The Loose »

kjdixo wrote:Moose On The Loose
Re. Tangle
Very inventive / ingenious that game (and code).
The first time I played the game I got interconnecting lines which I could untangle to win the game.
The above was what I expected.
I pressed the New Game button and then get only dots with no interconnecting lines.
I clicked some dots and they changed color.
So I have no lines to untangle . . . Am I missing something or do I have to imagine where the lines are?
I might have an incompatible browser setting.
Thanks
What web browser?

The new game should have more circles and a lot more lines

On Firefox, it works up to the point where I have well over 100 circles.

muggins
Posts: 6724
Joined: Fri 20 Jan 2006, 10:44
Location: hobart

#81 Post by muggins »

The zip file appears corrupt
Just rename to tangle1.html

kjdixo
Posts: 153
Joined: Sun 13 Sep 2009, 21:13

Browser

#82 Post by kjdixo »

What web browser?

The new game should have more circles and a lot more lines

On Firefox, it works up to the point where I have well over 100 circles.
Pale Moon web browser.
http://www.palemoon.org/
Pale Moon offers you a browsing experience in a browser completely built from its own, independently developed source that has been forked off from Firefox/Mozilla code, with carefully selected features and optimizations to maximize the browser's speed*, stability and user experience, while offering a rich collection of extensions and themes (including compatibility with many Firefox extensions users have come to love and rely on).
So it is based on Firefox, I changed a year ago because firefox had become too slow and bloated.
Even Palemoon has far too many settings and obviously 'behind the scenes unseen functionality' in the about:config for my liking. Ideally I would like a browser that simply renders the html and does not feed-back information to developers or google or the government or anyone. All tracking and targeted advertising should be made illegal in my opinion (also rip down those spy cameras in the streets and trash their control rooms).
Some websites won't even serve you html unless they have analysed your browser signature so they know what browser you are using.
I read that only 1.3 percent of users have JavaScript switched off, it is easy to switch off CSS in most browsers but not so easy (fiddly) to switch off JS, plus many users do not even know what what JS is. Not all websites are considerate enough to design a nice accessible page that works with JS and CSS swiched off, so minimal browsers like Dillo web browser are not a realistic option for daily browsing.
Palemoon is a good compromise for now, until I find something better.

Rant over . . . for now.

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

Re: HTML Tables

#83 Post by Moose On The Loose »

L18L wrote:
Moose On The Loose wrote:I tried and tried to get the positioning to work with CSS in the attached and finally just gave up and went back to using tables.
Try tableless version please
That looks like one of my many failed attempts. Notice:

1) The buttons over to the right of the game are shoved way over to the right

2) The "game number" and circles are way below the bottom edge of the game.

3) If you shrink your browser window, the controls to the right suddenly pop to below the game area.

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

Re: Browser

#84 Post by Moose On The Loose »

kjdixo wrote:
What web browser?

The new game should have more circles and a lot more lines

On Firefox, it works up to the point where I have well over 100 circles.
Pale Moon web browser.
http://www.palemoon.org/
I expect it is a bug in the browser. The code uses the NewGame() function on startup to do the first game and the same function for each new game. The code puts down the circles and then does the lines. It could be that the section that does this didn't complete correctly. When I get a bit of time, I will look into it a bit more.

kjdixo
Posts: 153
Joined: Sun 13 Sep 2009, 21:13

#85 Post by kjdixo »

Thanks Moose OTL
When I get time I will try your tangle game in some other browsers.

Digressing a little.
Line and dots and more lines and dots suggest to me charting and graphs.

This FLOT graph I did a long time ago and can't remember much about it.
My website has been mostly dormant and not used for a few years.
I used PHP to decode the Yahoo Finance Query CSV file.
http://kdworld7.net/financial/graph2.html

FLOT (Flot is a pure JavaScript plotting library for jQuery, with a focus on simple usage, attractive looks and interactive features.)
http://www.flotcharts.org/

This CSS only (no flot) graph I did a long time ago and can't remember much about it.
I used PHP to decode the Yahoo Finance Query CSV file.
http://kdworld7.net/financial/graph.html?s=GOOG

Maybe there is a thread/topic on this forum here, dealing with web page charts and graphs or perhaps someone could start one.

kjdixo
Posts: 153
Joined: Sun 13 Sep 2009, 21:13

#86 Post by kjdixo »

Converting scanned bitmap images of graphs from books and journals to csv files (data points) is done quite well by this windows program.
http://www.chem.uoa.gr/misc/specscan.htm
I wonder how it works?
Is there web code that could do similar?

seaside
Posts: 934
Joined: Thu 12 Apr 2007, 00:19

#87 Post by seaside »

kjdixo wrote:Converting scanned bitmap images of graphs from books and journals to csv files (data points) is done quite well by this windows program.
http://www.chem.uoa.gr/misc/specscan.htm
I wonder how it works?
Is there web code that could do similar?
kjdixo,

I've often thought of converting bitmaps to svg and then to data points.

Here's a program called "engauge" that looks quite promising.
This open source, digitizing software converts an image file showing a graph or map, into numbers. The image file can come from a scanner, digital camera or screenshot. The numbers can be read on the screen, and written or copied to a spreadsheet.

The process starts with an image file containing a graph or map. You add three axis points to define the axes, then other points along your curve(s).The final result is digitized data that can be used by other tools such as Microsoft Excel and Gnumeric.
http://digitizer.sourceforge.net

Cheers,
s
(I haven't tried the program, so I can't provide any feedback)

kjdixo
Posts: 153
Joined: Sun 13 Sep 2009, 21:13

#88 Post by kjdixo »

Thanks Seaside this looks very interesting.

I installed engauge-digitizer_5.2-1 from the ubuntu-trusty-universe repos in quirky puppy tahr 6.05.
It installed fine but the help files were not installed and the manual was not in usr/share/doc however the online help is very good.
http://digitizer.sourceforge.net/usermanual/index.html
The engauge program has some very advanced features and is quite complicated for a newbie (on a level with the GIMP or MtPaint when it comes to trying to work out how to do very basic tasks with a minimum of clicks quickly) . . . . compared to the specscan program which was from my recollection, 4 clicks and completely automatic.
I do get CSV data from engauge, but only after a lot of ' mouse clicking' and 'head scratching' and even the automatic mode has manual steps.
I think it takes time to learn it and so when I find out the shortcuts and easy ways I will post them here.
One thing I haven't tried that might be worth trying is to install specscan on linux using wine.
Thanks for showing me engauge.

kjdixo
Posts: 153
Joined: Sun 13 Sep 2009, 21:13

#89 Post by kjdixo »

Moose On The Loose
I tried Midori browser and the Tangle game works properly and progresses to more complex tangles and it all seems to work, so the problem was I think the browser, as you said a bug in Palemoon browser.
Thanks

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

#90 Post by Moose On The Loose »

kjdixo wrote:Moose On The Loose
I tried Midori browser and the Tangle game works properly and progresses to more complex tangles and it all seems to work, so the problem was I think the browser, as you said a bug in Palemoon browser.
Thanks
This is good to know.

I tried to code for "lowest common denominator" while being within the standard and in this case using SVG to do graphics. I have done other stuff using TABLEs and DIVs to do graphics by changing sizes and changing background colors. It looks kind of blocky but I could code stuff to do graphs and games.

The trick for graphs without SVG is to use the left border of an item at a short vertical line and either the top or bottom as the horizontal line. On up slopes, you use the top. On down slopes, you use the bottom. This lets you make nice stepwise lines. The graph looks quite good with only about 100 steps in it. Javascript can loop 100 times quickly so it is reasonable to make a continuously updating display such as some signal changing as the user fiddles a control up and down.

User avatar
L18L
Posts: 3479
Joined: Sat 19 Jun 2010, 18:56
Location: www.eussenheim.de/

Re: HTML Tables

#91 Post by L18L »

Moose On The Loose wrote:
L18L wrote:
Moose On The Loose wrote:I tried and tried to get the positioning to work with CSS in the attached and finally just gave up and went back to using tables.
Try tableless version please
That looks like one of my many failed attempts. Notice:

1) The buttons over to the right of the game are shoved way over to the right

2) The "game number" and circles are way below the bottom edge of the game.

3) If you shrink your browser window, the controls to the right suddenly pop to below the game area.
OK, that was just a quick and dirty demo of not using table for layout.

Here is the slow and proper solution.

Hope this helps you "being within the standard "
Attachments
tangle_tableless.png
controls staying at right side.
(31.93 KiB) Downloaded 248 times
tangle2.html.gz
unzip it
(8.11 KiB) Downloaded 238 times

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

Re: HTML Tables

#92 Post by Moose On The Loose »

L18L wrote:
Moose On The Loose wrote:
L18L wrote: Try tableless version please
That looks like one of my many failed attempts. Notice:

1) The buttons over to the right of the game are shoved way over to the right

2) The "game number" and circles are way below the bottom edge of the game.

3) If you shrink your browser window, the controls to the right suddenly pop to below the game area.
OK, that was just a quick and dirty demo of not using table for layout.

Here is the slow and proper solution.

Hope this helps you "being within the standard "
1) The boxes around the buttons one the right are now really big instead of fitting nicely

2) Still the same

3) Fixed

Other than that, it seems better than any of my tries

User avatar
Moose On The Loose
Posts: 965
Joined: Thu 24 Feb 2011, 14:54

Re: HTML Tables

#93 Post by Moose On The Loose »

Extra post caused by firefox crashing just as I posted.
Hopefully nothing to do with tangle2.html

User avatar
technosaurus
Posts: 4853
Joined: Mon 19 May 2008, 01:24
Location: Blue Springs, MO
Contact:

#94 Post by technosaurus »

I've been working on some stuff to allow sharing of C and javascript code, and it turns javascript does have a lot of the same functions, but is missing some useful ones.

here is a basic printf (other *printf functions should be similar)

Code: Select all

function printf(fmt){
  var strings = fmt.split(/[%].?/), string=strings[0];
  for(let i=1; i<strings.length; i++)
    string+=arguments[i]+strings[i];
  console.log(string);
  return string.length
}
Let me know if there are any C functions you miss ... I may make some more wrappers (qsort and the string functions are already on the list)
Check out my [url=https://github.com/technosaurus]github repositories[/url]. I may eventually get around to updating my [url=http://bashismal.blogspot.com]blogspot[/url].

Post Reply