Mini Hackathons?

Posts: 2
Joined: Sat May 18, 2013 11:21 pm
Location: United States

Mini Hackathons?

Unread postby VerwandlungDie » Tue Dec 03, 2013 7:45 am

I am proposing a series of what could be called mini-hackathons,
or hacker-confrences. Specificly, these would be a topic of focus during regular hacker meetings
where interested persons could listen to a brief overview of topic, then explore the subject for 30 - 45 minutes
in an open ended challenge, and end by briefly sharing results, thoughts, and ideas on a subject.

I propose topics be entry level for all (or most),
but have the ability to be expounded upon by more advanced participants.
Example topics may include
*EEPROM reading / writing
*ftp/http server setup
*Linux usage / scripting
*interactive client / server security testing.
*An intro into stenography: hiding & retrieving messages in pictures, and other file types.
*fun with file systems, ie: data recovery, making OSes vomit, linked lists, write your own FS? look at different FSs?
*(whatever might be fun and interesting, i am open to suggestions)

Give 20 different people the same problem, and you will get 20 different solutions.
I am interested in how others solve problems, this can be both very interesting, and educational.
If there is interest, perhaps we could try this on thursday?


nanocluster.umeche.maine.edu/EEPROM_Snarfing.pptx

User avatar
Posts: 129
Joined: Mon Feb 04, 2013 6:40 pm
Location: Orono

Re: Mini Hackathons?

Unread postby Derrick » Wed Dec 11, 2013 12:00 am

Challenge for 12/10/2013

[18:58] <@dualhbridge> Mini-Hackathon Theme: CSS
[18:58] <@dualhbridge> Tools: any editor and any browser
[18:58] <@dualhbridge> Teams: several or solo; exclusive or transient
[18:58] <@dualhbridge> Time: 25 minutes
[18:58] <@dualhbridge> Challenge: MAKE IMAGES MOVE USING HTML AND CSS.
[18:58] <@dualhbridge> Create folder containing one HTML file, one CSS file, and one or more images. Images may be sprites, photos, and/or background regions, etc. When the HTML file is opened in a browser, the image(s) must move without requiring a page refresh.
[18:58] <@dualhbridge> Here is an example: http://csscience.com/responsiveslidercss3/
[18:59] <@dualhbridge> An implementation of this would be welcome. The HTML and CSS need not conform to any generally accepted standard, the demo simply must be functional. Bonuses if you demonstrate similar motion control using JavaScript in addition to CSS and HTML alone.
[18:59] <@dualhbridge> Informal demos following.
[18:59] <@dualhbridge> Prizes: Titles and Accolades
[18:59] <@dualhbridge> References:
[18:59] <@dualhbridge> one HTML cheetsheet
[18:59] <@dualhbridge> http://www.webmonkey.com/2010/02/html_cheatsheet/
[18:59] <@dualhbridge> one popular CSS style guide http://make.wordpress.org/core/handbook ... dards/css/
-=Derrick=-

User avatar
Posts: 129
Joined: Mon Feb 04, 2013 6:40 pm
Location: Orono

Re: Mini Hackathons?

Unread postby Derrick » Wed Dec 11, 2013 12:24 am

style.css
Code: Select all
body {
}

a:hover{
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
    margin-left:80px;
}

index.html
Code: Select all
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Dagger</title>
    <link href="/style.css" rel="stylesheet"/>

</head>
<body>
    <a href="#"><img id ="dagger" src="imagesCA0GNPU3.jpg" /></a>

    <a href="http://google.com">Google</a>

</body>
</html>
Attachments
imagesCA0GNPU3.jpg
imagesCA0GNPU3.jpg (1.82 KiB) Viewed 1870 times
-=Derrick=-

Posts: 71
Joined: Wed May 22, 2013 12:16 pm
Location: Bangor

Re: Mini Hackathons?

Unread postby edburdo » Wed Dec 11, 2013 12:31 am

The CSS:

Bootlegged and copy/pasted from http://www.w3schools.com/css/css3_animations.asp

Image can be found here: http://i993.photobucket.com/albums/af54 ... hCat-1.png

Code: Select all

h1 { size: .8em; color: red; }

div {
width:233px;
height:216px;
background:red;
position:relative;
animation:myfirst 12s;
-webkit-animation:myfirst 12s; /* Safari and Chrome */
}

.flip-container {
   perspective: 1000;
}

