mirror of
https://github.com/bendtherules/blog.git
synced 2026-08-18 13:41:55 +00:00
Blog raw files
This commit is contained in:
bendtherules
@@ -0,0 +1,6 @@
|
||||
window.onload=function(){
|
||||
var canvas = document.getElementById("canvas");
|
||||
ctx = canvas.getContext("2d");
|
||||
cW = canvas.width;
|
||||
cH = canvas.height;
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
body {
|
||||
min-height: 100vh;
|
||||
background-color: #008000;
|
||||
margin: 0;
|
||||
}
|
||||
.wrapper {
|
||||
background-color: #00f;
|
||||
}
|
||||
.primary {
|
||||
float: left;
|
||||
width: 80%;
|
||||
background-color: #ff0;
|
||||
min-height: 100px;
|
||||
}
|
||||
.primary img {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
}
|
||||
.secondary {
|
||||
float: right;
|
||||
width: 20%;
|
||||
background-color: #f00;
|
||||
min-height: 200px;
|
||||
}
|
||||
.secondary img {
|
||||
height: 500px;
|
||||
width: 100px;
|
||||
}
|
||||
.clearfix {
|
||||
clear: both;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1 @@
|
||||
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/><script src="trial_composite.js"></script><title>HTML</title><meta content="" name="description"/><meta content="abhas" name="author"/><link href="sample.css" rel="stylesheet"/><meta content="width=device-width; initial-scale=1.0" name="viewport"/><link href="/favicon.ico" rel="shortcut icon"/><link href="/apple-touch-icon.png" rel="apple-touch-icon"/></head><body><canvas height="400" id="canvas" style="border:2px solid black" width="400">Oh noes! Canvas not supported! #SadTuba</canvas></body></html>
|
||||
+714
@@ -0,0 +1,714 @@
|
||||
/* all the fluffs */
|
||||
|
||||
/* apply a natural box layout model to all elements */
|
||||
*, *:before, *:after {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* to add reset.css */
|
||||
|
||||
/* my css starts here */
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: local('Open Sans Light'), local('OpenSans-Light'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
|
||||
}
|
||||
|
||||
/*html,body{
|
||||
height: 100%;
|
||||
}*/ /* makes the height 100vh irrespective of content*/
|
||||
|
||||
|
||||
/*.sidebar-fake-active{
|
||||
position: fixed;
|
||||
top: 0%;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: white;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.nav-active{
|
||||
position: fixed;
|
||||
width: 50%;
|
||||
left: 25%;
|
||||
}
|
||||
*/
|
||||
body{
|
||||
margin: 0;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.body-container{
|
||||
overflow-x: hidden;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
/*background: -moz-linear-gradient(left, rgb(222,110,73), rgb(222,110,73) 16%,rgb(255, 226, 221) 16%, rgb(255, 226, 221) 80%,rgb(91, 89, 89) 80%,rgb(91, 89, 89));
|
||||
background: -webkit-gradient(linear, left top, rightright top, from(red), color-stop(.75, red), color-stop(.75, green));
|
||||
background: linear-gradient(left, red, blue 30%, green);*/
|
||||
|
||||
/* colorzilla code */
|
||||
|
||||
background: rgb(222,110,73); /* Old browsers */
|
||||
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
|
||||
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RlNmU0OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE2JSIgc3RvcC1jb2xvcj0iI2RlNmU0OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE2JSIgc3RvcC1jb2xvcj0iI2ZmZTJkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2ZmZTJkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iIzViNTk1OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
|
||||
/* w3c recommended moved up to cater for chrome's % error bug */
|
||||
background: linear-gradient(to right, rgb(222,110,73) 0%,rgb(222,110,73) 16.2%,rgb(255,226,221) 16%,rgb(255,226,221) 79.2%,rgb(91,89,89) 79.2%); /*W3C*/
|
||||
background: -moz-linear-gradient(left, rgb(222,110,73) 0%, rgb(222,110,73) 16%, rgb(255,226,221) 16%, rgb(255,226,221) 80%, rgb(91,89,89) 80%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgb(222,110,73)), color-stop(16.2%,rgb(222,110,73)), color-stop(16.2%,rgb(255,226,221)), color-stop(79.2%,rgb(255,226,221)), color-stop(79.2%,rgb(91,89,89))); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 16.2%,rgb(255,226,221) 16.2%,rgb(255,226,221) 79.2%,rgb(91,89,89) 79.2%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 16%,rgb(255,226,221) 16%,rgb(255,226,221) 80%,rgb(91,89,89) 80%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 16%,rgb(255,226,221) 16%,rgb(255,226,221) 80%,rgb(91,89,89) 80%); /* IE10+ */
|
||||
/* else w3c should be here */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#de6e49', endColorstr='#5b5959',GradientType=1 ); /* IE6-8 */
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: 400px){
|
||||
.body-container{
|
||||
background: rgb(255,226,221);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width:401px) and (max-width:550px){
|
||||
.body-container{
|
||||
background: linear-gradient(to right, rgb(222,110,73) 0%,rgb(222,110,73) 16%,rgb(255,226,221) 20%); /*W3C*/
|
||||
background: -moz-linear-gradient(left, rgb(222,110,73) 0%, rgb(222,110,73) 20%, rgb(255,226,221) 20%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgb(222,110,73)), color-stop(20%,rgb(222,110,73)), color-stop(20%,rgb(255,226,221))); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 20%,rgb(255,226,221) 20%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 20%,rgb(255,226,221) 20%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 20%,rgb(255,226,221) 20%); /* IE10+ */
|
||||
}
|
||||
}
|
||||
|
||||
.body-container-active {
|
||||
|
||||
background: linear-gradient(to right, rgb(222,110,73) 0%,rgb(222,110,73) 100%,rgb(255,226,221) 100%);
|
||||
background: -moz-linear-gradient(left, rgb(222,110,73) 0%, rgb(222,110,73) 100%, rgb(255,226,221) 100%);
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgb(222,110,73)), color-stop(100%,rgb(222,110,73)), color-stop(100%,rgb(255,226,221)));
|
||||
background: -webkit-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 100%,rgb(255,226,221) 100%);
|
||||
background: -o-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 100%,rgb(255,226,221) 100%);
|
||||
background: -ms-linear-gradient(left, rgb(222,110,73) 0%,rgb(222,110,73) 100%,rgb(255,226,221) 100%);
|
||||
|
||||
}
|
||||
|
||||
.container-primary{
|
||||
/* to set min and max width */
|
||||
float: left;
|
||||
width: 80%; /* 640/800 */
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
.container-primary .intro{
|
||||
width: 100%; /* 640/640 */
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
background-color: rgb(222,110,73);
|
||||
padding-bottom: 3%;
|
||||
color: rgb(222,186,187);
|
||||
}
|
||||
|
||||
.intro .logo{
|
||||
float: left;
|
||||
/* margin-left: 1.953125%; */
|
||||
width: 20.1325%; /* 130/640 */
|
||||
text-align: right;
|
||||
/*padding-top: 5%;*/
|
||||
color: rgb(255,214,255);
|
||||
}
|
||||
|
||||
.logo .logo-text{
|
||||
/*font-family: "open sans", sans-serif;
|
||||
font-weight:300;*/
|
||||
font-size: 1.5em;
|
||||
margin-right: 15%;
|
||||
border-right: .15em rgb(158,166,49) solid;
|
||||
padding-right: 2%;
|
||||
margin-top: 25%;
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.logo .logo-text{
|
||||
font-size: 2em;
|
||||
}
|
||||
}
|
||||
@media (max-width: 650px)/* and (min-width:400px)*/{
|
||||
.logo .logo-text{
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 450px){
|
||||
.logo .logo-text{
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
@media (max-width: 350px){
|
||||
.logo .logo-text{
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.logo-text p{
|
||||
margin: 0;
|
||||
}
|
||||
.intro .main-header{
|
||||
width:79.6875%; /* 510/640 (rest other than .logo) */
|
||||
float:left;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.intro .main-header{
|
||||
font-size: 1.3em;
|
||||
}
|
||||
}
|
||||
@media (max-width: 750px) {
|
||||
.intro .main-header{
|
||||
font-size: .8em;
|
||||
}
|
||||
|
||||
.header-navbar ul li{
|
||||
margin-right:5.725%;
|
||||
}
|
||||
}
|
||||
|
||||
/*@media (max-width: 449px) {
|
||||
.intro .main-header{
|
||||
font-size: .6em;
|
||||
}
|
||||
}*/
|
||||
|
||||
|
||||
.main-header .header-linkbar{
|
||||
/* float: right; */
|
||||
margin-right: 6.0784%; /* 31/510 */
|
||||
}
|
||||
.header-linkbar ul{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.header-linkbar ul li{
|
||||
float: right;
|
||||
display: block;
|
||||
list-style: none;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
margin-right: 2.745%;
|
||||
|
||||
}
|
||||
|
||||
.circle{
|
||||
border-radius: 50%;
|
||||
width: 2em;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
.circle p{
|
||||
padding: 50% 0;
|
||||
}
|
||||
/* todo: fix this squares and circles */
|
||||
.rounded-square{
|
||||
border-radius: 1em;
|
||||
/* height: 5.88235%;
|
||||
*/
|
||||
}
|
||||
.rounded-square p{
|
||||
padding: 1em 1em;
|
||||
}
|
||||
|
||||
.header-linkbar ul li p{
|
||||
|
||||
text-align: center;
|
||||
margin: -0.5em 0;
|
||||
width: 100%;
|
||||
line-height: 1em;
|
||||
|
||||
}
|
||||
|
||||
.main-header .header-divider{
|
||||
margin-left: 8.725%; /* 44.5/510 */
|
||||
margin-top: 4.215%; /* 21.5/510 */
|
||||
margin-bottom: 2.6235%; /* 13.38/510 */
|
||||
width: 78.8235%; /* 402/510 */
|
||||
height: 2px;
|
||||
background-color: rgb(222,135,114);
|
||||
}
|
||||
|
||||
.main-header .header-navbar{
|
||||
|
||||
}
|
||||
|
||||
.header-navbar ul{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.header-navbar ul li{
|
||||
float: left;
|
||||
display: block;
|
||||
list-style: none;
|
||||
padding: .7% 2.6470%;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
margin-right: 4.90196%; /* 25/510 */
|
||||
/* width: 50px; */
|
||||
|
||||
}
|
||||
|
||||
.header-navbar ul li:first-child{
|
||||
margin-left: 13%; /* 66.25/510 */
|
||||
}
|
||||
|
||||
@media (max-width: 750px) {
|
||||
|
||||
.header-navbar ul li:first-child{
|
||||
margin-left: 8%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 350px) {
|
||||
|
||||
.header-navbar ul li:first-child{
|
||||
margin-left: 4%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:400px){
|
||||
.header-navbar ul li{
|
||||
margin-right: 2.902%;
|
||||
}
|
||||
}
|
||||
.header-navbar ul li[id="currentPage"]{
|
||||
border-style: dashed;
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.container-primary .middle{
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:400;
|
||||
|
||||
position:relative; /* To position sidebar menu on slide in */
|
||||
}
|
||||
|
||||
.middle .sidebar-primary{
|
||||
float: left;
|
||||
width: 20%;
|
||||
background-color: rgb(222,110,73);
|
||||
}
|
||||
|
||||
@media(max-width: 400px){
|
||||
.middle .sidebar-primary{
|
||||
position: absolute;
|
||||
left: -17%;
|
||||
/*background-color: rgb(104, 73, 62);*/
|
||||
/*width: 100%;*/
|
||||
/*background-color: transparent;*/
|
||||
}
|
||||
}
|
||||
|
||||
.middle .sidebar-primary-active{
|
||||
left: 0;
|
||||
width: 95%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.sidebar-nav:hover .nav-contents, .sidebar-nav:focus .nav-contents, .sidebar-nav:hover .nav-headline, .sidebar-nav:focus .nav-headline{
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
.sidebar-nav{
|
||||
margin-top: 5%;
|
||||
margin-bottom: 10%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media(max-width: 400px){
|
||||
.sidebar-primary .sidebar-nav{
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-primary-active .sidebar-nav{
|
||||
margin-top: 15%;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.sidebar-nav .nav-headline{
|
||||
background-color: rgb(222,81,75);
|
||||
padding: .5em .5em;
|
||||
color: rgb(222, 186, 187);
|
||||
|
||||
font-size: 1.125em;
|
||||
border-bottom: .15em solid;
|
||||
border-color: rgb(204, 54, 48);
|
||||
}
|
||||
|
||||
.nav-headline p{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.sidebar-nav .nav-contents{
|
||||
background-color: rgb(26,163,130);
|
||||
padding: .25em .25em;
|
||||
margin: .5em 0;
|
||||
color: aquamarine;
|
||||
border-bottom: .15em solid;
|
||||
border-color: rgb(59, 124, 108);
|
||||
transition-duration: .25s;
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
}
|
||||
|
||||
/*@media (max-width:500px){
|
||||
.sidebar-nav .nav-contents{
|
||||
font-size: .8em;
|
||||
}
|
||||
.sidebar-nav .nav-headline{
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
font-size: 1em;
|
||||
}
|
||||
}*/
|
||||
|
||||
@media (min-width:1000px){
|
||||
|
||||
.sidebar-nav .nav-headline{
|
||||
font-size:1.25em;
|
||||
}
|
||||
.sidebar-nav .nav-contents{
|
||||
font-size: 1.125em;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-contents:hover{
|
||||
border-color: rgb(99, 207, 64);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.nav-contents p{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.nav-headline{
|
||||
transition-duration: .25s;
|
||||
}
|
||||
|
||||
.sidebar-primary .nav-headline, .sidebar-primary .nav-contents{
|
||||
|
||||
width: 105%;
|
||||
|
||||
-webkit-transform-origin: left top;
|
||||
-moz-transform-origin: left top;
|
||||
-ms-transform-origin: left top;
|
||||
-o-transform-origin: left top;
|
||||
transform-origin: left top;
|
||||
|
||||
-webkit-transform: rotate(25deg);
|
||||
-moz-transform: rotate(25deg);
|
||||
-ms-transform: rotate(25deg);
|
||||
-o-transform: rotate(25deg);
|
||||
transform: rotate(25deg);
|
||||
}
|
||||
|
||||
.sidebar-primary-active .nav-headline, .sidebar-primary-active .nav-contents{
|
||||
width: 70%;
|
||||
margin-left: 15%;
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.middle .posts{
|
||||
float: right;
|
||||
width: 80%;
|
||||
background-color: rgb(255,226,221);
|
||||
padding: 0 0;
|
||||
|
||||
}
|
||||
@media(max-width: 400px){
|
||||
.middle .posts{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.middle .posts-active{
|
||||
position: absolute;
|
||||
left: 95%;
|
||||
}
|
||||
|
||||
.middle .posts-active .post{
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.posts .post{
|
||||
width: 80%;
|
||||
margin: 8% auto;
|
||||
margin-bottom: 12%;
|
||||
|
||||
}
|
||||
|
||||
.post .post-headline{
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
border: .1em solid rgb(158,166,49);
|
||||
margin-bottom: .5em;
|
||||
padding: 2% 4%;
|
||||
text-align: center;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.post .post-contents{
|
||||
padding: 4%;
|
||||
border: .1em solid rgb(43,138,88);
|
||||
/*font-size: .9em;*/
|
||||
}
|
||||
|
||||
.post-contents .post-body{
|
||||
font-size: 1em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.post-contents .post-meta{
|
||||
font-size: 1.1em;
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
}
|
||||
|
||||
@media (min-width:1000px){
|
||||
.post-contents .post-body{
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.post-contents .post-meta{
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.post .post-headline{
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (max-width:650px) and (min-width:400px){
|
||||
.post-contents .post-body{
|
||||
font-size: .85em;
|
||||
}
|
||||
|
||||
.post-contents .post-meta{
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.post .post-headline{
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.posts .post{
|
||||
width: 85%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:399px) {
|
||||
.post-contents .post-body{
|
||||
font-size: .75em;
|
||||
}
|
||||
|
||||
.post-contents .post-meta{
|
||||
font-size: .8em;
|
||||
}
|
||||
|
||||
.post .post-headline{
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.posts .post{
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
.meta-date,.meta-tag{
|
||||
background-color: green;
|
||||
color: white;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
|
||||
.container-secondary{
|
||||
/* to set min and max width */
|
||||
float: right;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
background-color: rgb(91,89,89);
|
||||
|
||||
}
|
||||
|
||||
.container-secondary .sidebar-secondary{
|
||||
max-width: 80%;
|
||||
margin: 0 auto; /* 18.26/160 */
|
||||
color: rgb(189,187,186);
|
||||
|
||||
-webkit-transform-origin: top left;
|
||||
-moz-transform-origin: top left;
|
||||
-ms-transform-origin: top left;
|
||||
-o-transform-origin: top left;
|
||||
transform-origin: top left;
|
||||
|
||||
-webkit-transform: perspective(2500) rotateY(-20deg) rotateX(-1deg);
|
||||
-moz-transform: perspective(2500) rotateY(-20deg) rotateX(-1deg);
|
||||
-ms-transform: perspective(2500) rotateY(-20deg) rotateX(-1deg);
|
||||
-o-transform: perspective(2500) rotateY(-20deg) rotateX(-1deg);
|
||||
transform: perspective(2500) rotateY(-20deg) rotateX(-1deg);
|
||||
|
||||
-webkit-transition-duration: 1s;
|
||||
-moz-transition-duration: 1s;
|
||||
-ms-transition-duration: 1s;
|
||||
-o-transition-duration: 1s;
|
||||
transition-duration: 1s;
|
||||
}
|
||||
.container-secondary .sidebar-secondary:hover{
|
||||
-webkit-transform: rotate(0);
|
||||
-moz-transform: rotate(0);
|
||||
-ms-transform: rotate(0);
|
||||
-o-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
|
||||
.sidebar-secondary .selfie{
|
||||
|
||||
margin: 14.265% 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.selfie .selfie-img img{
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.selfie .selfie-text{
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
font-size: .8em; /* 1.2 at bigger and .6 at smaller */
|
||||
|
||||
text-align: right; /* at smaller or larger widths, set to center. */
|
||||
margin-top: .1em;
|
||||
border: 1px dashed;
|
||||
padding: .25em;
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.selfie .selfie-text{
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.selfie-text p{
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.container-secondary .extras{
|
||||
margin: 0.5em -0.5em;
|
||||
border: 1px solid;
|
||||
border-color: rgb(235,159,49);
|
||||
/* border-radius: 1em; */
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.extras .extra{
|
||||
padding: 1em 0;
|
||||
}
|
||||
|
||||
.extra .extra-headline{
|
||||
background-color: rgb(68,68,68);
|
||||
padding: 0.1em 0.1em;
|
||||
margin: 0 0;
|
||||
text-align: center;
|
||||
color: rgb(0,157,241);
|
||||
|
||||
font-size: 1em;
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.extra .extra-headline{
|
||||
font-size: 1.25em;
|
||||
}
|
||||
}
|
||||
|
||||
.extra-contents-container{
|
||||
/* -webkit-perspective: 200px;
|
||||
-webkit-transform-style: preserve-3d; */
|
||||
}
|
||||
|
||||
.extra .extra-contents{
|
||||
margin: 0.4em 0;
|
||||
padding: 0 0.25em;
|
||||
padding-left: .75em;
|
||||
text-align: right;
|
||||
|
||||
|
||||
font-size: 0.875em;
|
||||
|
||||
font-family: "open sans", sans-serif;
|
||||
font-weight:300;
|
||||
background-color: rgb(105,104,103);
|
||||
border-bottom: .3em solid transparent;
|
||||
transition-duration: .5s;
|
||||
}
|
||||
|
||||
@media (min-width: 700px) {
|
||||
.extra .extra-contents{
|
||||
margin-top: 0.7em;
|
||||
margin-bottom: 0.7em;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.extra .extra-contents:hover{
|
||||
color: rgb(240,240,240);
|
||||
/* -webkit-transform: rotateX(15deg); */
|
||||
border-bottom-color: rgb(58,58,58);
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.extra .extra-contents{
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.extra-contents p{
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
|
||||
.extra-contents p:hover{
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
@media (max-width:550px){
|
||||
.container-primary{
|
||||
width: 100%;
|
||||
}
|
||||
.container-secondary{
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
.clearfix{
|
||||
clear: both;
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><title>Second Code</title><meta content="width=device-width, initial-scale=1.0" name="viewport"/><link href="/favicon.ico" rel="shortcut icon"/><link href="/apple-touch-icon.png" rel="apple-touch-icon"/><link href="./index.css" rel="stylesheet"/><link href="./large.css" media="(min-width:1000px)" rel="stylesheet"/><link href="./small.css" media="(min-width:700px)" rel="stylesheet"/><script src="./sidebar.js" type="text/javascript">
|
||||
</script><!--[if gte IE 9]><style type="text/css"> .gradient { filter: none; } </style><![endif]--></head><body><div class="body-container gradient"><div class="container-primary"><div class="intro"><div class="logo"><div class="logo-text"><p>Second <br/>Code</p></div><div class="logo-img"></div></div><div class="main-header"><div class="header-linkbar"><ul class="horizontal-list"><li class="rounded-square"><p>rss feed</p></li><li class="circle"><p>t</p></li><li class="circle"><p>f</p></li><div class="clearfix"></div></ul></div><br/><div class="header-divider"></div><br/><div class="header-navbar"><ul><li>Home</li><li id="currentPage">Blog</li><li>Projects</li><li>Me</li><div class="clearfix"></div></ul></div></div><div class="clearfix"></div></div><div class="middle"><div class="sidebar-primary"><div class="sidebar-fake"></div><div class="sidebar-nav"><div class="nav-headline"><p>Main Tags</p></div><div class="nav-contents"><p>Python</p></div><div class="nav-contents"><p>Robotics</p></div><div class="nav-contents"><p>CSS</p></div></div><div class="clearfix"></div></div><div class="posts"><div class="post"><div class="post-headline">Lorem ipsum dolor sit amet</div><div class="post-contents"><div class="post-body"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit animi veniam esse et laborum repellat odio eos architecto ab deserunt adipisci totam sed rerum incidunt corporis aliquid aperiam debitis excepturi libero doloribus iure dolore error quod eum dolores minima explicabo sint minus magnam dignissimos blanditiis hic repellendus tempora! Voluptates eligendi doloribus sit cumque ratione quae delectus quam hic exercitationem ipsa voluptas fugit reiciendis vitae quidem nostrum fuga praesentium voluptatem odio facere iusto esse officiis accusantium at sint illum animi nesciunt adipisci nisi sunt quibusdam repellendus facilis totam laudantium modi vero repudiandae id. Enim laboriosam commodi iusto distinctio ipsa tempore dolorem.</p></div><div class="post-meta"><div class="post-date"><p>Posted on <span class="meta-date">23rd Dec, 2013</span></p></div><div class="post-tags"><p>Tagged <span class="meta-tag">intro</span></p></div></div></div></div><div class="post"></div></div><div class="clearfix"></div></div></div><div class="container-secondary"><div class="sidebar-secondary"><div class="selfie"><div class="selfie-img"><img src="file:///D:/Babu/picture004_edited.jpg"/></div><div class="selfie-text"><p>Hi, I'm Abhas. <br/>A uni student who happens to love coding.</p></div></div><div class="extras"><div class="extra"><div class="extra-headline"><p>You might like</p></div><div class="extra-contents-container"><div class="extra-contents"><p>The coolest post is all about peace</p></div></div><div class="extra-contents-container"><div class="extra-contents"><p>Google was down today</p></div></div><div class="extra-contents-container"><div class="extra-contents"><p>Google was never down today</p></div></div><div class="extra-contents-container"><div class="extra-contents"><p>This is my new blog</p></div></div><div class="extra-contents-container"><div class="extra-contents"><p>Google was down today</p></div></div></div></div></div></div><div class="clearfix"></div></div></body></html>
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<!DOCTYPE html><html lang="en"><head><title>HTML</title><link href="./demo.css" rel="stylesheet"/></head><body><div class="wrapper"><div class="primary"><img src="http://demo1.opentaps.org/images/products/small/gis_computer_glen_rolla.png"/></div><div class="secondary"><img src="http://demo1.opentaps.org/images/products/small/gis_computer_glen_rolla.png"/></div><div class="clearfix"></div></div></body></html>
|
||||
@@ -0,0 +1,6 @@
|
||||
#canvas {
|
||||
whatever: 1;
|
||||
}
|
||||
#asd {
|
||||
color: 1;
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
// whatever(a)
|
||||
// font-size lookup(abc)
|
||||
|
||||
#canvas
|
||||
abc=5
|
||||
whatever 1
|
||||
|
||||
a= (1 2 3 4)
|
||||
#asd
|
||||
color (a)[0]
|
||||
@@ -0,0 +1,41 @@
|
||||
window.onload = function() {
|
||||
|
||||
var ele_sidebar_primary = document.getElementsByClassName("sidebar-primary")[0];
|
||||
var ele_posts = document.getElementsByClassName("posts")[0];
|
||||
var ele_body_container = document.getElementsByClassName("body-container")[0];
|
||||
|
||||
function getWidth() {
|
||||
var w = window,
|
||||
d = document,
|
||||
e = d.documentElement,
|
||||
g = d.getElementsByTagName('body')[0],
|
||||
width = w.innerWidth || e.clientWidth || g.clientWidth;
|
||||
return width;
|
||||
}
|
||||
|
||||
function sidebar_expand() {
|
||||
|
||||
if (getWidth() <= 400) {
|
||||
ele_sidebar_primary.classList.add("sidebar-primary-active");
|
||||
ele_posts.classList.add("posts-active");
|
||||
ele_body_container.classList.add("body-container-active");
|
||||
}
|
||||
}
|
||||
|
||||
function sidebar_collapse() {
|
||||
ele_sidebar_primary_active = document.getElementsByClassName("sidebar-primary-active")[0];
|
||||
ele_posts_active = document.getElementsByClassName("posts-active")[0];
|
||||
ele_body_container_active = document.getElementsByClassName("body-container-active")[0];
|
||||
|
||||
if (ele_sidebar_primary_active && ele_posts_active) {
|
||||
|
||||
ele_sidebar_primary_active.classList.remove("sidebar-primary-active");
|
||||
ele_posts_active.classList.remove("posts-active");
|
||||
ele_body_container_active.classList.remove("body-container-active");
|
||||
}
|
||||
}
|
||||
|
||||
ele_sidebar_primary.onclick = sidebar_expand;
|
||||
ele_posts.onclick = sidebar_collapse;
|
||||
|
||||
};
|
||||
@@ -0,0 +1 @@
|
||||
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/><script src="trial_canvas.js"></script><title>HTML</title><meta content="" name="description"/><meta content="abhas" name="author"/><meta content="width=device-width; initial-scale=1.0" name="viewport"/><link href="/favicon.ico" rel="shortcut icon"/><link href="/apple-touch-icon.png" rel="apple-touch-icon"/></head><body><canvas height="320" id="canvas" style="border:2px solid black" width="680">Oh noes! Canvas not supported! #SadTuba</canvas></body></html>
|
||||
@@ -0,0 +1,121 @@
|
||||
window.onload=function(){
|
||||
score=0;
|
||||
var canvas = document.getElementById("canvas");
|
||||
ctx = canvas.getContext("2d");
|
||||
|
||||
var cW = canvas.width;
|
||||
var cH = canvas.height;
|
||||
objList=[];
|
||||
var canvasRect=canvas.getBoundingClientRect();
|
||||
//ctx.globalCompositeOperation ='copy';
|
||||
|
||||
|
||||
ball=function (startX,startY,radius,hspeed,vspeed,color)
|
||||
{
|
||||
this.x=startX;
|
||||
this.y=startY;
|
||||
this.radius=radius;
|
||||
this.hspeed=hspeed;
|
||||
this.vspeed=vspeed;
|
||||
this.color=color;
|
||||
objList.push(this);
|
||||
}
|
||||
ball.prototype.check_click=function(mouse_x,mouse_y)
|
||||
{
|
||||
console.log(mouse_x,this.x,mouse_y,this.y);
|
||||
if (Math.pow(mouse_x-canvasRect.left-this.x,2)+Math.pow(mouse_y-canvasRect.top-this.y,2)<Math.pow(this.radius,2))
|
||||
{
|
||||
this.self_clear();
|
||||
objList.splice(objList.indexOf(this),1);
|
||||
score++;
|
||||
}
|
||||
}
|
||||
ball.prototype.check_collision=function()
|
||||
{
|
||||
if ((this.x-this.radius<0)||(this.x+this.radius>cW))
|
||||
{
|
||||
this.hspeed=-this.hspeed;
|
||||
}
|
||||
if ((this.y-this.radius<0)||(this.y+this.radius>cH))
|
||||
{
|
||||
this.vspeed=-this.vspeed;
|
||||
}
|
||||
}
|
||||
ball.prototype.self_clear=function(){
|
||||
ctx.clearRect(this.draw_x-this.draw_radius,this.draw_y-this.draw_radius,this.draw_radius*2,this.draw_radius*2);
|
||||
}
|
||||
ball.prototype.self_draw=function(){
|
||||
ctx.fillStyle=this.color;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(this.draw_x,this.draw_y);
|
||||
ctx.arc(this.draw_x, this.draw_y, this.draw_radius, 0, 2*Math.PI, true);
|
||||
ctx.fill();
|
||||
}
|
||||
ball.prototype.update=function()
|
||||
{
|
||||
this.x+=this.hspeed;
|
||||
this.y+=this.vspeed;
|
||||
|
||||
var round=Math.round;
|
||||
this.draw_x=round(this.x)
|
||||
this.draw_y=round(this.y)
|
||||
this.draw_radius=round(this.radius)
|
||||
|
||||
this.check_collision();
|
||||
this.self_draw();
|
||||
}
|
||||
|
||||
ball.prototype.preUpdate=function()
|
||||
{
|
||||
|
||||
|
||||
this.self_clear();
|
||||
}
|
||||
|
||||
callClick=function(ele,ev){
|
||||
//console.log(ev);
|
||||
ele.check_click(ev.clientX,ev.clientY);
|
||||
}
|
||||
|
||||
totalClick=function(ev){
|
||||
console.log("Clicked");
|
||||
/*objList.forEach.call(this,callClick);*/
|
||||
for (var i=0,l=objList.length;i<l;i++)
|
||||
{
|
||||
callClick(objList[i],ev);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
callUpdate=function(ele){
|
||||
ele.update();
|
||||
}
|
||||
callPreUpdate=function(ele){
|
||||
ele.preUpdate();
|
||||
}
|
||||
|
||||
totalUpdate=function(){
|
||||
//ctx.clearRect(0,0,cW,cH);
|
||||
objList.forEach(callPreUpdate);
|
||||
objList.forEach(callUpdate);
|
||||
}
|
||||
|
||||
gameLoop=function(){
|
||||
window.requestAnimationFrame(gameLoop, 16);
|
||||
totalUpdate();
|
||||
}
|
||||
|
||||
canvas.onmousedown=totalClick
|
||||
|
||||
createBall(10);
|
||||
window.requestAnimationFrame(gameLoop, 16);
|
||||
}
|
||||
|
||||
function createBall(n){
|
||||
for(var c=0;c<n;c++)
|
||||
{
|
||||
a=new ball(100+Math.random()*200,100+Math.random()*200,25,Math.random()*4,Math.random()*4,"green");
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
window.onload=function(){
|
||||
var canvas = document.getElementById("canvas");
|
||||
x_drawn=0
|
||||
ctx = canvas.getContext("2d");
|
||||
cW = canvas.width;
|
||||
cH = canvas.height;
|
||||
ctx.fillStyle="violet";
|
||||
ctx.font="60px lato light";
|
||||
ctx.fillText("hello world",50,150);
|
||||
ctx.fillStyle="blue";
|
||||
ctx.globalCompositeOperation="source-atop";
|
||||
ctx.save()
|
||||
var step=1
|
||||
var x_middle=50+ctx.measureText("hello").width
|
||||
var w_last=ctx.measureText(" world").width
|
||||
var y_height=1;
|
||||
function drawUpdate(){
|
||||
if (step==1){
|
||||
ctx.fillRect(x_middle+x_drawn,0,1,200);
|
||||
x_drawn-=1;
|
||||
}
|
||||
else{
|
||||
|
||||
ctx.fillRect(x_middle+1,150,w_last,-y_height);
|
||||
y_height+=1;
|
||||
}
|
||||
|
||||
|
||||
if (x_middle+x_drawn<50){
|
||||
step=2
|
||||
}
|
||||
}
|
||||
|
||||
window.setInterval(drawUpdate, 8);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/><script src="trial_tree.js"></script><title>Crappy grass generator</title><meta content="" name="description"/><meta content="abhas" name="author"/><meta content="width=device-width; initial-scale=1.0" name="viewport"/><link href="/favicon.ico" rel="shortcut icon"/><link href="/apple-touch-icon.png" rel="apple-touch-icon"/></head><body><button id="generate" style="background-color: blueviolet; color: white;">Regenerate</button><br/><canvas height="450" id="canvas" style="border:2px solid black" width="680">Oh noes! Canvas not supported! #SadTuba</canvas></body></html>
|
||||
@@ -0,0 +1,137 @@
|
||||
var generate=function(){
|
||||
var canvas = document.getElementById("canvas");
|
||||
var ctx = canvas.getContext("2d");
|
||||
|
||||
var cW = canvas.width;
|
||||
var cH = canvas.height;
|
||||
var l=300+Math.random()*100;
|
||||
|
||||
ctx.clearRect(0,0,cW,cH);
|
||||
var a_main=(90+((get0or1()-0.5)*2)*Math.random()*20)/180*Math.PI;
|
||||
console.log(a_main*180/Math.PI);
|
||||
var a_chord=(get0or1()-.5)*2*(20+Math.random()*25)/180*Math.PI;
|
||||
var start=[300,400];
|
||||
console.log(start);
|
||||
|
||||
var l2=(l/2)/*-Math.random()*l/4);*/
|
||||
var p0,p1,p2;
|
||||
|
||||
function getCP(start,a_main,a_chord,l,l2)
|
||||
{
|
||||
var stop=[start[0]+l*Math.cos(a_main),start[1]-l*Math.sin(a_main)]
|
||||
var p0=[start[0]+l2/2*Math.cos(a_main+a_chord),start[1]-l2*Math.sin(a_main+a_chord)];
|
||||
var p1=[stop[0]-l2*Math.cos(a_main+a_chord),stop[1]+l2*Math.sin(a_main+a_chord)];
|
||||
var p2=stop;
|
||||
return [p0,p1,p2]
|
||||
}
|
||||
function getSlope(p0,p1,p2,p3,t)
|
||||
{
|
||||
var slope_y=3*Math.pow((1-t),2)*(p1[1]-p0[1])+6*(1-t)*t*(p2[1]-p1[1]+3*Math.pow(t,2)*(p3[1]-p2[1]))
|
||||
var slope_x=3*Math.pow((1-t),2)*(p1[0]-p0[0])+6*(1-t)*t*(p2[0]-p1[0]+3*Math.pow(t,2)*(p3[0]-p2[0]))
|
||||
return -Math.atan2(slope_y,slope_x)*180/Math.PI // in deg
|
||||
}
|
||||
|
||||
var tmp_p=getCP(start,a_main,a_chord,l,l2);
|
||||
p0=tmp_p[0]
|
||||
p1=tmp_p[1]
|
||||
p2=tmp_p[2]
|
||||
|
||||
function getPoint(c){
|
||||
// c -> 0 to 1
|
||||
function getCubic(a0,a1,a2,a3){
|
||||
return Math.pow(1-c,3)*a0+3*Math.pow(1-c,2)*c*a1+3*Math.pow(c,2)*(1-c)*a2+Math.pow(c,3)*a3;
|
||||
}
|
||||
return [getCubic(start[0],p0[0],p1[0],p2[0]),getCubic(start[1],p0[1],p1[1],p2[1])];
|
||||
}
|
||||
|
||||
function get0or1(){
|
||||
return Math.round(Math.random());
|
||||
}
|
||||
|
||||
function normalize (ang) {
|
||||
if (ang>180)
|
||||
ang=-(360-ang)
|
||||
return ang;
|
||||
}
|
||||
|
||||
function drawTestPoints(numb){
|
||||
var r_or_l;
|
||||
//var testPoints=[getPoint(1/4),getPoint(2/4),getPoint(3/4)];
|
||||
var testPoints=[]
|
||||
for(var count=0;count<numb;count++){
|
||||
testPoints.push(getPoint((count+1)/(numb+1)))
|
||||
}
|
||||
for (var count=0;count<testPoints.length;count++){
|
||||
var tp_start=[testPoints[count][0],testPoints[count][1]];
|
||||
ctx.moveTo(tp_start[0],tp_start[1]);
|
||||
var bin=get0or1();
|
||||
//var a_main=(bin*180+(-bin+.5)*2*(15+Math.random()*45))/180*Math.PI;
|
||||
var a_main=getSlope(start,p0,p1,p2,(count+1)/4)
|
||||
console.log("a_main ="+a_main)
|
||||
|
||||
if (a_main<=90){
|
||||
|
||||
var diff=20
|
||||
a_main-=(diff+Math.random()*(a_main-diff)/2)
|
||||
if (r_or_l==1){
|
||||
a_main=180-a_main
|
||||
r_or_l=2
|
||||
}
|
||||
else{
|
||||
r_or_l=1
|
||||
}
|
||||
}
|
||||
else{
|
||||
|
||||
if (a_main<=180){
|
||||
var diff=20
|
||||
a_main+=diff+Math.random()*(180-(a_main+diff))/2
|
||||
if (r_or_l==2){
|
||||
a_main=180-a_main
|
||||
r_or_l=1
|
||||
}
|
||||
else{
|
||||
r_or_l=2
|
||||
}
|
||||
}
|
||||
}
|
||||
a_main=normalize(a_main);
|
||||
if (a_main<=0 && Math.abs(a_main)<=90){
|
||||
console.log("got right");
|
||||
a_main=-a_main;
|
||||
}
|
||||
if (a_main<=0 && Math.abs(a_main)>90){
|
||||
console.log("got left");
|
||||
a_main=-a_main
|
||||
}
|
||||
a_main=a_main/180*Math.PI
|
||||
|
||||
var a_chord=(get0or1()*(30+Math.random()*15))/180*Math.PI;
|
||||
var l=80+Math.random()*50;
|
||||
var l2=l/2;
|
||||
var tmp_p=getCP(tp_start,a_main,a_chord,l,l2);
|
||||
var tp_p0=tmp_p[0];
|
||||
var tp_p1=tmp_p[1];
|
||||
var tp_p2=tmp_p[2];
|
||||
ctx.bezierCurveTo(tp_p0[0],tp_p0[1],tp_p1[0],tp_p1[1],tp_p2[0],tp_p2[1]);
|
||||
}
|
||||
}
|
||||
|
||||
ctx.strokeStyle="green";
|
||||
/*ctx.lineWidth=70;*/
|
||||
ctx.lineCap='round';
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(start[0],start[1]);
|
||||
ctx.bezierCurveTo(p0[0],p0[1],p1[0],p1[1],p2[0],p2[1]);
|
||||
/*console.log(ctx.isPointInPath(testPoint[0],testPoint[1]));*/
|
||||
drawTestPoints(5);
|
||||
ctx.stroke();
|
||||
|
||||
}
|
||||
|
||||
window.onload=function(){
|
||||
generate()
|
||||
var g_button=document.getElementById("generate")
|
||||
g_button.onclick=generate
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user