diff --git a/.gitignore b/.gitignore index 9bea433..cc6c287 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,15 @@ .DS_Store + +source/.DS_Store + +source/js/.DS_Store + +dev_examples/ + +*.tmproj + +*.tmproject + +tmtags +source/gfx/.DS_Store diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..aed8f1f --- /dev/null +++ b/LICENSE @@ -0,0 +1,13 @@ +This program is free software: you can redistribute it and/or modify +it under the terms of the GNU General Public License as published by +the Free Software Foundation, either version 3 of the License, or +(at your option) any later version. + +This program is distributed in the hope that it will be useful, +but WITHOUT ANY WARRANTY; without even the implied warranty of +MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +GNU General Public License for more details. + +http://www.gnu.org/licenses/ + +Map tiles by [Stamen Design](http://stamen.com "Stamen Design"), under [CC BY 3.0](http://creativecommons.org/licenses/by/3.0 "CC BY 3.0"). Data by [OpenStreetMap](http://openstreetmap.org "OpenStreetMap"), under [CC BY SA](http://creativecommons.org/licenses/by-sa/3.0 "CC BY SA"). \ No newline at end of file diff --git a/README.html b/README.html deleted file mode 100755 index 7fe1c4b..0000000 --- a/README.html +++ /dev/null @@ -1 +0,0 @@ -Timeline Documentation

Document history with Timeline

There are lots of timeline tools on the web but they are almost all either hard on the eyes or hard to use. Create timelines that are at the same time beautiful and intuitive for users

Timeline is great for pulling in media from different sources. Just throw in a link from Twitter, YouTube, Flickr, Vimeo, Google Maps or SoundCloud and Timeline will format it to fit perfectly. More media types will be supported in the future.

Creating one is as easy as filling in a Google spreadsheet or as detailed as JSON.

Add it to your site

Step 1

Include these lines in the <head> of your site.

        <!-- CSS -->

        <link href="timeline.css" rel="stylesheet">

        

        <!-- JavaScript -->

        <script type="text/javascript" src="jquery-min.js"></script>

        <script type="text/javascript" src="timeline-min.js"></script>

Step 2

Add a <div> with an id called “timeline” in the <body> of your site.

<div id="timeline"></div>

Step 3

Initialize the data source in either the <head> or the <body>

<script>

                $(document).ready(function() {

                        timeline = new VMM.Timeline();

                        timeline.init("your_data.json");                        

                });

</script>

File Formats

JSON:

JSON is the native data format of Timeline. It is easy to work with and even people non-coders can create timelines with this method.

JSON is picky though. Pay special attention to the small details. A misplaced comma or quotation mark can prevent the timeline from loading properly.

Instructions on actually using the JSON file are included in the example data.JSON file.

A few hints about working with JSON files.

  1. JSON works in pairs. In the file you will notice “parameters”:”specific attributes”
  1. The part you will want to change goes in the specific attributes section.
  1. Pay special attention to the formatting notes in the json-guide/data.json file.

Google Docs:

If you don’t want to mess with JSON, grab a spreadsheet in Google Docs to build your timeline. It’s as simple as dropping a date, text, and links into the appropriate columns in Timeline’s template.

You can find the template here: https://docs.google.com/a/digitalartwork.net/previewtemplate?id=0AppSVxABhnltdEhzQjQ4MlpOaldjTmZLclQxQWFTOUE&mode=public

There are only four things you need to know in order to create a timeline using Google Docs:

  1. Make the spreadsheet public:
    Google Docs are automatically set to private but the spreadsheet must be public.

    Click the blue “Share” button on the top right-hand corner. In the “Share settings” window, you’ll see the private setting of the spreadsheet: click “Change...”. In the Visibility options window, choose “Public on the Web” and save.

  1. Publish to the Web
    Under the File menu, select “Publish to the Web.”

    In the next window, check the box next to “
    Automatically republish when changes are made.” Uncheck all other boxes. Click “start publishing.” This will give you the URL to embed in your HTML file.

  1. Copy/paste the Web URL into your Timeline HTML file
    After you publish the spreadsheet, Google Docs will generate a link to the file. Copy the link for the Web Page option (as opposed to PDF, HTML, XLS, etc.), then paste it into the timeline’s HTML file:

    timeline.init(“URL goes here”)

  1. Designate the “start” slide
    This indicates which event is the title slide, the one that begins the timeline.

    Only one should be labeled "start" (generally, the first one). The title slide must have a start date, headline and text to appear properly.

Getting Timeline onto the web

The zipped folder contains all of the files that you need in order to get Timeline working on your site. Upload the entire folder to your server and then you can play with the example timelines.

To create a new timeline, decide which file format you would like to use. Check out the examples folder of your chosen format.

For a google spreadsheet:

  1. Start by dropping in a placeholder, like “Timeline title goes here.”
  1. Save, make the spreadsheet public and publish it.
  1. To publish: File > Publish to the Web
  2. Copy/paste the link into HTML page
  3. Save, upload to server
  1. After making changes in the spreadsheet, reload the page in the browser to make sure everything is working well.

Media

Included in the zip file is a kitchen sink example. This timeline shows how to incorporate the different media types from different services like Twitter, YouTube, Flickr and Vimeo.

Twitter: Just copy and paste the address of the tweet from the browser bar into the media parameter. Timeline will auto-magically pull in the tweet and format it so that it looks beautiful.

For Flickr, Google Maps, SoundCloud, YouTube and Vimeo, just copy the URL and paste it into the media parameter.

Best practices

Tips and tricks to best utilize Timeline

  1. Timelines look best when they flow well and maintain a good pace. Some ideas to keep in mind:
  1. Keep it light - don’t get bogged down by text or other elements
  2. Include compelling media that help
  1. Chronology
  1. The best timeline stories have a strong chronological flow to the story. It does not  work well for stories that do not have a strong timeline element or that need to jump around in the timeline.
  2. Chronological order is inherent in a timeline, but we’re human: Sometimes we forget a date. Luckily, Timeline will sort events by date regardless of what order they are in on the spreadsheet.
  1. Include more than just the major events
  1. It is generally a more compelling story to include important smaller events that lead up to major events than just showing the major events.
