473,387 Members | 1,760 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,387 software developers and data experts.

Graphically edit a page?

Hello all.

I am a Java programmer who sometimes dabbles in simple PHP stuff, and
had a question that's way over my head, for you PHP experts.

I would like to know how to dynamically edit a cuurently static HTML
page which contains a map of a stands at a convention center. The
static version of the page can be found here:

http://www.ibertoldo.com/plano.htm

I would like to be able to *visually* edit this page -- create, modify
(re-shape and move boxes, assign data, etc.), and delete boxes on the
page, and then click on a "Save" button to save the changes in my
database.

I am a feeling what I am asking for is something much more suited to
Flash but I need to do it in PHP. Does anyone know of a graphic editor
out there, something that allows drag-and-drop and stretching of HTML
(DHTML) elements?

Thanks for any tips,
syg

Sep 12 '05 #1
10 1757
In article <11*********************@g44g2000cwa.googlegroups. com>,
sy****@gmail.com wrote:
Hello all.

I am a Java programmer who sometimes dabbles in simple PHP stuff, and
had a question that's way over my head, for you PHP experts.

I would like to know how to dynamically edit a cuurently static HTML
page which contains a map of a stands at a convention center. The
static version of the page can be found here:

http://www.ibertoldo.com/plano.htm

I would like to be able to *visually* edit this page -- create, modify
(re-shape and move boxes, assign data, etc.), and delete boxes on the
page, and then click on a "Save" button to save the changes in my
database.

I am a feeling what I am asking for is something much more suited to
Flash but I need to do it in PHP. Does anyone know of a graphic editor
out there, something that allows drag-and-drop and stretching of HTML
(DHTML) elements?


I'm confused - do you want to edit the image or the HTML? Both *can* be done
with PHP of course, but it's a little more complex than being the answer in a
simple usenet post.

For starters, PHP is not a graphics editor, so you won't be editing graphics
"live" or "dynamically" with PHP. PHP is server-side, not client-side. PHP can
be used to create images with basic shapes and imported images when given
specific instructions, but not dynamically through a web interface ion the way
I interprete your question.

The obvious question is of course - why would it be done in PHP? Why not just
use graphics editor and upload it to the site. That's what they are for.

--
Sandman[.net]
Sep 12 '05 #2
Yea, I realized after posting that PHP is rather beside the point. I am
using PHP to save the info in my database.

But obviously what I need here is some kind of sh*t-hot DHTML tool that
lets me draw rectangles (table cells or DIVs or what have you) on a
grid, stretch, drag and drop them, and then somehow round up all this
info and submit it to the server to be saved -- coordinates so I can
re-draw them using the info from the database, and whatever other info
I want to save along with these recangles -- company name, status of
the booth, etc.

So I more or less posted the same question on a DHTML newsgroup. I
know, it's a no-no but I shoud have only posted there to begin with.

..

Sep 12 '05 #3

<sy****@gmail.com> wrote in message
news:11*********************@o13g2000cwo.googlegro ups.com...
Yea, I realized after posting that PHP is rather beside the point. I am
using PHP to save the info in my database.

But obviously what I need here is some kind of sh*t-hot DHTML tool that
lets me draw rectangles (table cells or DIVs or what have you) on a
grid, stretch, drag and drop them, and then somehow round up all this
info and submit it to the server to be saved


uh, I worked on a project like this for my last company, we had a team of 6
working on this type of thing for a few months...not easy. I doubt you will
get this level of help on a NG, you need a contractor !!!
Sep 12 '05 #4
In article <11*********************@o13g2000cwo.googlegroups. com>,
sy****@gmail.com wrote:
Yea, I realized after posting that PHP is rather beside the point. I am
using PHP to save the info in my database.

But obviously what I need here is some kind of sh*t-hot DHTML tool that
lets me draw rectangles (table cells or DIVs or what have you) on a
grid, stretch, drag and drop them, and then somehow round up all this
info and submit it to the server to be saved -- coordinates so I can
re-draw them using the info from the database, and whatever other info
I want to save along with these recangles -- company name, status of
the booth, etc.

So I more or less posted the same question on a DHTML newsgroup. I
know, it's a no-no but I shoud have only posted there to begin with.


As Zoe said, this isn't a question that has a ~100 line response and you're
set. Building that kind of tool is a massive project. Impossible? No way, but
time consuming.

