Fixed gear

Developer
Huan Nghiem
Size
13,039 Kb
Views
16,192
  1. Fixed gear Previews
  2. Fixed gear HTML Codes
  3. Fixed gear JS Codes

How do I make an fixed gear?

What is a fixed gear? How do you make a fixed gear? This script and codes were developed by Huan Nghiem on 16 September 2022, Friday.

Fixed gear Previews
IQ Test

Fixed gear - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Fixed gear</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel='stylesheet prefetch' href='http://fixedgearpro.com/wp-content/themes/xedap410/css/style/styles.css'>
</head>
<body> <body> <div id="Wrapper"> <div id="BicycleWrapper" style="background: url(//fixedgearpro.com/wp-content/themes/xedap410/css/images/bicycle.png) no-repeat;"> </div> <div id="ConfigWrapper"> <table style="width: 100%;" cellpadding="0" cellspacing="0"> <tbody> <tr> <td> Vành sau </td> <td> <ul id="RimRColorList"> </ul> </td> <td> Vành trước </td> <td> <ul id="RimFColorList"> </ul> </td> </tr> <tr> <td> Lốp sau </td> <td> <ul id="TyreRColorList"> </ul> </td> <td> Lốp trước </td> <td> <ul id="TyreFColorList"> </ul> </td> </tr> <tr> <td> Yên xe </td> <td> <ul id="SaddleColorList"> </ul> </td> <td> Xích </td> <td> <ul id="ChainColorList"> </ul> </td> </tr> <tr> <td> Khung </td> <td> <ul id="FrameColorList"> </ul> </td> <td> Đĩa </td> <td> <ul id="CrankColorList"> </ul> </td> </tr> <tr> <td> Tay lái </td> <td> <ul id="GripColorList"> </ul> </td> <td> Ghi đông </td> <td> <input type="radio" name="handlebar" value="riser" checked="checked" id="handlebar_riser"> <label for="handlebar_riser">Riser</label> <input type="radio" name="handlebar" value="bullhorn" id="handlebar_bullhorn"> <label for="handlebar_bullhorn">Bullhorn</label> </td> </tr> <tr> <td> Kích thước </td> <td> <input type="radio" name="size" value="490" id="size490" checked="checked"> <label for="size490">490mm</label> <input type="radio" name="size" value="530" id="size530"> <label for="size530">530mm</label> <input type="radio" name="size" value="560" id="size560"> <label for="size560">560mm</label> <input type="radio" name="size" value="590" id="size590"> <label for="size590">590mm</label> </td> <td> Nền </td> <td> <ul id="BackgroundList"> </ul> </td> </tr> <tr> </tr> <tr> <td> Yêu cầu khác </td> <td> <textarea rows="5" cols="35" style="width: 280px; height: 80px;" id="txtYeuCau"></textarea> </td> <td> <input type="button" value="Màu ngẫu nhiên" id="RandomColorTrigger"> </td> <td> <input type="button" value="Lưu ảnh và gửi yêu cầu" id="x" class="SaveDataTrigger" onclick="capture(); return false;"> </td> </tr> </tbody> </table> </div> </div>
</body> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js'></script>
<script src='http://fixedgearpro.com/wp-content/themes/xedap410/css/style/raphael-min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Fixed gear - Script Codes JS Codes