/* flip the pane when hovered */
.flip-container:hover .flipper, .flip-container.hover .flipper {
   transform: rotateY(180deg);
   -webkit-transform:rotateY(180deg); /* Safari and Chrome */
}
/* flip speed goes here */
.flipper {
   transition: 0.6s;
   transform-style: preserve-3d;

   position: relative;
}
@keyframes myfirst
{
0%   {background: red; left:0px; top:0px;}
25%  {background: yellow; left:200px; top:0px;}
50%  {background: blue; left:200px; top:200px;}
75%  {background: green; left:0px; top:200px;}
100% {background: red; left:0px; top:0px;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{

0%   {background: red; left:0px; top:0px;}
25%  {background: yellow; left:200px; top:0px;}
50%  {background: blue; left:200px; top:200px;}
75%  {background: green; left:0px; top:200px;}
100% {background: red; left:0px; top:0px;}
}


The HTML

Code: Select all
<!DOCTYPE html>
<html lang="en-US">

<html>
<head>
<title>Challenge #1</title>
<link rel="stylesheet" type="text/css" href="style.css" /
</head>
<body>
<h1>Hello World</h1>
<p>Refresh the page for the animation to start.</p>
<p>Hover over the top-left of the image to flip it.</p>
<div class="flip-container">
<div class="flipper">
<img src="scratch.jpg" width="233" height="216" />
</div>
</div>

</body>
</html>

Posts: 1
Joined: Wed Dec 11, 2013 12:33 am

Re: Mini Hackathons?

Unread postby dpratt71 » Wed Dec 11, 2013 12:36 am

index.css
Code: Select all
    body
    {
    }

    .fancybox img {
        position: relative;
        border: 1px solid black;
        -moz-animation: mymove 3s ease-out forwards;
        -o-animation: mymove 3s ease-out forwards;
        -webkit-animation: mymove 3s;
        animation: mymove 3s ease-out forwards;
    }

    @-moz-keyframes mymove
    {
        from {left:-250px;}
        to {left:0px;}
    }

    @keyframes mymove
    {
        from {left:-250px;}
        to {left:0px;}
    }

    @-webkit-keyframes mymove /* Safari and Chrome */
    {
        from {left:-250px;}
        to {left:0px;}
    }


index.html
Code: Select all
    <!DOCTYPE html>

    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="Index.css" />
        <title>MHC Hackathon 2013</title>
    </head>
    <body>
        <ul>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130309_01.jpg">
                    <img title="9th Mar 2013:  First Hack Day: 1" src="http://www.hackmaine.org/Images/meetups/20130309_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130309_02.jpg">
                    <img title="9th Mar 2013:  First Hack Day: 2" src="http://www.hackmaine.org/Images/meetups/20130309_02t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130305_01.jpg">
                    <img title="5th Mar 2013:  Drawing stuff" src="http://www.hackmaine.org/Images/meetups/20130305_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130305_02.jpg">
                    <img title="5th Mar 2013:  Aaron does some plumbing" src="http://www.hackmaine.org/Images/meetups/20130305_02t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130205_01.jpg">
                    <img title="5th Feb 2013:  Collaborating at the Maine Discovery Museum" src="http://www.hackmaine.org/Images/meetups/20130205_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130205_02.jpg">
                    <img title="5th Feb 2013:  Checking out some exhibits" src="http://www.hackmaine.org/Images/meetups/20130205_02t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20130108_01.jpg">
                    <img title="8th Jan 2013:  Big group at Books-A-Million" src="http://www.hackmaine.org/Images/meetups/20130108_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20121002_01.jpg">
                    <img title="2nd Oct 2012:  Check out the nerd joy on @zacheryschiller" src="http://www.hackmaine.org/Images/meetups/20121002_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20121002_02.jpg">
                    <img title="2nd Oct 2012:  Join us for some hardware hacking." src="http://www.hackmaine.org/Images/meetups/20121002_02t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20120918_01.jpg">
                    <img title="18th Sep 2012:  Denis takes us through a “Electrical Circuits 101”" src="http://www.hackmaine.org/Images/meetups/20120918_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20120724_01.jpg">
                    <img title="24th Jul 2012:  Hacking Arduino via Sketch IDE." src="http://www.hackmaine.org/Images/meetups/20120724_01t.jpg" />
                </a>
            </li>
            <li>
                <a class="fancybox" rel="" href="http://www.hackmaine.org/Images/meetups/20120724_02.jpg">
                    <img title="24th Jul 2012:  Grokking memory corruption security exploits." src="http://www.hackmaine.org/Images/meetups/20120724_02t.jpg" />
                </a>
            </li>
        </ul>
    </body>
    </html>

Return to Mini-Hackathons

Who is online

Users browsing this forum: No registered users and 2 guests