Wikipad: the online calculator keypad anyone can edit

[mrmprog]

Yes. I really like the look of it

[Juju]

Hell yes Comic Sans. I love Comic Sans~

[flyingfisch]

Still can't edit anything. BTW: could you give me the source when your done so I can do one for casio?

[Deep Thought]

Still can't edit anything. BTW: could you give me the source when your done so I can do one for casio?

Click on a key to see its info page, then double-click the info to change it to a textbox. As for the source, sure.

EDIT: It requires PHP with DOMDocument. Do you have a server?

[Ti-Programmer]

Hell yes Comic Sans. I love Comic Sans~

Yes, Comic Sans is awesome. >9000 awesome.

[XVicarious]

I didn't read all of the posts so I don't know if anyone said this, the text seems to go over onto the calculator image.

[Deep Thought]

Yeah, Michael_Lee said that. Just resize your browser.

But then I had an idea, and changed the layout a bit. Text should now wrap around the image

[flyingfisch]

@DeepThought

I have an avahost account. I'll be doing the casio version as a sub-directory of my site. And yes, it does support php and DOM.

[Deep Thought]

All right, what you need is this:

• An image of the calculator you want to wiki, with an area map of each of its keys. This was the step that took by far the longest for me
• conf.xml XML file. This is where all the data is stored. Format it like this:

  <?xml version="1.0" encoding="UTF-8"?>
  <c>
     <k a="KEYVALUE 1" b="KEYVALUE 2" c="KEYVALUE 3" id="NAME OF KEY">
        <e>USE IN THE OS</e>
        <o>USE IN PROGRAMS</o>
     </k>
  
  ...
  
  </c>

  You should have one k element for every area (key), in the order they appear in the map
• log.txt file. The script logs editing events in a file called "log.txt" in the current directory. It doesn't have to have any content; it just has to exist
• The PHP source. Just add "src.php" to the end of the URL I gave you.

I think that's it. Everything else is just for styles and layout.

EDIT: Oh, and Comic Sans MS has been added.

[flyingfisch]

OK, what does an area map do? Is that where you have the links built in to the image? If that is what it is then I know how to do it.

[Deep Thought]

OK, what does an area map do? Is that where you have the links built in to the image? If that is what it is then I know how to do it.

Exactly that. Make sure the area elements are in the same order as their k elements in the conf.xml file.

[flyingfisch]

OK, cool. Did you email me or pm me the link cuz i dont have it yet.

[Deep Thought]

It's the URL of the main app, with "src.php" at the end.

[flyingfisch]

OK so this is what your talking about:

Code: Select All | Copy To Clipboard

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49

<map id="calc" name="calc"> <area shape="rect" coords="20,182,64,227" href="#" alt=""/> <area shape="rect" coords="63,182,107,227" href="#" alt=""/> <area shape="rect" coords="106,182,150,227" href="#" alt=""/> <area shape="rect" coords="149,182,193,227" href="#" alt=""/> <area shape="rect" coords="192,182,236,227" href="#" alt=""/> <area shape="rect" coords="20,239,64,273" href="#" alt=""/> <area shape="rect" coords="63,239,107,273" href="#" alt=""/> <area shape="rect" coords="106,239,150,273" href="#" alt=""/> <area shape="rect" coords="20,272,64,306" href="#" alt=""/> <area shape="rect" coords="63,272,107,306" href="#" alt=""/> <area shape="rect" coords="106,272,150,306" href="#" alt=""/> <area shape="rect" coords="20,305,64,337" href="#" alt=""/> <area shape="rect" coords="63,305,107,337" href="#" alt=""/> <area shape="rect" coords="106,305,150,337" href="#" alt=""/> <area shape="rect" coords="149,305,193,337" href="#" alt=""/> <area shape="rect" coords="192,305,236,337" href="#" alt=""/> <area shape="rect" coords="20,336,64,368" href="#" alt=""/> <area shape="rect" coords="63,336,107,368" href="#" alt=""/> <area shape="rect" coords="106,336,150,368" href="#" alt=""/> <area shape="rect" coords="149,336,193,368" href="#" alt=""/> <area shape="rect" coords="192,336,236,368" href="#" alt=""/> <area shape="rect" coords="20,367,64,399" href="#" alt=""/> <area shape="rect" coords="63,367,107,399" href="#" alt=""/> <area shape="rect" coords="106,367,150,399" href="#" alt=""/> <area shape="rect" coords="149,367,193,399" href="#" alt=""/> <area shape="rect" coords="192,367,236,399" href="#" alt=""/> <area shape="rect" coords="20,398,64,430" href="#" alt=""/> <area shape="rect" coords="63,398,107,430" href="#" alt=""/> <area shape="rect" coords="106,398,150,430" href="#" alt=""/> <area shape="rect" coords="149,398,193,430" href="#" alt=""/> <area shape="rect" coords="192,398,236,430" href="#" alt=""/> <area shape="rect" coords="20,429,64,461" href="#" alt=""/> <area shape="rect" coords="63,429,107,461" href="#" alt=""/> <area shape="rect" coords="106,429,150,461" href="#" alt=""/> <area shape="rect" coords="149,429,193,461" href="#" alt=""/> <area shape="rect" coords="192,429,236,461" href="#" alt=""/> <area shape="rect" coords="20,460,64,492" href="#" alt=""/> <area shape="rect" coords="63,460,107,492" href="#" alt=""/> <area shape="rect" coords="106,460,150,492" href="#" alt=""/> <area shape="rect" coords="149,460,193,492" href="#" alt=""/> <area shape="rect" coords="192,460,236,492" href="#" alt=""/> <area shape="rect" coords="20,491,64,525" href="#" alt=""/> <area shape="rect" coords="63,491,107,525" href="#" alt=""/> <area shape="rect" coords="106,491,150,525" href="#" alt=""/> <area shape="rect" coords="149,491,193,525" href="#" alt=""/> <area shape="rect" coords="192,491,236,525" href="#" alt=""/> </map>

It shouldn't be too hard to do that, I think Fireworks has it built in.

[Deep Thought]

That's right.

And I didn't know that about Fireworks. I did it by hand, with the help of a script