--
Sandman[.net]
Sep 12 '05 #5
On 12 Sep 2005 07:43:45 -0700, in comp.lang.php sy****@gmail.com
wrote:
| Yea, I realized after posting that PHP is rather beside the point. I am
| using PHP to save the info in my database.
|
| But obviously what I need here is some kind of sh*t-hot DHTML tool that
| lets me draw rectangles (table cells or DIVs or what have you) on a
| grid, stretch, drag and drop them, and then somehow round up all this
| info and submit it to the server to be saved -- coordinates so I can
| re-draw them using the info from the database, and whatever other info
| I want to save along with these recangles -- company name, status of
| the booth, etc.
|
| So I more or less posted the same question on a DHTML newsgroup. I
| know, it's a no-no but I shoud have only posted there to begin with.


If I understand you correctly you will need an image map editor
http://www.boutell.com/mapedit/
This is the first one I found using google. I've never used it so I
can't vouch for the app.

A little tutorial here:
http://www.htmlgoodies.com/tutorials...le.php/3479741

You'll end up with HTML code that looks something like:
--------------------------------------------------------------------
<IMG SRC="images/Dev.jpg" ALT="this is the images ALT tag info"
WIDTH="800" HEIGHT="600" BORDER="0" USEMAP="#imap">
<MAP NAME="imap">
<AREA SHAPE="RECT" COORDS="17,217,548,345" ALT="box 1">
<AREA SHAPE="RECT" COORDS="69,372,196,518" ALT="box 2">
<AREA SHAPE="RECT" COORDS="205,366,515,519" ALT="box 3">
<AREA SHAPE="CIRCLE" COORDS="687,303,62" ALT="circ1">
COORDS="631,333,606,332,590,349,592,362,600,368,60 2,370,605,393,626,449,
622,466,596,510,608,521,630,548,639,537,639,516,64 6,502,656,520,
689,561,676,488,702,497,713,505,722,522,731,524,73 7,514,743,490,
740,465,711,428,723,402,744,401,768,389,773,359,76 2,347,764,324,
737,363,716,357,686,364,665,361,649,354" ALT="poly 1">
</MAP>
--------------------------------------------------------------------
In the Area tags you will need to add the Title and onClick
attributes.

The Title attribute is required because only IE displays the ALT tag
information on mouseover, all other browsers use the Title attribute.

The onClick function will point to a javascript function to tell the
browser what information you want to display.

The Area items will look something like:
--------------------------------------------------------------------
<IMG SRC="images/Development10A.jpg" ALT="this is the images ALT tag
info" WIDTH="800" HEIGHT="600" BORDER="0" USEMAP="#imap">
<MAP NAME="imap">
<AREA SHAPE="RECT" COORDS="17,217,548,345" ALT="box 1" title="box
1" onClick="abc(1)">
<AREA SHAPE="RECT" COORDS="69,372,196,518" ALT="box 2" title="box
2" onClick="abc(2)">
<AREA SHAPE="RECT" COORDS="205,366,515,519" ALT="box 3" title="box
3" onClick="abc(3)">
<AREA SHAPE="CIRCLE" COORDS="687,303,62" ALT="circ1"
title="circ1" onClick="abc(4)">
<AREA SHAPE="POLY"
COORDS="631,333,606,332,590,349,592,362,600,368,60 2,370,605,393,626,449,
622,466,596,510,608,521,630,548,639,537,639,516,64 6,502,656,520,
689,561,676,488,702,497,713,505,722,522,731,524,73 7,514,743,490,
740,465,711,428,723,402,744,401,768,389,773,359,76 2,347,764,324,
737,363,716,357,686,364,665,361,649,354" ALT="poly 1">
</MAP>
--------------------------------------------------------------------

The javascript area will look something like:

<script type="text/javascript">
var iMapArr = ["","item1","item2","item3","item4","item5"];

function abc(itm)
{
alert( iMapArr[itm] );
}
</script>
Caveats:
If the user is using a text only browser then the page is unusable -
no image no map.
If the user has javascripting turned off then the above will not work.
Although you could change the onClick to point to another file that
will do the processing.

HTH
---------------------------------------------------------------
jn******@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------
Sep 12 '05 #6

Jeff North wrote:
Caveats:
If the user is using a text only browser then the page is unusable -
no image no map.


That's what the ALT tag is there for.
Lynx handles image maps just fine when you define the ALT tag for each
area.
Of course "Box 1" isn't too descriptive.

Sep 12 '05 #7
Hmmm ...

Actually I don't think an image-map editor is what I need. The reason
is that an image-map editor works on an already existing image. What I
would like to do is simply present the user with a grid of boxes. Each
one would be a DIV I guess.

