Browse Source

Many style tweaks, optimized flickr images

pull/127/head
Zach Wise 13 years ago
parent
commit
43a1ddc660
  1. 23
      compiled/css/themes/dark.css
  2. 23
      compiled/css/timeline.css
  3. 8
      compiled/js/locale/de.js
  4. 8
      compiled/js/locale/en.js
  5. 8
      compiled/js/locale/es.js
  6. 8
      compiled/js/locale/fr.js
  7. 8
      compiled/js/locale/is.js
  8. 8
      compiled/js/locale/it.js
  9. 8
      compiled/js/locale/kr.js
  10. 8
      compiled/js/locale/nl.js
  11. 8
      compiled/js/locale/pt-br.js
  12. 8
      compiled/js/locale/zh-ch.js
  13. 8
      compiled/js/locale/zh-tw.js
  14. 8
      compiled/js/timeline-min.js
  15. 142
      compiled/js/timeline.js
  16. 21
      source/js/VMM.MediaElement.js
  17. 17
      source/js/VMM.Slider.Slide.js
  18. 36
      source/js/VMM.Slider.js
  19. 1
      source/js/VMM.Timeline.TimeNav.js
  20. 2
      source/js/VMM.Timeline.js
  21. 16
      source/js/VMM.js
  22. 118
      source/less/VMM.Slider.less
  23. 5
      source/less/VMM.Timeline.TimeNav.less
  24. 3
      source/less/VMM.Timeline.less
  25. 7
      source/less/Variables.less

23
compiled/css/themes/dark.css