$(function () { //Before config--------------------------------------------------------------------------------------------------------------------------------- // Check querrystring function getUrlVars() { var vars = [], hash; var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); for (var i = 0; i < hashes.length; i++) { hash = hashes[i].split('='); vars.push(hash[0]); vars[hash[0]] = hash[1]; } return vars; } /* var qcurrentRimFColor = '#232223'; if (getUrlVars()["rimFColor"] != 'undefined') { qcurrentRimFColor = getUrlVars()["rimFColor"]; } var qcurrentTyreRColor = '#232223'; if (getUrlVars()["tyreRColor"] != 'undefined') { qcurrentTyreRColor = getUrlVars()["tyreRColor"]; } var qcurrentTyreFColor = '#232223'; if (getUrlVars()["tyreFColor"] != 'undefined') { qcurrentTyreFColor = getUrlVars()["tyreFColor"]; } var qcurrentSaddleColor = '#232223'; // if (getUrlVars()["saddleColor"] != 'undefined') { // qcurrentSaddleColor = getUrlVars()["saddleColor"]; // } var qcurrentChainColor = '#232223'; if (getUrlVars()["chainColor"] != 'undefined') { qcurrentChainColor = getUrlVars()["chainColor"]; } var qcurrentFrameColor = '#E91E1B'; if (getUrlVars()["frameColor"] != 'undefined') { qcurrentFrameColor = getUrlVars()["frameColor"]; } var qcurrentGripColor = '#232223'; if (getUrlVars()["gripColor"] != 'undefined') { qcurrentGripColor = getUrlVars()["gripColor"]; } var qcurrentCrankColor = '#E8E9E6'; if (getUrlVars()["crankColor"] != 'undefined') { qcurrentCrankColor = getUrlVars()["crankColor"]; } */ //End Init //Config // var bicycleConfigs = { // rimRColor: ['#232223', '#FDFDFD', '#FBD348', '#86B2DA', '#E488B5', '#E91E1B', '#FFB000'], // rimFColor: ['#232223', '#FDFDFD', '#C1C74A', '#FBD348', '#86B2DA', '#E488B5', '#E91E1B', '#FFB000'], // tyreRColor: ['#232223', '#FDFDFD', '#F85B02', '#E7D41A', '#E488B5', '#E91E1B', '#DB0BDA', '#002F96'], // tyreFColor: ['#232223', '#FDFDFD', '#F85B02', '#E7D41A', '#E488B5', '#E91E1B', '#DB0BDA', '#002F96'], // saddleColor: ['#232223', '#FDFDFD', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#DB0BDA'], // chainColor: ['#232223', '#FDFDFD', '#9EC434', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#DB0BDA'], // frameColor: ['#232223', '#FDFDFD', '#9EC434', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#D2D399'], // gripColor: ['#232223', '#FDFDFD', '#9EC434', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#DB0BDA'], // crankColor: ['#232223', '#E8E9E6'], // currentRimRColor: qcurrentRimRColor, // currentRimFColor: qcurrentRimRColor, // currentTyreRColor: qcurrentTyreRColor, // currentTyreFColor: qcurrentTyreFColor, // currentSaddleColor: qcurrentSaddleColor, // // currentSaddleColor: '#232223', // currentChainColor: qcurrentChainColor, // currentFrameColor: qcurrentFrameColor, // currentGripColor: qcurrentGripColor, // currentCrankColor: qcurrentCrankColor, // background: ['Images/bicycle.png', 'Images/bicycle2.png', 'Images/bicycle3.png', 'Images/bicycle4.png', 'Images/bicycle5.png'] // } function qs(key) { var vars = [], hash; var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); for (var i = 0; i < hashes.length; i++) { hash = hashes[i].split('='); vars.push(hash[0]); vars[hash[0]] = hash[1]; } return vars[key]; } //Vành sau var qcurrentRimRColor = '232223'; if (qs('rimRColor')) { qcurrentRimRColor = qs('rimRColor'); } // Vành trước var qcurrentRimFColor = '232223'; if (qs('rimFColor')) { qcurrentRimFColor = qs('rimFColor'); } // Lốp sau var qcurrentTyreRColor = '232223'; if (qs('tyreRColor')) { qcurrentTyreRColor = qs('tyreRColor'); } //Lốp trước var qcurrentTyreFColor = '232223'; if (qs('tyreFColor')) { qcurrentTyreFColor = qs('tyreFColor'); } //Yên xe var qcurrentSaddleColor = '232223'; if (qs('saddleColor')) { qcurrentSaddleColor = qs('saddleColor'); } //Xích var qcurrentChainColor = 'FDFDFD'; if (qs('chainColor')) { qcurrentChainColor = qs('chainColor'); } //Khung xe - miss here.... var qcurrentFrameColor = 'E91E1B'; if (qs('frameColor')) { qcurrentFrameColor = qs('frameColor'); } //Tay lái var qcurrentGripColor = '232223'; if (qs('gripColor')) { qcurrentGripColor = qs('gripColor'); } //Pedal var qcurrentCrankColor = 'E8E9E6'; if (qs('crankColor')) { qcurrentCrankColor = qs('crankColor'); } var bicycleConfigs = { rimRColor: ['#232223', '#FDFDFD', '#FBD348', '#86B2DA', '#E488B5', '#E91E1B', '#FFB000'], rimFColor: ['#232223', '#FDFDFD', '#C1C74A', '#FBD348', '#86B2DA', '#E488B5', '#E91E1B', '#FFB000'], tyreRColor: ['#232223', '#FDFDFD', '#F85B02', '#E7D41A', '#E488B5', '#E91E1B', '#DB0BDA', '#002F96'], tyreFColor: ['#232223', '#FDFDFD', '#F85B02', '#E7D41A', '#E488B5', '#E91E1B', '#DB0BDA', '#002F96'], saddleColor: ['#232223', '#FDFDFD', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#DB0BDA'], chainColor: ['#232223', '#FDFDFD', '#9EC434', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#DB0BDA'], frameColor: ['#232223', '#FDFDFD', '#9EC434', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#D2D399'], gripColor: ['#232223', '#FDFDFD', '#9EC434', '#F85B02', '#E7D41A', '#86B2DA', '#E488B5', '#E91E1B', '#DB0BDA'], crankColor: ['#232223', '#E8E9E6'], currentRimRColor: '#' + qcurrentRimRColor, currentRimFColor: '#' + qcurrentRimFColor, currentTyreRColor: '#' + qcurrentTyreRColor, currentTyreFColor: '#' + qcurrentTyreFColor, currentSaddleColor: '#' + qcurrentSaddleColor, currentChainColor: '#' + qcurrentChainColor, currentFrameColor: '#' + qcurrentFrameColor, currentGripColor: '#' + qcurrentGripColor, currentCrankColor: '#' + qcurrentCrankColor, background: ['//fixedgearpro.com/images/bicycle.png', '//fixedgearpro.com/images/bicycle2.png', '//fixedgearpro.com/images/bicycle3.png', '//fixedgearpro.com/images/bicycle4.png', '//fixedgearpro.com/images/bicycle5.png'] } //bind backgroud var backgroundHtml = ''; $.each(bicycleConfigs.background, function (i, item) { backgroundHtml += '<li><img src="' + item + '"/></li>'; }); $('#BackgroundList').append(backgroundHtml); $('#BackgroundList li:first').addClass('selected'); $('#BackgroundList li').click(function () { $('#BicycleWrapper').css('background-image', 'url("' + $(this).find('img').attr('src') + '")'); }); function BindColor(colorArrays, selectedColor, selectorId) { if (typeof (selectorId) == "string") { selectorId = $('#' + selectorId.replace('#', '')); } $.each(colorArrays, function (i, item) { if (item == selectedColor) { selectorId.append('<li style="background:' + item + '" data-color="' + item + '" class="selected">' + item + '</li>'); } else { selectorId.append('<li style="background:' + item + '" data-color="' + item + '">' + item + '</li>'); } }); $('#ConfigWrapper li').click(function () { $(this).parents('ul:first').find('li').removeClass('selected'); $(this).addClass('selected'); }); } function GetNextColor(selectorId) { selectorId = selectorId.replace('#', ''); var index = parseInt($('#' + selectorId + ' li').index($('#' + selectorId + ' li.selected'))); var length = $('#' + selectorId + ' li').length; $('#' + selectorId + ' li').removeClass('selected'); if (index == length - 1) { $('#' + selectorId + ' li:eq(0)').addClass('selected'); } else { $('#' + selectorId + ' li:eq(' + (index + 1) + ')').addClass('selected'); } return $('#' + selectorId + ' li.selected').data('color'); } //draw----------------------------------------------------------------------------------------------------------------------------------- var paper = Raphael("BicycleWrapper", 800, 500); //ma trong lop sau// BindColor(bicycleConfigs.rimRColor, bicycleConfigs.currentRimRColor, 'RimRColorList'); var rimR = paper.circle(180, 315, 127); rimR.attr("stroke", bicycleConfigs.currentRimRColor); rimR.attr("stroke-width", 15); rimR.attr("cursor", "pointer"); $('#RimRColorList li').click(function () { rimR.attr('stroke', $(this).data('color')); }); rimR.click(function () { rimR.attr('stroke', GetNextColor('RimRColorList')); }); // lop sau// var tyreR = paper.circle(180, 315, 147); tyreR.attr("stroke", bicycleConfigs.currentTyreRColor); tyreR.attr("stroke-width", 15); BindColor(bicycleConfigs.tyreRColor, bicycleConfigs.currentTyreRColor, 'TyreRColorList'); tyreR.attr("stroke", bicycleConfigs.currentTyreRColor); tyreR.attr("cursor", "pointer"); tyreR.click(function () { tyreR.attr('stroke', GetNextColor('TyreRColorList')); }); $('#TyreRColorList li').click(function () { tyreR.attr('stroke', $(this).data('color')); }); //ma trong lop truoc// BindColor(bicycleConfigs.rimFColor, bicycleConfigs.currentRimFColor, 'RimFColorList'); var rimF = paper.circle(621, 315, 127); rimF.attr("stroke", bicycleConfigs.currentRimFColor); rimF.attr("cursor", "pointer"); rimF.attr("stroke-width", 15); $('#RimFColorList li').click(function () { rimF.attr('stroke', $(this).data('color')); }); rimF.click(function () { rimF.attr('stroke', GetNextColor('RimFColorList')); }); // lop truoc// var tyreF = paper.circle(621, 315, 147); // tyreF.attr("stroke", "black"); tyreF.attr("stroke", bicycleConfigs.currentTyreFColor); tyreF.attr("stroke-width", 15); BindColor(bicycleConfigs.tyreFColor, bicycleConfigs.currentTyreFColor, 'TyreFColorList'); tyreF.attr("stroke", bicycleConfigs.currentTyreFColor); tyreF.attr("cursor", "pointer"); tyreF.click(function () { tyreF.attr('stroke', GetNextColor('TyreFColorList')); }); $('#TyreFColorList li').click(function () { tyreF.attr('stroke', $(this).data('color')); }); //yen xe BindColor(bicycleConfigs.saddleColor, bicycleConfigs.currentSaddleColor, 'SaddleColorList'); var saddle = paper.path('M308.333,37c0,0,12.417-2.583,21.119-4.625c3.262-0.765,3.524-6.493-9.952-12.375h-28.833h-56.75c0,0-10.25,0.083-27.75-5.333c0,0-4,2-4.167,5.75s16.25,11.75,18.583,11.5c0,0,6.5,5.083,15.25,3.167l4.083,3.75h11.167c0,0,0-4.167,7.25-2c0,0,19.167-2.334,23.167-3.167s10.917-5.083,21-2.333l2.5,4.083L308.333,37z'); saddle.attr('fill', bicycleConfigs.currentSaddleColor).attr('stroke-width', 0); saddle.attr("cursor", "pointer"); saddle.click(function () { saddle.attr('fill', GetNextColor('SaddleColorList')); }); $('#SaddleColorList li').click(function () { saddle.attr('fill', $(this).data('color')); }); var saddleshadow = paper.path('M203.5,20c0,0,22.75,20,72,11'); saddleshadow.attr('stroke', '#f1f1f1').attr('opacity', 0.5).attr('stroke-width', 0.3); //xich BindColor(bicycleConfigs.chainColor, bicycleConfigs.currentChainColor, 'ChainColorList'); var chain = paper.set(); var chainbottom = paper.path('M157.875,323.758c0,0,0.402,4.492,3.514,4.492l1.486,1c0,0,0.852,3.75,4.926,2.875l1.496,0.875 c0,0,0.805,1.5,5.129,1.125c0,0,0.034,3.137,6.179,1.506c0,0-0.569,2.619,4.351,2.119l0.919,0.063c0,0,1.083,2.062,4.5,1.521 l0.375,0.091c0,0,1.167,2.492,5.417,1.534c0,0,1.125,2.626,5.333,1.459c0,0,0.625,3.166,5.167,1.666c0,0,1.666,3.792,5.833,2.417 l0.542,0.301c0,0,1.375,2.45,4.792,1.491l0.5-0.042c0,0,2.5,2.541,5.125,1.083l0.292,0.451c0,0,1.125,2.716,4.875,1.466l0.417,0.329 c0,0,1.916,2.629,4.708,1.004l0.333,0.125c0,0,1.542,2.624,5.333,1.583l0.333,0.244c0,0,1.125,3.131,5.833,1.673l0.208,0.125 c0,0,1.917,2.793,5.5,1.834c0,0,1.417,2.79,5.25,1.499c0,0,0.375,2.792,5.125,1.667c0,0,2.167,1.958,5.167,1.333 c0,0,2.708,3.167,4.833,1.542l0.667,0.208l0.542,0.256c0,0,2.875,2.62,5.875,1.453v0.3c0,0,0.292,2.575,5.625,1.533 c0,0,1.583,2.875,5.458,1.5c0,0,1.791,3.043,5.458,1.709l1.167,0.338c0,0,1.333,2.87,5.25,1.62c0,0,1.708,2.792,4.875,1.5l0.5,0.342 c0,0,0.917,2.325,4.542,1.283l0.208,0.269c0,0,1.458,2.731,5.667,1.606l0.417,0.041c0,0,0.375,2.209,4.667,1.334 c0,0,1.5,3.375,5.875,1.75c0,0,1.625,3.083,4.875,1.583c0,0,2.458,3.263,4.833,1.402l1.333-0.193c0,0,2.779,3.541,5.202,1.166 l0.756,0.084c0,0,2.542,2.791,5.083,0.333c0,0,2.083,1.89,4.792,0.341c0,0,2.917,2.466,5,0c0,0,2.792,2.367,4.667-0.758 c0,0,3.417,2.042,4.625-1.208l0.375-0.084c0,0,3.5,1.751,4.25-1.416l0.333-0.334c0,0,3.375,1.334,4.208-1.833l0.374-0.333 c0,0,3.294,1.333,4.127-2.25l0.333-0.292c0,0,3.708,0.166,3.625-2.875l0.001-0.208c0,0,3.582-0.166,2.874-3.208l0.093-0.5 l0.449-0.375c0,0,3.292-0.063,2.167-3.178l0.234-0.572c0,0,3.849-0.042,2.432-4.167c0,0,3.625-0.458,1.708-4.25l0.083-0.417 c0,0,3.541-1.166,0.833-4.416c0,0,2.75-1.293,1.5-2.959l-0.162-0.303l-0.707-0.037l-2.323,1.09l-1.309,2.5l-1.292,5l-1.917,4.208 l-2.25,2.959l-3.831,4.666l-4.211,3.75l-3.417,2.042l-4.75,2.833l-6.542,2.167l-10.208,1.292l-8.542-0.209l-1.405-0.333 c0,0-0.714-0.641-1.611-0.067l-1.442-0.225c0,0-1.917-2.625-3.958-0.375l-0.737-0.067l-0.311,0.361c0,0-0.677-0.832-0.411-1.293 c0,0-2.875-2.168-3.875-0.209l-0.5-0.324c0,0-2.167-3.596-4.708-0.842l-1.042-0.334c0,0-1.875-3.291-5.208-1.416 c0,0-2.583-4.168-5.167-1.334l-0.542-0.041c0,0-1.288-2.724-5.583-1.542c0,0-1.334-3.043-5-1.834c0,0-2.333-2.917-5.333-1.625 c0,0-0.042-2.416-4.75-1.541l-0.75-0.084c0,0-1.417-3.583-5.292-1.208l-0.708-0.25c0,0,0.084-3.691-5.292-2.083l-0.958-0.167 c0,0-1.292-2.708-4.417-1.333c0,0-1.25-2.959-5.625-1.792c0,0-1.584-2.834-6.042-1.792c0,0-1.417-3.124-5.042-1.749l-0.875,0.041 c0,0-0.542-2.916-4.167-1.208c0,0-2.042-3.375-5.708-1.667l-0.542-0.375c0,0-1.167-3.499-5.083-1.708l-0.833-0.125 c0,0-0.625-3.417-4.292-1.917l-0.75,0.084c0,0-2.458-2.875-4.958-1.167l-0.625-0.375c0,0-1.708-3.458-5.375-1.833l-0.667-0.167 c0,0-1.542-3.417-4.708-1.375l-0.625-0.125c0,0-0.875-3.083-4.833-1.375l-0.75-0.167c0,0-0.674-3.561-4.5-1.166l-0.917-0.459 c0,0-0.833-3.208-4.958-2.083l-0.958-0.208c0,0-0.875-3.001-4.083-1.084l-0.625,0.042c0,0-1.625-3.416-4.75-1.583l-0.958-0.25 c0,0-1.417-2.834-5.125-1.667l-0.708-0.125c0,0-1.208-3.251-4.208-1.417l-0.708-0.166c0,0-1.274-3.043-4.45-1.834l-0.727,0.167 c0,0-2.24-3.333-5.323-1.583c0,0-2.574-2.754-5.37-1.209c0,0-1.963-3.749-4.671-2.583l-0.5-0.125l-0.083-0.959L163,326.959v-0.917 l-0.75-0.083l-0.208-1l-0.917-0.875l-0.083-1h-1.958h-1.208V323.758z'); var chainlip = paper.path('M177.639,302.304L177.639,302.304c-0.032-0.021-4.147-2.679-6.389,0.315l-0.625,0.287 c0,0-2.5-3.281-4.875,1.219c0,0-4.348-0.625-4.361,3.375c0,0-5.139,1.512-4.139,6.318H160c0,0,4-2.943,3.375-4.318s1.5-0.5,1.5-0.5 s2.602-2.875,2.926-2c0,0,2.199-2.344,2.949-1.547l3.676-0.703l1.274,0.188L177.639,302.304z'); chain.push(chainbottom); chain.push(chainlip); var frame = paper.set(); var newframe = paper.path('M290.474,104.068l1.75,4.25c0,0-1,1.875,6.25,1.875s230.625-2.5,230.625-2.5s2.75,0.25,1.25-3.625 c15-5,15.875-5.25,15.875-5.25l17.375,57.375c0,0,1.75,0.25,3,1.125s1.625,8.375,1.625,8.375l1.5,4l33.875,86.875 c0,0,17.125,45.125,18.125,46.625s10.998,8.74,9.625,12c-2.953,7.01-6.258,7.26-12.883,3.727c-1.625-5.625-2.617-7.602-5.242-7.102 c-2.125,0.125-4.25-2.875,0.75-6c0.5-1.125,0-2.125-2.25-6.25s-21.25-44.75-26.75-56.75s-37.744-78.531-39-89 c-3.375-7.5-3.75-11.625-7.625-5.75c-6.5,7.875-138.203,155.885-157.703,176.885c-8.666,11.324-9.505,20.865-41.505,16.865 c-33.667-2-146.917-18.75-146.917-18.75s-0.583-1.916-7.416,2.25c-7.334,1-28,5.334-22.5-11.166c4.5-4.5,10.666-6.666,10.666-6.666 s3.666-1.834,8.5-12.168c5.667-10.166,48.667-85.5,48.667-85.5l51.167-89.334l1.5-2.166l2.666,11.5l-99,170.25 c0,0-3.375,5.875-4.625,7c0.5,4,4.125,9.375,8.5,9.875s158.875,14.25,158.875,14.25s2.75-1.25-1.75-11.125 c-4.679-10.27-4.645-10.33-61.5-188.916l11.5-5.334l8.5,26.668l53.5,169.332c0,0,1.667,10,8.834-3.666 c7.666-9.832,16.667-19.5,16.667-19.5l149.666-168.5c0,0,4.334-5.5-1.166-10l-237.12,2.635l-6.715-18.467L290.474,104.068z'); var frametop = paper.path('M287.978,136.866l11.326-4.954c0,0-6.177-20.787-8.25-28.625c-11.375,2.75-12.75,3.5-12.75,3.5 l4.25,11.5c0,0-0.263,0.19-4.451,7.503c-9.851,17.199,2.326,11.622,2.326,11.622l4.375-7.5 C284.804,129.912,285.051,127.745,287.978,136.866z'); var daioctop = paper.path('M544.371,93.66c0,0,3.059,2.355,1.6,4.998 c0,0-9.035,4.482-17.115,5.32c-1.441-2.096-1.76-4.191-0.801-5.16C534.934,97.529,538.48,96.42,544.371,93.66z'); var daiocbottom = paper.path('M560.105,144.579c0,0,3.088,1.93,1.721,4.621 c0,0-8.877,4.787-16.924,5.899c-1.512-2.046-1.902-4.129-0.977-5.129C550.756,148.447,552.848,147.191,560.105,144.579z'); var framehidden = paper.set(); var framehidden1 = paper.path('M297.833,326.501l-0.417,5l-50.5-7.167c0,0-32.25-6.583-38.417-7.5l-3.333-1.333v-1.25h1.5l0.75-0.834 l1.333-1.25h2.167h4.833c0,0,6,1.833,8.333,0.917c0,0,6.417,1.667,7.417,1.417c0,0,25.417,3.834,25.75,4.167 c0,0,34.75,5.083,40.583,7.083V326.501z'); var framehidden2 = paper.path('M205.719,310.094 205.719,311.656 204.813,311.656 204.813,312.688 202.188,312.688 201.281,312.688 201.188,312.167 200.75,311.781 200.219,311.75 200.219,311.188 201.219,310.875 201.219,310.094 z'); var framehidden3 = paper.path('M199.781,313.188 199.781,314.063 200.781,314.063 200.781,314.875 198.125,314.875 197.813,315.125 197.813,315.906 197.063,315.906 197.063,314.156 198.406,314.063 198.922,314 199.063,313.188 z'); var framehidden4 = paper.path('MM196.844,310.094v1.031h1v1.719c0,0-1-0.531-1,0s0,1,0,1h-0.656v-1.031l-1.156,0.031v-2.469v-0.281H196.844z '); framehidden.push(framehidden1); framehidden.push(framehidden2); framehidden.push(framehidden3); framehidden.push(framehidden4); frame.push(newframe); frame.push(frametop); frame.push(framehidden); BindColor(bicycleConfigs.frameColor, bicycleConfigs.currentFrameColor, 'FrameColorList'); frame.attr('fill', bicycleConfigs.currentFrameColor).attr('stroke-width', 0.3).attr('stroke', '#666').attr('cursor', 'pointer'); frame.click(function () { frame.attr('fill', GetNextColor('FrameColorList')); }); $('#FrameColorList li').click(function () { frame.attr('fill', $(this).data('color')); }); frametop.attr('stroke', 'none'); var frameshadow = paper.path('M289.833,123.5 289.907,123.728 336.167,266.667 337.667,269.667 299.208,143.5 292.208,122.417 291.208,122.25 290.333,122.25Z'); frameshadow.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.7); var frameshadow2 = paper.path('M542.25,100.25 555.75,145.5 553.25,145.5 539.5,100.25 Z'); frameshadow2.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.7); var frameshadow3 = paper.path('M563.75,171.25c0,0,33,85.25,35.5,87.75c0,0-16.75-49.75-33-87.75 C566.25,171.25,563.16,169.729,563.75,171.25z'); frameshadow3.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.7); var frameshadow4 = paper.path('M365.25,327.875c0,0,36.5-42.125,52.625-57.875s-50,56.75-51.375,59S364.647,328.569,365.25,327.875z'); frameshadow4.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.7); var frameshadow5 = paper.path('M180,302.167c0,0,47.834-81,49.167-82.833s-22.834,36.001-49.167,80V302.167z'); frameshadow5.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.7); var frameshadow6 = paper.path('M212,313.833c0,0,10.333,3,51,9.167C263,323,214.5,314.166,212,313.833z'); frameshadow6.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.7); framehidden.attr('stroke', 'none'); var frameshadowtop = paper.set(); var frameshadowtop1 = paper.path('M280,107.333l4,10c0,0,1.833,0.667,1.667-1S282,106.5,282,106.5L280,107.333z'); var frameshadowtop2 = paper.path('M284.667,106.5l3,7c0,0,1.167,0.298,1.167-1.518l-2.083-6.149L284.667,106.5z'); var frameshadowtop3 = paper.path('M287.833,117.465 285.75,120.5 287.833,121.167 289,117.465 z'); var frameshadowtop4 = paper.path('M284.677,121.167 284.677,123.833 285.75,123.833 286.333,121.167 z'); frameshadowtop.push(frameshadowtop1); frameshadowtop.push(frameshadowtop2); frameshadowtop.push(frameshadowtop3); frameshadowtop.push(frameshadowtop4); frameshadowtop.attr('fill', '#fff').attr('stroke', 'none').attr('opacity', 0.4); daioctop.attr('stroke', '#fff').attr('stroke-width', 0.5); daioctop.attr('fill', '#000'); daiocbottom.attr('stroke', '#fff').attr('stroke-width', 0.5); daiocbottom.attr('fill', '#000'); var trucsau = paper.circle(173.176, 317.107, 5.375); trucsau.attr('fill', '#444'); trucsau.attr('stroke', '#333'); trucsau.attr('stroke-width', 0.8); var trucsaulo = paper.circle(173.176, 317.107, 1.25); trucsaulo.attr('fill', '#000'); var trucsauthanhtruoc = paper.path('M181.568,317.107c0,0.779-0.238,1.41-0.531,1.41h-3.327c-0.293,0-0.531-0.631-0.531-1.41l0,0 c0-0.779,0.238-1.41,0.531-1.41h3.327C181.331,315.697,181.568,316.328,181.568,317.107L181.568,317.107z'); trucsauthanhtruoc.attr('fill', '#444'); trucsauthanhtruoc.attr('stroke-width', 0); var trucsauthanhsau = paper.path('M166.306,317.107c0,0.779,0.162,1.41,0.362,1.41h2.267c0.2,0,0.362-0.631,0.362-1.41l0,0 c0-0.779-0.162-1.41-0.362-1.41h-2.267C166.468,315.697,166.306,316.328,166.306,317.107L166.306,317.107z'); trucsauthanhsau.attr('fill', '#444'); trucsauthanhsau.attr('stroke-width', 0); var tructruoc = paper.circle(623.676, 315.857, 5.375); tructruoc.attr('fill', '#444'); tructruoc.attr('stroke', '#333'); tructruoc.attr('stroke-width', 0.8); var tructruoclo = paper.circle(613.128, 309.467, 1); tructruoclo.attr('stroke', '#666'); tructruoclo.attr('stroke-width', 1); //xich tren phai nam tren khung var chaintop = paper.path('M184.956,302.619l1.008-1.678c0,0,2.286-0.006,2.849,0.839h1c0,0,1.25-1.407,3.5,0h1.5 c0,0,2.938-2.095,5.688,0l0.375-0.046c0,0,2.688-1.766,5.063,0H207c0,0,2.438-2.203,4.563,0l0.313-0.047c0,0,3.563-2.938,5.188,0.25 h1.063c0,0,3.25-3.063,5.063,0h1.563c0,0,1.938-2.188,4.063,0l1.25-0.125c0,0,1.438-1.938,4.125,0.063h1.563 c0,0,1.938-2.188,4.438,0h1.625c0,0,1.625-1.813,4.063,0.063l1.5,0.063c0,0,2.75-1.875,4.188,0.063l1.375-0.125c0,0,2.188-2,4-0.063 l1.688,0.125c0,0,2.313-2.063,4.438-0.063l1.75-0.063c0,0,2.688-1.75,4.125,0L271,302c0,0,1.625-1.75,3.75,0l1.5-0.125 c0,0,2.125-2.125,3.688,0.063h1.125l0.563-0.063c0,0,2.863-2,4.244-0.063l2.068,0.188c0,0,2.563-1.938,4.125,0.063l1.875-0.063 c0,0,1.956-1.875,3.853,0h2.084c0,0,1.125-2.125,3.25-0.063h1.75c0,0,2.75-1.813,4.188,0h2.063c0,0,2.063-1.813,3.75-0.063 l1.938,0.125c0,0,1.563-1.688,3.438,0l1.25,0.619h1.188c0,0,2.063-2.807,4.281-0.369h0.868c0,0,1.789-1.938,3.851-0.125l1.938-0.063 h0.563c0,0,1.313-1.875,3.438-0.25l0.563,0.375l1.563,0.125c0,0,1.62-2.333,4.625-0.375c0,0,1.59-2.365,4.139-0.401h1.674 c0,0,2.189-2.266,4.313-0.339h1c0,0,2.313-2.656,4.25,0.323l0.563-0.157c0,0,2.625-2.426,4.375,0.699l0.688-0.063 c0,0,3.25-1.813,4,1.313l0.688,0.313c0,0,3.375-2.063,4.125,1.375l0.5,0.313c0,0,3.813-2.113,3.938,1.6l0.54,0.463 c0,0,3.772-1,3.397,2.25l0.387,0.375c0,0,4.676-0.688,3.488,2.938l0.193,0.375c0,0,4.182-0.688,3.057,2.563l0.192,0.875 c0,0,4.183,0.047,2.62,3.492c0,0.258,0.35,0.695,0.35,0.695s4.467-0.438,1.965,3.813v0.375c0,0,4.561,0.563,1.998,4.125l0.188,0.375 c0,0,4.691,1.339,0.938,4.313h0.5c0,0,3.661,1.5,0.956,4.313l0.044,0.5c0,0,2.639,1.617,1.625,2.688l-0.981,1.067l-2.621,0.188 l0.852-1.818l-2.688-2.313c0,0,1.125-5.875-0.375-6.75c0,0-4.563-10.375-7.125-12.25c0,0-13.563-12.789-19.625-12.65 c0,0-13.153-3.173-19.625-1.475l-1.678-0.413c0,0-0.539,1.407-2.243,0.316l-1.704,0.409c0,0-2.008,1.059-3.66,0.123l-1.277-0.373 c0,0-1,1.5-3.938,0.375h-1.688l-0.625-0.063c0,0-1.14,0.375-4.226-0.563l-0.961,0.313l-0.688,0.063c0,0-0.813,1.688-4.063-0.313 h-1.243c0,0-0.944,1.813-3.944,0l-1.596-0.188c0,0-1.779,1.75-4.591,0h-0.5c0,0-2.313,2.438-5.313,0h-1.5c0,0-1.375,1.875-4.438,0 h-0.938c0,0-1.5,1.688-4.188-0.125l-1.25,0.125l-0.5,0.063c0,0-2.313,1.625-5.063-0.063l-1.193,0.063c0,0-1.619,1.688-3.994-0.188 l-1.438,0.125c0,0-1.875,1.813-4.438-0.188l-1.375,0.125c0,0-1.688,1.875-4.438,0l-0.813,0.125c0,0-3.099,1.375-5.143-0.125 l-0.794,0.125l-0.313-0.063c0,0-2,1.688-4.063-0.063l-1.5-0.063c0,0-2.875,2.063-4.438,0.125L251.938,305c0,0-3.313,2-4.625,0.125 l-1.188-0.063c0,0-2.313,2-4.25,0.063L240.813,305c0,0-3.063,1.875-4.563,0.063h-1.563h-0.625c0,0-2.688,1.813-4.063-0.125 l-1.25-0.063c0,0-3.5,2.625-4.563,0.188h-1.5c0,0-2.313,1.813-4.688-0.125h-1.563c0,0-1.938,1.688-4.625,0.063l-0.625-0.5 c0,0-3.563,1.563-5-0.125c0,0-1,2.25-4.938-0.313l-0.75-0.125c0,0-1.563,1.938-4.938,0.125l-2.214,0.086L184.956,302.619z'); chain.push(chaintop); chain.attr('fill-rule', 'evenodd'); chain.attr('stroke-width', 0.3); chain.attr('stroke-linecap', 'butt'); chain.attr('stroke-linejoin', 'mitted'); chain.attr('fill', bicycleConfigs.currentChainColor).attr('stroke', '#000').attr('stroke-width', 0.2); chain.attr("cursor", "pointer"); chain.click(function () { chain.attr('fill', GetNextColor('ChainColorList')); }); $('#ChainColorList li').click(function () { chain.attr('fill', $(this).data('color')); }); //pedal var crank = paper.set(); var pedalrangcua = paper.path('M397.105,343.568c-0.01-1.225,1.863-1.92,2.977-2.063c-0.086-1.975-3.625-0.496-3.207-2.977 c0.418-1.264,2.168-1.193,2.521-2.52c-4.654-0.01-2.942-3.748-1.146-4.352c-1.168-1.434-2.968-0.07-3.436-1.832 c-0.388-1.461,1.361-1.916,1.832-2.979c-1.001-1.043-4.046,0.695-3.893-1.832c0.223-0.77,0.928-1.055,1.374-1.604 c-1.54,0.178,0.472-0.238,0.458-0.916c-0.955-1.021-4.244,1.238-4.123-1.604c0.032-0.883,0.93-0.902,1.146-1.604 c-0.394-0.088-0.589,0.342-0.687,0c0.11-1.01,1.195,0.373,0.915-0.914c-0.709-1.057-3.257,1.377-4.122-0.459 c-0.417-1.867,1.164-1.738,0.916-3.436c-1.25-0.637-1.857,1.139-3.664,0.688c-1.645-1.295,0.703-2.627,0-4.123 c-1.677,0.369-3.84,2.342-4.352-0.457c0.279-0.67,1.04-1.713,0.457-2.52c-1.542-0.018-1.615,1.438-2.977,1.602 c-2.291-0.377-0.516-3.008-1.375-4.121c-1.825,2.445-5.032,2.162-4.351-1.834c-1.94,1.738-4.711,3.645-4.58-1.373 c-1.931,0.123-1.231,2.215-2.749,2.291c-2.048,0.102-1.018-1.932-2.52-3.207c-1.316,0.971-0.903,2.857-2.519,2.748 c-1.753-0.119-0.697-2.355-2.52-2.977c-0.888,1.398-0.78,3.063-2.29,2.977c-1.651-0.092-0.821-2.195-2.52-2.748 c-1.043,0.865-0.112,3.705-2.52,3.207c-1.19-0.338-0.855-2.197-2.29-2.291c-0.977,0.932,0.212,4.029-2.29,3.436 c-1.14-0.389-1.008-2.045-2.52-2.063c-0.582,1.576,0.652,3.975-2.062,3.666c-0.97-0.404-0.954-1.795-2.29-1.832 c-0.512,1.529,0.684,4.037-1.604,4.121c-1.116-0.332-1.291-1.609-2.749-1.602c-0.652,0.938,0.35,1.846,0.458,2.746 c-0.369,0.625-0.547,1.439-1.604,1.377c-1.167-0.049-1.66-1.754-2.977-0.916c0.251,1.434,1.667,3.008,0,3.893 c-1.689,0.314-1.794-0.955-3.207-0.918c-0.812,1.496,1.225,1.934,0.688,3.895c-1.26,1.252-2.987-0.473-4.123,0 c-0.102,1.758,1.444,1.426,1.375,2.748c-0.149,2.838-2.619,0.316-4.123,1.834c0.588,0.861,1.571,1.33,1.832,2.52 c-0.222,1.984-2.5,0.912-3.894,1.373c0.312,1.467,3.333,2.92,0.916,4.352c-0.843,0.072-2.026-0.195-2.52,0.229 c0.299,1.932,2.694,1.523,2.062,3.436c-0.471,1.42-2.233,0.316-3.207,1.604c0.57,1.561,2.497,0.967,2.52,2.52 c0.029,1.893-2.186,0.906-3.207,2.52c1.097,1.129,2.98,0.76,2.978,2.291c-0.003,1.676-2.167,0.977-2.978,2.518 c1.39,1.15,3.448,0.641,3.207,2.521c-0.191,1.494-2.566,0.66-2.52,2.746c1.546,0.211,3.363,0.15,3.435,1.834 c-0.353,1.326-2.131,1.227-2.519,2.52c0.458,0.686,1.88,0.41,2.978,0.457c2.02,1.77-0.865,2.795-1.145,4.352 c1.415,0.471,3.935-0.703,3.894,1.604c-0.315,1.211-1.731,1.324-1.832,2.748c2.048,0.277,4.021-1.008,4.123,1.375 c0.051,1.207-1.578,1.061-1.375,2.748c1.009,0.445,3.241-1.426,4.123,0.229c0.362,1.813-1.063,1.838-0.917,3.436 c1.25,0.637,1.857-1.139,3.664-0.688c1.604,1.25-0.63,2.701,0,4.123c1.703-0.391,3.808-2.309,4.352,0.457 c-0.28,0.668-1.04,1.711-0.458,2.52c1.543,0.018,1.617-1.438,2.978-1.604c1.896,0.197,1.065,2.689,1.146,3.666 c0.111-0.271,0.245-0.52,0.458-0.688c0.191,0.648-0.32,0.596-0.229,1.145c1.867-2.404,5.007-2.188,4.352,1.832 c1.813-1.518,4.468-3.66,4.57,0.818c0.055-0.814,0.89,0.125,0.239,0.557c1.784-0.668,1.225-2.223,2.519-2.289 c1.941-0.1,1.762,2.711,2.291,3.205c1.87-1.164,1.139-2.857,2.748-2.748c1.69,0.111,1.588,3.346,2.521,2.977 c1.495-4.438,2.49-2.92,4.123-0.686c-0.392-0.537,0.731,0.316,0.687,0.457c1.068-0.84,0.092-3.727,2.52-3.205 c1.136,0.771,1.218,1.895,2.29,2.289c0.239-4.855,3.076-3.121,4.81-1.375c-0.576-4.656,2.631-3.811,4.351-1.832 c0.627-0.85-0.113-1.914,0-2.977c0.273-0.566,0.786-0.898,1.375-1.146c1.33,0.65,1.908,1.047,2.977,1.604 c0.652-0.938-0.35-1.848-0.457-2.746c0.888-2.83,3.295,0.07,4.58-0.461c-0.252-1.434-1.667-3.008,0-3.893 c1.868-0.096,2.338,1.012,3.436,0.688c0.096-1.623-1.323-1.73-0.916-3.664c1.438-0.979,2.686,0.018,4.122,0 c0.166-1.641-1.44-1.455-1.374-2.748c0.105-2.002,2.249-1.822,3.895-1.146c0.626-1.676-1.77-1.746-1.604-3.205 c0.219-1.941,2.735-1.186,3.893-1.375c0.029-1.633-1.715-1.275-1.832-2.518c-0.2-2.102,1.746-1.854,3.436-2.064 c-0.066-1.688-2.149-1.359-2.289-2.977c0.357-1.281,2.21-1.902,3.435-1.604c-0.093-2.344-2.698-1.201-2.521-3.205 c0.141-1.6,2.512-1.137,3.207-2.291C399,344.742,397.118,345.176,397.105,343.568z M357.712,376.955 c-18.443,0-33.394-14.949-33.394-33.393s14.951-33.395,33.394-33.395c18.442,0,33.394,14.951,33.394,33.395 S376.154,376.955,357.712,376.955z'); pedalrangcua.attr('fill', '#222'); crank.push(pedalrangcua); var pedaltron = paper.circle(357.834, 343.748, 36.98); crank.push(pedaltron); var pedaltronnho = paper.path('M357.834,313.584c-16.567,0-29.998,13.432-29.998,29.998c0,16.568,13.431,29.998,29.998,29.998 s29.998-13.43,29.998-29.998C387.832,327.016,374.402,313.584,357.834,313.584z M357.834,372.313 c-15.736,0-28.493-12.758-28.493-28.494s12.757-28.492,28.493-28.492s28.494,12.756,28.494,28.492S373.571,372.313,357.834,372.313z'); pedaltronnho.attr('fill', '#444'); crank.push(pedaltronnho); pedalnanhoa = paper.path('M337.813,312.652c0,0,2.694-2.436,6.194,2.127c3.441,4.484,6.653,14.652,6.653,14.652 s1.267,3.602,0.097,8.535c0,0,0.208,3.125-14.458,2.668c-9.292-2.084-8.167-2.08-13.841-7.684c0,0-2.574,8.881-1.14,16.65 c3.108-2.031,4.996-5.908,14.44-4.594c9.543,1.328,15.727,0.1,15.125,7.209c-0.667,7.875-9.195,17.088-9.195,17.088 s-4.025,3.211-7.45,2.918c6.335,4.184,5.878,5.625,17.965,7.537c-2.737-5.021-2.617-10.162,2.045-19.127 c3.586-6.934,5.857-9.803,12.433-5.141c6.575,4.662,12.047,10.93,13.537,15.1c-0.358,3.348,1.047,1.518,1.047,1.518 s6.133-3.758,9.24-11.289c-3.945,1.195-19.787-7.396-21.308-11.229c0.478-1.436,40.271,1,40.271,1s25.486-9.773,24.873-10.043 c-15.182-0.357-37.232,3.02-54.52,2.787c-25.27,0-4.341-14.498,6.896-16.41c4.303,0.598,4.198,0.275,4.198,0.275 s-5.595-8.709-10.854-13.012c-0.12,3.586-6.182,12.98-13.01,17.984c-7,4.355-10.917,3.293-14.715-17.564 c0-6.217-0.358-7.172,4.782-7.293c-5.14-1.793-16.681,2.832-19.191,4.984C335.413,314.451,337.813,312.652,337.813,312.652z'); pedalnanhoa.attr('fill', '#0B0909'); crank.push(pedalnanhoa); var pedalnanhoabe = paper.path('M409.465,350.592l5.01-0.594l3.307-3.121h23.052c0,0-3.657-5.613-6.495-6.328 S409.465,350.592,409.465,350.592z'); pedalnanhoabe.attr('fill', '#0B0909'); crank.push(pedalnanhoabe); var pedaltron1 = paper.circle(345.732, 372.91, 2.782); pedaltron1.attr('fill', '#ccc'); pedaltron1.attr('stroke', '#999'); crank.push(pedaltron1); var pedaltroncham1 = paper.circle(345.732, 372.91, 1.03); pedaltroncham1.attr('fill', '#666'); crank.push(pedaltroncham1); var pedaltron2 = paper.circle(325.939, 341.518, 2.782); pedaltron2.attr('fill', '#ccc'); pedaltron2.attr('stroke', '#999'); crank.push(pedaltron2); var pedaltroncham2 = paper.circle(325.939, 341.518, 1.03); pedaltroncham2.attr('fill', '#666'); crank.push(pedaltroncham2); var pedaltron3 = paper.circle(348.514, 314.109, 2.782); pedaltron3.attr('fill', '#ccc'); pedaltron3.attr('stroke', '#999'); crank.push(pedaltron3); var pedaltroncham3 = paper.circle(348.514, 314.109, 1.03); pedaltroncham3.attr('fill', '#666'); crank.push(pedaltroncham3); var pedaltron4 = paper.circle(381.92, 323.023, 2.782); pedaltron4.attr('fill', '#ccc'); pedaltron4.attr('stroke', '#999'); crank.push(pedaltron4); var pedaltroncham4 = paper.circle(381.92, 323.023, 1.03); pedaltroncham4.attr('fill', '#666'); crank.push(pedaltroncham4); var pedaltron5 = paper.circle(382.949, 364.332, 2.782); pedaltron5.attr('fill', '#ccc'); pedaltron5.attr('stroke', '#999'); crank.push(pedaltron5); var pedaltroncham5 = paper.circle(382.949, 364.332, 1.03); pedaltroncham5.attr('fill', '#666'); crank.push(pedaltroncham5); var pedaltrongiua = paper.circle(358.773, 343.336, 3.542); pedaltrongiua.attr('fill', '#ccc'); pedaltrongiua.attr('stroke', '#999'); crank.push(pedaltrongiua); var pedaltrongiuacham = paper.circle(358.773, 343.336, 1.267); pedaltrongiuacham.attr('fill', '#666'); crank.push(pedaltrongiuacham); //bind color BindColor(bicycleConfigs.crankColor, bicycleConfigs.currentCrankColor, 'CrankColorList'); pedalnanhoa.attr('fill', bicycleConfigs.currentCrankColor).attr('stroke', 'none'); pedalrangcua.attr('fill', bicycleConfigs.currentCrankColor).attr('stroke', 'none'); pedalnanhoabe.attr('fill', bicycleConfigs.currentCrankColor).attr('stroke', 'none'); pedaltron.attr('stroke', bicycleConfigs.currentCrankColor); pedaltronnho.attr('stroke', bicycleConfigs.currentCrankColor); var crankstrokeset = paper.set(); crankstrokeset.push(pedaltron); crankstrokeset.push(pedaltronnho); var crankcolorset = paper.set(); crankcolorset.push(pedalnanhoa); crankcolorset.push(pedalrangcua); crankcolorset.push(pedalnanhoabe); crank.click(function () { var color = GetNextColor('CrankColorList'); crankcolorset.attr('fill', color); crankstrokeset.attr('stroke', color); }); $('#CrankColorList li').click(function () { crankcolorset.attr('fill', $(this).data('color')); crankstrokeset.attr('stroke', $(this).data('color')); }); //tay lai var grip = paper.path('M564.333,65c0,0,13.667-10.833,0-17.333 c0,0-11.167-1.667-11.667,10.167c0,0-0.094,0.918,0.215,2.199c0.7,2.909,3.473,7.686,14.119,7.801c0,0,3.166-0.667,7.833-7 c0,0,7.167-8.333-1-15.333c0,0-8.333-8.833-18.833,1l-6,5.667c0,0-2.5,3.166-2,6.333l-3.334,2.833L552,60.167l0.626,0.042 c0,0,2.874,5.057,4.046,4.979C556.672,65.188,556.4,66.25,564.333,65z'); var gripdot = paper.path('M560.704,57.167c0,0,1.295,2,2.462,0S559.409,55.167,560.704,57.167z'); gripdot.attr('fill', '#ccc').attr('stroke', 'none').attr('opacity', 0.5); BindColor(bicycleConfigs.gripColor, bicycleConfigs.currentGripColor, 'GripColorList'); grip.attr('stroke', '#666').attr('stroke-width', 0.3); grip.attr('fill', bicycleConfigs.currentGripColor).attr('cursor', 'pointer'); grip.click(function () { grip.attr('fill', GetNextColor('GripColorList')); }); $('#GripColorList li').click(function () { grip.attr('fill', $(this).data('color')); }); function GetRandomColor(colorArrays, selectorId) { var index = Math.floor(Math.random() * colorArrays.length); var color = colorArrays[index]; selectorId = selectorId.replace('#', ''); var length = $('#' + selectorId + ' li').length; $('#' + selectorId + ' li').removeClass('selected'); $('#' + selectorId + ' li:eq(' + index + ')').addClass('selected'); return color; } $('#RandomColorTrigger').click(function () { rimR.attr('stroke', GetRandomColor(bicycleConfigs.rimRColor, 'RimRColorList')); rimF.attr('stroke', GetRandomColor(bicycleConfigs.rimFColor, 'RimFColorList')); tyreR.attr('stroke', GetRandomColor(bicycleConfigs.tyreRColor, 'TyreRColorList')); tyreF.attr('stroke', GetRandomColor(bicycleConfigs.tyreFColor, 'TyreFColorList')); saddle.attr('fill', GetRandomColor(bicycleConfigs.saddleColor, 'SaddleColorList')); chain.attr('fill', GetRandomColor(bicycleConfigs.chainColor, 'ChainColorList')); frame.attr('fill', GetRandomColor(bicycleConfigs.frameColor, 'FrameColorList')); var randomcolor = GetRandomColor(bicycleConfigs.crankColor, 'CrankColorList'); crankstrokeset.attr('stroke', randomcolor); crankcolorset.attr('fill', randomcolor); grip.attr('fill', GetRandomColor(bicycleConfigs.gripColor, 'GripColorList')); }); $('#SaveDataTrigger').click(function () { var saveData = { rimRColor: $('#RimRColorList li.selected').attr('data-color'), rimFColor: $('#RimFColorList li.selected').attr('data-color'), tyreRColor: $('#TyreRColorList li.selected').attr('data-color'), tyreFColor: $('#TyreFColorList li.selected').attr('data-color'), saddleColor: $('#SaddleColorList li.selected').attr('data-color'), chainColor: $('#ChainColorList li.selected').attr('data-color'), frameColor: $('#FrameColorList li.selected').attr('data-color'), crankColor: $('#CrankColorList li.selected').attr('data-color'), gripColor: $('#GripColorList li.selected').attr('data-color'), size: $('input[name="size"]').val(), handlebar: $('input[name="handlebar"]').val() }; alert(JSON.stringify(saveData)); });
});
Fixed gear - Script Codes
Fixed gear - Script Codes
Home Page Home
Developer Huan Nghiem
Username nightshade
Uploaded September 16, 2022
Rating 3
Size 13,039 Kb
Views 16,192
Do you need developer help for Fixed gear?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Huan Nghiem (nightshade) Script Codes
Name
A Pen by Huan Nghiem
Learn Flexbox
Patchnote
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!