Вверх ↑
Этот топик читают: Гость
Ответов: 3514
Рейтинг: 184
#1: 2007-01-22 17:30:19 ЛС | профиль | цитата
На hiasm волне спокойно можно написать "текстовый" хтмл редактор. Однако всё таки приятней, "пощупать" свой будующий сайт, нежели мутить с кодами, которые в первый раз видишь.
Вот моя нароботка:
code_864

Работает она правильно, как бы странно это не прозвучало )

Проблема вот в чём: Программа будет "редактором" гостевых книг. В скрипте этой самой гостевой предусмотрено: 4 Лейбла (надписи то бишь), 3 Эдита (поля ввода), 1 текстовое поле, 1 кнопка и таблица, в которую будут помещатся сообщения.
Хочется позволить пользователю "двигать" поля, кнопки и прочее. Однако возникает проблема, для нормального контроля над элементами нужны таблицы, а соответственно нужно просчитывать их расположение. В примере выше данные полученные от компонентов просто вставляются в уже готовую заготовку. Но там один элемент, а нужно 9. Таблицы будут "конкурировать" в итоге всё будет расплыватся. Решение я вижу таким- нужно научить элемент узнавать, есть ли "вокруг" него таблицы и отталкиватся от них...
Итак вопрос. Как сделать вот это:
Add(MainForm,11905751,21,105)
{
Left=20
Top=105
Width=586
Height=344
}
Add(ChildPanel,4234945,140,161)
{
}
BEGIN_SDK
Add(EditMulti,6486489,3,3)
{
EventCount=1
WorkCount=7
DataCount=6
Width=594
Height=452
link(doWork1,13841186:doData,[(19,9)(19,90)])
link(doWork2,11644571:doEvent1,[(22,16)(22,160)])
link(doWork3,2039834:doData,[(40,23)(40,335)])
link(doWork4,2840267:doFont,[(152,30)(152,181)])
link(doWork5,4292901:doData,[(99,37)(99,405)])
link(doWork6,1666818:doData,[(124,44)(124,370)])
link(doWork7,148777:doData,[(218,51)(218,321)])
}
Add(ChildPanel,12276026,553,210)
{
}
BEGIN_SDK
Add(EditMulti,11769052,3,3)
{
WorkCount=9
link(doWork1,7531748:doWork1,[(7,9)(7,16)])
link(doWork2,7531748:doWork2,[(7,16)(7,23)])
link(doWork3,7531748:doWork3,[(7,23)(7,30)])
link(doWork4,7531748:doWork4,[(7,30)(7,37)])
link(doWork5,16580405:doWork1,[(7,37)(7,72)])
link(doWork6,16580405:doWork2,[(7,44)(7,79)])
link(doWork7,16580405:doWork3,[(7,51)(7,86)])
link(doWork8,16580405:doWork4,[(7,58)(7,93)])
link(doWork9,16580405:doWork5,[(7,65)(7,100)])
}
Add(Panel,1244422,91,112)
{
Left=209
Width=363
Height=251
Align=3
Color=11169621
BorderWidth=0
BevelWidth=0
Point(doColor)
}
Add(ChildPanel,16580405,11,66)
{
}
BEGIN_SDK
Add(EditMulti,9748301,3,3)
{
WorkCount=5
link(doWork1,11878417:doWork1,[(64,9)(64,76)])
link(doWork2,16219016:doWork2,[(54,16)(54,139)])
link(doWork3,11878417:doWork2,[(64,23)(64,83)])
link(doWork4,11679173:doWork2,[(8,30)(8,69)])
link(doWork5,13581745:doColor,[(19,37)(19,118)])
}
Add(Panel,13581745,35,105)
{
Left=5
Top=70
Width=349
Height=63
Color=16777215
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(ChildPanel,11878417,126,70)
{
}
BEGIN_SDK
Add(EditMulti,13349763,3,3)
{
WorkCount=2
link(doWork1,14216812:doBringToFront,[(19,9)(19,125)])
link(doWork2,14216812:doColor,[(19,16)(19,118)])
}
Add(Panel,14216812,35,105)
{
Left=1
Top=21
Width=345
Height=20
Color=12632256
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(Label,3063216,91,42)
{
Left=4
Top=1
Width=317
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Привет, это второе сообщение гостевой книги."
Point(doColor)
}
END_SDK
Add(ChildPanel,16219016,105,126)
{
}
BEGIN_SDK
Add(EditMulti,13349763,3,3)
{
WorkCount=2
link(doWork1,14216812:doBringToFront,[(19,9)(19,125)])
link(doWork2,14216812:doColor,[(19,16)(19,118)])
}
Add(Panel,14216812,98,147)
{
Left=1
Top=1
Width=345
Height=20
Color=8388736
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(Label,3063216,70,42)
{
Left=4
Top=1
Width=164
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Иванов пётр Васьльевич"
Point(doColor)
}
END_SDK
Add(ChildPanel,11679173,14,56)
{
}
BEGIN_SDK
Add(EditMulti,13349763,3,3)
{
WorkCount=2
link(doWork1,14216812:doBringToFront,[(19,9)(19,125)])
link(doWork2,14216812:doColor,[(19,16)(19,118)])
}
Add(Panel,14216812,35,105)
{
Left=1
Top=42
Width=345
Height=20
Color=8421504
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(Label,3063216,98,56)
{
Left=4
Top=1
Width=155
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Ответ администратора"
Point(doColor)
}
END_SDK
END_SDK
Add(ChildPanel,7531748,11,10)
{
}
BEGIN_SDK
Add(EditMulti,9748301,3,3)
{
WorkCount=4
link(doWork1,7959237:doWork1,[(64,9)(64,76)])
link(doWork2,12134693:doWork2,[(8,16)(8,146)])
link(doWork3,7959237:doWork2,[(64,23)(64,83)])
link(doWork4,13581745:doColor,[(19,30)(19,118)])
}
Add(Panel,13581745,35,105)
{
Left=5
Top=10
Width=349
Height=42
Color=16777215
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(ChildPanel,7959237,126,70)
{
}
BEGIN_SDK
Add(EditMulti,13349763,3,3)
{
WorkCount=2
link(doWork1,14216812:doBringToFront,[(19,9)(19,125)])
link(doWork2,14216812:doColor,[(19,16)(19,118)])
}
Add(Panel,14216812,182,105)
{
Left=1
Top=21
Width=345
Height=20
Color=12632256
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(Label,3063216,91,21)
{
Left=4
Top=1
Width=353
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Это первое сообщение гостевой книги! Поздравляю!"
Point(doColor)
}
END_SDK
Add(ChildPanel,12134693,161,133)
{
}
BEGIN_SDK
Add(EditMulti,13349763,3,3)
{
WorkCount=2
link(doWork1,14216812:doBringToFront,[(19,9)(19,125)])
link(doWork2,14216812:doColor,[(19,16)(19,118)])
}
Add(Panel,14216812,35,105)
{
Left=1
Top=1
Width=345
Height=20
Color=8388736
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
}
Add(Label,3063216,7,0)
{
Left=4
Top=1
Width=88
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Vasya Pupkin"
Point(doColor)
}
END_SDK
END_SDK
END_SDK
Add(Button,6790904,294,238)
{
Left=10
Top=205
Width=195
Caption="Отправить"
}
Add(Panel,10864141,91,105)
{
Left=3
Top=38
Width=572
Height=251
Color=11169621
BorderWidth=0
BevelWidth=0
Point(doColor)
Point(doBringToFront)
link(onClick,6486489:onEvent1,[(185,111)(185,9)])
}
Add(Memo,12977488,119,189)
{
Left=10
Top=100
Width=195
Height=105
}
Add(Edit,10166422,196,161)
{
Left=80
Top=60
Width=125
Text=""
}
Add(Edit,6994094,189,154)
{
Left=80
Top=40
Width=125
Text=""
}
Add(Edit,5511073,182,147)
{
Left=80
Top=20
Width=125
Text=""
}
Add(Label,11531468,77,28)
{
Left=10
Top=25
Width=33
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Ник:"
Point(doColor)
}
Add(Label,11941780,91,42)
{
Left=10
Top=45
Width=26
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Url:"
Point(doColor)
}
Add(Label,5356643,462,168)
{
Left=10
Top=65
Width=47
Height=18
Color=8388736
Font=[Verdana,9,0,255,204]
Transparent=0
Caption="E-mail:"
Point(doColor)
Point(doFont)
}
Add(Label,3536610,126,77)
{
Left=10
Top=85
Width=86
Height=18
Font=[Verdana,9,0,16777215,204]
Transparent=0
Caption="Сообщение:"
Point(doColor)
}
Add(DoData,148777,434,315)
{
link(onEventData,8693935:doEvent1,[])
link(Data,6486489:Data6,[(440,159)(44,159)])
}
Add(Hub,11644571,42,154)
{
OutCount=3
link(onEvent1,10864141:doBringToFront,[])
link(onEvent2,12276026:doWork1,[(313,167)(313,216)])
}
Add(DoData,13841186,35,84)
{
link(onEventData,10864141:doColor,[(79,90)(79,118)])
link(Data,6486489:Data1,[(41,33)(9,33)])
}
Add(Hub,13760956,126,329)
{
link(onEvent1,12276026:doWork2,[(355,335)(355,223)])
link(onEvent2,12276026:doWork6,[(355,342)(355,251)])
}
Add(DoData,2039834,77,329)
{
link(onEventData,13760956:doEvent1,[])
link(Data,6486489:Data2,[(83,65)(16,65)])
}
Add(StrList,13510357,441,84)
{
Strings=#6:Normal|
}
Add(Font,2840267,378,175)
{
Font=[Verdana,9,0,255,204]
link(onFont,5356643:doFont,[])
link(Size,14837137:Text,[(384,156)(342,156)])
link(Color,6486489:Data3,[(391,44)(23,44)])
link(Name,8111486:Text,[])
link(Style,13510357:Text,[(405,152)(447,152)])
}
Add(StrList,8111486,392,91)
{
Strings=#7:Verdana|
}
Add(StrList,14837137,336,91)
{
Strings=#1:9|
}
Add(Hub,12230771,245,399)
{
link(onEvent1,12276026:doWork3,[(415,405)(415,230)])
link(onEvent2,12276026:doWork7,[(415,412)(415,258)])
}
Add(DoData,4292901,196,399)
{
link(onEventData,12230771:doEvent1,[])
link(Data,6486489:Data4,[(202,201)(30,201)])
}
Add(DoData,1666818,245,364)
{
link(onEventData,12276026:doWork8,[(415,370)(415,265)])
link(Data,6486489:Data5,[(251,184)(37,184)])
}
Add(Hub,8693935,483,308)
{
link(onEvent1,12276026:doWork4,[(534,314)(534,237)])
link(onEvent2,12276026:doWork9,[(534,321)(534,272)])
}
END_SDK

В виде html, с возможностью перетаскивания, и одновременно сохранения пропорций и положения элементов.

Задача возможно трудная, однако если есть хоть какие нибудь идеи - напишите
карма: 0
0
файлы: 1code_864.txt [2.9KB] [260]
Ответов: 3514
Рейтинг: 184
#2: 2007-01-23 15:04:35 ЛС | профиль | цитата
Неужели никаких идей нет?..
карма: 0
0
Ответов: 689
Рейтинг: 20
#3: 2007-01-23 16:17:22 ЛС | профиль | цитата
Связка: XML + XSLT. Данные сначала попадают в таблицу, автоматически экспортируются в XML, преобразуются XSLT в нормально читаемый HTML и отображаются компонентом
Add(WebBrowserEx,3703243,84,273)
{
Left=80
Top=270
}
пример работы с XML + XSLT. В коде HiAsm пока, пока, не реализовано, руки не дошли, но в моих планах доделать свой пример здесь, для простого отчета.
карма: 0

0
Ответов: 3514
Рейтинг: 184
#4: 2007-01-23 19:14:51 ЛС | профиль | цитата
oldTV, обьясни плиз, какой мне смысл столько раз конвертить документ? Всё ранво ведь прийдётся делать "строгие" таблицы.

Я вот что подумал, просмотрев исходники сайтов сделанный в Сайткрафте.
file-type=Sitecraft file
version=1.5.110
left=4
top=7
width=234
height=96
orig-file-ext=.png
shadow=0
shadow-len=10
shadow-blur=2
shadow-color=0
shadow-chain=1
color-filled=0
fill-color=16777215
hue=0
hue-locked=0
textured=0
joinless-texture=0
texture-element-width=128
texture-element-height=128
texture-preserve-aspect-ratio=0
texture-aspect-ratio=1
brightness=0
luminosity=0
is-transparen-color=0
transparen-color=16777215
fusiness=0
aspect-ratio=1.66666666666667
PreserveAspectRatio=0
formed=0
form-stretched=1
text-shadow=0
text-alignment=2
text-layout=1
font-charset=1
font-color=0
font-name=Times New Roman
font-pitch=0
font-height=-19
text-visible=0
bump=0
bump-height=3
bump-blur=3
bump-chain=1
show-glass=0
quality=1
jpg-quality=70
r-t=0
web-file-ext=.png
e-n=
element-name=
image=88


и

-8 1 2
-9 2 0 0 2 0 1

S
FontNameArialSize Color clBlackFontNameArialSize Color clBlack



В конечном счёте всё это собирается воедино и компилится...


Скажите, а если у меня будет исходник такой "фикнюшки" на делфи, или VB, можно будет прикрепить код к Проекту хиасма без потери функциональности?
карма: 0
0
Ответов: 689
Рейтинг: 20
#5: 2007-01-23 19:50:49 ЛС | профиль | цитата
не конвертировать, преобразовывать. Честно говоря я сам не знаю зачем, но по другом динамически отображать данные в HTML можно только так. Ну по крайней мере мне известен только такой способ, как наиболее простой. В XSLT - задал форматирование, в XML - сами данные, форма HiAsm для редактирования (ввода) данных
карма: 0

0
Ответов: 3514
Рейтинг: 184
#6: 2007-01-23 19:54:00 ЛС | профиль | цитата
В XSLT - задал форматирование, в XML - сами данные, форма HiAsm для редактирования (ввода) данных


Вообще не представляю, как это. XSLT сам будет чтоль определять расстановку таблиц и элементов?..
карма: 0
0
Ответов: 2125
Рейтинг: 159
#7: 2007-01-23 20:15:36 ЛС | профиль | цитата
Астрамак писал(а):
XSLT сам будет чтоль определять расстановку таблиц и элементов

XSLT - это шаблон будущего HTML файла, там есть операторы выборки из XML данных и цикла по этим данным. Соответственно, куски текста внутри цикла (обычно тэги таблицы+выбранные из XML в текущей итерации данные) размножаются. Циклы могут быть вложенными, таким образом получают таблицы.
карма: 1

0
Ответов: 689
Рейтинг: 20
#8: 2007-01-23 22:02:43 ЛС | профиль | цитата
есть правда особенности этой технологии:
1. корректно работает только в IE
2. нет free-визуальных редакторов для работы c такой связкой, все платные - монстрообразные и дорогие. Явно не для России. Так что придется в блокнотике, ручками. Лучше в блокнотике с подсветкой, типа RuleNote или Notepad++ (это мне нравится больше, более а-ля Microsoft чтоли).

но вот пример:
простой xml-файл:
code_872

вот xslt, файл для преобразования xml-данных в html:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<table border="1" bgcolor="#F5F5F5">
<tr bgcolor="#CCCCCC">
<td align="center">
<strong>
<xsl:value-of select="//dogsCaptionName" />
</strong>
</td>
<td align="center">
<strong>
<xsl:value-of select="//dogsCaptionWeight" />
</strong>
</td>
<td align="center">
<strong>
<xsl:value-of select="//dogsCaptionColor" />
</strong>
</td>
</tr>
<xsl:for-each select="tutorial/enimals/dogs/dog">
<tr>
<xsl:if test="position() mod 2 = 0">
<xsl:attribute name="bgcolor">#CCCCCC</xsl:attribute>
</xsl:if>
<td>
<xsl:value-of select="dogName" />
</td>
<td align="right">
<xsl:value-of select="dogWeight" />
<xsl:value-of select="dogWeight/@caption" />
</td>
<td>
<xsl:value-of select="dogColor" />
</td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>

Все возможности описаны выше, в примере, но так сказать начальный курс молодого бойца:
в файл xml есть тэг: <?xml-stylesheet type='text/xsl' href='ex04-8.xsl'?>. Он задает путь к файлу xslt, файлк шаблона преобразования. Сам же XSLT некая смесь из тэгов HTML, типа вот такого (ячейка таблицы):
<td>
<xsl:value-of select="dogColor" />
</td>
и тэга XSL - в данном случае выдергивающего данные из XML (из тэга dogColor) и вставляющие их в таблицу.
Более подробно все в примерах, здесь, здесь их куча.
карма: 0

0
файлы: 1code_872.txt [951B] [339]
Ответов: 3514
Рейтинг: 184
#9: 2007-01-23 22:41:50 ЛС | профиль | цитата
Это всё понятно. Но этот самый xslt не будет работать корректно! Нужно что то "умное", что бы таблицы высчитывала, определяла, находится ли оно в таблице. НАпример. Один элемент имеет отступ слева 100, а второй 150. Отсчитываем, получаем 50, значит td with равно 50 ти. Хм.. А это ведь можно и попробовать )
карма: 0
0
9
Сообщение
...
Прикрепленные файлы
(файлы не залиты)