@ -63,9 +63,17 @@
.slider .nav-next{float:right;text-align:right;}.slider .nav-next .icon{margin-left:61px;background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-184px 0;width:24px;height:24px;height:24px;overflow:hidden;}
.slider .nav-next .date,.slider .nav-next .title{text-align:right;padding-right:15px;}
.slider .nav-next:hover .icon{margin-left:66px;}
.slider .slider-item{position:absolute;width:700px;height:100%;padding:0px;margin:0px;display:table;}.slider .slider-item .content{display:table-cell;vertical-align:middle;}.slider .slider-item .content .content-container{display:table;vertical-align:middle;}.slider .slider-item .content .content-container .text{width:40%;max-width:50%;min-width:120px;display:table-cell;vertical-align:middle;}.slider .slider-item .content .content-container .text .container{display:table-cell;vertical-align:middle;text-align:left;padding-right:15px;}
.slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:left;}.slider .slider-item .content .content-container .media .media-wrapper{margin-left:auto;margin-right:auto;}.slider .slider-item .content .content-container .media .media-wrapper .media-container{display:inline-block;line-height:0px;padding:0px;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-frame,.slider .slider-item .content .content-container .media .media-wrapper .media-container img,.slider .slider-item .content .content-container .media .media-wrapper .media-container iframe{-webkit-box-shadow:0 1px 3px 0px rgba(0, 0, 0, 0.35);-moz-box-shadow:0 1px 3px 0px rgba(0, 0, 0, 0.35);box-shadow:0 1px 3px 0px rgba(0, 0, 0, 0.35);border:1px solid;border-color:#333333 #999999 #999999 #333333;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container span.messege{display:block;vertical-align:middle;margin-left:auto;margin-right:auto;text-align:center;margin-top:50%;font-size:28px;font-weight:bold;text-transform:uppercase;}
.slider .slider-item{position:absolute;width:700px;height:100%;padding:0px;margin:0px;display:table;overflow-x:hidden;overflow-y:auto;}.slider .slider-item .content{display:table-cell;vertical-align:middle;}.slider .slider-item .content .pad-top .text .container{padding-top:15px;}
.slider .slider-item .content .pad-right .text .container{padding-right:15px;}
.slider .slider-item .content .pad-left .text .container{padding-left:30px;}
.slider .slider-item .content .content-container{display:table;vertical-align:middle;}.slider .slider-item .content .content-container .text{width:40%;max-width:50%;min-width:120px;display:table-cell;vertical-align:middle;}.slider .slider-item .content .content-container .text .container{display:table-cell;vertical-align:middle;text-align:left;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-wrap:break-word;}
.slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:left;}.slider .slider-item .content .content-container .media .media-wrapper{margin-left:auto;margin-right:auto;}.slider .slider-item .content .content-container .media .media-wrapper .media-container{display:inline-block;line-height:0px;padding:0px;max-height:100%;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-frame,.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image img{border:1px solid;border-color:#333333 #999999 #999999 #333333;background:#1a1a1a;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .soundcloud{border:0;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image{display:inline-block;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow{position:relative;z-index:1;background:#1a1a1a;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:before,.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:after{z-index:-1;position:absolute;content:"";bottom:15px;left:10px;width:50%;top:80%;max-width:300px;background:#999999;-webkit-box-shadow:0 15px 10px #999999;-moz-box-shadow:0 15px 10px #999999;box-shadow:0 15px 10px #999999;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-o-transform:rotate(-2deg);-ms-transform:rotate(-2deg);transform:rotate(-2deg);}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);-ms-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container span.messege{display:block;vertical-align:middle;margin-left:auto;margin-right:auto;text-align:center;background:#1a1a1a;font-size:28px;font-weight:bold;text-transform:uppercase;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text{display:table;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container{display:table-cell;vertical-align:middle;font-size:15px;line-height:20px;color:#aaaaaa;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container p{margin-bottom:20px;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote{font-size:15px;line-height:20px;color:#aaaaaa;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#1a1a1a;color:#ffffff;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote .quote-mark{color:#aaaaaa;}
@ -83,9 +91,10 @@
.slider .slider-item .content .content-container .media .media-wrapper .media-container .map{line-height:normal;z-index:200;text-align:left;background-color:#1a1a1a;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .map img{max-height:none !important;max-width:none !important;border:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .google-map{height:100%;width:100%;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .map-attribution{position:absolute;z-index:201;bottom:0px;width:100%;overflow:hidden;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .map-attribution .attribution-text{height:19px;overflow:hidden;-webkit-user-select:none;line-height:19px;margin-right:60px;padding-left:65px;font-family:Arial,sans-serif;font-size:10px;color:#444;white-space:nowrap;color:#1a1a1a;text-shadow:1px 1px 1px #aaaaaa;text-align:center;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .map-attribution .attribution-text a{color:#1a1a1a !important;}
.slider .slider-item .content .content-container .media .media-wrapper .credit{color:#999999;text-align:right;font-size:10px;line-height:10px;display:block;margin:0 auto;margin-top:4px;}
.slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#aaaaaa;font-size:11px;line-height:14px;}
.slider .slider-item .content .content-container .media .media-wrapper .credit{color:#999999;text-align:right;display:block;margin:0 auto;margin-top:6px;font-size:10px;line-height:13px;}
.slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#aaaaaa;font-size:11px;line-height:14px;text-rendering:optimizeLegibility;}
.slider .slider-item .content .media.text-media .media-wrapper .media-container{border:none;background-color:#1a1a1a;}
.slider .slider-item .content-container.layout-text-media .text-media{padding-right:15px;border-right:1px solid #e3e3e3;}
.slider .slider-item .content-container.layout-text{width:100%;}.slider .slider-item .content-container.layout-text .text{width:100%;max-width:100%;}.slider .slider-item .content-container.layout-text .text .container{display:block;vertical-align:middle;text-align:left;padding:0px;width:90%;text-align:left;margin-left:auto;margin-right:auto;}
.slider .slider-item .content-container.layout-media{width:100%;}.slider .slider-item .content-container.layout-media .text{width:100%;height:100%;max-width:100%;display:block;text-align:center;}.slider .slider-item .content-container.layout-media .text .container{display:block;text-align:center;width:100%;margin-left:none;margin-right:none;}
.slider .slider-item .content-container.layout-media .media{width:100%;min-width:50%;float:none;}.slider .slider-item .content-container.layout-media .media .media-wrapper{display:block;}.slider .slider-item .content-container.layout-media .media .media-wrapper .media-container{margin-left:auto;margin-right:auto;line-height:0px;padding:0px;}
@ -95,9 +104,9 @@
.vmm-timeline .navigation .toolbar .zoom-in .icon{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .zoom-out .icon{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .back-home .icon{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vmm-timeline .navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#262626;}.vmm-timeline .navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#1a1a1a;width:100%;height:49px;}.vmm-timeline .navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#1a1a1a;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vmm-timeline .navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#262626;}.vmm-timeline .navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#1a1a1a;width:100%;height:49px;-webkit-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);-moz-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);}.vmm-timeline .navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#1a1a1a;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vmm-timeline .navigation .timenav-background .timenav-line{position:absolute;top:0px;left:50%;width:3px;height:150px;background:#0bd4e3;z-index:201;-webkit-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);}
.vmm-timeline .navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:8px;}
.vmm-timeline .navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}
.vmm-timeline .navigation .timenav{position:absolute;top:0px;left:-250px;z-index:1;}.vmm-timeline .navigation .timenav .content{position:relative;}.vmm-timeline .navigation .timenav .content .marker.start{display:none;}
.vmm-timeline .navigation .timenav .content .marker.active .dot{background:#0bd4e3;z-index:200;}
.vmm-timeline .navigation .timenav .content .marker.active .line{z-index:199;background:#0bd4e3;width:1px;}.vmm-timeline .navigation .timenav .content .marker.active .line .event-line{background:#0bd4e3;filter:alpha(opacity=75);-khtml-opacity:0.75;-moz-opacity:0.75;opacity:0.75;}

23
compiled/css/timeline.css

@ -63,9 +63,17 @@
.slider .nav-next{float:right;text-align:right;}.slider .nav-next .icon{margin-left:61px;background-image:url(timeline.png);background-repeat:no-repeat;background-position:-184px 0;width:24px;height:24px;height:24px;overflow:hidden;}
.slider .nav-next .date,.slider .nav-next .title{text-align:right;padding-right:15px;}
.slider .nav-next:hover .icon{margin-left:66px;}
.slider .slider-item{position:absolute;width:700px;height:100%;padding:0px;margin:0px;display:table;}.slider .slider-item .content{display:table-cell;vertical-align:middle;}.slider .slider-item .content .content-container{display:table;vertical-align:middle;}.slider .slider-item .content .content-container .text{width:40%;max-width:50%;min-width:120px;display:table-cell;vertical-align:middle;}.slider .slider-item .content .content-container .text .container{display:table-cell;vertical-align:middle;text-align:left;padding-right:15px;}
.slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:left;}.slider .slider-item .content .content-container .media .media-wrapper{margin-left:auto;margin-right:auto;}.slider .slider-item .content .content-container .media .media-wrapper .media-container{display:inline-block;line-height:0px;padding:0px;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-frame,.slider .slider-item .content .content-container .media .media-wrapper .media-container img,.slider .slider-item .content .content-container .media .media-wrapper .media-container iframe{-webkit-box-shadow:0 1px 3px 0px rgba(0, 0, 0, 0.35);-moz-box-shadow:0 1px 3px 0px rgba(0, 0, 0, 0.35);box-shadow:0 1px 3px 0px rgba(0, 0, 0, 0.35);border:1px solid;border-color:#cccccc #999999 #999999 #cccccc;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container span.messege{display:block;vertical-align:middle;margin-left:auto;margin-right:auto;text-align:center;margin-top:50%;font-size:28px;font-weight:bold;text-transform:uppercase;}
.slider .slider-item{position:absolute;width:700px;height:100%;padding:0px;margin:0px;display:table;overflow-x:hidden;overflow-y:auto;}.slider .slider-item .content{display:table-cell;vertical-align:middle;}.slider .slider-item .content .pad-top .text .container{padding-top:15px;}
.slider .slider-item .content .pad-right .text .container{padding-right:15px;}
.slider .slider-item .content .pad-left .text .container{padding-left:30px;}
.slider .slider-item .content .content-container{display:table;vertical-align:middle;}.slider .slider-item .content .content-container .text{width:40%;max-width:50%;min-width:120px;display:table-cell;vertical-align:middle;}.slider .slider-item .content .content-container .text .container{display:table-cell;vertical-align:middle;text-align:left;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-wrap:break-word;}
.slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:left;}.slider .slider-item .content .content-container .media .media-wrapper{margin-left:auto;margin-right:auto;}.slider .slider-item .content .content-container .media .media-wrapper .media-container{display:inline-block;line-height:0px;padding:0px;max-height:100%;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-frame,.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image img{border:1px solid;border-color:#cccccc #999999 #999999 #cccccc;background:#ffffff;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .soundcloud{border:0;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image{display:inline-block;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow{position:relative;z-index:1;background:#ffffff;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:before,.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:after{z-index:-1;position:absolute;content:"";bottom:15px;left:10px;width:50%;top:80%;max-width:300px;background:#999999;-webkit-box-shadow:0 15px 10px #999999;-moz-box-shadow:0 15px 10px #999999;box-shadow:0 15px 10px #999999;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-o-transform:rotate(-2deg);-ms-transform:rotate(-2deg);transform:rotate(-2deg);}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);-ms-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container span.messege{display:block;vertical-align:middle;margin-left:auto;margin-right:auto;text-align:center;background:#ffffff;font-size:28px;font-weight:bold;text-transform:uppercase;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text{display:table;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container{display:table-cell;vertical-align:middle;font-size:15px;line-height:20px;color:#666666;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container p{margin-bottom:20px;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote{font-size:15px;line-height:20px;color:#666666;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;color:#000000;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote .quote-mark{color:#666666;}
@ -83,9 +91,10 @@
.slider .slider-item .content .content-container .media .media-wrapper .media-container .map{line-height:normal;z-index:200;text-align:left;background-color:#ffffff;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .map img{max-height:none !important;max-width:none !important;border:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .google-map{height:100%;width:100%;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .map-attribution{position:absolute;z-index:201;bottom:0px;width:100%;overflow:hidden;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .map-attribution .attribution-text{height:19px;overflow:hidden;-webkit-user-select:none;line-height:19px;margin-right:60px;padding-left:65px;font-family:Arial,sans-serif;font-size:10px;color:#444;white-space:nowrap;color:#ffffff;text-shadow:1px 1px 1px #333333;text-align:center;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .map .map-attribution .attribution-text a{color:#ffffff !important;}
.slider .slider-item .content .content-container .media .media-wrapper .credit{color:#999999;text-align:right;font-size:10px;line-height:10px;display:block;margin:0 auto;margin-top:4px;}
.slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#666666;font-size:11px;line-height:14px;}
.slider .slider-item .content .content-container .media .media-wrapper .credit{color:#999999;text-align:right;display:block;margin:0 auto;margin-top:6px;font-size:10px;line-height:13px;}
.slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#666666;font-size:11px;line-height:14px;text-rendering:optimizeLegibility;}
.slider .slider-item .content .media.text-media .media-wrapper .media-container{border:none;background-color:#ffffff;}
.slider .slider-item .content-container.layout-text-media .text-media{padding-right:15px;border-right:1px solid #e3e3e3;}
.slider .slider-item .content-container.layout-text{width:100%;}.slider .slider-item .content-container.layout-text .text{width:100%;max-width:100%;}.slider .slider-item .content-container.layout-text .text .container{display:block;vertical-align:middle;text-align:left;padding:0px;width:90%;text-align:left;margin-left:auto;margin-right:auto;}
.slider .slider-item .content-container.layout-media{width:100%;}.slider .slider-item .content-container.layout-media .text{width:100%;height:100%;max-width:100%;display:block;text-align:center;}.slider .slider-item .content-container.layout-media .text .container{display:block;text-align:center;width:100%;margin-left:none;margin-right:none;}
.slider .slider-item .content-container.layout-media .media{width:100%;min-width:50%;float:none;}.slider .slider-item .content-container.layout-media .media .media-wrapper{display:block;}.slider .slider-item .content-container.layout-media .media .media-wrapper .media-container{margin-left:auto;margin-right:auto;line-height:0px;padding:0px;}
@ -95,9 +104,9 @@
.vmm-timeline .navigation .toolbar .zoom-in .icon{background-image:url(timeline.png);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .zoom-out .icon{background-image:url(timeline.png);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .back-home .icon{background-image:url(timeline.png);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vmm-timeline .navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#e9e9e9;}.vmm-timeline .navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#ffffff;width:100%;height:49px;}.vmm-timeline .navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#ffffff;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vmm-timeline .navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#e9e9e9;}.vmm-timeline .navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#ffffff;width:100%;height:49px;-webkit-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);-moz-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);}.vmm-timeline .navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#ffffff;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vmm-timeline .navigation .timenav-background .timenav-line{position:absolute;top:0px;left:50%;width:3px;height:150px;background:#0088cc;z-index:201;-webkit-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);}
.vmm-timeline .navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(timeline.png);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:8px;}
.vmm-timeline .navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(timeline.png);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}
.vmm-timeline .navigation .timenav{position:absolute;top:0px;left:-250px;z-index:1;}.vmm-timeline .navigation .timenav .content{position:relative;}.vmm-timeline .navigation .timenav .content .marker.start{display:none;}
.vmm-timeline .navigation .timenav .content .marker.active .dot{background:#0088cc;z-index:200;}
.vmm-timeline .navigation .timenav .content .marker.active .line{z-index:199;background:#0088cc;width:1px;}.vmm-timeline .navigation .timenav .content .marker.active .line .event-line{background:#0088cc;filter:alpha(opacity=75);-khtml-opacity:0.75;-moz-opacity:0.75;opacity:0.75;}

8
compiled/js/locale/de.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/en.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/es.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/fr.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/is.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/it.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/kr.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/nl.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/pt-br.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/zh-ch.js

File diff suppressed because one or more lines are too long

8
compiled/js/locale/zh-tw.js

File diff suppressed because one or more lines are too long

8
compiled/js/timeline-min.js vendored

File diff suppressed because one or more lines are too long

142
compiled/js/timeline.js

@ -125,6 +125,13 @@ if (typeof VMM == 'undefined') {
return this;
},
sizes: {
api: {
width: 0,
height: 0
}
},
vp: "Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo",
api_keys_master: {
@ -133,6 +140,13 @@ if (typeof VMM == 'undefined') {
twitter: ""
},
flickr: {
active: false,
array: [],
api_loaded: false,
que: []
},
youtube: {
active: false,
array: [],
@ -197,7 +211,7 @@ if (typeof VMM == 'undefined') {
};
if (styles != null && styles != "") {
ce += " " + styles;
ce += " style='" + styles + "'";
};
ce += ">";
@ -1111,28 +1125,28 @@ if(typeof VMM != 'undefined' && typeof VMM.MediaElement == 'undefined') {
}
// IMAGE
if (m.type == "image") {
mediaElem = "<img src='" + m.id + "'>";
mediaElem = "<div class='media-image media-shadow'><img src='" + m.id + "' class='media-image'></div>";
// FLICKR
} else if (m.type == "flickr") {
_id = "flickr_" + m.id;
mediaElem = "<a href='" + m.link + "' target='_blank'><img id='" + _id + "_large" + "'></a>";
mediaElem = "<div class='media-image media-shadow'><a href='" + m.link + "' target='_blank'><img id='" + _id + "_large" + "'></a></div>";
VMM.ExternalAPI.flickr.get(m.id, "#" + _id);
// GOOGLE DOCS
} else if (m.type == "googledoc") {
_id = "googledoc_" + VMM.Util.unique_ID(5);
mediaElem = "<div class='media-frame doc' id='" + _id + "'><span class='messege'><p>Loading Document</p></span></div>";
mediaElem = "<div class='media-frame media-shadow doc' id='" + _id + "'><span class='messege'><p>Loading Document</p></span></div>";
VMM.ExternalAPI.googledocs.get(m.id, _id);
// YOUTUBE
} else if (m.type == "youtube") {
mediaElem = "<div class='media-frame video youtube' id='youtube_" + m.id + "'><span class='messege'><p>Loading YouTube video</p></span></div>";
mediaElem = "<div class='media-shadow'><div class='media-frame video youtube' id='youtube_" + m.id + "'><span class='messege'><p>Loading YouTube video</p></span></div></div>";
VMM.ExternalAPI.youtube.get(m.id);
// VIMEO
} else if (m.type == "vimeo") {
mediaElem = "<iframe class='media-frame video vimeo' autostart='false' frameborder='0' width='100%' height='100%' src='http://player.vimeo.com/video/" + m.id + "?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff'></iframe>";
mediaElem = "<div class='media-shadow'><iframe class='media-frame video vimeo' autostart='false' frameborder='0' width='100%' height='100%' src='http://player.vimeo.com/video/" + m.id + "?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff'></iframe></div>";
VMM.ExternalAPI.vimeo.get(m.id);
// DAILYMOTION
} else if (m.type == "dailymotion") {
mediaElem = "<iframe class='media-frame video dailymotion' autostart='false' frameborder='0' width='100%' height='100%' src='http://www.dailymotion.com/embed/video/" + m.id + "'></iframe>";
mediaElem = "<div class='media-shadow'><iframe class='media-frame video dailymotion' autostart='false' frameborder='0' width='100%' height='100%' src='http://www.dailymotion.com/embed/video/" + m.id + "'></iframe></div>";
// TWITTER
} else if (m.type == "twitter"){
mediaElem = "<div class='twitter' id='" + "twitter_" + m.id + "'><span class='messege'><p>Loading Tweet</p></span></div>";
@ -1140,29 +1154,32 @@ if(typeof VMM != 'undefined' && typeof VMM.MediaElement == 'undefined') {
VMM.ExternalAPI.twitter.prettyHTML(m.id);
// TWITTER
} else if (m.type == "twitter-ready") {
isTextMedia = true;
mediaElem = m.id;
// SOUNDCLOUD
} else if (m.type == "soundcloud") {
_id = "soundcloud_" + VMM.Util.unique_ID(5);
mediaElem = "<div class='media-frame soundcloud' id='" + _id + "'><span class='messege'><p>Loading Sound</p></span></div>";
mediaElem = "<div class='media-frame media-shadow soundcloud' id='" + _id + "'><span class='messege'><p>Loading Sound</p></span></div>";
VMM.ExternalAPI.soundcloud.get(m.id, _id);
// GOOGLE MAPS
} else if (m.type == "google-map") {
_id = "googlemap_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='media-frame map' id='" + _id + "'><span class='messege'><p>Loading Map</p></span></div>";
mediaElem = "<div class='media-frame media-shadow map' id='" + _id + "'><span class='messege'><p>Loading Map</p></span></div>";
VMM.ExternalAPI.googlemaps.get(m.id, _id);
// WIKIPEDIA
} else if (m.type == "wikipedia") {
_id = "wikipedia_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='wikipedia' id='" + _id + "'><span class='messege'><p>Loading Wikipedia</p></span></div>";
isTextMedia = true;
VMM.ExternalAPI.wikipedia.get(m.id, _id);
// UNKNOWN
} else if (m.type == "unknown") {
trace("NO KNOWN MEDIA TYPE FOUND TRYING TO JUST PLACE THE HTML");
isTextMedia = true;
mediaElem = "<div class='plain-text'><div class='container'>" + VMM.Util.properQuotes(m.id) + "</div></div>";
// WEBSITE
} else if (m.type == "website") {
mediaElem = "<iframe class='media-frame website' frameborder='0' autostart='false' width='100%' height='100%' scrolling='yes' marginheight='0' marginwidth='0' src='" + m.id + "'></iframe>";
mediaElem = "<div class='media-shadow'><iframe class='media-frame website' frameborder='0' autostart='false' width='100%' height='100%' scrolling='yes' marginheight='0' marginwidth='0' src='" + m.id + "'></iframe></div>";
//mediaElem = "<a href='" + m.id + "' target='_blank'>" + "<img src='http://api.snapito.com/free/lc?url=" + m.id + "'></a>";
// NO MATCH
} else {
@ -2011,7 +2028,6 @@ if(typeof VMM != 'undefined' && typeof VMM.ExternalAPI == 'undefined') {
} else {
api_key = Aes.Ctr.decrypt(VMM.master_config.api_keys_master.flickr, VMM.master_config.vp, 256)
}
var the_url = "http://api.flickr.com/services/rest/?method=flickr.photos.getSizes&api_key=" + api_key + "&photo_id=" + mid + "&format=json&jsoncallback=?";
VMM.getJSON(the_url, VMM.ExternalAPI.flickr.create);
},
@ -2021,23 +2037,45 @@ if(typeof VMM != 'undefined' && typeof VMM.ExternalAPI == 'undefined') {
var id = "flickr_" + flickr_id;
var flickr_large_id = id + "_large";
var flickr_thumb_id = id + "_thumb";
// FIND LARGE SIZE
var flickr_img_large;
var flickr_large_found = false;
var flickr_img_size, flickr_img_thumb, flickr_size_found = false;
var flickr_best_size = "Large";
flickr_best_size = VMM.ExternalAPI.flickr.sizes(VMM.master_config.sizes.api.height);
for(var i = 0; i < d.sizes.size.length; i++) {
if (d.sizes.size[i].label == "Large") {
flickr_large_found = true;
flickr_img_large = d.sizes.size[i].source;
if (d.sizes.size[i].label == flickr_best_size) {
flickr_size_found = true;
flickr_img_size = d.sizes.size[i].source;
}
}
if (!flickr_large_found) {
flickr_img_large = d.sizes.size[d.sizes.size.length - 1].source;
if (!flickr_size_found) {
flickr_img_size = d.sizes.size[d.sizes.size.length - 1].source;
}
var flickr_img_thumb = d.sizes.size[0].source;
VMM.Lib.attr("#"+flickr_large_id, "src", flickr_img_large);
flickr_img_thumb = d.sizes.size[0].source;
VMM.Lib.attr("#"+flickr_large_id, "src", flickr_img_size);
VMM.attachElement("#"+flickr_thumb_id, "<img src='" + flickr_img_thumb + "'>");
//VMM.Lib.attr("#"+flickr_thumb_id, "src", flickr_img_thumb);
},
sizes: function(s) {
var _size = "";
if (s <= 75) {
_size = "Thumbnail";
} else if (s <= 180) {
_size = "Small";
} else if (s <= 240) {
_size = "Small 320";
} else if (s <= 375) {
_size = "Medium";
} else if (s <= 480) {
_size = "Medium 640";
} else if (s <= 600) {
_size = "Medium 800";
} else {
_size = "Large";
}
return _size;
}
},
@ -2890,7 +2928,7 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var preloadTimeOutSlides = function() {
for(var j = 0; j < config.preload; j++) {
if ( !((current_slide + j) >= slides.length - 1)) {
if ( !((current_slide + j) > slides.length - 1)) {
slides[current_slide + j].show();
}
if ( !( (current_slide - j) < 0 ) ) {
@ -2926,6 +2964,9 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
}
}
VMM.master_config.sizes.api.width = mediasize.media.width;
VMM.master_config.sizes.api.height = mediasize.media.height;
mediasize.text_media.video = VMM.Util.ratio.fit(mediasize.text_media.width, mediasize.text_media.height, 16, 9);
mediasize.media.video = VMM.Util.ratio.fit(mediasize.media.width, mediasize.media.height, 16, 9);
@ -2958,20 +2999,13 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
VMM.Lib.css(".slider-item .layout-text-media .text .container", "width", config.slider.content.width );
VMM.Lib.css(".slider-item .layout-text-media .media", "float", "none" );
VMM.Lib.addClass(".slider-item .content-container", "pad-top");
VMM.Lib.css(".slider-item .media blockquote p", "line-height", "18px" );
VMM.Lib.css(".slider-item .media blockquote p", "font-size", "16px" );
VMM.Lib.css(".slider-item", "overflow-y", "auto" );
// MAINTAINS VERTICAL CENTER IF IT CAN
for(var i = 0; i < slides.length; i++) {
if (VMM.Lib.height(VMM.Lib.find( slides[i], ".content")) > config.slider.height) {
slides[i].css("display", "block");
} else {
slides[i].css("display", "table");
}
}
} else {
@ -2980,6 +3014,9 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
VMM.Lib.css(".slider-item .layout-text-media .text .container", "display", "table-cell" );
VMM.Lib.css(".slider-item .layout-text-media .text .container", "width", "auto" );
//VMM.Lib.addClass(".slider-item .content-container", "pad-left");
VMM.Lib.removeClass(".slider-item .content-container", "pad-top");
VMM.Lib.css(".slider-item .layout-text-media .media", "float", "left" );
VMM.Lib.css(".slider-item .layout-text-media", "display", "table" );
@ -3030,7 +3067,15 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
VMM.Lib.height( layout_text_media + ".doc", mediasize.text_media.height);
VMM.Lib.height( layout_media + ".doc", mediasize.media.height);
trace(mediasize);
// MAINTAINS VERTICAL CENTER IF IT CAN
for(var i = 0; i < slides.length; i++) {
if (slides[i].content_height() > config.slider.height + 20) {
slides[i].css("display", "block");
} else {
slides[i].css("display", "table");
}
}
}
/* POSITION SLIDES
@ -3039,7 +3084,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var pos = 0;
for(var i = 0; i < slides.length; i++) {
pos = i * (config.slider.width+config.spacing);
//VMM.Lib.css(slides[i], "left", pos);
slides[i].leftpos(pos);
}
}
@ -3050,13 +3094,10 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var _ease = "linear";
for(var i = 0; i < slides.length; i++) {
if (i == current_slide) {
//VMM.Lib.animate(slides[i], config.duration, _ease, {"opacity": 1});
slides[i].animate(config.duration, _ease, {"opacity": 1});
} else if (i == current_slide - 1 || i == current_slide + 1) {
//VMM.Lib.animate(slides[i], config.duration, _ease, {"opacity": 0.1});
slides[i].animate(config.duration, _ease, {"opacity": 0.1});
} else {
//VMM.Lib.css(slides[i], "opacity", n);
slides[i].opacity(n);
}
}
@ -3080,7 +3121,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var is_first = false;
var _pos = slides[current_slide].leftpos();
var _title = "";
//var _pos = VMM.Lib.position(slides[current_slide]);
if (current_slide == 0) {is_first = true};
if (current_slide +1 >= slides.length) {is_last = true};
@ -3089,7 +3129,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
/* set proper nav titles and dates etc.
================================================== */
trace(data[current_slide]);
if (is_first) {
VMM.Lib.visible(navigation.prevBtn, false);
} else {
@ -3142,8 +3181,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
/* SET Vertical Scoll
================================================== */
//opacitySlides(0.85);
//if (VMM.Lib.height(slides[current_slide]) > config.slider_height) {
if (slides[current_slide].height() > config.slider_height) {
VMM.Lib.css(".slider", "overflow-y", "scroll" );
} else {
@ -3152,7 +3189,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
}
preloadSlides();
//VMM.Lib.css(navigation.nextBtnContainer, "left", ( VMM.Lib.width(navigation.nextBtnContainer) - config.slider.nav.width) );
}
/* BUILD NAVIGATION
@ -3273,7 +3309,6 @@ if (typeof VMM.Slider != 'undefined') {
if(typeof p != 'undefined') {
VMM.Lib.css(element, "left", p);
} else {
trace("LEFT: " + VMM.Lib.position(element).left);
return VMM.Lib.position(element).left
}
};
@ -3298,6 +3333,16 @@ if (typeof VMM.Slider != 'undefined') {
return VMM.Lib.height(element);
};
this.content_height = function () {
var ch = VMM.Lib.find( element, ".content")[0];
if (ch != 'undefined' && ch != null) {
return VMM.Lib.height(ch);
} else {
return 0;
}
}
/* PRIVATE
================================================== */
var render = function() {
@ -3369,7 +3414,13 @@ if (typeof VMM.Slider != 'undefined') {
if (c.has.text) { c.layout += "-text" };
if (c.has.media){ c.layout += "-media" };
//c.slide = VMM.createElement("div", c.text + c.media, c.layout);
if (c.has.text) {
c.slide = VMM.createElement("div", c.media + c.text, c.layout + " pad-left");
} else {
c.slide = VMM.createElement("div", c.text + c.media, c.layout);
}
c_wrap = VMM.createElement("div", c.slide, "content");
/* RETURN
@ -3577,7 +3628,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') {
var _d_array; // DATE ARRAY
var _t_array; // TIME ARRAY
if ( d.match(/,/gi) ) {
trace("DATE HAS ,");
_d_array = d.split(",");
for(var i = 0; i < _d_array.length; i++) {
_d_array[i] = parseInt(_d_array[i]);
@ -3590,7 +3640,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Util == 'undefined') {
if ( _d_array[5] > 1 ) { _date.setSeconds( _d_array[5]); }
if ( _d_array[6] > 1 ) { _date.setMilliseconds( _d_array[6]); }
} else if (d.match("/")) {
trace("DATE HAS /");
var _time_parse;
var _times;
if (d.match(" ")) {
@ -5544,7 +5593,7 @@ if(typeof VMM != 'undefined' && typeof VMM.Timeline == 'undefined') {
timeline_id = "#timeline";
}
version = "1.20";
version = "1.25";
trace("TIMELINE VERSION " + version);
@ -6109,6 +6158,7 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.TimeNav == 'undefin
function reSize(firstrun) {
VMM.Lib.css($timenavline, "left", Math.round(config.width/2)+2);
VMM.Lib.css($timenavindicator, "left", Math.round(config.width/2)-8);
goToMarker(config.current_slide, config.ease, config.duration, true, firstrun);
};
@ -7225,7 +7275,7 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
_date.startDate = VMM.Lib.html(VMM.Lib.find(this, "time")[0]);
if (VMM.Lib.find(this, "time")[1]) {
_date.endDate = VMM.Lib.html(VMM.Lib.find(this, "time")[0]);
_date.endDate = VMM.Lib.html(VMM.Lib.find(this, "time")[1]);
}
_date.headline = VMM.Lib.html(VMM.Lib.find(this, "h3"));

21
source/js/VMM.MediaElement.js

@ -94,28 +94,28 @@ if(typeof VMM != 'undefined' && typeof VMM.MediaElement == 'undefined') {
}
// IMAGE
if (m.type == "image") {
mediaElem = "<img src='" + m.id + "'>";
mediaElem = "<div class='media-image media-shadow'><img src='" + m.id + "' class='media-image'></div>";
// FLICKR
} else if (m.type == "flickr") {
_id = "flickr_" + m.id;
mediaElem = "<a href='" + m.link + "' target='_blank'><img id='" + _id + "_large" + "'></a>";
mediaElem = "<div class='media-image media-shadow'><a href='" + m.link + "' target='_blank'><img id='" + _id + "_large" + "'></a></div>";
VMM.ExternalAPI.flickr.get(m.id, "#" + _id);
// GOOGLE DOCS
} else if (m.type == "googledoc") {
_id = "googledoc_" + VMM.Util.unique_ID(5);
mediaElem = "<div class='media-frame doc' id='" + _id + "'><span class='messege'><p>Loading Document</p></span></div>";
mediaElem = "<div class='media-frame media-shadow doc' id='" + _id + "'><span class='messege'><p>Loading Document</p></span></div>";
VMM.ExternalAPI.googledocs.get(m.id, _id);
// YOUTUBE
} else if (m.type == "youtube") {
mediaElem = "<div class='media-frame video youtube' id='youtube_" + m.id + "'><span class='messege'><p>Loading YouTube video</p></span></div>";
mediaElem = "<div class='media-shadow'><div class='media-frame video youtube' id='youtube_" + m.id + "'><span class='messege'><p>Loading YouTube video</p></span></div></div>";
VMM.ExternalAPI.youtube.get(m.id);
// VIMEO
} else if (m.type == "vimeo") {
mediaElem = "<iframe class='media-frame video vimeo' autostart='false' frameborder='0' width='100%' height='100%' src='http://player.vimeo.com/video/" + m.id + "?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff'></iframe>";
mediaElem = "<div class='media-shadow'><iframe class='media-frame video vimeo' autostart='false' frameborder='0' width='100%' height='100%' src='http://player.vimeo.com/video/" + m.id + "?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff'></iframe></div>";
VMM.ExternalAPI.vimeo.get(m.id);
// DAILYMOTION
} else if (m.type == "dailymotion") {
mediaElem = "<iframe class='media-frame video dailymotion' autostart='false' frameborder='0' width='100%' height='100%' src='http://www.dailymotion.com/embed/video/" + m.id + "'></iframe>";
mediaElem = "<div class='media-shadow'><iframe class='media-frame video dailymotion' autostart='false' frameborder='0' width='100%' height='100%' src='http://www.dailymotion.com/embed/video/" + m.id + "'></iframe></div>";
// TWITTER
} else if (m.type == "twitter"){
mediaElem = "<div class='twitter' id='" + "twitter_" + m.id + "'><span class='messege'><p>Loading Tweet</p></span></div>";
@ -123,29 +123,32 @@ if(typeof VMM != 'undefined' && typeof VMM.MediaElement == 'undefined') {
VMM.ExternalAPI.twitter.prettyHTML(m.id);
// TWITTER
} else if (m.type == "twitter-ready") {
isTextMedia = true;
mediaElem = m.id;
// SOUNDCLOUD
} else if (m.type == "soundcloud") {
_id = "soundcloud_" + VMM.Util.unique_ID(5);
mediaElem = "<div class='media-frame soundcloud' id='" + _id + "'><span class='messege'><p>Loading Sound</p></span></div>";
mediaElem = "<div class='media-frame media-shadow soundcloud' id='" + _id + "'><span class='messege'><p>Loading Sound</p></span></div>";
VMM.ExternalAPI.soundcloud.get(m.id, _id);
// GOOGLE MAPS
} else if (m.type == "google-map") {
_id = "googlemap_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='media-frame map' id='" + _id + "'><span class='messege'><p>Loading Map</p></span></div>";
mediaElem = "<div class='media-frame media-shadow map' id='" + _id + "'><span class='messege'><p>Loading Map</p></span></div>";
VMM.ExternalAPI.googlemaps.get(m.id, _id);
// WIKIPEDIA
} else if (m.type == "wikipedia") {
_id = "wikipedia_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='wikipedia' id='" + _id + "'><span class='messege'><p>Loading Wikipedia</p></span></div>";
isTextMedia = true;
VMM.ExternalAPI.wikipedia.get(m.id, _id);
// UNKNOWN
} else if (m.type == "unknown") {
trace("NO KNOWN MEDIA TYPE FOUND TRYING TO JUST PLACE THE HTML");
isTextMedia = true;
mediaElem = "<div class='plain-text'><div class='container'>" + VMM.Util.properQuotes(m.id) + "</div></div>";
// WEBSITE
} else if (m.type == "website") {
mediaElem = "<iframe class='media-frame website' frameborder='0' autostart='false' width='100%' height='100%' scrolling='yes' marginheight='0' marginwidth='0' src='" + m.id + "'></iframe>";
mediaElem = "<div class='media-shadow'><iframe class='media-frame website' frameborder='0' autostart='false' width='100%' height='100%' scrolling='yes' marginheight='0' marginwidth='0' src='" + m.id + "'></iframe></div>";
//mediaElem = "<a href='" + m.id + "' target='_blank'>" + "<img src='http://api.snapito.com/free/lc?url=" + m.id + "'></a>";
// NO MATCH
} else {

17
source/js/VMM.Slider.Slide.js

@ -36,7 +36,6 @@ if (typeof VMM.Slider != 'undefined') {
if(typeof p != 'undefined') {
VMM.Lib.css(element, "left", p);
} else {
trace("LEFT: " + VMM.Lib.position(element).left);
return VMM.Lib.position(element).left
}
};
@ -61,6 +60,16 @@ if (typeof VMM.Slider != 'undefined') {
return VMM.Lib.height(element);
};
this.content_height = function () {
var ch = VMM.Lib.find( element, ".content")[0];
if (ch != 'undefined' && ch != null) {
return VMM.Lib.height(ch);
} else {
return 0;
}
}
/* PRIVATE
================================================== */
var render = function() {
@ -132,7 +141,13 @@ if (typeof VMM.Slider != 'undefined') {
if (c.has.text) { c.layout += "-text" };
if (c.has.media){ c.layout += "-media" };
//c.slide = VMM.createElement("div", c.text + c.media, c.layout);
if (c.has.text) {
c.slide = VMM.createElement("div", c.media + c.text, c.layout + " pad-left");
} else {
c.slide = VMM.createElement("div", c.text + c.media, c.layout);
}
c_wrap = VMM.createElement("div", c.slide, "content");
/* RETURN

36
source/js/VMM.Slider.js

@ -285,7 +285,7 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var preloadTimeOutSlides = function() {
for(var j = 0; j < config.preload; j++) {
if ( !((current_slide + j) >= slides.length - 1)) {
if ( !((current_slide + j) > slides.length - 1)) {
slides[current_slide + j].show();
}
if ( !( (current_slide - j) < 0 ) ) {
@ -321,6 +321,9 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
}
}
VMM.master_config.sizes.api.width = mediasize.media.width;
VMM.master_config.sizes.api.height = mediasize.media.height;
mediasize.text_media.video = VMM.Util.ratio.fit(mediasize.text_media.width, mediasize.text_media.height, 16, 9);
mediasize.media.video = VMM.Util.ratio.fit(mediasize.media.width, mediasize.media.height, 16, 9);
@ -353,20 +356,13 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
VMM.Lib.css(".slider-item .layout-text-media .text .container", "width", config.slider.content.width );
VMM.Lib.css(".slider-item .layout-text-media .media", "float", "none" );
VMM.Lib.addClass(".slider-item .content-container", "pad-top");
VMM.Lib.css(".slider-item .media blockquote p", "line-height", "18px" );
VMM.Lib.css(".slider-item .media blockquote p", "font-size", "16px" );
VMM.Lib.css(".slider-item", "overflow-y", "auto" );
// MAINTAINS VERTICAL CENTER IF IT CAN
for(var i = 0; i < slides.length; i++) {
if (VMM.Lib.height(VMM.Lib.find( slides[i], ".content")) > config.slider.height) {
slides[i].css("display", "block");
} else {
slides[i].css("display", "table");
}
}
} else {
@ -375,6 +371,9 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
VMM.Lib.css(".slider-item .layout-text-media .text .container", "display", "table-cell" );
VMM.Lib.css(".slider-item .layout-text-media .text .container", "width", "auto" );
//VMM.Lib.addClass(".slider-item .content-container", "pad-left");
VMM.Lib.removeClass(".slider-item .content-container", "pad-top");
VMM.Lib.css(".slider-item .layout-text-media .media", "float", "left" );
VMM.Lib.css(".slider-item .layout-text-media", "display", "table" );
@ -425,7 +424,15 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
VMM.Lib.height( layout_text_media + ".doc", mediasize.text_media.height);
VMM.Lib.height( layout_media + ".doc", mediasize.media.height);
trace(mediasize);
// MAINTAINS VERTICAL CENTER IF IT CAN
for(var i = 0; i < slides.length; i++) {
if (slides[i].content_height() > config.slider.height + 20) {
slides[i].css("display", "block");
} else {
slides[i].css("display", "table");
}
}
}
/* POSITION SLIDES
@ -434,7 +441,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var pos = 0;
for(var i = 0; i < slides.length; i++) {
pos = i * (config.slider.width+config.spacing);
//VMM.Lib.css(slides[i], "left", pos);
slides[i].leftpos(pos);
}
}
@ -445,13 +451,10 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var _ease = "linear";
for(var i = 0; i < slides.length; i++) {
if (i == current_slide) {
//VMM.Lib.animate(slides[i], config.duration, _ease, {"opacity": 1});
slides[i].animate(config.duration, _ease, {"opacity": 1});
} else if (i == current_slide - 1 || i == current_slide + 1) {
//VMM.Lib.animate(slides[i], config.duration, _ease, {"opacity": 0.1});
slides[i].animate(config.duration, _ease, {"opacity": 0.1});
} else {
//VMM.Lib.css(slides[i], "opacity", n);
slides[i].opacity(n);
}
}
@ -475,7 +478,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
var is_first = false;
var _pos = slides[current_slide].leftpos();
var _title = "";
//var _pos = VMM.Lib.position(slides[current_slide]);
if (current_slide == 0) {is_first = true};
if (current_slide +1 >= slides.length) {is_last = true};
@ -484,7 +486,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
/* set proper nav titles and dates etc.
================================================== */
trace(data[current_slide]);
if (is_first) {
VMM.Lib.visible(navigation.prevBtn, false);
} else {
@ -537,8 +538,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
/* SET Vertical Scoll
================================================== */
//opacitySlides(0.85);
//if (VMM.Lib.height(slides[current_slide]) > config.slider_height) {
if (slides[current_slide].height() > config.slider_height) {
VMM.Lib.css(".slider", "overflow-y", "scroll" );
} else {
@ -547,7 +546,6 @@ if(typeof VMM != 'undefined' && typeof VMM.Slider == 'undefined') {
}
preloadSlides();
//VMM.Lib.css(navigation.nextBtnContainer, "left", ( VMM.Lib.width(navigation.nextBtnContainer) - config.slider.nav.width) );
}
/* BUILD NAVIGATION

1
source/js/VMM.Timeline.TimeNav.js

@ -98,6 +98,7 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.TimeNav == 'undefin
function reSize(firstrun) {
VMM.Lib.css($timenavline, "left", Math.round(config.width/2)+2);
VMM.Lib.css($timenavindicator, "left", Math.round(config.width/2)-8);
goToMarker(config.current_slide, config.ease, config.duration, true, firstrun);
};

2
source/js/VMM.Timeline.js

@ -62,7 +62,7 @@ if(typeof VMM != 'undefined' && typeof VMM.Timeline == 'undefined') {
timeline_id = "#timeline";
}
version = "1.20";
version = "1.25";
trace("TIMELINE VERSION " + version);

16
source/js/VMM.js

@ -103,6 +103,13 @@ if (typeof VMM == 'undefined') {
return this;
},
sizes: {
api: {
width: 0,
height: 0
}
},
vp: "Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo",
api_keys_master: {
@ -111,6 +118,13 @@ if (typeof VMM == 'undefined') {
twitter: ""
},
flickr: {
active: false,
array: [],
api_loaded: false,
que: []
},
youtube: {
active: false,
array: [],
@ -175,7 +189,7 @@ if (typeof VMM == 'undefined') {
};
if (styles != null && styles != "") {
ce += " " + styles;
ce += " style='" + styles + "'";
};
ce += ">";

118
source/less/VMM.Slider.less

@ -137,16 +137,39 @@
margin:0px;
//overflow: hidden;
display:table;
overflow-x:hidden;
overflow-y:auto;
.content {
display:table-cell;
vertical-align:middle;
/* All Slides
================================================== */
.pad-top {
.text {
.container {
padding-top: @base-space;
}
}
}
.pad-right {
.text {
.container {
padding-right: @base-space;
}
}
}
.pad-left {
.text {
.container {
padding-left: @base-space*2;
}
}
}
.content-container {
display:table;
vertical-align:middle;
.text {
width:40%;
max-width:50%;
@ -157,7 +180,11 @@
display:table-cell;
vertical-align:middle;
text-align:left;
padding-right: @base-space;
-webkit-hyphens:auto;
-moz-hyphens:auto;
-ms-hyphens:auto;
hyphens:auto;
word-wrap:break-word;
}
}
.media {
@ -169,20 +196,69 @@
margin-right: auto;
.media-container {
display:inline-block;
//overflow: hidden;
line-height:0px;
padding:0px;
//max-height:400px;
.media-frame, img, iframe {
.media-shadow();
max-height:100%;
//overflow:hidden;
/* MEDIA SHADOWS AND BORDERS
================================================== */
.media-frame, .media-image img {
border: 1px solid;
border-color: @color-line @color-dark-fourth @color-dark-fourth @color-line;
background:@color-background;
}
.soundcloud {
border: 0;
}
.media-image {
display: inline-block;
}
.media-shadow {
position: relative;
z-index: 1;
background:@color-background;
}
.media-shadow:before, .media-shadow:after {
z-index: -1;
position: absolute;
content: "";
bottom: 15px;
left: 10px;
width: 50%;
top: 80%;
max-width:300px;
background: @color-dark-fourth;
-webkit-box-shadow: 0 15px 10px @color-dark-fourth;
-moz-box-shadow: 0 15px 10px @color-dark-fourth;
box-shadow: 0 15px 10px @color-dark-fourth;
-webkit-transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
}
.media-shadow::after {
-webkit-transform: rotate(2deg);
-moz-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
right: 10px;
left: auto;
}
span.messege {
display:block;
vertical-align:middle;
margin-left:auto;
margin-right:auto;
text-align:center;
margin-top: 50%;
background:@color-background;
//margin-top: 50%;
font-size: 28px;
font-weight: bold;
text-transform: uppercase;
@ -359,18 +435,22 @@
.credit {
color: @color-credit;
text-align: right;
font-size: 10px;
line-height: 10px;
display: block;
margin: 0 auto;
margin-top:4px;
margin-top:6px;
.text-font(@base-font-small - 1);
//max-height:16px;
//overflow:auto;
}
.caption {
text-align:left;
margin-top:10px;
margin-top:@base-font-small - 1;
color: @color-caption;
font-size: 11px;
line-height: 14px;
.text-font(@base-font-small);
text-rendering: optimizeLegibility;
//max-height:45px;
//overflow-x:hidden;
//overflow-y:auto;
}
}
}
@ -385,6 +465,16 @@
}
}
/* Text and Media Slides
================================================== */
.content-container.layout-text-media {
.text-media {
padding-right:@base-space;
border-right: 1px solid @color-dark-fifth;//@color-line;
}
}
/* Text Only Slides
================================================== */
.content-container.layout-text {

5
source/less/VMM.Timeline.TimeNav.less

@ -105,7 +105,7 @@
background:@white;
width:100%;
height:@navigation-time-height - 1;
.box-shadow(-1px -1px 7px rgba(0,0,0,.1));
//.box-shadow(1px -1px 0px rgba(255,255,255,.70));
.top-highlight {
position:absolute;
@ -136,7 +136,8 @@
top: -1px;
left: 50%;
z-index:202;
.icon-currenttime()
.icon-currenttime();
}
}

3
source/less/VMM.Timeline.less

@ -1,5 +1,6 @@
/*!
TIMELINE 0.98
TIMELINE CSS
Designed and built by Zach Wise at VeriteCo
This program is free software: you can redistribute it and/or modify

7
source/less/Variables.less

@ -78,12 +78,15 @@
-moz-box-shadow: @shadow;
box-shadow: @shadow;
}
.media-shadow(@shadow: 0 1px 3px 0px rgba(0,0,0,0.35)) {
.media-shadow(@shadow: 0 1px 3px 0px @color-dark-fourth) {
-webkit-box-shadow: @shadow;
-moz-box-shadow: @shadow;
box-shadow: @shadow;
border: 1px solid;
border-color: @color-line @color-dark-fourth @color-dark-fourth @color-line;
//border-color: @color-line @color-line-hover @color-line-hover @color-line;
}
.text-font(@fontsize: 15px) {
font-size: @fontsize;
line-height: round((@fontsize/100) * 130);
}

Loading…
Cancel
Save