\ No newline at end of file diff --git a/date.format.min.js b/date.format.min.js deleted file mode 100644 index 81ed458..0000000 --- a/date.format.min.js +++ /dev/null @@ -1 +0,0 @@ -var dateFormat=function(){var a=/d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|"[^"]*"|'[^']*'/g,b=/\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,c=/[^-+\dA-Z]/g,d=function(a,b){a=String(a);b=b||2;while(a.length99?Math.round(q/10):q),t:n<12?"a":"p",tt:n<12?"am":"pm",T:n<12?"A":"P",TT:n<12?"AM":"PM",Z:g?"UTC":(String(e).match(b)||[""]).pop().replace(c,""),o:(r>0?"-":"+")+d(Math.floor(Math.abs(r)/60)*100+Math.abs(r)%60,4),S:["th","st","nd","rd"][j%10>3?0:(j%100-j%10!=10)*j%10]};return f.replace(a,function(a){return a in s?s[a]:a.slice(1,a.length-1)})}}();dateFormat.masks={"default":"ddd mmm dd yyyy HH:MM:ss",shortDate:"m/d/yy",mediumDate:"mmm d, yyyy",longDate:"mmmm d, yyyy",fullDate:"dddd, mmmm d, yyyy",shortTime:"h:MM TT",mediumTime:"h:MM:ss TT",longTime:"h:MM:ss TT Z",isoDate:"yyyy-mm-dd",isoTime:"HH:MM:ss",isoDateTime:"yyyy-mm-dd'T'HH:MM:ss",isoUtcDateTime:"UTC:yyyy-mm-dd'T'HH:MM:ss'Z'"};dateFormat.i18n={dayNames:["Sun","Mon","Tue","Wed","Thu","Fri","Sat","Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec","January","February","March","April","May","June","July","August","September","October","November","December"]};Date.prototype.format=function(a,b){return dateFormat(this,a,b)} \ No newline at end of file diff --git a/examples/.DS_Store b/examples/.DS_Store deleted file mode 100644 index 50ee845..0000000 Binary files a/examples/.DS_Store and /dev/null differ diff --git a/examples/embed.html b/examples/embed.html new file mode 100644 index 0000000..0795492 --- /dev/null +++ b/examples/embed.html @@ -0,0 +1,46 @@ + + + + + Embed Timeline + + + + + + + + + +
+ + + + + diff --git a/examples/i18n_example/index.html b/examples/i18n_example/index.html new file mode 100644 index 0000000..524a0dd --- /dev/null +++ b/examples/i18n_example/index.html @@ -0,0 +1,75 @@ + + + + + Timeline Google Spreadsheet Template + + + + + + + + +
+ + + + + diff --git a/examples/kitchen-sink/index.html b/examples/kitchen-sink/index.html index eb734ee..6b95b15 100644 --- a/examples/kitchen-sink/index.html +++ b/examples/kitchen-sink/index.html @@ -6,10 +6,6 @@ - - - - + @@ -24,7 +27,7 @@ @@ -34,20 +37,7 @@ - diff --git a/examples/template_googlespreadsheet/.DS_Store b/examples/template_googlespreadsheet/.DS_Store deleted file mode 100644 index 5008ddf..0000000 Binary files a/examples/template_googlespreadsheet/.DS_Store and /dev/null differ diff --git a/examples/template_googlespreadsheet/index.html b/examples/template_googlespreadsheet/index.html index f5aad81..5d1990a 100644 --- a/examples/template_googlespreadsheet/index.html +++ b/examples/template_googlespreadsheet/index.html @@ -4,32 +4,40 @@ Timeline Google Spreadsheet Template - - - - - - - - - - - - - - + -
+ +
+ + + diff --git a/examples/template_html/.DS_Store b/examples/template_html/.DS_Store deleted file mode 100644 index 5008ddf..0000000 Binary files a/examples/template_html/.DS_Store and /dev/null differ diff --git a/examples/template_html/index.html b/examples/template_html/index.html index 88e60f4..338dae1 100755 --- a/examples/template_html/index.html +++ b/examples/template_html/index.html @@ -4,10 +4,7 @@ Timeline - - - - + diff --git a/examples/template_json/index.html b/examples/template_json/index.html index 3a824fa..1581732 100644 --- a/examples/template_json/index.html +++ b/examples/template_json/index.html @@ -4,35 +4,45 @@ Timeline JSON Template - - - - - - - + - - - - - - - -
+ +
+ + + diff --git a/source/.DS_Store b/source/.DS_Store deleted file mode 100644 index 39035fa..0000000 Binary files a/source/.DS_Store and /dev/null differ diff --git a/source/css/mixins.css b/source/css/mixins.css deleted file mode 100644 index 8b13789..0000000 --- a/source/css/mixins.css +++ /dev/null @@ -1 +0,0 @@ - diff --git a/source/css/reset.css b/source/css/reset.css deleted file mode 100644 index 3f8d0d6..0000000 --- a/source/css/reset.css +++ /dev/null @@ -1,20 +0,0 @@ -#timeline h1,#timeline h2,#timeline h3,#timeline h4,#timeline h5,#timeline h6,#timeline p,#timeline blockquote,#timeline pre,#timeline a,#timeline abbr,#timeline acronym,#timeline address,#timeline cite,#timeline code,#timeline del,#timeline dfn,#timeline em,#timeline img,#timeline q,#timeline s,#timeline samp,#timeline small,#timeline strike,#timeline strong,#timeline sub,#timeline sup,#timeline tt,#timeline var,#timeline dd,#timeline dl,#timeline dt,#timeline li,#timeline ol,#timeline ul,#timeline fieldset,#timeline form,#timeline label,#timeline legend,#timeline button,#timeline table,#timeline caption,#timeline tbody,#timeline tfoot,#timeline thead,#timeline tr,#timeline th,#timeline td{margin:0;padding:0;border:0;font-weight:normal;font-style:normal;font-size:100%;line-height:1;font-family:inherit;} -#timeline table{border-collapse:collapse;border-spacing:0;} -#timeline ol,#timeline ul{list-style:none;} -#timeline q:before,#timeline q:after,#timeline blockquote:before,#timeline blockquote:after{content:"";} -#timeline a:focus{outline:thin dotted;} -#timeline a:hover,#timeline a:active{outline:0;} -#timeline article,#timeline aside,#timeline details,#timeline figcaption,#timeline figure,#timeline footer,#timeline header,#timeline hgroup,#timeline nav,#timeline section{display:block;} -#timeline audio,#timeline canvas,#timeline video{display:inline-block;*display:inline;*zoom:1;} -#timeline audio:not([controls]){display:none;} -#timeline sub,#timeline sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;} -#timeline sup{top:-0.5em;} -#timeline sub{bottom:-0.25em;} -#timeline img{border:0;-ms-interpolation-mode:bicubic;} -#timeline button,#timeline input,#timeline select,#timeline textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;} -#timeline button,#timeline input{line-height:normal;*overflow:visible;} -#timeline button::-moz-focus-inner,#timeline input::-moz-focus-inner{border:0;padding:0;} -#timeline button,#timeline input[type="button"],#timeline input[type="reset"],#timeline input[type="submit"]{cursor:pointer;-webkit-appearance:button;} -#timeline input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;} -#timeline input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;} -#timeline textarea{overflow:auto;vertical-align:top;} diff --git a/source/css/structure-slider.css b/source/css/structure-slider.css deleted file mode 100644 index c9fc9ba..0000000 --- a/source/css/structure-slider.css +++ /dev/null @@ -1,119 +0,0 @@ -#timeline h1,#timeline h2,#timeline h3,#timeline h4,#timeline h5,#timeline h6,#timeline p,#timeline blockquote,#timeline pre,#timeline a,#timeline abbr,#timeline acronym,#timeline address,#timeline cite,#timeline code,#timeline del,#timeline dfn,#timeline em,#timeline img,#timeline q,#timeline s,#timeline samp,#timeline small,#timeline strike,#timeline strong,#timeline sub,#timeline sup,#timeline tt,#timeline var,#timeline dd,#timeline dl,#timeline dt,#timeline li,#timeline ol,#timeline ul,#timeline fieldset,#timeline form,#timeline label,#timeline legend,#timeline button,#timeline table,#timeline caption,#timeline tbody,#timeline tfoot,#timeline thead,#timeline tr,#timeline th,#timeline td{margin:0;padding:0;border:0;font-weight:normal;font-style:normal;font-size:100%;line-height:1;font-family:inherit;} -#timeline table{border-collapse:collapse;border-spacing:0;} -#timeline ol,#timeline ul{list-style:none;} -#timeline q:before,#timeline q:after,#timeline blockquote:before,#timeline blockquote:after{content:"";} -#timeline a:focus{outline:thin dotted;} -#timeline a:hover,#timeline a:active{outline:0;} -#timeline article,#timeline aside,#timeline details,#timeline figcaption,#timeline figure,#timeline footer,#timeline header,#timeline hgroup,#timeline nav,#timeline section{display:block;} -#timeline audio,#timeline canvas,#timeline video{display:inline-block;*display:inline;*zoom:1;} -#timeline audio:not([controls]){display:none;} -#timeline sub,#timeline sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;} -#timeline sup{top:-0.5em;} -#timeline sub{bottom:-0.25em;} -#timeline img{border:0;-ms-interpolation-mode:bicubic;} -#timeline button,#timeline input,#timeline select,#timeline textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;} -#timeline button,#timeline input{line-height:normal;*overflow:visible;} -#timeline button::-moz-focus-inner,#timeline input::-moz-focus-inner{border:0;padding:0;} -#timeline button,#timeline input[type="button"],#timeline input[type="reset"],#timeline input[type="submit"]{cursor:pointer;-webkit-appearance:button;} -#timeline input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;} -#timeline input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;} -#timeline textarea{overflow:auto;vertical-align:top;} -#timeline{font-family:"Georgia",Times New Roman,Times,serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;font-size:14px;font-weight:normal;line-height:20px;}#timeline p{font-size:14px;font-weight:normal;line-height:20px;margin-bottom:20px;color:#666666;}#timeline p small{font-size:12px;} -#timeline p:first-child{margin-top:20px;} -#timeline .navigation p{color:#999999;} -#timeline .feature h3,#timeline .feature h4,#timeline .feature h5,#timeline .feature h6{margin-bottom:15px;} -#timeline .feature p{color:#666666;} -#timeline h1,#timeline h2,#timeline h3,#timeline h4,#timeline h5,#timeline h6{font-weight:normal;color:#000000;}#timeline h1 small,#timeline h2 small,#timeline h3 small,#timeline h4 small,#timeline h5 small,#timeline h6 small{color:#999999;} -#timeline h1.date,#timeline h2.date,#timeline h3.date,#timeline h4.date,#timeline h5.date,#timeline h6.date{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:bold;} -#timeline h1{margin-bottom:15px;font-size:28px;line-height:30px;}#timeline h1 small{font-size:18px;} -#timeline h2{margin-bottom:15px;font-size:24px;line-height:28px;}#timeline h2 small{font-size:14px;} -#timeline h3,#timeline h4,#timeline h5,#timeline h6{line-height:40px;}#timeline h3 .active,#timeline h4 .active,#timeline h5 .active,#timeline h6 .active{color:#ff0000;} -#timeline h3{font-size:18px;line-height:22px;}#timeline h3 small{font-size:14px;} -#timeline h4{font-size:16px;line-height:18px;}#timeline h4 small{font-size:12px;} -#timeline h5{font-size:14px;line-height:16px;} -#timeline h6{font-size:13px;line-height:14px;text-transform:uppercase;} -#timeline .credit,#timeline .caption{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;} -#timeline .credit{color:#999999;text-align:right;font-size:10px;line-height:5px;display:block;margin:0 auto;} -#timeline .caption{text-align:left;margin-top:10px;color:#666666;font-size:11px;line-height:14px;} -html,body{height:100%;padding:0px;margin:0px;} -#timeline{width:100%;height:100%;padding:0px;margin:0px;background-color:#ffffff;position:absolute;overflow:hidden;}#timeline .feedback{position:absolute;display:table;overflow:hidden;top:0px;left:0px;z-index:2000;width:100%;height:100%;background-color:#e9e9e9;border:1px solid #cccccc;}#timeline .feedback .messege{display:table-cell;vertical-align:middle;font-size:28px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:bold;text-transform:uppercase;line-height:36px;width:75%;margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;text-align:center;} -#timeline .container.main{position:absolute;top:0px: left:0px;padding-bottom:3px;padding-top:15px;width:auto;height:auto;margin:0px;clear:both;} -#timeline img,#timeline embed,#timeline object,#timeline video,#timeline iframe{max-width:100%;} -#timeline img{max-height:100%;} -#timeline a{color:#0069d6;text-decoration:none;} -#timeline a:hover{color:#00438a;text-decoration:underline;} -#timeline .twitter{max-width:500px;background-color:#ffffff;margin-left:auto;margin-right:auto;}#timeline .twitter blockquote{font-size:14px;line-height:20px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#666666;}#timeline .twitter blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;font-family:"Georgia",Times New Roman,Times,serif;color:#000000;} -#timeline .twitter a{color:#0084b4;text-decoration:none;} -#timeline .twitter a:hover{color:#004c68;text-decoration:underline;} -#timeline .thumbnail{width:24px;height:24px;overflow:hidden;float:left;margin-right:5px;border:1px solid #cccccc;} -#timeline .thumbnail.twitter{background-image:url(gfx/icons/twitter.png);background-repeat:no-repeat;} -#timeline .thumbnail.vimeo{background-image:url(gfx/icons/vimeo.png);background-repeat:no-repeat;} -#timeline .thumbnail.youtube{background-image:url(gfx/icons/youtube.png);background-repeat:no-repeat;} -#timeline .zFront{z-index:500;} -#timeline{}#timeline .slider .slider-container-mask{width:720px;height:400px;overflow:hidden;position:relative;margin-right:100px;margin-left:100px;display:block;margin-left:auto;margin-right:auto;}#timeline .slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;background-color:#ffffff;}#timeline .slider .slider-container-mask .slider-container .slider-item-container .slider-item{width:720px;top:0px;position:absolute;} -#timeline .slider .nav-previous,#timeline .slider .nav-next{position:absolute;top:0px;width:100px;color:#cccccc;font-size:11px;}#timeline .slider .nav-previous .nav-container,#timeline .slider .nav-next .nav-container{height:100px;position:absolute;} -#timeline .slider .nav-previous .icon,#timeline .slider .nav-next .icon{margin-bottom:15px;} -#timeline .slider .nav-previous .date,#timeline .slider .nav-next .date{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;font-weight:bold;line-height:20px;text-transform:uppercase;margin-bottom:5px;} -#timeline .slider .nav-previous .date,#timeline .slider .nav-next .date,#timeline .slider .nav-previous .title,#timeline .slider .nav-next .title{line-height:14px;} -#timeline .slider .nav-previous:hover,#timeline .slider .nav-next:hover{color:#333333;cursor:pointer;} -#timeline .slider .nav-previous{float:left;text-align:left;}#timeline .slider .nav-previous .icon{margin-left:10px;padding-left:20px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAWCAMAAAD6gTxzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRF2dnZWVlZsrKyv7+/TU1NzMzMjY2Nc3Nz5eXlgICAQEBA8vLymZmZZmZmMzMz////CXz3iwAAABB0Uk5T////////////////////AOAjXRkAAAB1SURBVHjafNFXDsAgDAPQAKWDUd//tq2EnS6p+eNJECcYWLmzklFq2Ud1iAKlVNFG2c/zoCiJIJlkA6lOlFBFXU+vIM26lkHypxvzmCnjgg91J6TPRaDJktMVwvATFc+ur7Gb02MCrfA2py/6amGe2b/jEGAA5cYUouw7P64AAAAASUVORK5CYII=) no-repeat scroll 0% 50%;} -#timeline .slider .nav-previous .date,#timeline .slider .nav-previous .title{text-align:left;padding-left:10px;} -#timeline .slider .nav-previous:hover .icon{margin-left:5px;padding-left:20px;} -#timeline .slider .nav-next{float:right;text-align:right;}#timeline .slider .nav-next .icon{margin-right:10px;padding-right:20px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAWCAMAAAD6gTxzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRF2dnZWVlZsrKyv7+/TU1NzMzMjY2Nc3Nz5eXlgICAQEBA8vLymZmZZmZmMzMz////CXz3iwAAABB0Uk5T////////////////////AOAjXRkAAABySURBVHjabNFLEoAgDAPQAiJ/ev/buqCJONjlm5GkVcKwEbWR5uaaq4E0V7NB0mg0b5J2mCdpMqpC+kasaNkjrE3Ac530RgSSDkaQ0kFbN6N9g0X5KPFTteAzLuSPtQVScJyGpx1PyNo8NH9HxB6PAAMAzkAUorcBvvAAAAAASUVORK5CYII=) no-repeat scroll 100% 50%;} -#timeline .slider .nav-next .date,#timeline .slider .nav-next .title{text-align:right;padding-right:10px;} -#timeline .slider .nav-next:hover .icon{margin-right:5px;padding-right:20px;} -#timeline .slider .slider-item{padding:0px;overflow:hidden;}#timeline .slider .slider-item .content{background-color:#ffffff;padding:0px;zoom:1;width:720px;margin-left:auto;margin-right:auto;}#timeline .slider .slider-item .content:before,#timeline .slider .slider-item .content:after{display:table;content:"";zoom:1;} -#timeline .slider .slider-item .content:after{clear:both;} -#timeline .slider .slider-item .content .layout-text .text{width:100%;height:100%;}#timeline .slider .slider-item .content .layout-text .text .container{width:75%;margin-left:auto;margin-right:auto;} -#timeline .slider .slider-item .content .layout-media .text{width:100%;height:100%;}#timeline .slider .slider-item .content .layout-media .text .container{width:100%;margin-left:auto;margin-right:auto;} -#timeline .slider .slider-item .content .layout-media .media{width:100%;}#timeline .slider .slider-item .content .layout-media .media .container{width:auto;} -#timeline .slider .slider-item .content .layout-text-media{height:100%;zoom:1;display:table;}#timeline .slider .slider-item .content .layout-text-media:before,#timeline .slider .slider-item .content .layout-text-media:after{display:table;content:"";zoom:1;} -#timeline .slider .slider-item .content .layout-text-media:after{clear:both;} -#timeline .slider .slider-item .content .layout-text-media .text{width:33%;min-width:150px;display:table-cell;vertical-align:middle;}#timeline .slider .slider-item .content .layout-text-media .text .container{display:table-cell;vertical-align:middle;float:right;padding-right:15px;} -#timeline .slider .slider-item .content .layout-text-media .media{width:100%;display:inline-block;}#timeline .slider .slider-item .content .layout-text-media .media .media-wrapper{margin-left:auto;margin-right:auto;display:table;vertical-align:middle;}#timeline .slider .slider-item .content .layout-text-media .media .media-wrapper .media-container{overflow:hidden;line-height:0px;padding:0px;border:1px solid #cccccc;margin-left:auto;margin-right:auto;background-color:#cccccc;} -#timeline .slider .slider-item .content .layout-text-media .media.text-media .media-wrapper .media-container{border:none;background-color:#ffffff;} -#timeline .feature{width:100%;}#timeline .feature .slider{width:100%;float:left;position:relative;} -#timeline .navigation{clear:both;width:100%;height:200px;overflow:hidden;border-top:1px solid #cccccc;position:relative;}#timeline .navigation .timenav-background{position:absolute;top:0px;left:0px;height:150px;width:100%;background-color:#e9e9e9;}#timeline .navigation .timenav-background .timenav-line{position:absolute;top:0px;left:50%;width:2px;height:150px;background:#ff0000;z-index:500;} -#timeline .navigation .timenav{position:absolute;top:0px;left:-250px;z-index:1;}#timeline .navigation .timenav .content{position:relative;}#timeline .navigation .timenav .content .marker.active .dot{background:#ff0000;} -#timeline .navigation .timenav .content .marker.active .line .event-line{background:#ff0000;} -#timeline .navigation .timenav .content .marker.active .flag{z-index:200;}#timeline .navigation .timenav .content .marker.active .flag .flag-content h3{color:#ff0000;} -#timeline .navigation .timenav .content .marker.active:hover{cursor:default;}#timeline .navigation .timenav .content .marker.active:hover .flag .flag-content h3{color:#ff0000;} -#timeline .navigation .timenav .content .marker.active:hover .flag .flag-content h4{color:#999999;} -#timeline .navigation .timenav .content .marker{position:absolute;top:0px;left:150px;display:block;}#timeline .navigation .timenav .content .marker .dot{position:absolute;top:150px;left:0px;display:block;width:6px;height:6px;background:#333333;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;z-index:21;} -#timeline .navigation .timenav .content .marker .line{position:absolute;top:0px;left:3px;width:1px;height:150px;background:#cccccc;z-index:22;}#timeline .navigation .timenav .content .marker .line .event-line{position:absolute;z-index:22;left:0px;height:1px;width:1px;background:#666666;filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1;} -#timeline .navigation .timenav .content .marker .flag{position:absolute;top:15px;left:3px;padding:0px;display:block;z-index:23;width:153px;height:56px;overflow:hidden;background-image:url(gfx/TimeFlag.png);background-repeat:no-repeat;}#timeline .navigation .timenav .content .marker .flag .flag-content{padding:5px 7px 17px 5px;overflow:hidden;}#timeline .navigation .timenav .content .marker .flag .flag-content h3{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;font-weight:bold;line-height:20px;font-size:11px;line-height:12px;color:#666666;margin-bottom:2px;} -#timeline .navigation .timenav .content .marker .flag .flag-content h4{font-size:10px;line-height:11px;color:#999999;} -#timeline .navigation .timenav .content .marker .flag .flag-content .thumbnail{margin-bottom:15px;} -#timeline .navigation .timenav .content .marker .flag:hover{cursor:pointer;}#timeline .navigation .timenav .content .marker .flag:hover .flag-content h3{color:#333333;} -#timeline .navigation .timenav .content .marker .flag:hover .flag-content h4{color:#666666;} -#timeline .navigation .timenav .content .marker .flag.row1{z-index:25;top:48px;} -#timeline .navigation .timenav .content .marker .flag.row2{z-index:24;top:96px;} -#timeline .navigation .timenav .content .marker .flag.row3{z-index:23;top:1px;} -#timeline .navigation .timenav .content .marker .flag.zFront{z-index:100;} -#timeline .navigation .timenav .time{position:absolute;left:0px;top:150px;height:50px;background-color:#ffffff;}#timeline .navigation .timenav .time .time-interval-minor{height:6px;white-space:nowrap;position:absolute;top:-9px;left:8px;z-index:10;}#timeline .navigation .timenav .time .time-interval-minor .minor{position:relative;top:0px;display:inline-block;background:#ffffff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAMCAMAAACdvocfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFzMzM////040VdgAAAAJ0Uk5T/wDltzBKAAAAEklEQVR42mJgYAQCBopJgAADAAbwADHy2qHzAAAAAElFTkSuQmCC);width:15px;height:6px;background-position:center top;white-space:nowrap;color:#333333;margin-top:0px;padding-top:0px;} -#timeline .navigation .timenav .time .time-interval{white-space:nowrap;position:absolute;top:5px;left:0px;}#timeline .navigation .timenav .time .time-interval h5{background:#ffffff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAMCAMAAACdvocfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFzMzM////040VdgAAAAJ0Uk5T/wDltzBKAAAAEklEQVR42mJgYAQCBopJgAADAAbwADHy2qHzAAAAAElFTkSuQmCC);background-position:center top;background-repeat:no-repeat;padding-top:15px;display:inline-block;width:150px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:12px;font-weight:normal;line-height:20px;text-transform:uppercase;text-align:center;white-space:nowrap;color:#333333;margin-left:0px;margin-right:0px;margin-top:1px;} -.slider{width:100%;height:100%;overflow:hidden;}.slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.slider .slider-container-mask .slider-container{position:absolute;top:0px;left:80px;overflow:hidden;text-align:center;width:100%;height:100%;width:800px;height:600px;text-align:center;display:table;}.slider .slider-container-mask .slider-container .slider-item-container{overflow:hidden;display:table-cell;vertical-align:middle;} -.slider img,.slider embed,.slider object,.slider video,.slider iframe{max-width:100%;} -.slider a{color:#0069d6;text-decoration:none;} -.slider a:hover{color:#00438a;text-decoration:underline;} -.slider .nav-previous,.slider .nav-next{position:absolute;top:0px;width:100px;color:#cccccc;font-size:11px;}.slider .nav-previous .nav-container,.slider .nav-next .nav-container{height:100px;position:absolute;} -.slider .nav-previous .icon,.slider .nav-next .icon{margin-bottom:15px;} -.slider .nav-previous .date,.slider .nav-next .date{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;font-weight:bold;line-height:20px;text-transform:uppercase;margin-bottom:5px;} -.slider .nav-previous .date,.slider .nav-next .date,.slider .nav-previous .title,.slider .nav-next .title{line-height:14px;} -.slider .nav-previous:hover,.slider .nav-next:hover{color:#333333;cursor:pointer;} -.slider .nav-previous{float:left;text-align:left;}.slider .nav-previous .icon{margin-left:10px;padding-left:20px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAWCAMAAAD6gTxzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRF2dnZWVlZsrKyv7+/TU1NzMzMjY2Nc3Nz5eXlgICAQEBA8vLymZmZZmZmMzMz////CXz3iwAAABB0Uk5T////////////////////AOAjXRkAAAB1SURBVHjafNFXDsAgDAPQAKWDUd//tq2EnS6p+eNJECcYWLmzklFq2Ud1iAKlVNFG2c/zoCiJIJlkA6lOlFBFXU+vIM26lkHypxvzmCnjgg91J6TPRaDJktMVwvATFc+ur7Gb02MCrfA2py/6amGe2b/jEGAA5cYUouw7P64AAAAASUVORK5CYII=) no-repeat scroll 0% 50%;} -.slider .nav-previous .date,.slider .nav-previous .title{text-align:left;padding-left:10px;} -.slider .nav-previous:hover .icon{margin-left:5px;padding-left:20px;} -.slider .nav-next{float:right;text-align:right;}.slider .nav-next .icon{margin-right:10px;padding-right:20px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAWCAMAAAD6gTxzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRF2dnZWVlZsrKyv7+/TU1NzMzMjY2Nc3Nz5eXlgICAQEBA8vLymZmZZmZmMzMz////CXz3iwAAABB0Uk5T////////////////////AOAjXRkAAABySURBVHjabNFLEoAgDAPQAiJ/ev/buqCJONjlm5GkVcKwEbWR5uaaq4E0V7NB0mg0b5J2mCdpMqpC+kasaNkjrE3Ac530RgSSDkaQ0kFbN6N9g0X5KPFTteAzLuSPtQVScJyGpx1PyNo8NH9HxB6PAAMAzkAUorcBvvAAAAAASUVORK5CYII=) no-repeat scroll 100% 50%;} -.slider .nav-next .date,.slider .nav-next .title{text-align:right;padding-right:10px;} -.slider .nav-next:hover .icon{margin-right:5px;padding-right:20px;} -.slider .slider-item{width:700px;border:1px solid #CCC;padding:0px;margin:0px;overflow:hidden;display:table;margin-left:auto;margin-right:auto;}.slider .slider-item .content{} -.slider .slider-item .content .layout-text .text{width:100%;height:100%;}.slider .slider-item .content .layout-text .text .container{width:75%;margin-left:auto;margin-right:auto;} -.slider .slider-item .content .layout-media .text{width:100%;height:100%;}.slider .slider-item .content .layout-media .text .container{width:100%;margin-left:auto;margin-right:auto;} -.slider .slider-item .content .layout-media .media{width:100%;}.slider .slider-item .content .layout-media .media .container{width:auto;} -.slider .slider-item .content .layout-text-media{display:table;vertical-align:middle;}.slider .slider-item .content .layout-text-media .text{width:25%;min-width:120px;display:table-cell;vertical-align:middle;}.slider .slider-item .content .layout-text-media .text .container{display:table-cell;vertical-align:middle;text-align:left;padding-right:15px;} -.slider .slider-item .content .layout-text-media .media{width:100%;float:left;}.slider .slider-item .content .layout-text-media .media .media-wrapper{margin-left:auto;margin-right:auto;}.slider .slider-item .content .layout-text-media .media .media-wrapper .media-container{display:inline-block;overflow:hidden;line-height:0px;padding:0px;}.slider .slider-item .content .layout-text-media .media .media-wrapper .media-container img{border:1px solid #cccccc;max-height:350px;} -.slider .slider-item .content .layout-text-media .media .media-wrapper .media-container .credit,.slider .slider-item .content .layout-text-media .media .media-wrapper .media-container .caption{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;} -.slider .slider-item .content .layout-text-media .media .media-wrapper .media-container .credit{color:#999999;text-align:right;font-size:10px;line-height:5px;display:block;margin:0 auto;margin-top:2px;} -.slider .slider-item .content .layout-text-media .media .media-wrapper .media-container .caption{text-align:left;margin-top:10px;color:#666666;font-size:11px;line-height:14px;} -.slider .slider-item .content .layout-text-media .media.text-media .media-wrapper .media-container{border:none;background-color:#ffffff;} diff --git a/source/css/structure.css b/source/css/structure.css deleted file mode 100644 index 8f3d785..0000000 --- a/source/css/structure.css +++ /dev/null @@ -1 +0,0 @@ -#timeline{} diff --git a/source/css/variables.css b/source/css/variables.css deleted file mode 100644 index 8b13789..0000000 --- a/source/css/variables.css +++ /dev/null @@ -1 +0,0 @@ - diff --git a/source/gfx/.DS_Store b/source/gfx/.DS_Store deleted file mode 100644 index ba70dea..0000000 Binary files a/source/gfx/.DS_Store and /dev/null differ diff --git a/source/gfx/Sprites/.DS_Store b/source/gfx/Sprites/.DS_Store deleted file mode 100644 index 9dcbaa8..0000000 Binary files a/source/gfx/Sprites/.DS_Store and /dev/null differ diff --git a/source/gfx/timeline-dark.png b/source/gfx/timeline-dark.png new file mode 100644 index 0000000..5c5d488 Binary files /dev/null and b/source/gfx/timeline-dark.png differ diff --git a/source/gfx/timeline-dark.psd b/source/gfx/timeline-dark.psd new file mode 100644 index 0000000..5d48f31 Binary files /dev/null and b/source/gfx/timeline-dark.psd differ diff --git a/source/gfx/timeline.psd b/source/gfx/timeline.psd index 5adb638..86bf43a 100644 Binary files a/source/gfx/timeline.psd and b/source/gfx/timeline.psd differ diff --git a/source/js/.DS_Store b/source/js/.DS_Store deleted file mode 100644 index d114035..0000000 Binary files a/source/js/.DS_Store and /dev/null differ diff --git a/source/js/AES.js b/source/js/AES.js new file mode 100644 index 0000000..958a31a --- /dev/null +++ b/source/js/AES.js @@ -0,0 +1,463 @@ +/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ +/* AES implementation in JavaScript (c) Chris Veness 2005-2011 */ +/* - see http://csrc.nist.gov/publications/PubsFIPS.html#197 */ +/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ + +var Aes = {}; // Aes namespace + +/** + * AES Cipher function: encrypt 'input' state with Rijndael algorithm + * applies Nr rounds (10/12/14) using key schedule w for 'add round key' stage + * + * @param {Number[]} input 16-byte (128-bit) input state array + * @param {Number[][]} w Key schedule as 2D byte-array (Nr+1 x Nb bytes) + * @returns {Number[]} Encrypted output state array + */ +Aes.cipher = function(input, w) { // main Cipher function [§5.1] + var Nb = 4; // block size (in words): no of columns in state (fixed at 4 for AES) + var Nr = w.length/Nb - 1; // no of rounds: 10/12/14 for 128/192/256-bit keys + + var state = [[],[],[],[]]; // initialise 4xNb byte-array 'state' with input [§3.4] + for (var i=0; i<4*Nb; i++) state[i%4][Math.floor(i/4)] = input[i]; + + state = Aes.addRoundKey(state, w, 0, Nb); + + for (var round=1; round 6 && i%Nk == 4) { + temp = Aes.subWord(temp); + } + for (var t=0; t<4; t++) w[i][t] = w[i-Nk][t] ^ temp[t]; + } + + return w; +} + +/* + * ---- remaining routines are private, not called externally ---- + */ + +Aes.subBytes = function(s, Nb) { // apply SBox to state S [§5.1.1] + for (var r=0; r<4; r++) { + for (var c=0; c>> i*8) & 0xff; + for (var i=0; i<2; i++) counterBlock[i+2] = (nonceRnd >>> i*8) & 0xff; + for (var i=0; i<4; i++) counterBlock[i+4] = (nonceSec >>> i*8) & 0xff; + + // and convert it to a string to go on the front of the ciphertext + var ctrTxt = ''; + for (var i=0; i<8; i++) ctrTxt += String.fromCharCode(counterBlock[i]); + + // generate key schedule - an expansion of the key into distinct Key Rounds for each round + var keySchedule = Aes.keyExpansion(key); + + var blockCount = Math.ceil(plaintext.length/blockSize); + var ciphertxt = new Array(blockCount); // ciphertext as array of strings + + for (var b=0; b>> c*8) & 0xff; + for (var c=0; c<4; c++) counterBlock[15-c-4] = (b/0x100000000 >>> c*8) + + var cipherCntr = Aes.cipher(counterBlock, keySchedule); // -- encrypt counter block -- + + // block size is reduced on final block + var blockLength = b>> c*8) & 0xff; + for (var c=0; c<4; c++) counterBlock[15-c-4] = (((b+1)/0x100000000-1) >>> c*8) & 0xff; + + var cipherCntr = Aes.cipher(counterBlock, keySchedule); // encrypt counter block + + var plaintxtByte = new Array(ciphertext[b].length); + for (var i=0; i 0) { while (c++ < 3) { pad += '='; plain += '\0'; } } + // note: doing padding here saves us doing special-case packing for trailing 1 or 2 chars + + for (c=0; c>18 & 0x3f; + h2 = bits>>12 & 0x3f; + h3 = bits>>6 & 0x3f; + h4 = bits & 0x3f; + + // use hextets to index into code string + e[c/3] = b64.charAt(h1) + b64.charAt(h2) + b64.charAt(h3) + b64.charAt(h4); + } + coded = e.join(''); // join() is far faster than repeated string concatenation in IE + + // replace 'A's from padded nulls with '='s + coded = coded.slice(0, coded.length-pad.length) + pad; + + return coded; +} + +/** + * Decode string from Base64, as defined by RFC 4648 [http://tools.ietf.org/html/rfc4648] + * (instance method extending String object). As per RFC 4648, newlines are not catered for. + * + * @param {String} str The string to be decoded from base-64 + * @param {Boolean} [utf8decode=false] Flag to indicate whether str is Unicode string to be decoded + * from UTF8 after conversion from base64 + * @returns {String} decoded string + */ +Base64.decode = function(str, utf8decode) { + utf8decode = (typeof utf8decode == 'undefined') ? false : utf8decode; + var o1, o2, o3, h1, h2, h3, h4, bits, d=[], plain, coded; + var b64 = Base64.code; + + coded = utf8decode ? str.decodeUTF8() : str; + + + for (var c=0; c>>16 & 0xff; + o2 = bits>>>8 & 0xff; + o3 = bits & 0xff; + + d[c/4] = String.fromCharCode(o1, o2, o3); + // check for padding + if (h4 == 0x40) d[c/4] = String.fromCharCode(o1, o2); + if (h3 == 0x40) d[c/4] = String.fromCharCode(o1); + } + plain = d.join(''); // join() is far faster than repeated string concatenation in IE + + return utf8decode ? plain.decodeUTF8() : plain; +} + + +/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ +/* Utf8 class: encode / decode between multi-byte Unicode characters and UTF-8 multiple */ +/* single-byte character encoding (c) Chris Veness 2002-2011 */ +/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ + +var Utf8 = {}; // Utf8 namespace + +/** + * Encode multi-byte Unicode string into utf-8 multiple single-byte characters + * (BMP / basic multilingual plane only) + * + * Chars in range U+0080 - U+07FF are encoded in 2 chars, U+0800 - U+FFFF in 3 chars + * + * @param {String} strUni Unicode string to be encoded as UTF-8 + * @returns {String} encoded string + */ +Utf8.encode = function(strUni) { + // use regular expressions & String.replace callback function for better efficiency + // than procedural approaches + var strUtf = strUni.replace( + /[\u0080-\u07ff]/g, // U+0080 - U+07FF => 2 bytes 110yyyyy, 10zzzzzz + function(c) { + var cc = c.charCodeAt(0); + return String.fromCharCode(0xc0 | cc>>6, 0x80 | cc&0x3f); } + ); + strUtf = strUtf.replace( + /[\u0800-\uffff]/g, // U+0800 - U+FFFF => 3 bytes 1110xxxx, 10yyyyyy, 10zzzzzz + function(c) { + var cc = c.charCodeAt(0); + return String.fromCharCode(0xe0 | cc>>12, 0x80 | cc>>6&0x3F, 0x80 | cc&0x3f); } + ); + return strUtf; +} + +/** + * Decode utf-8 encoded string back into multi-byte Unicode characters + * + * @param {String} strUtf UTF-8 string to be decoded back to Unicode + * @returns {String} decoded string + */ +Utf8.decode = function(strUtf) { + // note: decode 3-byte chars first as decoded 2-byte strings could appear to be 3-byte char! + var strUni = strUtf.replace( + /[\u00e0-\u00ef][\u0080-\u00bf][\u0080-\u00bf]/g, // 3-byte chars + function(c) { // (note parentheses for precence) + var cc = ((c.charCodeAt(0)&0x0f)<<12) | ((c.charCodeAt(1)&0x3f)<<6) | ( c.charCodeAt(2)&0x3f); + return String.fromCharCode(cc); } + ); + strUni = strUni.replace( + /[\u00c0-\u00df][\u0080-\u00bf]/g, // 2-byte chars + function(c) { // (note parentheses for precence) + var cc = (c.charCodeAt(0)&0x1f)<<6 | c.charCodeAt(1)&0x3f; + return String.fromCharCode(cc); } + ); + return strUni; +} + +/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ \ No newline at end of file diff --git a/source/js/VMM.Core.js b/source/js/VMM.Core.js index 8fed283..c09dd4f 100644 --- a/source/js/VMM.Core.js +++ b/source/js/VMM.Core.js @@ -2,132 +2,12 @@ ================================================== */ -/* Sequence -================================================== */ -if(typeof VMM != 'undefined' && typeof VMM.Sequence == 'undefined') { - - - VMM.Sequence = Class.extend({ - - initialize: function(length,index) { - trace('sequence init'); - - // PUBLIC - this.increment = 1; - this.decrement = 1; - this.wrap = false; - - // PRIVATE - this.length = (length == null) ? 0 : length; - this.index = (index == null) ? ((length == 0) ? -1 : 0) : (index >= length) ? length-1 : index; - this.synced = []; - }, - setLength: function(i) { - - this.length = i; - - this.setIndex(this.index); - }, - - getLength: function() { - - return this.length; - }, - - setIndex: function(i) { - - if(this.length <= 0) { - - this.index = -1; - - return; - } - - if(i < 0) i = (this.wrap) ? this.length - (i%this.length) : 0; - else if(i >= this.length) i = (this.wrap) ? (i%this.length) : this.length-1; - - var pi = this.index; - - this.index = i; - - if(pi != this.index) { - - // update sequences - for(var j=0; j", "slider-item" , bw); + slides.push(_slide); } @@ -588,6 +484,7 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') { VMM.bindEvent(".nav-next", onNextClick); VMM.bindEvent(".nav-previous", onPrevClick); + VMM.bindEvent(window, onKeypressNav, 'keydown'); } /* BUILD diff --git a/source/js/VMM.LoadLib.js b/source/js/VMM.LoadLib.js new file mode 100644 index 0000000..5f3153f --- /dev/null +++ b/source/js/VMM.LoadLib.js @@ -0,0 +1,247 @@ +/* + LoadLib + Based on LazyLoad by Ryan Grove + https://github.com/rgrove/lazyload/ + Copyright (c) 2011 Ryan Grove + All rights reserved. + + Permission is hereby granted, free of charge, to any person obtaining a copy of + this software and associated documentation files (the 'Software'), to deal in + the Software without restriction, including without limitation the rights to + use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of + the Software, and to permit persons to whom the Software is furnished to do so, + subject to the following conditions: + + The above copyright notice and this permission notice shall be included in all + copies or substantial portions of the Software. + +================================================== */ +window.loadedJS = []; + + +if(typeof VMM != 'undefined' && typeof VMM.LoadLib == 'undefined') { + //VMM.LoadLib.js('http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', onJQueryLoaded); + //VMM.LoadLib.css('http://someurl.css', onCSSLoaded); + + + + VMM.LoadLib = (function (doc) { + var env, + head, + pending = {}, + pollCount = 0, + queue = {css: [], js: []}, + styleSheets = doc.styleSheets; + + var loaded_Array = []; + + function isLoaded(url) { + var has_been_loaded = false; + for(var i=0; i= 0) { + if (styleSheets[i].href === css.urls[0]) { + finish('css'); + break; + } + } + + pollCount += 1; + + if (css) { + if (pollCount < 200) { + setTimeout(pollWebKit, 50); + } else { + + finish('css'); + } + } + } + } + + return { + + css: function (urls, callback, obj, context) { + if (isLoaded(urls)) { + return callback; + } else { + load('css', urls, callback, obj, context); + } + }, + + js: function (urls, callback, obj, context) { + if (isLoaded(urls)) { + return callback; + } else { + load('js', urls, callback, obj, context); + } + } + + }; + })(this.document); +} + diff --git a/source/js/VMM.Util.js b/source/js/VMM.Util.js index ac04a7f..a0f7d27 100644 --- a/source/js/VMM.Util.js +++ b/source/js/VMM.Util.js @@ -123,6 +123,15 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') { // VMM.Util.date.day[0]; // VMM.Util.date.get12HRTime(time, seconds_true); date: { + month: VMM.master_config.i18n.date.month, + month_abbr: VMM.master_config.i18n.date.month_abbr, + day: VMM.master_config.i18n.date.day, + day_abbr: VMM.master_config.i18n.date.day_abbr, + + // not localized, localize through dateFormat's functioanlity. + hour: [1,2,3,4,5,6,7,8,9,10,11,12,1,2,3,4,5,6,7,8,9,10,11,12], + hour_suffix: ["am"], + prettyDate: function(d, is_abbr, date_type) { var _date = ""; if (type.of(d) == "date") { @@ -224,25 +233,49 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') { // VMM.Util.linkify(); linkify: function(text,targets,is_touch) { - if(!text) return text; + // http://, https://, ftp:// + var urlPattern = /\b(?:https?|ftp):\/\/[a-z0-9-+&@#\/%?=~_|!:,.;]*[a-z0-9-+&@#\/%=~_|]/gim; + + // www. sans http:// or https:// + var pseudoUrlPattern = /(^|[^\/])(www\.[\S]+(\b|$))/gim; + + // Email addresses + var emailAddressPattern = /(([a-zA-Z0-9_\-\.]+)@[a-zA-Z_]+?(?:\.[a-zA-Z]{2,6}))+/gim; - text = text.replace(/((https?\:\/\/|ftp\:\/\/)|(www\.))(\S+)(\w{2,4})(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/gi, function(url) { - var nice = url; - var _touch = ""; - if(url.search('^https?:\/\/') < 0) url = 'http://'+url; - _touch = "onclick = 'void(0)'"; - if(is_touch) { - _touch = "onclick = 'void(0)'"; - } - - onclick = "void(0)"; - if(targets === null || targets === "") return ''+ url +''; - else return "'" + url + "" ; - }); + return text + .replace(urlPattern, "$&") + .replace(pseudoUrlPattern, "$1$2") + .replace(emailAddressPattern, "$1"); + }, + + linkify_with_twitter: function(text,targets,is_touch) { - return text; + // http://, https://, ftp:// + var urlPattern = /\b(?:https?|ftp):\/\/[a-z0-9-+&@#\/%?=~_|!:,.;]*[a-z0-9-+&@#\/%=~_|]/gim; + var url_pattern = /(\()((?:ht|f)tps?:\/\/[a-z0-9\-._~!$&'()*+,;=:\/?#[\]@%]+)(\))|(\[)((?:ht|f)tps?:\/\/[a-z0-9\-._~!$&'()*+,;=:\/?#[\]@%]+)(\])|(\{)((?:ht|f)tps?:\/\/[a-z0-9\-._~!$&'()*+,;=:\/?#[\]@%]+)(\})|(<|&(?:lt|#60|#x3c);)((?:ht|f)tps?:\/\/[a-z0-9\-._~!$&'()*+,;=:\/?#[\]@%]+)(>|&(?:gt|#62|#x3e);)|((?:^|[^=\s'"\]])\s*['"]?|[^=\s]\s+)(\b(?:ht|f)tps?:\/\/[a-z0-9\-._~!$'()*+,;=:\/?#[\]@%]+(?:(?!&(?:gt|#0*62|#x0*3e);|&(?:amp|apos|quot|#0*3[49]|#x0*2[27]);[.!&',:?;]?(?:[^a-z0-9\-._~!$&'()*+,;=:\/?#[\]@%]|$))&[a-z0-9\-._~!$'()*+,;=:\/?#[\]@%]*)*[a-z0-9\-_~$()*+=\/#[\]@%])/img; + var url_replace = '$1$4$7$10$13$2$5$8$11$14$3$6$9$12'; + //return text.replace(url_pattern, url_replace); + + // www. sans http:// or https:// + var pseudoUrlPattern = /(^|[^\/])(www\.[\S]+(\b|$))/gim; + + // Email addresses + var emailAddressPattern = /(([a-zA-Z0-9_\-\.]+)@[a-zA-Z_]+?(?:\.[a-zA-Z]{2,6}))+/gim; + + var twitterHandlePattern = /(@([\w]+))/g; + + var twitterSearchPattern = /(#([\w]+))/g; + + return text + //.replace(urlPattern, "$&") + .replace(url_pattern, url_replace) + .replace(pseudoUrlPattern, "$1$2") + .replace(emailAddressPattern, "$1") + .replace(twitterHandlePattern, "$1") + .replace(twitterSearchPattern, "$1"); }, + /* Turns plain text links into real links ================================================== */ // VMM.Util.unlinkify(); @@ -292,7 +325,10 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') { /* Get URL Variables ================================================== */ // var somestring = VMM.Util.getUrlVars(str_url)["varname"]; - getUrlVars: function(str) { + getUrlVars: function(string) { + + var str = string.toString(); + var vars = [], hash; var hashes = str.slice(str.indexOf('?') + 1).split('&'); for(var i = 0; i < hashes.length; i++) { @@ -300,10 +336,10 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') { vars.push(hash[0]); vars[hash[0]] = hash[1]; } - trace(vars); + return vars; }, - + /* Cleans up strings to become real HTML ================================================== */ toHTML: function(text) { @@ -432,6 +468,30 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') { }).init(); - + //'string'.linkify(); + if(!String.linkify) { + String.prototype.linkify = function() { + + // http://, https://, ftp:// + var urlPattern = /\b(?:https?|ftp):\/\/[a-z0-9-+&@#\/%?=~_|!:,.;]*[a-z0-9-+&@#\/%=~_|]/gim; + + // www. sans http:// or https:// + var pseudoUrlPattern = /(^|[^\/])(www\.[\S]+(\b|$))/gim; + + // Email addresses + var emailAddressPattern = /(([a-zA-Z0-9_\-\.]+)@[a-zA-Z_]+?(?:\.[a-zA-Z]{2,6}))+/gim; + + var twitterHandlePattern = /(@([\w]+))/g; + + var twitterSearchPattern = /(#([\w]+))/g; + + return this + .replace(urlPattern, '$&') + .replace(pseudoUrlPattern, '$1$2') + .replace(emailAddressPattern, '$1') + .replace(twitterHandlePattern, "$1") + .replace(twitterSearchPattern, "$1"); + }; + } } \ No newline at end of file diff --git a/source/js/VMM.js b/source/js/VMM.js index 68b90b5..be19e8a 100644 --- a/source/js/VMM.js +++ b/source/js/VMM.js @@ -1,8 +1,9 @@ /* Verite * Verite JS Master - * Version: 0.1 - * Date: December 12, 2011 - * Copyright 2011 Verite + * Version: 0.5 + * Date: April 5, 2012 + * Copyright 2012 Verite unless part of Verite Timeline, + * if part of Timeline then it inherits Timeline's license. * Designed and built by Zach Wise digitalartwork.net * ----------------------------------------------------- */ @@ -11,153 +12,102 @@ ================================================== */ - /* Simple JavaScript Inheritance * By John Resig http://ejohn.org/ * MIT Licensed. ================================================== */ +(function() { + var initializing = false, + fnTest = /xyz/.test(function() { + xyz; + }) ? /\b_super\b/: /.*/; + // The base Class implementation (does nothing) + this.Class = function() {}; + + // Create a new Class that inherits from this class + Class.extend = function(prop) { + var _super = this.prototype; + + // Instantiate a base class (but only create the instance, + // don't run the init constructor) + initializing = true; + var prototype = new this(); + initializing = false; + + // Copy the properties over onto the new prototype + for (var name in prop) { + // Check if we're overwriting an existing function + prototype[name] = typeof prop[name] == "function" && + typeof _super[name] == "function" && fnTest.test(prop[name]) ? + (function(name, fn) { + return function() { + var tmp = this._super; + + // Add a new ._super() method that is the same method + // but on the super-class + this._super = _super[name]; + + // The method only need to be bound temporarily, so we + // remove it when we're done executing + var ret = fn.apply(this, arguments); + this._super = tmp; + + return ret; + }; + })(name, prop[name]) : + prop[name]; + } -(function(){ - var initializing = false, fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/; - // The base Class implementation (does nothing) - this.Class = function(){}; - - // Create a new Class that inherits from this class - Class.extend = function(prop) { - var _super = this.prototype; - - // Instantiate a base class (but only create the instance, - // don't run the init constructor) - initializing = true; - var prototype = new this(); - initializing = false; - - // Copy the properties over onto the new prototype - for (var name in prop) { - // Check if we're overwriting an existing function - prototype[name] = typeof prop[name] == "function" && - typeof _super[name] == "function" && fnTest.test(prop[name]) ? - (function(name, fn){ - return function() { - var tmp = this._super; - - // Add a new ._super() method that is the same method - // but on the super-class - this._super = _super[name]; - - // The method only need to be bound temporarily, so we - // remove it when we're done executing - var ret = fn.apply(this, arguments); - this._super = tmp; - - return ret; - }; - })(name, prop[name]) : - prop[name]; - } - - // The dummy class constructor - function Class() { - // All construction is actually done in the init method - if ( !initializing && this.init ) - this.init.apply(this, arguments); - } - - // Populate our constructed prototype object - Class.prototype = prototype; - - // Enforce the constructor to be what we expect - Class.prototype.constructor = Class; - - // And make this class extendable - Class.extend = arguments.callee; - - return Class; - }; -})(); - + // The dummy class constructor + function Class() { + // All construction is actually done in the init method + if (!initializing && this.init) + this.init.apply(this, arguments); + } + // Populate our constructed prototype object + Class.prototype = prototype; -/* CLASS EXTEND EXAMPLE -================================================== */ -/* -var Person = Class.extend({ - init: function(isDancing){ - this.dancing = isDancing; - }, - dance: function(){ - return this.dancing; - } -}); -var Ninja = Person.extend({ - init: function(){ - this._super( false ); - }, - dance: function(){ - // Call the inherited version of dance() - return this._super(); - }, - swingSword: function(){ - return true; - } -}); - -var p = new Person(true); -p.dance(); // => true - -var n = new Ninja(); -n.dance(); // => false -n.swingSword(); // => true - -// Should all be true -p instanceof Person && p instanceof Class && -n instanceof Ninja && n instanceof Person && n instanceof Class -*/ + // Enforce the constructor to be what we expect + Class.prototype.constructor = Class; + // And make this class extendable + Class.extend = arguments.callee; + return Class; + }; +})(); /* Access to the Global Object * access the global object without hard-coding the identifier window ================================================== */ - var global = (function () { return this || (1,eval)('this'); }()); - /* VMM ================================================== */ - if (typeof VMM == 'undefined') { /* Main Scope Container ================================================== */ //var VMM = {}; - var VMM = Class.extend({ - - }); + var VMM = Class.extend({}); /* Master Config ================================================== */ - //VMM.master_config.youtube_array + VMM.master_config = ({ init: function() { return this; }, - youtube: { - active: false, - array: [], - api_loaded:false - }, - - }).init(); - - VMM.master_config = ({ + vp: "Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo", - init: function() { - return this; + keys: { + flickr: "RAIvxHY4hE/Elm5cieh4X5ptMyDpj7MYIxziGxi0WGCcy1s+yr7rKQ==", + google: "jwNGnYw4hE9lmAez4ll0QD+jo6SKBJFknkopLS4FrSAuGfIwyj57AusuR0s8dAo=" }, youtube: { @@ -192,9 +142,18 @@ if (typeof VMM == 'undefined') { contract_timeline: "Contract Timeline" } - } + }, + googlemaps: { + active: false, + map_active: false, + places_active: false, + array: [], + api_loaded:false, + que: [] + } + }).init(); /* Abstract out DOM element creation to make independent of library @@ -267,7 +226,6 @@ if (typeof VMM == 'undefined') { }; - /* LIBRARY ABSTRACTION ================================================== */ @@ -370,12 +328,56 @@ if (typeof VMM == 'undefined') { }; // VMM.getJSON(url, the_function); - VMM.getJSON = function(url, the_function) { + VMM.getJSON = function(url, data, callback) { if( typeof( jQuery ) != 'undefined' ){ - $.getJSON(url, the_function); + + /* CHECK FOR IE AND USE Use Microsoft XDR + ================================================== */ + if ( VMM.Browser.browser == "Explorer" && parseInt(VMM.Browser.version, 10) >= 8 && window.XDomainRequest) { + trace("it's ie"); + var ie_url = url; + + if (ie_url.match('^http://')){ + trace("RUNNING GET JSON") + //ie_url = ie_url.replace("http://","//"); + return jQuery.getJSON(url, data, callback); + } else if (ie_url.match('^https://')) { + trace("RUNNING XDR"); + ie_url = ie_url.replace("https://","http://"); + var xdr = new XDomainRequest(); + xdr.open("get", ie_url); + xdr.onload = function() { + var ie_json = VMM.parseJSON(xdr.responseText); + trace(xdr.responseText); + if (type.of(ie_json) == "null" || type.of(ie_json) == "undefined") { + trace("IE JSON ERROR") + } else { + return data(ie_json) + } + + //.error(function() { trace("IE ERROR")}) + //.success(function() { trace("IE SUCCESS")}); + + + } + xdr.send(); + } else { + return jQuery.getJSON(url, data, callback); + } + } else { + //$.getJSON(url, data); + return jQuery.getJSON(url, data, callback); + + + } + } + } + // VMM.parseJSON(the_json); + VMM.parseJSON = function(the_json) { + if( typeof( jQuery ) != 'undefined' ){ + return $.parseJSON(the_json); } } - // ADD ELEMENT AND RETURN IT // VMM.appendAndGetElement(append_to_element, tag, cName, content, [attrib]); VMM.appendAndGetElement = function(append_to_element, tag, cName, content) { @@ -1282,6 +1284,8 @@ if (typeof VMM == 'undefined') { } else if (m.type == "youtube") { mediaElem = "
"; return mediaElem; + } else if (m.type == "googledoc") { + mediaElem = ""; } else if (m.type == "vimeo") { mediaElem = "
"; return mediaElem; @@ -1301,7 +1305,9 @@ if (typeof VMM == 'undefined') { mediaElem = ""; return mediaElem; } else if (m.type == "website") { - mediaElem = "
"; + //mediaElem = "
"; + mediaElem = "
"; + return mediaElem; } else { mediaElem = "
"; @@ -1337,11 +1343,11 @@ if (typeof VMM == 'undefined') { // CREDIT if (data.credit != null && data.credit != "") { - creditElem = "
" + data.credit + "
"; + creditElem = "
" + VMM.Util.linkify_with_twitter(data.credit, "_blank") + "
"; } // CAPTION if (data.caption != null && data.caption != "") { - captionElem = "
" + data.caption + "
"; + captionElem = "
" + VMM.Util.linkify_with_twitter(data.caption, "_blank") + "
"; } // MEDIA TYPE @@ -1352,8 +1358,16 @@ if (typeof VMM == 'undefined') { mediaElem = ""; } else if (m.type == "flickr") { var flickr_id = "flickr_" + m.id; - mediaElem = ""; + mediaElem = ""; VMM.ExternalAPI.flickr.getPhoto(m.id, "#" + flickr_id); + } else if (m.type == "googledoc") { + if (m.id.match(/docs.google.com/i)) { + mediaElem = ""; + } else { + mediaElem = ""; + } + + } else if (m.type == "youtube") { mediaElem = "
Loading YouTube video...
"; VMM.ExternalAPI.youtube.init(m.id); @@ -1361,7 +1375,7 @@ if (typeof VMM == 'undefined') { } else if (m.type == "vimeo") { mediaElem = ""; } else if (m.type == "twitter"){ - mediaElem = ""; + mediaElem = ""; //VMM.ExternalAPI.twitter.getHTML(m.id); trace("TWITTER"); VMM.ExternalAPI.twitter.prettyHTML(m.id); @@ -1373,12 +1387,16 @@ if (typeof VMM == 'undefined') { mediaElem = "
Loading Sound
"; VMM.ExternalAPI.soundcloud.getSound(m.id, soundcloud_id) } else if (m.type == "google-map") { - mediaElem = "" + //mediaElem = "" + var map_id = "googlemap_" + VMM.Util.unique_ID(7); + mediaElem = "
Loading Map...
"; + VMM.ExternalAPI.googlemaps.getMap(m.id, map_id); } else if (m.type == "unknown") { trace("NO KNOWN MEDIA TYPE FOUND TRYING TO JUST PLACE THE HTML"); mediaElem = VMM.Util.properQuotes(m.id); } else if (m.type == "website") { - mediaElem = "" + //mediaElem = ""; + mediaElem = "" + ""; } else { trace("NO KNOWN MEDIA TYPE FOUND"); trace(m.type); @@ -1450,24 +1468,29 @@ if (typeof VMM == 'undefined') { media.type = "twitter"; media.id = twitter_id; success = true; - } else if (d.match("maps.google.com")) { + } else if (d.match("maps.google")) { //maps.google.com media.type = "google-map"; media.id = d.split(/src=['|"][^'|"]*?['|"]/gi); - trace("google map " + media.id); + //trace("google map " + media.id); success = true; } else if (d.match("flickr.com/photos")) { media.type = "flickr"; //media.id = d.split('/photos/[^/]+/([0-9]+)/gi'); media.id = d.split("photos\/")[1].split("/")[1]; + media.link = d; //media.id = media.id.split("/")[1]; - trace("FLICKR " + media.id); + //trace("FLICKR " + media.id); success = true; } else if (d.match(/jpg|jpeg|png|gif/i)) { media.type = "image"; media.id = d; success = true; + } else if (VMM.FileExtention.googleDocType(d)) { + media.type = "googledoc"; + media.id = d; + success = true; } else if (d.indexOf('http://') == 0) { media.type = "website"; media.id = d; @@ -1487,34 +1510,49 @@ if (typeof VMM == 'undefined') { } return false; } - - VMM.Keys = { - flickr: "6d6f59d8d30d79f4f402a7644d5073e3", + //VMM.FileExtention.googleDocType(url); + VMM.FileExtention = { + googleDocType: function(url) { + var fileName = url; + var fileExtension = ""; + //fileExtension = fileName.substr(5); + fileExtension = fileName.substr(fileName.length - 5, 5); + var validFileExtensions = ["DOC","DOCX","XLS","XLSX","PPT","PPTX","PDF","PAGES","AI","PSD","TIFF","DXF","SVG","EPS","PS","TTF","XPS","ZIP","RAR"]; + var flag = false; + + for (var i = 0; i < validFileExtensions.length; i++) { + + + if (fileExtension.toLowerCase().match(validFileExtensions[i].toString().toLowerCase()) || fileName.match("docs.google.com") ) { + flag = true; + } + + } + + return flag; + + } } + + + VMM.ExternalAPI = { twitter: { tweetArray: [], // VMM.ExternalAPI.twitter.getHTML(id); getHTML: function(id) { - var the_url = "https://api.twitter.com/1/statuses/oembed.json?id=" + id+ "&callback=?"; - - VMM.getJSON(the_url, function(d) { - VMM.ExternalAPI.twitter.onJSONLoaded(d, id); - }); + //var the_url = document.location.protocol + "//api.twitter.com/1/statuses/oembed.json?id=" + id+ "&callback=?"; + var the_url = "http://api.twitter.com/1/statuses/oembed.json?id=" + id+ "&callback=?"; + VMM.getJSON(the_url, VMM.ExternalAPI.twitter.onJSONLoaded); }, - onJSONLoaded: function(d, id) { - VMM.attachElement("#"+id, VMM.ExternalAPI.twitter.linkify(d.html) ); - }, - //somestring = VMM.ExternalAPI.twitter.linkify(d); - linkify: function(d) { - return d.replace(/[@]+[A-Za-z0-9-_]+/g, function(u) { - var username = u.replace("@",""); - - return u.link("http://twitter.com/"+username); - }); + onJSONLoaded: function(d) { + trace("TWITTER JSON LOADED"); + var id = d.id; + VMM.attachElement("#"+id, VMM.Util.linkify_with_twitter(d.html) ); }, + // VMM.ExternalAPI.twitter.parseTwitterDate(date); parseTwitterDate: function(d) { var date = new Date(Date.parse(d)); @@ -1554,17 +1592,14 @@ if (typeof VMM == 'undefined') { /* FETCH THE DATA ================================================== */ - var the_url = "https://api.twitter.com/1/statuses/show.json?id=" + twitter_id + "&include_entities=true&callback=?"; + var the_url = "http://api.twitter.com/1/statuses/show.json?id=" + twitter_id + "&include_entities=true&callback=?"; VMM.getJSON(the_url, function(d) { var tweet = {} /* FORMAT RESPONSE ================================================== */ var twit = "