vmario/doodle3d-client
0
0
Fork 0
mirror of https://github.com/Doodle3D/doodle3d-client.git synced 2024-11-22 09:17:56 +01:00
Code Issues Releases Wiki Activity

VerticalShapes toggle button

Browse Source
This commit is contained in:
peteruithoven 2014-01-13 15:52:40 +01:00
parent d156dc9902
commit ab329aaaf1
8 changed files with 35 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
img/btnArrowClose.xcf Normal file
View File

Binary file not shown.

BIN
img/btnArrowOpen.xcf Normal file
View File

Binary file not shown.

23
js/buttonbehaviors.js
View File

@ -1,7 +1,7 @@
var twistIncrement = Math.PI/1800;
var btnNew, btnPrevious, btnNext, btnOops, btnStop, btnInfo, btnRotate;
var btnSettings, btnWordArt, btnZoom, btnMove, btnUpDown, btnTwist, btnShape, btnEditClosed, btnEditOpen;
var btnSettings, btnWordArt, btnZoom, btnMove, btnUpDown, btnTwist, btnShape, btnEditClosed, btnEditOpen; btnToggleVerticalShapes;
var btnDiv,btnConv,btnStraight,btnSine, buttonGroupAdd, popupWordArt;
var state;
@ -41,7 +41,7 @@ function initButtonBehavior() {
btnConv = $("#btnConv");
btnSine = $("#btnSine");
btnAdd = $("#btnAdd");
btnToggleVertical = $("#btnToggleVertical");
btnToggleVerticalShapes = $("#btnToggleVerticalShapes");
buttonGroupAdd = $("#buttonGroupAdd");
buttonGroupVerticalShapes = $("#buttonGroupVerticalShapes");
popupWordArt = $("#popupWordArt");
@ -67,18 +67,29 @@ function initButtonBehavior() {
btnConv.on("onButtonClick", onBtnConv);
btnSine.on("onButtonClick", onBtnSine);
btnAdd.on("onButtonClick", onBtnAdd);
btnToggleVertical.on("onButtonClick", onBtnToggleVertical);
btnToggleVerticalShapes.on("onButtonClick", onBtnToggleVerticalShapes);
getSavedSketchStatus();
setSketchModified(false);
function onBtnToggleVertical() {
buttonGroupVerticalShapes.toggle();
function onBtnToggleVerticalShapes() {
console.log("onBtnToggleVerticalShapes");
var btnImg;
if(buttonGroupVerticalShapes.is(":hidden")) {
btnImg = "img/buttons/btnArrowClose.png";
} else {
btnImg = "img/buttons/btnArrowOpen.png";
}
btnToggleVerticalShapes.attr("src",btnImg);
buttonGroupVerticalShapes.fadeToggle(BUTTON_GROUP_SHOW_DURATION);
}
function onBtnAdd() {
buttonGroupAdd.fadeToggle(POPUP_SHOW_DURATION);
buttonGroupAdd.fadeToggle(BUTTON_GROUP_SHOW_DURATION);
}
function onBtnStraight() {

1
js/main.js
View File

@ -23,6 +23,7 @@ var showOrHide = false;
var clientInfo = {};
var POPUP_SHOW_DURATION = 175;
var BUTTON_GROUP_SHOW_DURATION = 80;
$(function() {
console.log("ready");

10
less/buttons.less
View File

@ -165,8 +165,8 @@
}
#buttonGroupVerticalShapes {
top: 10px;
left: 10px;
top: 7px;
left: 8px;
padding-top: 20px;
width: 65px;
@ -175,10 +175,10 @@
}
}
#btnToggleVertical {
#btnToggleVerticalShapes {
position: absolute;
top: 0;
left: 10px;
top: 3px;
left: 6px;
}

BIN
www/img/buttons/btnArrowClose.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
www/img/buttons/btnArrowOpen.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

13
www/index.html
View File

@ -105,7 +105,7 @@
<img id="btnSine" class="btn" src="img/buttons/btnSine.png" />
<img id="btnStraight" class="btn" src="img/buttons/btnStraight.png" />
</div>
<img id="btnToggleVertical" class="btn" src="img/buttons/btnArrowOpen.png" />
<img id="btnToggleVerticalShapes" class="btn" src="img/buttons/btnArrowClose.png" />
</div>
</div>
@ -114,6 +114,17 @@
<img id="btnEditClosed" class="btn" src="img/buttons/btnEditClosed.png" />
<img id="btnEditOpen" class="btn" src="img/buttons/btnEditOpen.png" />
<div id="buttonGroupVerticalShapes" class="buttonGroup">
<img id="btnTwistLeft" class="btn" src="img/buttons/btnTwistLeft.png" />
<img id="btnTwistRight" class="btn" src="img/buttons/btnTwistRight.png" />
<img id="btnUp" class="btn" src="img/buttons/btnUp.png" />
<img id="btnDown" class="btn" src="img/buttons/btnDown.png" />
<hr>
<img id="btnConv" class="btn" src="img/buttons/btnConv.png" />
<img id="btnDiv" class="btn" src="img/buttons/btnDiv.png" />
<img id="btnSine" class="btn" src="img/buttons/btnSine.png" />
<img id="btnStraight" class="btn" src="img/buttons/btnStraight.png" />
</div>
</div>
</div>