diff options
Diffstat (limited to 'kjsembed/docs/examples/buttonmaker')
16 files changed, 1054 insertions, 0 deletions
diff --git a/kjsembed/docs/examples/buttonmaker/01.png b/kjsembed/docs/examples/buttonmaker/01.png Binary files differnew file mode 100644 index 00000000..8866be37 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/01.png diff --git a/kjsembed/docs/examples/buttonmaker/02.png b/kjsembed/docs/examples/buttonmaker/02.png Binary files differnew file mode 100644 index 00000000..d531ab8b --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/02.png diff --git a/kjsembed/docs/examples/buttonmaker/03.png b/kjsembed/docs/examples/buttonmaker/03.png Binary files differnew file mode 100644 index 00000000..e83f9d61 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/03.png diff --git a/kjsembed/docs/examples/buttonmaker/04.png b/kjsembed/docs/examples/buttonmaker/04.png Binary files differnew file mode 100644 index 00000000..2dae0228 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/04.png diff --git a/kjsembed/docs/examples/buttonmaker/05.png b/kjsembed/docs/examples/buttonmaker/05.png Binary files differnew file mode 100644 index 00000000..1a7293e5 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/05.png diff --git a/kjsembed/docs/examples/buttonmaker/06.png b/kjsembed/docs/examples/buttonmaker/06.png Binary files differnew file mode 100644 index 00000000..f5074bc7 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/06.png diff --git a/kjsembed/docs/examples/buttonmaker/07.png b/kjsembed/docs/examples/buttonmaker/07.png Binary files differnew file mode 100644 index 00000000..861253d8 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/07.png diff --git a/kjsembed/docs/examples/buttonmaker/08.png b/kjsembed/docs/examples/buttonmaker/08.png Binary files differnew file mode 100644 index 00000000..c48e10cf --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/08.png diff --git a/kjsembed/docs/examples/buttonmaker/09.png b/kjsembed/docs/examples/buttonmaker/09.png Binary files differnew file mode 100644 index 00000000..7ed0db8d --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/09.png diff --git a/kjsembed/docs/examples/buttonmaker/ButtonMakerUI.ui b/kjsembed/docs/examples/buttonmaker/ButtonMakerUI.ui new file mode 100644 index 00000000..23c30593 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/ButtonMakerUI.ui @@ -0,0 +1,592 @@ +<!DOCTYPE UI><UI version="3.3" stdsetdef="1"> +<class>Form1</class> +<widget class="QWidget"> + <property name="name"> + <cstring>Form1</cstring> + </property> + <property name="geometry"> + <rect> + <x>0</x> + <y>0</y> + <width>646</width> + <height>456</height> + </rect> + </property> + <property name="sizePolicy"> + <sizepolicy> + <hsizetype>3</hsizetype> + <vsizetype>3</vsizetype> + <horstretch>0</horstretch> + <verstretch>0</verstretch> + </sizepolicy> + </property> + <vbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QGroupBox"> + <property name="name"> + <cstring>PreviewBox</cstring> + </property> + <property name="sizePolicy"> + <sizepolicy> + <hsizetype>5</hsizetype> + <vsizetype>5</vsizetype> + <horstretch>0</horstretch> + <verstretch>1</verstretch> + </sizepolicy> + </property> + <property name="title"> + <string>Preview</string> + </property> + <grid> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel" row="0" column="0"> + <property name="name"> + <cstring>Preview</cstring> + </property> + <property name="text"> + <string>none</string> + </property> + <property name="alignment"> + <set>AlignCenter</set> + </property> + </widget> + </grid> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout6</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel1</cstring> + </property> + <property name="text"> + <string>Button text:</string> + </property> + <property name="buddy" stdset="0"> + <cstring>text</cstring> + </property> + </widget> + <widget class="KLineEdit"> + <property name="name"> + <cstring>Text</cstring> + </property> + </widget> + </hbox> + </widget> + <widget class="QButtonGroup"> + <property name="name"> + <cstring>Mode</cstring> + </property> + <property name="title"> + <string>Base Image</string> + </property> + <vbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout15</cstring> + </property> + <vbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout8</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QRadioButton"> + <property name="name"> + <cstring>Srcimg</cstring> + </property> + <property name="text"> + <string>Source &image:</string> + </property> + <property name="checked"> + <bool>true</bool> + </property> + </widget> + <widget class="KURLRequester"> + <property name="name"> + <cstring>BaseImage</cstring> + </property> + </widget> + </hbox> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout14</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <spacer> + <property name="name"> + <cstring>spacer7</cstring> + </property> + <property name="orientation"> + <enum>Horizontal</enum> + </property> + <property name="sizeType"> + <enum>Expanding</enum> + </property> + <property name="sizeHint"> + <size> + <width>81</width> + <height>20</height> + </size> + </property> + </spacer> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout13</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel3_2</cstring> + </property> + <property name="text"> + <string>X scale:</string> + </property> + </widget> + <widget class="KIntSpinBox"> + <property name="name"> + <cstring>Xscale</cstring> + </property> + <property name="value"> + <number>1</number> + </property> + </widget> + </hbox> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout12</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel4_2</cstring> + </property> + <property name="text"> + <string>Y scale:</string> + </property> + </widget> + <widget class="KIntSpinBox"> + <property name="name"> + <cstring>Yscale</cstring> + </property> + <property name="value"> + <number>1</number> + </property> + </widget> + </hbox> + </widget> + </hbox> + </widget> + </vbox> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout17</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QRadioButton"> + <property name="name"> + <cstring>Pillbox</cstring> + </property> + <property name="text"> + <string>Generate pillbox</string> + </property> + </widget> + <spacer> + <property name="name"> + <cstring>spacer6</cstring> + </property> + <property name="orientation"> + <enum>Horizontal</enum> + </property> + <property name="sizeType"> + <enum>Expanding</enum> + </property> + <property name="sizeHint"> + <size> + <width>16</width> + <height>20</height> + </size> + </property> + </spacer> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout9</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel2</cstring> + </property> + <property name="text"> + <string>Width:</string> + </property> + </widget> + <widget class="KIntSpinBox"> + <property name="name"> + <cstring>Xsize</cstring> + </property> + <property name="enabled"> + <bool>false</bool> + </property> + <property name="maxValue"> + <number>512</number> + </property> + <property name="value"> + <number>128</number> + </property> + </widget> + </hbox> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout10</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel1_2</cstring> + </property> + <property name="text"> + <string>Height:</string> + </property> + </widget> + <widget class="KIntSpinBox"> + <property name="name"> + <cstring>Ysize</cstring> + </property> + <property name="enabled"> + <bool>false</bool> + </property> + <property name="maxValue"> + <number>512</number> + </property> + <property name="value"> + <number>32</number> + </property> + </widget> + </hbox> + </widget> + <spacer> + <property name="name"> + <cstring>spacer8</cstring> + </property> + <property name="orientation"> + <enum>Horizontal</enum> + </property> + <property name="sizeType"> + <enum>Expanding</enum> + </property> + <property name="sizeHint"> + <size> + <width>16</width> + <height>20</height> + </size> + </property> + </spacer> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout15</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel1_3</cstring> + </property> + <property name="text"> + <string>Base color:</string> + </property> + </widget> + <widget class="KColorButton"> + <property name="name"> + <cstring>BaseColor</cstring> + </property> + <property name="enabled"> + <bool>false</bool> + </property> + <property name="text"> + <string></string> + </property> + <property name="color"> + <color> + <red>0</red> + <green>255</green> + <blue>255</blue> + </color> + </property> + </widget> + </hbox> + </widget> + </hbox> + </widget> + </vbox> + </widget> + <widget class="QGroupBox"> + <property name="name"> + <cstring>TextBox</cstring> + </property> + <property name="title"> + <string>Text Style</string> + </property> + <vbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel3</cstring> + </property> + <property name="text"> + <string>Font style:</string> + </property> + <property name="buddy" stdset="0"> + <cstring>font</cstring> + </property> + </widget> + <widget class="KFontRequester"> + <property name="name"> + <cstring>Font</cstring> + </property> + <property name="preview"> + <bool>false</bool> + </property> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout16</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel2_2</cstring> + </property> + <property name="text"> + <string>Text X offset:</string> + </property> + </widget> + <widget class="KIntNumInput"> + <property name="name"> + <cstring>XOffset</cstring> + </property> + </widget> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel2_2_2</cstring> + </property> + <property name="text"> + <string>Text Y offset:</string> + </property> + </widget> + <widget class="KIntNumInput"> + <property name="name"> + <cstring>YOffset</cstring> + </property> + </widget> + <spacer> + <property name="name"> + <cstring>spacer6_2</cstring> + </property> + <property name="orientation"> + <enum>Horizontal</enum> + </property> + <property name="sizeType"> + <enum>Expanding</enum> + </property> + <property name="sizeHint"> + <size> + <width>31</width> + <height>20</height> + </size> + </property> + </spacer> + </hbox> + </widget> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout10</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout7</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel4</cstring> + </property> + <property name="text"> + <string>Text colors:</string> + </property> + <property name="buddy" stdset="0"> + <cstring>textColors</cstring> + </property> + </widget> + <widget class="KDualColorButton"> + <property name="name"> + <cstring>TextColors</cstring> + </property> + </widget> + </hbox> + </widget> + <spacer> + <property name="name"> + <cstring>spacer4</cstring> + </property> + <property name="orientation"> + <enum>Horizontal</enum> + </property> + <property name="sizeType"> + <enum>Expanding</enum> + </property> + <property name="sizeHint"> + <size> + <width>40</width> + <height>20</height> + </size> + </property> + </spacer> + <widget class="QLayoutWidget"> + <property name="name"> + <cstring>layout8</cstring> + </property> + <hbox> + <property name="name"> + <cstring>unnamed</cstring> + </property> + <widget class="QLabel"> + <property name="name"> + <cstring>textLabel5</cstring> + </property> + <property name="text"> + <string>Shadow offset:</string> + </property> + <property name="buddy" stdset="0"> + <cstring>offset</cstring> + </property> + </widget> + <widget class="KIntNumInput"> + <property name="name"> + <cstring>Offset</cstring> + </property> + <property name="value"> + <number>1</number> + </property> + </widget> + </hbox> + </widget> + </hbox> + </widget> + </vbox> + </widget> + </vbox> +</widget> +<connections> + <connection> + <sender>Srcimg</sender> + <signal>toggled(bool)</signal> + <receiver>BaseImage</receiver> + <slot>setEnabled(bool)</slot> + </connection> + <connection> + <sender>Srcimg</sender> + <signal>toggled(bool)</signal> + <receiver>Xscale</receiver> + <slot>setEnabled(bool)</slot> + </connection> + <connection> + <sender>Srcimg</sender> + <signal>toggled(bool)</signal> + <receiver>Yscale</receiver> + <slot>setEnabled(bool)</slot> + </connection> + <connection> + <sender>Pillbox</sender> + <signal>toggled(bool)</signal> + <receiver>Ysize</receiver> + <slot>setEnabled(bool)</slot> + </connection> + <connection> + <sender>Pillbox</sender> + <signal>toggled(bool)</signal> + <receiver>Xsize</receiver> + <slot>setEnabled(bool)</slot> + </connection> + <connection> + <sender>Pillbox</sender> + <signal>toggled(bool)</signal> + <receiver>BaseColor</receiver> + <slot>setEnabled(bool)</slot> + </connection> +</connections> +<layoutdefaults spacing="6" margin="11"/> +<includehints> + <includehint>klineedit.h</includehint> + <includehint>kurlrequester.h</includehint> + <includehint>klineedit.h</includehint> + <includehint>kpushbutton.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>kcolorbutton.h</includehint> + <includehint>kfontrequester.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>kdualcolorbutton.h</includehint> + <includehint>knuminput.h</includehint> + <includehint>knuminput.h</includehint> +</includehints> +</UI> diff --git a/kjsembed/docs/examples/buttonmaker/buttonmaker.desktop b/kjsembed/docs/examples/buttonmaker/buttonmaker.desktop new file mode 100644 index 00000000..0e6deaa4 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/buttonmaker.desktop @@ -0,0 +1,10 @@ +[Desktop Entry] +Exec=kjscmd `kde-config --prefix`/share/apps/buttonmaker/buttonmaker.js +GenericName=Webpage Button Maker +Icon=exec +MimeType= +Name=ButtonMaker +StartupNotify=true +Terminal=false +Type=Application +X-KDE-SubstituteUID=false diff --git a/kjsembed/docs/examples/buttonmaker/buttonmaker.js b/kjsembed/docs/examples/buttonmaker/buttonmaker.js new file mode 100755 index 00000000..ac85b878 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/buttonmaker.js @@ -0,0 +1,266 @@ +#!/usr/bin/env kjscmd + +StdDirs.addResourceType("buttonmaker", StdDirs.kde_default("data") + "/buttonmaker"); + +var imgfx = new ImageFX(); +var win = new KMainWindow(this); + +try { +//var view = Factory.loadui(StdDirs.findResource("buttonmaker", "ButtonMakerUI.ui"), this, win); + var view = Factory.loadui("ButtonMakerUI.ui", this, win); +} +catch(err) +{ + alert( err ); + exit(); +} + +var quitAction = StdAction.quit( 0, 0, win.actionCollection() ); +var saveAction = StdAction.save( 0, 0, win.actionCollection() ); +var newAction = StdAction.fileNew( 0, 0, win.actionCollection() ); + +win.connect( quitAction, 'activated()', this, 'exit'); +win.connect( saveAction, 'activated()', this, 'saveImage'); +win.connect( newAction, 'activated()', this, 'resetView'); + + +win.connect(view.TextBox.Font, 'fontSelected(const QFont&)', this, 'updateUI' ); +win.connect(view.TextBox.TextColors, 'fgChanged(const QColor&)', this, 'updateUI' ); +win.connect(view.TextBox.TextColors, 'bgChanged(const QColor&)', this, 'updateUI' ); +win.connect(view.TextBox.Offset, 'valueChanged(int)', this, 'updateUI' ); +win.connect(view.TextBox.YOffset, 'valueChanged(int)', this, 'updateUI' ); +win.connect(view.TextBox.XOffset, 'valueChanged(int)', this, 'updateUI' ); + +win.connect(view.Text, 'returnPressed(const QString&)', this, 'updateUI'); + +win.connect(view.Mode, 'released(int)', this, 'changeMode'); +win.connect(view.Mode.Xsize, 'valueChanged(int)', this, 'updatePillBox' ); +win.connect(view.Mode.Ysize, 'valueChanged(int)', this, 'updatePillBox' ); +win.connect(view.Mode.BaseColor, 'changed(const QColor&)', this, 'updatePillBox' ); +win.connect(view.Mode.BaseImage, 'urlSelected(const QString&)', this, 'loadImage'); + +win.connect(view.Mode.Xscale, 'valueChanged(int)', this, 'updateUI' ); +win.connect(view.Mode.Yscale, 'valueChanged(int)', this, 'updateUI' ); + +var bgimage = new Pixmap(); +bgimage.resize(16,32); +bgimage.fill("blue"); + +resetView(); + +win.createGUI("buttonmaker.rc"); +win.setCentralWidget(view); +win.setCaption("ButtonMaker"); +win.show(); +application.exec(); + +function CustomPillBox() +{ + this.a = new Image(); + this.b = new Image(); + this.c = new Image(); + this.d = new Image(); + this.e = new Image(); + this.f = new Image(); + this.g = new Image(); + this.h = new Image(); + this.i = new Image(); + + this.height = function() { + return this.a.height() + this.d.height() + this.g.height(); + } + + this.width = function() { + return this.a.width() + this.b.width() + this.c.width(); + } + + this.loadImages = function() { + return ( + this.a.load(StdDirs.findResource("buttonmaker", "01.png")) && + this.b.load(StdDirs.findResource("buttonmaker", "02.png")) && + this.c.load(StdDirs.findResource("buttonmaker", "03.png")) && + this.d.load(StdDirs.findResource("buttonmaker", "04.png")) && + this.e.load(StdDirs.findResource("buttonmaker", "05.png")) && + this.f.load(StdDirs.findResource("buttonmaker", "06.png")) && + this.g.load(StdDirs.findResource("buttonmaker", "07.png")) && + this.h.load(StdDirs.findResource("buttonmaker", "08.png")) && + this.i.load(StdDirs.findResource("buttonmaker", "09.png"))); + } + + this.colorize = function( color ) { + var percent = 0.55; + this.a = imgfx.blendColor( color, this.a, percent); + this.b = imgfx.blendColor( color, this.b, percent); + this.c = imgfx.blendColor( color, this.c, percent); + this.d = imgfx.blendColor( color, this.d, percent); + this.e = imgfx.blendColor( color, this.e, percent); + this.f = imgfx.blendColor( color, this.f, percent); + this.g = imgfx.blendColor( color, this.g, percent); + this.h = imgfx.blendColor( color, this.h, percent); + this.i = imgfx.blendColor( color, this.i, percent); + } + + this.resize = function( newW, newH ) { + + this.b.smoothScale( newW - ( this.a.width() + this.c.width() ), this.b.height() ); + this.h.smoothScale( newW - ( this.g.width() + this.i.width() ), this.h.height() ); + + this.d.smoothScale( this.d.width(), newH - ( this.a.height() + this.g.height() ) ); + this.f.smoothScale( this.f.width(), newH - ( this.c.height() + this.i.height() ) ); + + this.e.smoothScale( newW - ( this.a.width() + this.c.width() ), + newH - ( this.c.height() + this.i.height() ) ); + } + + this.pixmap = function(width, height){ + this.resize(width, height); + var pix = new Pixmap(); + pix.resize(width, height); + pix.fill("white"); + + var painter = new Painter(); + try { + if( painter.begin(pix) ) + { + //painter.drawRect(0,0,this.width(), this.height()); + painter.drawImage(0, 0, this.a, 0, 0, -1, -1, 0); + painter.drawImage(0, this.a.height(), this.d, 0, 0, -1, -1, 0); + painter.drawImage(0, ( this.height() - this.g.height() ) ,this.g, 0, 0, -1, -1, 0); + + painter.drawImage(this.a.width(), 0, this.b, 0, 0, -1, -1, 0); + painter.drawImage(this.d.width(), this.b.height(), this.e, 0, 0, -1, -1, 0); + painter.drawImage(this.g.width(), ( this.height() - this.h.height() ) ,this.h, 0, 0, -1, -1, 0); + + painter.drawImage(this.a.width() + this.b.width(), 0, this.c, 0, 0, -1, -1, 0); + painter.drawImage(this.d.width() + this.e.width(), this.c.height(), this.f, 0, 0, -1, -1, 0); + painter.drawImage(this.g.width() + this.h.width(), ( this.height() - this.i.height() ) ,this.i, 0, 0, -1, -1, 0); + if( painter.end() ) + pix = painter.pixmap(); + } + else + alert("Could not paint to the pixmap."); + } catch (err) { alert(err); } + return pix; + } + +} + +function render(txt, bgimg, font, offset, fgColor, bgColor, xOffset, yOffset) +{ + var h = bgimg.height(); + var w = bgimg.width(); + var fg = new Pen(); + var bg = new Pen(); + fg.setColor(fgColor); + bg.setColor(bgColor); + + var painter = new Painter(); + try { + if (painter.begin(bgimg)) + { + painter.scale( view.Mode.Xscale.value, view.Mode.Yscale.value ); + painter.setPen(bg); + painter.setFont(font); + var box = painter.textBox(txt); + var txtX = (w/2) - (box.width()/2) + xOffset; + var txtY = (h/2) + (box.height()/2) + yOffset; + painter.drawText(txtX+offset,txtY+offset,txt); + painter.setPen(fg); + painter.drawText(txtX,txtY,txt); + painter.end() + return painter.pixmap(); + } + else + alert("Could not paint to the pixmap."); + } catch (err) { alert(err); } + return new Pixmap(); +} + +function changeMode(mode) +{ + if( mode == 0) + { + loadImage(view.Mode.BaseImage.url); + } + else + { + var pb = new CustomPillBox(); + if ( !pb.loadImages() ) + alert("Error Loading Resources!"); + else + { + pb.colorize(view.Mode.BaseColor.color); + bgimage = pb.pixmap(view.Mode.Xsize.value,view.Mode.Ysize.value); + } + updateUI(); + } +} + +function updatePillBox() +{ + var pb = new CustomPillBox(); + if ( !pb.loadImages() ) + alert("Error Loading Resources!"); + else + { + pb.colorize(view.Mode.BaseColor.color); + bgimage = pb.pixmap(view.Mode.Xsize.value,view.Mode.Ysize.value); + } + updateUI(); +} + +function updateUI() +{ + view.PreviewBox.Preview.pixmap = render(view.Text.text, + bgimage, + view.TextBox.Font.font, + view.TextBox.Offset.value, + view.TextBox.TextColors.foreground, + view.TextBox.TextColors.background, + view.TextBox.XOffset.value, + view.TextBox.YOffset.value); + win.adjustSize(); +} + +function saveImage() +{ + var img = new Image(this); + var fileName = StdDialog.getSaveFileName(); + if( fileName != "") + { + var pixmap = render(view.Text.text, + bgimage, + view.TextBox.Font.font, + view.TextBox.Offset.value, + view.TextBox.TextColors.foreground, + view.TextBox.TextColors.background, + view.TextBox.XOffset.value, + view.TextBox.YOffset.value); + img.setPixmap(pixmap); + img.save(fileName); + } +} + +function resetView() +{ + view.TextBox.Offset.value = 1; + if ( application.args.length > 0 ) + view.Text.text = application.args[0]; + else + view.Text.text = ""; + view.TextBox.Font.font = ""; + view.TextBox.TextColors.foreground = "black"; + view.TextBox.TextColors.background = "white"; + view.Mode.BaseImage.url = StdDirs.findResource("buttonmaker", "default.png"); + loadImage(view.Mode.BaseImage.url); +} + +function loadImage(file) +{ + var img = new Image(this); + if (img.load(file) ) + { + bgimage = img.pixmap(); + updateUI(); + } +} diff --git a/kjsembed/docs/examples/buttonmaker/default.png b/kjsembed/docs/examples/buttonmaker/default.png Binary files differnew file mode 100644 index 00000000..6a113a17 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/default.png diff --git a/kjsembed/docs/examples/buttonmaker/gray.png b/kjsembed/docs/examples/buttonmaker/gray.png Binary files differnew file mode 100644 index 00000000..16dc6281 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/gray.png diff --git a/kjsembed/docs/examples/buttonmaker/package.sh b/kjsembed/docs/examples/buttonmaker/package.sh new file mode 100644 index 00000000..e8563b9a --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/package.sh @@ -0,0 +1,14 @@ +#!/bin/sh + +mkdir -p share/applnk/Scripts +mkdir -p share/apps/buttonmaker +mkdir -p share/apps/kjsembed + +RCSC="01.png 02.png 03.png 04.png 05.png 06.png 07.png 08.png 09.png default.png" + +cp buttonmaker.js $RCSC ButtonMakerUI.ui share/apps/buttonmaker +cp buttonmaker.desktop share/applnk/Scripts +cp kjsuic.js share/apps/kjsembed + +shar -M -z -X share > buttonmaker.sh +rm -rf share diff --git a/kjsembed/docs/examples/buttonmaker/pillbox.js b/kjsembed/docs/examples/buttonmaker/pillbox.js new file mode 100755 index 00000000..25c50ae1 --- /dev/null +++ b/kjsembed/docs/examples/buttonmaker/pillbox.js @@ -0,0 +1,172 @@ +#!/usr/bin/env kjscmd + +function BaseImage() +{ + this.a = new Image(this); + this.b = new Image(this); + this.c = new Image(this); + this.d = new Image(this); + this.e = new Image(this); + this.f = new Image(this); + this.g = new Image(this); + this.h = new Image(this); + this.i = new Image(this); + + this.height = function() { + return this.a.height() + this.d.height() + this.g.height(); + } + + this.width = function() { + return this.a.width() + this.b.width() + this.c.width(); + } + + this.loadImages = function() { + return ( + this.a.load("01.png") && + this.b.load("02.png") && + this.c.load("03.png") && + this.d.load("04.png") && + this.e.load("05.png") && + this.f.load("06.png") && + this.g.load("07.png") && + this.h.load("08.png") && + this.i.load("09.png") ); + } + + this.colorize = function( color ) { + var percent = 0.55; + var imgfx = new ImageFX(); + + this.a = imgfx.blendColor( color, this.a, percent); + this.b = imgfx.blendColor( color, this.b, percent); + this.c = imgfx.blendColor( color, this.c, percent); + this.d = imgfx.blendColor( color, this.d, percent); + this.e = imgfx.blendColor( color, this.e, percent); + this.f = imgfx.blendColor( color, this.f, percent); + this.g = imgfx.blendColor( color, this.g, percent); + this.h = imgfx.blendColor( color, this.h, percent); + this.i = imgfx.blendColor( color, this.i, percent); + } + + this.resize = function( newW, newH ) { + + this.b.smoothScale( newW - ( this.a.width() + this.c.width() ), this.b.height() ); + this.h.smoothScale( newW - ( this.g.width() + this.i.width() ), this.h.height() ); + + this.d.smoothScale( this.d.width(), newH - ( this.a.height() + this.g.height() ) ); + this.f.smoothScale( this.f.width(), newH - ( this.c.height() + this.i.height() ) ); + + this.e.smoothScale( newW - ( this.a.width() + this.c.width() ), + newH - ( this.c.height() + this.i.height() ) ); + } + + this.test = function( parent ) { + var box = new QHBox(parent); + var vbox1 = new QVBox(box); + var vbox2 = new QVBox(box); + var vbox3 = new QVBox(box); + var l1 = new QLabel(vbox1); + l1.pixmap = this.a.pixmap(); + + var l2 = new QLabel(vbox1); + l2.pixmap = this.d.pixmap(); + + var l3 = new QLabel(vbox1); + l3.pixmap = this.g.pixmap(); + + var l4 = new QLabel(vbox2); + l4.pixmap = this.b.pixmap(); + + var l5 = new QLabel(vbox2); + l5.pixmap = this.e.pixmap(); + + var l6 = new QLabel(vbox2); + l6.pixmap = this.h.pixmap(); + + var l7 = new QLabel(vbox3); + l7.pixmap = this.c.pixmap(); + + var l8 = new QLabel(vbox3); + l8.pixmap = this.f.pixmap(); + + var l9 = new QLabel(vbox3); + l9.pixmap = this.i.pixmap(); + } + + this.pixmap = function(width, height){ + var pix = new Pixmap(this); + pix.resize(width,height); + pix.fill("white"); + var painter = new Painter(this); + if( painter.begin(pix) ) + { + this.paint(painter); + if( painter.end() ) + return painter.pixmap(); + } + return pix; + } + + this.paint = function(painter){ + + painter.drawRect(0,0,this.width(), this.height()); + + painter.drawImage(0, 0, this.a, 0, 0, -1, -1, 0); + painter.drawImage(0, this.a.height(), this.d, 0, 0, -1, -1, 0); + painter.drawImage(0, ( this.height() - this.g.height() ) ,this.g, 0, 0, -1, -1, 0); + + painter.drawImage(this.a.width(), 0, this.b, 0, 0, -1, -1, 0); + painter.drawImage(this.d.width(), this.b.height(), this.e, 0, 0, -1, -1, 0); + painter.drawImage(this.g.width(), ( this.height() - this.h.height() ) ,this.h, 0, 0, -1, -1, 0); + + painter.drawImage(this.a.width() + this.b.width(), 0, this.c, 0, 0, -1, -1, 0); + painter.drawImage(this.d.width() + this.e.width(), this.c.height(), this.f, 0, 0, -1, -1, 0); + painter.drawImage(this.g.width() + this.h.width(), ( this.height() - this.i.height() ) ,this.i, 0, 0, -1, -1, 0); + } + + this.widget = function(canvas) { + var painter = new Painter(this); + if( painter.begin(canvas) ) + { + this.paint(painter); + if( painter.end() ) + return true; + } + return false; + } +} + + +var base = new BaseImage(); +var label = new QLabel(this); + + +if ( !base.loadImages() ) + alert("Error Loading Resources!"); + +base.colorize("blue"); +var H = 128; +var W = 128; + +base.resize(W,H); + +var box = new QHBox(this); +var label = new QLabel(box); +label.resize(W,H); +label.paintEvent = function(ev) +{ + println("paint..."); + base.widget(label); +} + +var label2 = new QLabel(box); +label2.pixmap = base.pixmap(W,H); + +base.test(box); + +box.show(); +box.resize(W*3, H) + +application.exec(); + +//img.load("cl.png"); img.blendColor( "blue", 0.20); img.smoothScale(16,128); lab.pixmap = img.pixmap |