On that grid he creates stands made up of x grid boxes by clicking on a
given box then stretching it so it is made up of 1, 2 or x more boxes.
He then assigns some data (name of company, status) and saves.

All I would be saving here are some x,y coordinates and the company
info. With that info saved when the user returns to the page I simply
spit out a DIV with given coordinates for each entry in the database.

I think I am dreaming though. I could do this kind of thing myself with
the DynDuo DHTML library or something but I think it would take me
quite a long time. I was interested in knowing if something like this
already exists. But I realize a php newsgroup is probably not the place
to be looking.

Anyway, thanks for your collective input.
syg

Sep 13 '05 #8
On 12 Sep 2005 15:06:42 -0700, in comp.lang.php "BKDotCom"
<bk***********@yahoo.com> wrote:
|
| Jeff North wrote:
| > Caveats:
| > If the user is using a text only browser then the page is unusable -
| > no image no map.
|
| That's what the ALT tag is there for.
Alt attribute:
http://www.w3.org/TR/html401/struct/objects.html#h-13.8

Title attribute:
http://www.w3.org/TR/html401/struct/global.html#h-7.4.3
| Lynx handles image maps just fine when you define the ALT tag for each
| area.
OK, correction required.
When you use Firefox 1.06 and turn off the displaying of images then
the image map is non-functional.
| Of course "Box 1" isn't too descriptive.


It was for the example that I gave.
---------------------------------------------------------------
jn******@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------
Sep 13 '05 #9
On 13 Sep 2005 01:22:35 -0700, in comp.lang.php sy****@gmail.com
wrote:
| Hmmm ...
|
| Actually I don't think an image-map editor is what I need. The reason
| is that an image-map editor works on an already existing image. What I
| would like to do is simply present the user with a grid of boxes. Each
| one would be a DIV I guess.
|
| On that grid he creates stands made up of x grid boxes by clicking on a
| given box then stretching it so it is made up of 1, 2 or x more boxes.
| He then assigns some data (name of company, status) and saves.
|
| All I would be saving here are some x,y coordinates and the company
| info. With that info saved when the user returns to the page I simply
| spit out a DIV with given coordinates for each entry in the database.
|
| I think I am dreaming though. I could do this kind of thing myself with
| the DynDuo DHTML library or something but I think it would take me
| quite a long time. I was interested in knowing if something like this
| already exists. But I realize a php newsgroup is probably not the place
| to be looking.
|
| Anyway, thanks for your collective input.
| syg


Will this help:
http://jjnau.netfirms.com/floor/floor.htm
---------------------------------------------------------------
jn******@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------
Sep 13 '05 #10
Hey, that looks pretty cool. I'll have to futz with it but more or less
it's what they want.

Cheers!
syg

Sep 13 '05 #11

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: Dorthe Luebbert | last post by:
Hi, I am looking for a class to display trees graphically (SVG, Gdlib, whatever). It should look somehowlike this java driven example: ...
3
by: sygsix | last post by:
Hello all. I am a Java programmer who sometimes dabbles in simple PHP stuff, and had a question that's way over my head, for you DHTML experts. I would like to know how to dynamically edit a...
0
by: Alex | last post by:
Interested in more .NET stuff visit www.dedicatedsolutions.co.uk The DataList is not as powerful as the DataGrid. It requires more work from you since it has no default data presentation format....
4
by: Glenn M | last post by:
I have a shared XML file on a server . i also have one xslt file that performs a simple transform on in to view the data. now i want to have another page that lets users modify the shared xml...
5
by: MasterChief | last post by:
I am using Visual Web Developer to create a basic database app. I put in a grid view and Enabled Selecting on the gridview. What I would like to happen though is when the person clicks select it...
3
by: Neil Steventon | last post by:
Hi, Im after some advise on how to go about this problem. I have a master page with nice header and side bar setup. I then have various aspx pages that use this master page. I want one of the...
9
by: rn5a | last post by:
A Form has a DataGrid which displays records from a SQL Server 2005 DB table. Users can modify the records using this DataGrid for which I am using EditCommandColumn in the DataGrid. This is the...
1
by: Benny Ng | last post by:
Dear All, Now I met one problem in the development of my one application. I have one ASP.NET page. It's for disply the information of customer. But now I have one new requirement. It's to...
1
by: chromis | last post by:
Hi, I'm having trouble fully implementing the edit section of a contact admin system, so far I have written the following: - Bean (Contact.cfc) - Data Access object (ContactDAO.cfc) - Gateway...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.