├── .gitignore ├── sass ├── core │ ├── _base.sass │ └── _typo.sass ├── helpers │ ├── _variables.sass │ └── _animations-keyframes.sass ├── parallel-park.sass └── components │ ├── _animations-steps.sass │ ├── _car-extends.sass │ ├── _park.sass │ ├── _lib-breadcrumbs.sass │ ├── _breadcrumbs-steps-animations.sass │ └── _car.sass ├── config.rb ├── README.md ├── index.html └── LICENSE /.gitignore: -------------------------------------------------------------------------------- 1 | css/* -------------------------------------------------------------------------------- /sass/core/_base.sass: -------------------------------------------------------------------------------- 1 | // Base 2 | // styles for html elements 3 | 4 | html 5 | padding: 20px 6 | background-color: #ecf0f1 7 | font-family: 'Lato', sans-serif 8 | 9 | main 10 | width: ($width-car + $margin-left-car) * 3 + 10px 11 | display: block 12 | background-color: hsl(0, 8%, 90%) 13 | min-height: 500px 14 | margin: 0 auto 15 | position: relative 16 | 17 | input 18 | display: none -------------------------------------------------------------------------------- /sass/helpers/_variables.sass: -------------------------------------------------------------------------------- 1 | // ------------------------------------------ | 2 | // Variáveis | 3 | // -------------------------------------------| 4 | 5 | $color-car: #b6bec3 6 | $color-car-blue: #3498db 7 | $color-car-red: #e74c3c 8 | $color-car-silver: silver 9 | $color-glasses: #495d65 10 | $height-car: 125px 11 | $width-car: 285px 12 | $margin-left-car: 40px 13 | $padding-park: 20px 14 | $margin-left-passo1: ($width-car + $margin-left-car) * 2 + $padding-park -------------------------------------------------------------------------------- /config.rb: -------------------------------------------------------------------------------- 1 | require 'compass/import-once/activate' 2 | # Require any additional compass plugins here. 3 | 4 | # Set this to the root of your project when deployed: 5 | http_path = "/" 6 | css_dir = "css" 7 | sass_dir = "sass" 8 | 9 | # You can select your preferred output style here (can be overridden via the command line): 10 | # output_style = :expanded or :nested or :compact or :compressed 11 | 12 | # To enable relative paths to assets via compass helper functions. Uncomment: 13 | # relative_assets = true 14 | 15 | # To disable debugging comments that display the original location of your selectors. Uncomment: 16 | # line_comments = false 17 | 18 | # If you prefer the indented syntax, you might want to regenerate this 19 | # project again passing --syntax sass, or you can uncomment this: 20 | # preferred_syntax = :sass 21 | # and then run: 22 | # sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass 23 | -------------------------------------------------------------------------------- /sass/parallel-park.sass: -------------------------------------------------------------------------------- 1 | // Welcome to the parallel park made with pure css and love 2 | 3 | // To compile this sass project use `compass compile` 4 | // To watch changes in the project use `compass watch` and feel free to edit the code as you want 5 | 6 | // First of all you'll need to import compass, if you don't have compass discover how to install it here: 7 | @import "compass" 8 | 9 | // Using helpers folder for variables and keyframes 10 | @import "helpers/variables" 11 | @import "helpers/animations-keyframes" 12 | 13 | // Core is for styling html tags 14 | @import "core/base" 15 | @import "core/typo" 16 | 17 | // Components is used for all components, like the car, park and some animations 18 | @import "components/lib-breadcrumbs" 19 | @import "components/animations-steps" 20 | @import "components/car-extends" 21 | @import "components/car" 22 | @import "components/park" 23 | @import "components/breadcrumbs-steps-animations" -------------------------------------------------------------------------------- /sass/helpers/_animations-keyframes.sass: -------------------------------------------------------------------------------- 1 | // Animations keyframes 2 | // Step by step animation keyframes 3 | 4 | // PASSO 1 - START 5 | @include keyframes(animacao-passo1) 6 | from 7 | left: 0 8 | to 9 | left: $margin-left-passo1 + 10px 10 | 11 | // PASSO 2 - STEP 2 12 | @include keyframes(animacao-passo2) 13 | from 14 | @include rotate(0) 15 | left: $margin-left-passo1 + 10px 16 | to 17 | @include transform-origin(top, left) 18 | @include rotate(.1turn) 19 | left: $margin-left-passo1 - 10px 20 | 21 | // PASSO 3 - STEP 3 22 | @include keyframes(animacao-passo3) 23 | from 24 | left: $margin-left-passo1 - 10px 25 | top: 0 26 | to 27 | left: 470px 28 | top: -183px 29 | 30 | // PASSO 4 - FINISH 31 | @include keyframes(animacao-passo4) 32 | from 33 | left: 470px 34 | top: -183px 35 | @include rotate(.1turn) 36 | to 37 | left: 345px 38 | top: -183px 39 | @include rotate(0deg) -------------------------------------------------------------------------------- /sass/components/_animations-steps.sass: -------------------------------------------------------------------------------- 1 | // Animation steps 2 | 3 | // Start 4 | .passo1:checked + .passo2:not(:checked) 5 | ~ .car 6 | @include animation(animacao-passo1 3s ease-in-out) 7 | 8 | .passo1:checked + .passo2 9 | ~ .car 10 | left: $margin-left-passo1 + 10px 11 | 12 | // Step 2 13 | .passo1:checked + .passo2:checked + .passo3:not(:checked) 14 | ~ .car 15 | @include animation(animacao-passo2 3s) 16 | 17 | .passo1:checked + .passo2:checked + .passo3 18 | ~ .car 19 | @include transform-origin(top, left) 20 | @include rotate(.1turn) 21 | left: $margin-left-passo1 - 10px 22 | 23 | 24 | // Step 3 25 | .passo1:checked + .passo2:checked + .passo3:checked 26 | ~ .car 27 | @include animation(animacao-passo3 3s ease-out) 28 | left: 470px 29 | top: -183px 30 | 31 | // Finish 32 | .passo2:checked + .passo3:checked 33 | + .passo4:checked ~ .car 34 | @include animation(animacao-passo4 3s) 35 | left: 345px 36 | top: -183px 37 | @include rotate(0deg) -------------------------------------------------------------------------------- /sass/components/_car-extends.sass: -------------------------------------------------------------------------------- 1 | // ------------------------------------------ | 2 | // Extends - placeholder | 3 | // Estilos comuns para elementos simétricos | 4 | // -------------------------------------------| 5 | 6 | // retrovisores 7 | %commons-retrovisor 8 | content: '' 9 | width: 12px 10 | height: 12px 11 | background-color: inherit 12 | right: 80px 13 | position: absolute 14 | 15 | // farois 16 | %commons-farol 17 | content: '' 18 | width: 20px 19 | height: 10px 20 | background-color: yellow 21 | position: absolute 22 | top: 70px 23 | @include border-radius(50%) 24 | 25 | // vidro laterais 26 | %commons-vidro-lateral 27 | content: '' 28 | display: block 29 | border-bottom: 10px solid $color-glasses 30 | border-left: 30px solid transparent 31 | border-right: 40px solid transparent 32 | height: 10px 33 | width: 130px 34 | position: absolute 35 | right: 52px 36 | 37 | // luzes de ré 38 | %commons-luz-de-re 39 | content: '' 40 | width: 23px 41 | height: 12px 42 | background-color: #D92626 43 | position: absolute 44 | bottom: -62px -------------------------------------------------------------------------------- /sass/components/_park.sass: -------------------------------------------------------------------------------- 1 | .park 2 | background-color: hsl(0, 8%, 85) 3 | padding: $padding-park 4 | position: relative 5 | border-top: 2px solid #fff 6 | @include box-shadow(0px -20px 0px #c4baba) 7 | margin-top: 50px 8 | &:before, 9 | &:after 10 | content: '' 11 | position: absolute 12 | height: 100% 13 | border-left: 2px dashed #fff 14 | width: 2px 15 | top: 0px 16 | &:before 17 | left: $width-car + $padding-park + 10px 18 | &:after 19 | left: $width-car * 2 + $padding-park * 2 + $margin-left-car 20 | 21 | // --------------------------------------- | 22 | // Linha de carros estacionados -----------| 23 | .car-line 24 | + .car-line 25 | margin-top: 40px 26 | 27 | // --------------------------------------- | 28 | // Espaço - vaga para estacionar ----------| 29 | .vacancy 30 | width: $width-car 31 | height: $height-car 32 | @include inline-block 33 | font-size: 31px 34 | text-align: center 35 | line-height: 1.5 36 | color: #333 37 | @include box-sizing(border-box) 38 | padding: 10px 39 | &:before 40 | content: "You are going to park here!" 41 | &:hover:before 42 | content: "Click the button below to start." 43 | + .car 44 | margin-left: $margin-left-car -------------------------------------------------------------------------------- /sass/core/_typo.sass: -------------------------------------------------------------------------------- 1 | // Typography 2 | 3 | // Importing google fonts 4 | @import url(http://fonts.googleapis.com/css?family=Montserrat:400,700) 5 | @import url(http://fonts.googleapis.com/css?family=Lato) 6 | 7 | // Main title and subtitle of the application 8 | header 9 | h1 10 | font-family: Montserrat, 'sans-serif' 11 | font-size: 45px 12 | text-align: center 13 | color: #34495e 14 | .header-subtitile 15 | font-size: .35em 16 | margin-bottom: 5px 17 | position: relative 18 | &:before, 19 | &:after 20 | content: '' 21 | position: absolute 22 | width: 25% 23 | height: 2px 24 | top: 50% 25 | margin-top: -1px 26 | background-color: #34495e 27 | &:before 28 | left: -35% 29 | &:after 30 | right: -35% 31 | .header-title 32 | margin-top: 0 33 | 34 | // CONGRATULATIONS STYLE 35 | // Use for the congratulations message 36 | .congrats 37 | @include opacity(0) 38 | 39 | bottom: 140px 40 | position: absolute 41 | visibility: hidden 42 | width: 100% 43 | color: #34495e 44 | 45 | .congrats-title, 46 | .congrats-subtitle, 47 | .congrats-text 48 | margin: 0 49 | line-height: 1.5 50 | text-align: center 51 | 52 | .congrats-title 53 | font-size: 42px 54 | 55 | .congrats-subtitle 56 | font-size: 22px 57 | 58 | .congrats-link 59 | color: $color-car-blue 60 | text-decoration: none -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Pure CSS - Parallel park 2 | Pure CSS - Parallel park is step by step tutorial on how to perfect parallel park. 3 | 4 | ![Exhibition](https://raw.githubusercontent.com/teles/pure-css-parallel-park/gh-pages/exhibition.gif) 5 | 6 | [Click here to see a live demo](http://teles.github.io/pure-css-parallel-park/) or love it on [codepen](http://codepen.io/teles/pen/gbKeLR). 7 | 8 | ## Dependences 9 | To generate the css file from the sass code you will only need compass. If you don't have it, [install it](http://compass-style.org/install/) 10 | 11 | ## Running the project 12 | 13 | To compile the sass project use `compass compile`. 14 | 15 | To watch changes in the project use `compass watch`, everytime you change something in the sass code running `grunt watch` the css will be compiled again. 16 | 17 | ## Folders structure 18 | The sass code is divided in folders, which folder has its own purpose. 19 | In helpers folder there are stylesheets which don't generated css. 20 | In core folder there are styles for html tags and typo. 21 | In components folder you will find the components like car, park and breadcrumbs. 22 | 23 | ## "How do you animate the car without using javascript?" 24 | The animations are all css3, they are made using keyframes, but the interactions are using a simple combination beetwen hidden inputs and labels. 25 | Happens like this: when the user checks the start button he is checking a hidden input and the first animations starts after it, so it happens in the steps 2, 3 and finish. Quite simple :) 26 | 27 | 28 | -------------------------------------------------------------------------------- /sass/components/_lib-breadcrumbs.sass: -------------------------------------------------------------------------------- 1 | // STEPS BREADCRUMBS 2 | 3 | // I get this from this pen: 4 | // http://codepen.io/arkev/pen/DzCKF from the user @arkev 5 | 6 | .breadcrumbs 7 | @include inline-block 8 | box-shadow: 0 0 1px rgba(0, 0, 0, 0.35) 9 | overflow: hidden 10 | border-radius: 5px 11 | counter-reset: flag 12 | position: absolute 13 | bottom: 25px 14 | left: calc(50% - 200px) 15 | color: #34495e 16 | 17 | > label 18 | text-decoration: none 19 | outline: none 20 | display: block 21 | float: left 22 | font-size: 12px 23 | line-height: 36px 24 | padding: 0 10px 0 60px 25 | position: relative 26 | cursor: pointer 27 | 28 | &:first-child 29 | padding-left: 46px 30 | border-radius: 5px 0 0 5px 31 | &:before 32 | left: 14px 33 | 34 | &:last-child 35 | border-radius: 0 5px 5px 0 36 | padding-right: 20px 37 | 38 | &:after 39 | content: '' 40 | position: absolute 41 | top: 0 42 | right: -18px 43 | width: 36px 44 | height: 36px 45 | transform: scale(0.707) rotate(45deg) 46 | z-index: 1 47 | box-shadow: 2px -2px 0 2px hsl(0, 8%, 90%) 48 | border-radius: 0 5px 0 50px 49 | 50 | &:last-child:after 51 | content: none 52 | 53 | &:before 54 | content: counter(flag) 55 | counter-increment: flag 56 | border-radius: 100% 57 | width: 20px 58 | height: 20px 59 | line-height: 20px 60 | margin: 8px 0 61 | position: absolute 62 | top: 0 63 | left: 30px 64 | background: #444 65 | font-weight: bold 66 | text-align: center 67 | color: $color-glasses 68 | 69 | &.breadcrumbs-flat 70 | > label 71 | background: white 72 | color: black 73 | transition: all 0.5s 74 | &:after 75 | background: white 76 | color: black 77 | transition: all 0.5s 78 | &:before 79 | background: white 80 | box-shadow: 0 0 0 1px #ccc 81 | &:hover, 82 | &:hover:after 83 | background-color: $color-glasses 84 | color: #fff -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Pure CSS - Parallel Park 6 | 7 | 8 | 9 |
10 |

11 | PURE CSS 12 |

Parallel park

13 |

14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 | 23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 | 31 | 32 | 33 | 34 |
35 |
36 |
37 |
38 |
39 |
40 | 41 | 42 | 43 | 44 |
45 |
46 |

Congratulations!

47 |

You are now a parallel park master.

48 |

49 | Share this pen with your friends on twitter. ↗ 50 |

51 |
52 |
53 |
54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /sass/components/_breadcrumbs-steps-animations.sass: -------------------------------------------------------------------------------- 1 | // Breadcrumb animations 2 | // Animate specific breadcrumbs when the steps are changing. 3 | 4 | // Extends for breadcrumbs 5 | 6 | // checkable step state 7 | %commons-checkable-step 8 | pointer-events: all 9 | @include opacity(1) 10 | 11 | // checked step state 12 | %commons-checked-step 13 | background-color: $color-glasses 14 | color: #fff 15 | 16 | // non checkable step state 17 | %commons-non-checkable-step 18 | pointer-events: none 19 | @include opacity(.2) 20 | 21 | // initial state for the breadcrumbs 22 | .passo2-label, 23 | .passo3-label, 24 | .passo4-label 25 | @extend %commons-non-checkable-step 26 | 27 | // Keyframes for breadcrumbs 28 | @include keyframes(animacao-check-step) 29 | 0%, 80% 30 | pointer-events: none 31 | @include opacity(.2) 32 | 100% 33 | pointer-events: all 34 | @include opacity(1) 35 | 36 | @include keyframes(show-congrats) 37 | 0%, 50% 38 | @include opacity(0) 39 | 100% 40 | @include opacity(100) 41 | 42 | // Step by step breadcrumbs 43 | // step 1 checked 44 | input.passo1:checked 45 | @extend %commons-checked-step 46 | ~ .breadcrumbs 47 | > .passo1-label, 48 | > .passo1-label:after 49 | @extend %commons-checked-step 50 | > .passo2-label 51 | @include animation(animacao-check-step 3.2s) 52 | @extend %commons-checkable-step 53 | 54 | // step 1 and 2 checked 55 | + input.passo2:checked 56 | ~ .breadcrumbs 57 | > .passo2-label, 58 | > .passo2-label:after 59 | @extend %commons-checked-step 60 | > .passo3-label 61 | @include animation(animacao-check-step 3.2s) 62 | @extend %commons-checkable-step 63 | 64 | // step 1, 2 and 3 checked 65 | + input.passo3:checked 66 | ~ .breadcrumbs 67 | > .passo3-label, 68 | > .passo3-label:after 69 | @extend %commons-checked-step 70 | > .passo4-label 71 | @include animation(animacao-check-step 3.2s) 72 | @extend %commons-checkable-step 73 | 74 | // step 1, 2, 3 and 4 checked 75 | + input.passo4:checked 76 | ~ .breadcrumbs 77 | > .passo4-label, 78 | > .passo4-label:after 79 | @include animation(animacao-check-step 3.2s) 80 | @extend %commons-checked-step 81 | 82 | // When all the steps are checked show the congratulations message 83 | ~ .congrats 84 | @include animation(show-congrats 4.4s) 85 | visibility: visible 86 | @include opacity(1) -------------------------------------------------------------------------------- /sass/components/_car.sass: -------------------------------------------------------------------------------- 1 | // --------------------------------------- | 2 | // Carro ----------------------------------| 3 | // --------------------------------------- | 4 | .car 5 | width: $width-car 6 | height: $height-car 7 | background: $color-car 8 | position: relative 9 | @include inline-block 10 | @include border-top-right-radius(40px 50%) 11 | @include border-bottom-right-radius(40px 50%) 12 | @include border-bottom-left-radius(20px 30px) 13 | @include border-top-left-radius(20px 30px) 14 | 15 | &:after 16 | @extend %commons-retrovisor 17 | top: -12px 18 | @include border-radius(3px 100% 0 0) 19 | &:before 20 | @extend %commons-retrovisor 21 | bottom: -12px 22 | @include border-radius(0 0 100% 3px) 23 | 24 | // Parte frontal do carro 25 | // Vidro frontal 26 | .car-front 27 | border-bottom: 40px solid $color-glasses 28 | border-left: 8px solid transparent 29 | border-right: 8px solid transparent 30 | top: 42px 31 | height: 0 32 | width: 70px 33 | right: 30px 34 | position: absolute 35 | @include rotate(-90deg) 36 | @include box-shadow(0px 3px 0 #fff) 37 | 38 | // Faróis 39 | 40 | // farol esquerdo 41 | &:after 42 | @extend %commons-farol 43 | @include rotate(22deg) 44 | left: -5px 45 | 46 | // farol direito 47 | &:before 48 | @extend %commons-farol 49 | @include rotate(-22deg) 50 | right: -5px 51 | 52 | // Outras cores para o carro 53 | &.car-blue 54 | background-color: $color-car-blue 55 | &.car-red 56 | background-color: $color-car-red 57 | &.car-silver 58 | background-color: $color-car-silver 59 | 60 | // Espaçamento entre carros 61 | + .car, 62 | + .vacancy 63 | margin-left: $margin-left-car 64 | 65 | // Meio do carro 66 | 67 | // Vidros laterais 68 | .car-middle 69 | 70 | // vidro lateral direito 71 | &:before 72 | @extend %commons-vidro-lateral 73 | bottom: 8px 74 | 75 | // vidro lateral esquerdo 76 | &:after 77 | @extend %commons-vidro-lateral 78 | top: 8px 79 | @include scale(1, -1) 80 | 81 | // Parte traseira do carro 82 | .car-back 83 | content: '' 84 | border-bottom: 35px solid $color-glasses 85 | border-left: 20px solid transparent 86 | border-right: 20px solid transparent 87 | height: 0 88 | top: 44px 89 | width: 60px 90 | left: -5px 91 | @include rotate(90deg) 92 | position: absolute 93 | 94 | // Luzes de ré 95 | 96 | // luz de ré esquerda 97 | &:before 98 | @extend %commons-luz-de-re 99 | left: -30px 100 | @include border-bottom-left-radius(40px 22px) 101 | &:after 102 | 103 | // luz de ré direita 104 | @extend %commons-luz-de-re 105 | right: -30px 106 | @include border-bottom-right-radius(40px 22px) -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | GNU GENERAL PUBLIC LICENSE 2 | Version 2, June 1991 3 | 4 | Copyright (C) 1989, 1991 Free Software Foundation, Inc., 5 | 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA 6 | Everyone is permitted to copy and distribute verbatim copies 7 | of this license document, but changing it is not allowed. 8 | 9 | Preamble 10 | 11 | The licenses for most software are designed to take away your 12 | freedom to share and change it. By contrast, the GNU General Public 13 | License is intended to guarantee your freedom to share and change free 14 | software--to make sure the software is free for all its users. This 15 | General Public License applies to most of the Free Software 16 | Foundation's software and to any other program whose authors commit to 17 | using it. (Some other Free Software Foundation software is covered by 18 | the GNU Lesser General Public License instead.) You can apply it to 19 | your programs, too. 20 | 21 | When we speak of free software, we are referring to freedom, not 22 | price. Our General Public Licenses are designed to make sure that you 23 | have the freedom to distribute copies of free software (and charge for 24 | this service if you wish), that you receive source code or can get it 25 | if you want it, that you can change the software or use pieces of it 26 | in new free programs; and that you know you can do these things. 27 | 28 | To protect your rights, we need to make restrictions that forbid 29 | anyone to deny you these rights or to ask you to surrender the rights. 30 | These restrictions translate to certain responsibilities for you if you 31 | distribute copies of the software, or if you modify it. 32 | 33 | For example, if you distribute copies of such a program, whether 34 | gratis or for a fee, you must give the recipients all the rights that 35 | you have. You must make sure that they, too, receive or can get the 36 | source code. And you must show them these terms so they know their 37 | rights. 38 | 39 | We protect your rights with two steps: (1) copyright the software, and 40 | (2) offer you this license which gives you legal permission to copy, 41 | distribute and/or modify the software. 42 | 43 | Also, for each author's protection and ours, we want to make certain 44 | that everyone understands that there is no warranty for this free 45 | software. If the software is modified by someone else and passed on, we 46 | want its recipients to know that what they have is not the original, so 47 | that any problems introduced by others will not reflect on the original 48 | authors' reputations. 49 | 50 | Finally, any free program is threatened constantly by software 51 | patents. We wish to avoid the danger that redistributors of a free 52 | program will individually obtain patent licenses, in effect making the 53 | program proprietary. To prevent this, we have made it clear that any 54 | patent must be licensed for everyone's free use or not licensed at all. 55 | 56 | The precise terms and conditions for copying, distribution and 57 | modification follow. 58 | 59 | GNU GENERAL PUBLIC LICENSE 60 | TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION 61 | 62 | 0. This License applies to any program or other work which contains 63 | a notice placed by the copyright holder saying it may be distributed 64 | under the terms of this General Public License. The "Program", below, 65 | refers to any such program or work, and a "work based on the Program" 66 | means either the Program or any derivative work under copyright law: 67 | that is to say, a work containing the Program or a portion of it, 68 | either verbatim or with modifications and/or translated into another 69 | language. (Hereinafter, translation is included without limitation in 70 | the term "modification".) Each licensee is addressed as "you". 71 | 72 | Activities other than copying, distribution and modification are not 73 | covered by this License; they are outside its scope. The act of 74 | running the Program is not restricted, and the output from the Program 75 | is covered only if its contents constitute a work based on the 76 | Program (independent of having been made by running the Program). 77 | Whether that is true depends on what the Program does. 78 | 79 | 1. You may copy and distribute verbatim copies of the Program's 80 | source code as you receive it, in any medium, provided that you 81 | conspicuously and appropriately publish on each copy an appropriate 82 | copyright notice and disclaimer of warranty; keep intact all the 83 | notices that refer to this License and to the absence of any warranty; 84 | and give any other recipients of the Program a copy of this License 85 | along with the Program. 86 | 87 | You may charge a fee for the physical act of transferring a copy, and 88 | you may at your option offer warranty protection in exchange for a fee. 89 | 90 | 2. You may modify your copy or copies of the Program or any portion 91 | of it, thus forming a work based on the Program, and copy and 92 | distribute such modifications or work under the terms of Section 1 93 | above, provided that you also meet all of these conditions: 94 | 95 | a) You must cause the modified files to carry prominent notices 96 | stating that you changed the files and the date of any change. 97 | 98 | b) You must cause any work that you distribute or publish, that in 99 | whole or in part contains or is derived from the Program or any 100 | part thereof, to be licensed as a whole at no charge to all third 101 | parties under the terms of this License. 102 | 103 | c) If the modified program normally reads commands interactively 104 | when run, you must cause it, when started running for such 105 | interactive use in the most ordinary way, to print or display an 106 | announcement including an appropriate copyright notice and a 107 | notice that there is no warranty (or else, saying that you provide 108 | a warranty) and that users may redistribute the program under 109 | these conditions, and telling the user how to view a copy of this 110 | License. (Exception: if the Program itself is interactive but 111 | does not normally print such an announcement, your work based on 112 | the Program is not required to print an announcement.) 113 | 114 | These requirements apply to the modified work as a whole. If 115 | identifiable sections of that work are not derived from the Program, 116 | and can be reasonably considered independent and separate works in 117 | themselves, then this License, and its terms, do not apply to those 118 | sections when you distribute them as separate works. But when you 119 | distribute the same sections as part of a whole which is a work based 120 | on the Program, the distribution of the whole must be on the terms of 121 | this License, whose permissions for other licensees extend to the 122 | entire whole, and thus to each and every part regardless of who wrote it. 123 | 124 | Thus, it is not the intent of this section to claim rights or contest 125 | your rights to work written entirely by you; rather, the intent is to 126 | exercise the right to control the distribution of derivative or 127 | collective works based on the Program. 128 | 129 | In addition, mere aggregation of another work not based on the Program 130 | with the Program (or with a work based on the Program) on a volume of 131 | a storage or distribution medium does not bring the other work under 132 | the scope of this License. 133 | 134 | 3. You may copy and distribute the Program (or a work based on it, 135 | under Section 2) in object code or executable form under the terms of 136 | Sections 1 and 2 above provided that you also do one of the following: 137 | 138 | a) Accompany it with the complete corresponding machine-readable 139 | source code, which must be distributed under the terms of Sections 140 | 1 and 2 above on a medium customarily used for software interchange; or, 141 | 142 | b) Accompany it with a written offer, valid for at least three 143 | years, to give any third party, for a charge no more than your 144 | cost of physically performing source distribution, a complete 145 | machine-readable copy of the corresponding source code, to be 146 | distributed under the terms of Sections 1 and 2 above on a medium 147 | customarily used for software interchange; or, 148 | 149 | c) Accompany it with the information you received as to the offer 150 | to distribute corresponding source code. (This alternative is 151 | allowed only for noncommercial distribution and only if you 152 | received the program in object code or executable form with such 153 | an offer, in accord with Subsection b above.) 154 | 155 | The source code for a work means the preferred form of the work for 156 | making modifications to it. For an executable work, complete source 157 | code means all the source code for all modules it contains, plus any 158 | associated interface definition files, plus the scripts used to 159 | control compilation and installation of the executable. However, as a 160 | special exception, the source code distributed need not include 161 | anything that is normally distributed (in either source or binary 162 | form) with the major components (compiler, kernel, and so on) of the 163 | operating system on which the executable runs, unless that component 164 | itself accompanies the executable. 165 | 166 | If distribution of executable or object code is made by offering 167 | access to copy from a designated place, then offering equivalent 168 | access to copy the source code from the same place counts as 169 | distribution of the source code, even though third parties are not 170 | compelled to copy the source along with the object code. 171 | 172 | 4. You may not copy, modify, sublicense, or distribute the Program 173 | except as expressly provided under this License. Any attempt 174 | otherwise to copy, modify, sublicense or distribute the Program is 175 | void, and will automatically terminate your rights under this License. 176 | However, parties who have received copies, or rights, from you under 177 | this License will not have their licenses terminated so long as such 178 | parties remain in full compliance. 179 | 180 | 5. You are not required to accept this License, since you have not 181 | signed it. However, nothing else grants you permission to modify or 182 | distribute the Program or its derivative works. These actions are 183 | prohibited by law if you do not accept this License. Therefore, by 184 | modifying or distributing the Program (or any work based on the 185 | Program), you indicate your acceptance of this License to do so, and 186 | all its terms and conditions for copying, distributing or modifying 187 | the Program or works based on it. 188 | 189 | 6. Each time you redistribute the Program (or any work based on the 190 | Program), the recipient automatically receives a license from the 191 | original licensor to copy, distribute or modify the Program subject to 192 | these terms and conditions. You may not impose any further 193 | restrictions on the recipients' exercise of the rights granted herein. 194 | You are not responsible for enforcing compliance by third parties to 195 | this License. 196 | 197 | 7. If, as a consequence of a court judgment or allegation of patent 198 | infringement or for any other reason (not limited to patent issues), 199 | conditions are imposed on you (whether by court order, agreement or 200 | otherwise) that contradict the conditions of this License, they do not 201 | excuse you from the conditions of this License. If you cannot 202 | distribute so as to satisfy simultaneously your obligations under this 203 | License and any other pertinent obligations, then as a consequence you 204 | may not distribute the Program at all. For example, if a patent 205 | license would not permit royalty-free redistribution of the Program by 206 | all those who receive copies directly or indirectly through you, then 207 | the only way you could satisfy both it and this License would be to 208 | refrain entirely from distribution of the Program. 209 | 210 | If any portion of this section is held invalid or unenforceable under 211 | any particular circumstance, the balance of the section is intended to 212 | apply and the section as a whole is intended to apply in other 213 | circumstances. 214 | 215 | It is not the purpose of this section to induce you to infringe any 216 | patents or other property right claims or to contest validity of any 217 | such claims; this section has the sole purpose of protecting the 218 | integrity of the free software distribution system, which is 219 | implemented by public license practices. Many people have made 220 | generous contributions to the wide range of software distributed 221 | through that system in reliance on consistent application of that 222 | system; it is up to the author/donor to decide if he or she is willing 223 | to distribute software through any other system and a licensee cannot 224 | impose that choice. 225 | 226 | This section is intended to make thoroughly clear what is believed to 227 | be a consequence of the rest of this License. 228 | 229 | 8. If the distribution and/or use of the Program is restricted in 230 | certain countries either by patents or by copyrighted interfaces, the 231 | original copyright holder who places the Program under this License 232 | may add an explicit geographical distribution limitation excluding 233 | those countries, so that distribution is permitted only in or among 234 | countries not thus excluded. In such case, this License incorporates 235 | the limitation as if written in the body of this License. 236 | 237 | 9. The Free Software Foundation may publish revised and/or new versions 238 | of the General Public License from time to time. Such new versions will 239 | be similar in spirit to the present version, but may differ in detail to 240 | address new problems or concerns. 241 | 242 | Each version is given a distinguishing version number. If the Program 243 | specifies a version number of this License which applies to it and "any 244 | later version", you have the option of following the terms and conditions 245 | either of that version or of any later version published by the Free 246 | Software Foundation. If the Program does not specify a version number of 247 | this License, you may choose any version ever published by the Free Software 248 | Foundation. 249 | 250 | 10. If you wish to incorporate parts of the Program into other free 251 | programs whose distribution conditions are different, write to the author 252 | to ask for permission. For software which is copyrighted by the Free 253 | Software Foundation, write to the Free Software Foundation; we sometimes 254 | make exceptions for this. Our decision will be guided by the two goals 255 | of preserving the free status of all derivatives of our free software and 256 | of promoting the sharing and reuse of software generally. 257 | 258 | NO WARRANTY 259 | 260 | 11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY 261 | FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN 262 | OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES 263 | PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED 264 | OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF 265 | MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS 266 | TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE 267 | PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, 268 | REPAIR OR CORRECTION. 269 | 270 | 12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING 271 | WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR 272 | REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, 273 | INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING 274 | OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED 275 | TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY 276 | YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER 277 | PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE 278 | POSSIBILITY OF SUCH DAMAGES. 279 | 280 | END OF TERMS AND CONDITIONS 281 | 282 | How to Apply These Terms to Your New Programs 283 | 284 | If you develop a new program, and you want it to be of the greatest 285 | possible use to the public, the best way to achieve this is to make it 286 | free software which everyone can redistribute and change under these terms. 287 | 288 | To do so, attach the following notices to the program. It is safest 289 | to attach them to the start of each source file to most effectively 290 | convey the exclusion of warranty; and each file should have at least 291 | the "copyright" line and a pointer to where the full notice is found. 292 | 293 | {description} 294 | Copyright (C) {year} {fullname} 295 | 296 | This program is free software; you can redistribute it and/or modify 297 | it under the terms of the GNU General Public License as published by 298 | the Free Software Foundation; either version 2 of the License, or 299 | (at your option) any later version. 300 | 301 | This program is distributed in the hope that it will be useful, 302 | but WITHOUT ANY WARRANTY; without even the implied warranty of 303 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 304 | GNU General Public License for more details. 305 | 306 | You should have received a copy of the GNU General Public License along 307 | with this program; if not, write to the Free Software Foundation, Inc., 308 | 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA. 309 | 310 | Also add information on how to contact you by electronic and paper mail. 311 | 312 | If the program is interactive, make it output a short notice like this 313 | when it starts in an interactive mode: 314 | 315 | Gnomovision version 69, Copyright (C) year name of author 316 | Gnomovision comes with ABSOLUTELY NO WARRANTY; for details type `show w'. 317 | This is free software, and you are welcome to redistribute it 318 | under certain conditions; type `show c' for details. 319 | 320 | The hypothetical commands `show w' and `show c' should show the appropriate 321 | parts of the General Public License. Of course, the commands you use may 322 | be called something other than `show w' and `show c'; they could even be 323 | mouse-clicks or menu items--whatever suits your program. 324 | 325 | You should also get your employer (if you work as a programmer) or your 326 | school, if any, to sign a "copyright disclaimer" for the program, if 327 | necessary. Here is a sample; alter the names: 328 | 329 | Yoyodyne, Inc., hereby disclaims all copyright interest in the program 330 | `Gnomovision' (which makes passes at compilers) written by James Hacker. 331 | 332 | {signature of Ty Coon}, 1 April 1989 333 | Ty Coon, President of Vice 334 | 335 | This General Public License does not permit incorporating your program into 336 | proprietary programs. If your program is a subroutine library, you may 337 | consider it more useful to permit linking proprietary applications with the 338 | library. If this is what you want to do, use the GNU Lesser General 339 | Public License instead of this License. 340 | 341 | --------------------------------------------------------------------------------