From fc7ba0f29f549820885fcb11e88c68256d3eacca Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 14 Apr 2015 14:54:22 -0400 Subject: adding loader --- site/public/assets/style.css | 22 ++++++++++++++++++++-- 1 file changed, 20 insertions(+), 2 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 2ca71b4..e5a3404 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -208,6 +208,24 @@ cursor: grabbing; cursor: -moz-grabbing; } +#loader_rapper { + -webkit-transition: 0.3s opacity !important; + transition: 0.3s opacity !important; + opacity: 1.0; +} +#loader_rapper.hidden { + opacity: 0; +} +#loader_svg { + position: absolute; + left: 2.5%; + top: 10%; + height: 60%; + width: 95%; +} +#loader_svg svg { + width: 100%; height: 100%; +} nav { -moz-user-select: none; -webkit-user-select: none; @@ -268,7 +286,7 @@ nav .middle { nav .bottom { width: 100%; - background: #44D3D3; + background: #bbb; } nav a { text-decoration:none; @@ -638,7 +656,7 @@ nav a.active, nav .sub a:hover { } .logo { position: fixed; - right: 10px; + right: 2%; bottom: 10px; width: 6%; max-width:120px; -- cgit v1.2.3-70-g09d2 From d23a69383e0871e681cf122441c4531980a2b4c2 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 14 Apr 2015 16:08:56 -0400 Subject: share links --- site/public/assets/javascripts/_env.js | 25 ++++++++++++++++++++++++- site/public/assets/style.css | 10 ++++------ site/templates/project.liquid | 6 +++--- 3 files changed, 31 insertions(+), 10 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/javascripts/_env.js b/site/public/assets/javascripts/_env.js index ac155b3..c34787d 100644 --- a/site/public/assets/javascripts/_env.js +++ b/site/public/assets/javascripts/_env.js @@ -105,6 +105,8 @@ environment.ready = function(){ load_hash(page) }) + Share.init() + $(window).mousedown(function(e){ if (! menu_open) { controls.pause() @@ -492,4 +494,25 @@ function HustleLoader () { init() } - +var Share = { + init: function(){ + $(document).on("click", ".fb", Share.facebook) + $(document).on("click", ".tw", Share.twitter) + }, + + facebook: function (e) { + e.preventDefault() + var link = window.location.href + var msg = $(".postname").html() + var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(link) + "&t=" + encodeURIComponent(msg) + window.open(url, "_blank") + }, + + twitter: function (e) { + e.preventDefault() + var link = window.location.href + var msg = $(".postname").html() + var url = "https://twitter.com/home?status=" + encodeURIComponent(msg + " " + link) + window.open(url, "_blank") + }, +} \ No newline at end of file diff --git a/site/public/assets/style.css b/site/public/assets/style.css index e5a3404..6bf1fcb 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -454,18 +454,16 @@ nav a.active, nav .sub a:hover { color: #909090; } -.credit a { +.credit img { display:inline-block; opacity:0.9; + cursor: pointer; + width: 18px; } -.credit a:hover { +.credit img:hover { opacity:1; } -.credit a img { - width:18px; -} - .mx-object3d .image{ box-shadow:5px -10px 20px rgba(0,0,0,0.1); } diff --git a/site/templates/project.liquid b/site/templates/project.liquid index a6b2b24..b54722d 100644 --- a/site/templates/project.liquid +++ b/site/templates/project.liquid @@ -15,8 +15,8 @@ {{ project.description | newline_to_br }}
- - + +
- + \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 52b9d528e7bc9b8b4b1d1c391ef7267be34a2458 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 14 Apr 2015 16:27:06 -0400 Subject: loading adjust --- site/public/assets/javascripts/_env.js | 2 +- site/public/assets/style.css | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/javascripts/_env.js b/site/public/assets/javascripts/_env.js index 3bff148..f30d62d 100644 --- a/site/public/assets/javascripts/_env.js +++ b/site/public/assets/javascripts/_env.js @@ -158,7 +158,7 @@ environment.ready = function(){ build_scene() setTimeout(function(){ $("#scene").removeClass("fade") - }, 50) + }, 100) } setTimeout(function(){ done_loading = true }, 200) diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 6bf1fcb..2e8829e 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -663,6 +663,10 @@ nav a.active, nav .sub a:hover { .logo img { width:100%; } +.loading .logo, +.loading .toggleRapper { + display: none; +} .toggleRapper { width: 50px; position: fixed; -- cgit v1.2.3-70-g09d2 From 22b1dabf05f968baedffb701be6c6f6fc579241a Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 14 Apr 2015 18:24:32 -0400 Subject: center logo --- site/public/assets/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 2e8829e..65235ce 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -219,7 +219,7 @@ cursor: grabbing; #loader_svg { position: absolute; left: 2.5%; - top: 10%; + top: 20%; height: 60%; width: 95%; } -- cgit v1.2.3-70-g09d2 From d1d06e58283eac26dd78b0a19bcfcbf16e64013f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 14 Apr 2015 19:38:23 -0400 Subject: fix videos on mobile --- site/public/assets/javascripts/_env.js | 30 ++++++++++++---------- site/public/assets/style.css | 47 ++++++++++++++++++++++------------ 2 files changed, 47 insertions(+), 30 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/javascripts/_env.js b/site/public/assets/javascripts/_env.js index 7ff471d..c4e9ace 100644 --- a/site/public/assets/javascripts/_env.js +++ b/site/public/assets/javascripts/_env.js @@ -352,17 +352,19 @@ function build_gallery () { var $play = $('
') var $el = $(this) $el.append($play) - $play.click(function(e){ - e.stopPropagation() - e.preventDefault() - if ($el.hasClass('loaded')) { - var player = $el.data('player') - player.api('play') - } - else { - load_video($el) - } - }) + if (is_desktop) { + $play.on("click", function(e){ + e.stopPropagation() + e.preventDefault() + if ($el.hasClass('loaded')) { + var player = $el.data('player') + player.api('play') + } + else { + load_video($el) + } + }) + } }) $(".caption").click(function(){ @@ -416,8 +418,10 @@ function load_video ($el) { var vimeo_id = $el.data("video").match(/\d+/)[0] var $embed = $('') $el.append($embed) - var $mask = $('
') - $el.append($mask) + if (! is_mobile) { + var $mask = $('
') + $el.append($mask) + } var player = $f( $el.find("iframe")[0] ) $el.data('player', player) player.addEvent('ready', function(){ diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 65235ce..825f46c 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -113,7 +113,7 @@ cursor: grabbing; transform: translateY(-50%); } -.flickity-prev-next-button:hover { background: white; } +.desktop .flickity-prev-next-button:hover { background: white; } .flickity-prev-next-button:focus { outline: none; @@ -256,7 +256,7 @@ nav { border-top: 1px solid #222; padding-top: 10px; } -.toplogo:hover { +.desktop .toplogo:hover { cursor:pointer; opacity:1; } @@ -295,13 +295,13 @@ nav a { color:black; } -nav .cat:hover { +.desktop nav .cat:hover { cursor:pointer; background:#eee; } -nav a.active:hover { +.desktop nav a.active:hover { cursor:default; } nav .cat { @@ -313,7 +313,7 @@ nav .cat.active { display: inline-block; font-family: 'BellGothic-Bold'; } -nav .top .cat.active:hover { +.desktop nav .top .cat.active:hover { background:transparent; } @@ -409,7 +409,7 @@ nav .sub.active a { transform:translateY(0)scale(1)skew(0deg); } -nav a.active, nav .sub a:hover { +.desktop nav a.active, nav .sub a:hover { text-decoration:none; background:#eee; color:black; @@ -460,7 +460,7 @@ nav a.active, nav .sub a:hover { cursor: pointer; width: 18px; } -.credit img:hover { +.desktop .credit img:hover { opacity:1; } @@ -559,7 +559,7 @@ nav a.active, nav .sub a:hover { opacity: 0.7; z-index: 4; } -.cell.video .play:hover { +.desktop .cell.video .play:hover { opacity: 1.0; } .cell iframe { @@ -621,12 +621,12 @@ nav a.active, nav .sub a:hover { opacity:0.5; cursor:pointer; } -.caption:hover { +.desktop .caption:hover { background:#222; color:#222; cursor:pointer; } -.caption:hover::after { +.desktop .caption:hover::after { color:white; opacity:1; } @@ -734,7 +734,7 @@ nav a.active, nav .sub a:hover { transition: 0.1s opacity ease-in; transition-delay:0.4s; } -.ready .project:hover { +.desktop .ready .project:hover { opacity: 1.0; } .project img { @@ -852,14 +852,27 @@ nav a.active, nav .sub a:hover { .menuActive #entry_container { left:160px; } - body{ - font-size: 18px; + #scene { + -webkit-transition: left 0.2s; + transition: left 0.2s; + } + .menuActive #scene { + left:160px; + } + body { + font-size: 18px; } } .mobile .cell iframe { - position: fixed; /* REALLY WEIRD, vimeo won't play without this! */ - width: 80%; - opacity:0.2; + width: 100%; + opacity: 0.0!important; transition:0.4s opacity ease-in; - z-index: 2; + z-index: 100; + height: 100%; + -webkit-transform: translateZ(0); + transform: translateZ(0); } +.mobile .play { + pointer-events: none; + opacity: 1; +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 0f625b3e6b511f4ee1323da30e6280f4880955fc Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 16 Apr 2015 12:38:31 -0400 Subject: get rid of contact image --- site/db.json | 2 +- site/public/assets/images/2H_LOGOMARK.svg | 12 ++++++------ site/public/assets/style.css | 4 ++++ site/templates/index.liquid | 6 +++--- site/templates/page.liquid | 14 ++++++++++---- 5 files changed, 24 insertions(+), 14 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/db.json b/site/db.json index f8431f0..d0624e8 100644 --- a/site/db.json +++ b/site/db.json @@ -42,7 +42,7 @@ "id": "contact", "title": "CONTACT", "body": "TWOHUSTLERS\r\n50 WHITE STREET\r\nNEW YORK, NY 10013\r\nINFO@TWOHUSTLERS.COM\r\n+1 646 370-1180\r\nTWOHUSTLERS ©2014\r\nWEBSITE BY OKFOCUS", - "image": "http://checkingintocollege.com/wp/wp-content/uploads/2014/08/angryphone.jpg", + "image": "", "__index": "0" } ], diff --git a/site/public/assets/images/2H_LOGOMARK.svg b/site/public/assets/images/2H_LOGOMARK.svg index 9af234a..43a9691 100644 --- a/site/public/assets/images/2H_LOGOMARK.svg +++ b/site/public/assets/images/2H_LOGOMARK.svg @@ -7,11 +7,11 @@ - - + - - + - -
+ viewBox="338.1 276.3 660.5 819.7" xml:space="preserve"> - + @@ -176,7 +176,7 @@ WEBSITE BY OKFOCUS, http://okfoc.us, Internet Legends. c0,1-0.1,1.8-0.3,2.7c-0.1,0.8-0.1,1.7-0.3,2.5c0,0.3,0,0.6-0.1,0.8c-4,29.5-20.9,56.4-58.2,93.1l-81.8,80.1 c-53.5,52.1-85.9,103.9-101.6,162.9c-6.7,25.1-13.7,52.6-14.5,81L712.3,705.6z"/> - + diff --git a/site/templates/page.liquid b/site/templates/page.liquid index 52b64dc..7c295ff 100644 --- a/site/templates/page.liquid +++ b/site/templates/page.liquid @@ -1,9 +1,15 @@
{{page.title}} - -
- {{page.body | newline_to_br}} -
+ {% if page.image %} + +
+ {{page.body | newline_to_br}} +
+ {% else %} +
+ {{page.body | newline_to_br}} +
+ {% endif %}
-- cgit v1.2.3-70-g09d2 From b51455df828fde90edbee3143bd8d49b00cc3f1a Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 16 Apr 2015 14:04:10 -0400 Subject: single image upload field, abstract upload class a bit --- site/db.json | 6 +- site/index.js | 1 + site/public/assets/style.css | 3 +- site/templates/index.liquid | 2 + themes/okadmin/public/css/main.css | 25 +++++-- themes/okadmin/public/js/app.js | 93 +++++++++++++++++-------- themes/okadmin/public/js/upload.js | 91 +++++++++++------------- themes/okadmin/templates/partials/inputs.liquid | 52 +++++++++----- 8 files changed, 171 insertions(+), 102 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/db.json b/site/db.json index d0624e8..12ccb38 100644 --- a/site/db.json +++ b/site/db.json @@ -27,7 +27,11 @@ "caption": "CURABITUR BLANDIT TEMPUS PORTTITOR 4" } ], - "__index": "0" + "__index": "0", + "shape": { + "uri": "", + "caption": "" + } } ], "page": [ diff --git a/site/index.js b/site/index.js index 521b7d7..30e4a76 100644 --- a/site/index.js +++ b/site/index.js @@ -7,6 +7,7 @@ var projectSchema = { description: {type: 'text'}, video: {type: 'video'}, images: {type: 'captioned-image-list'}, + shape: {type: 'image'}, } var app = okcms.createApp({ diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 3c2526b..28d0013 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -285,6 +285,7 @@ nav .middle { } nav .bottom { + height: 20%; width: 100%; background: #bbb; } @@ -489,7 +490,7 @@ nav .sub.active a { } .entry span div.content.noline { border-top: 0; - padding-top: 0px; + padding-top: 0; } .entry span div.content div { width:50%; diff --git a/site/templates/index.liquid b/site/templates/index.liquid index afb5de3..d18098c 100644 --- a/site/templates/index.liquid +++ b/site/templates/index.liquid @@ -110,9 +110,11 @@ WEBSITE BY OKFOCUS, http://okfoc.us, Internet Legends. {% endfor %}
+
ABOUT
CONTACT
diff --git a/themes/okadmin/public/css/main.css b/themes/okadmin/public/css/main.css index ec426f9..685e368 100644 --- a/themes/okadmin/public/css/main.css +++ b/themes/okadmin/public/css/main.css @@ -228,7 +228,9 @@ button, input[type=submit] { border: 0; display: none; } -.main.resource form .group.loaded input:first-child, +.main.resource form .group.image input, +.main.resource form .group.video input:first-child, +.main.resource form .group.loaded.video input[type=text], .main.resource form .group input:first-child { display: block; width: 25em; @@ -238,17 +240,24 @@ button, input[type=submit] { } .main.resource form .group.loaded input { display: block; - width: 20.05em; } -.main.resource form .group input { - display: none; +.main.resource form .group input[type=text] { + width: 20.05em; margin-bottom: 0.1em; } +.main.resource form .group.image .image-element, +.main.resource form .group.video input[type=text], .main.resource form .group.loaded input[hidden], +.main.resource form .group.image.loaded .fields, .main.resource form input[hidden] { display: none; } - +.main.resource form .group.image.loaded .image-element { + display: block; +} +.main.resource form .fields { + height: 3em; +} .main.resource form textarea { padding: 0.5em; height: 15em; @@ -280,6 +289,8 @@ button, input[type=submit] { width: 10em; max-height: 10em; border: 0; +} +.main.resource form .images img { cursor: -webkit-grab; cursor: grab; } @@ -313,10 +324,10 @@ button, input[type=submit] { margin: 0; padding: 0; cursor: pointer; } -li.image-element:hover .remove-image { +.image-element:hover .remove-image { display: block; } -li.image-element .remove-image:hover { +.image-element .remove-image:hover { color: red; } .remove-image { diff --git a/themes/okadmin/public/js/app.js b/themes/okadmin/public/js/app.js index 22317f3..baa4873 100644 --- a/themes/okadmin/public/js/app.js +++ b/themes/okadmin/public/js/app.js @@ -1,38 +1,75 @@ var OKAdmin = function(){ - // initialize our (single) ajax image uploader with an element and a template - OKUpload.bind( document.getElementById("file") ) - OKUpload.add = function(data){ - var url = data[0].extra.Location - add_image(url) - } - - // also handle straight image urls - $("#add-image-url").keydown(pressEnter(function(e){ - var url = $(this).val() - $(this).val("") - add_image(url) - })) + // initialize our multi-image uploader with an element and a template + $(".image-list").each(function(){ + var uploader = new OKUpload () + uploader.bind( $(".add-image-button input", this) ) + uploader.add = function(data){ + var url = data[0].extra.Location + add_image(url) + } + // also handle straight image urls + $(".add-image-url", this).keydown(pressEnter(function(e){ + var url = $(this).val() + $(this).val("") + add_image(url) + })) + + // clone and populate template + function add_image(url){ + var imageTemplate = $("#captioned-image-template").html() + var $el = $(imageTemplate) + $el.find(".uri").val(url) + $el.find("img").attr("src", url) + $(".captioned-image-list ol").append($el) + } + }) + // delete image from gallery + $(document).on("mousedown", ".image-list .remove-image", function(){ + if (confirm("Delete this image?")) { + $(this).parent().remove() + } + }) - // clone and populate template - function add_image(url){ - var imageTemplate = $("#captioned-image-template").html() - var $el = $(imageTemplate) - $el.find(".uri").val(url) - $el.find("img").attr("src", url) - $(".captioned-image-list ol").append($el) - } + // initialize our single image uploader with existing DOM + $(".image").each(function(){ + var $el = $(this) + + var uploader = new OKUpload () + uploader.bind( $(".add-image-button input", this) ) + uploader.add = function(data){ + var url = data[0].extra.Location + add_image(url) + } + // also handle straight image urls + $(".add-image-url", this).keydown(pressEnter(function(e){ + var url = $(this).val() + $(this).val("") + add_image(url) + })) + + // clone and populate template + function add_image(url){ + $el.find(".uri").val(url) + $el.find(".caption").val("") + $el.find("img").attr("src", url) + $el.addClass("loaded") + } + }) + // delete image from single image entry + $(document).on("mousedown", ".image .remove-image", function(){ + if (confirm("Delete this image?")) { + var $el = $(this).closest(".image") + $el.removeClass('loaded') + $el.find(".uri").val("") + $el.find(".caption").val("") + $el.find("img").attr("src", "") + } + }) // make the region sortable with drag-and-drop $(".captioned-image-list ol").sortable() $(".captioned-image-list ol").disableSelection() - - // delete image - $(document).on("mousedown", ".remove-image", function(){ - if (confirm("Delete this image?")) { - $(this).parent().remove() - } - }) // populate a video field with info from our url parser var last_url diff --git a/themes/okadmin/public/js/upload.js b/themes/okadmin/public/js/upload.js index 1c9094c..39f7427 100644 --- a/themes/okadmin/public/js/upload.js +++ b/themes/okadmin/public/js/upload.js @@ -1,55 +1,48 @@ -var OKUpload = { - action: "/_services/image", - - bind: function(el){ - if (! el) return - el.addEventListener("change", OKUpload.handleFileSelect) - }, - - handleFileSelect: function(e) { - e.stopPropagation(); - e.preventDefault(); - - var files = e.dataTransfer ? e.dataTransfer.files : e.target.files; - - for (var i = 0, f; f = files[i]; i++) { - if ( ! f.type.match('image.*')) { - continue; - } - OKUpload.upload(f) - } - }, +var OKUpload = function(){ + this.action = "/_services/image" +} +OKUpload.prototype.bind = function(el){ + if (el.length) el = el[0] + el.addEventListener("change", this.handleFileSelect.bind(this)) +} +OKUpload.prototype.handleFileSelect = function(e) { + e.stopPropagation(); + e.preventDefault(); - upload: function(f){ - var fd = new FormData() - fd.append('image', f) + var files = e.dataTransfer ? e.dataTransfer.files : e.target.files; - var request = $.ajax({ - url: OKUpload.action, - type: "post", - data: fd, - dataType: "json", - processData: false, - contentType: false, - }) - request.done(OKUpload.success) - }, - - success: function(media){ - if (media.error) { - console.log(media.error) - return + for (var i = 0, f; f = files[i]; i++) { + if ( ! f.type.match('image.*')) { + continue; } - OKUpload.add(media) - }, - - add: function(media){ - console.log(media) - }, - - error: function(error){ - throw error - }, + this.upload(f) + } +} +OKUpload.prototype.upload = function(f){ + var fd = new FormData() + fd.append('image', f) + var request = $.ajax({ + url: this.action, + type: "post", + data: fd, + dataType: "json", + processData: false, + contentType: false, + }) + request.done(this.success.bind(this)) +} +OKUpload.prototype.success = function(media){ + if (media.error) { + console.log(media.error) + return + } + this.add(media) +} +OKUpload.prototype.add = function(media){ + console.log(media) +} +OKUpload.prototype.error = function(error){ + throw error } diff --git a/themes/okadmin/templates/partials/inputs.liquid b/themes/okadmin/templates/partials/inputs.liquid index 253b275..c9a4d92 100644 --- a/themes/okadmin/templates/partials/inputs.liquid +++ b/themes/okadmin/templates/partials/inputs.liquid @@ -22,15 +22,48 @@ {% elsif type == 'video' %}
- - + +
+ {% elsif type == 'image' %} +
+
+
+ + +
+ +
+
+ + + {{spec.value.caption}} + +
+
{% elsif type == 'captioned-image-list' %} -
+
+
+
+ + +
+ +
+ + +
    {% for image in spec.value %}
  1. @@ -41,19 +74,6 @@
    2. {% endfor %}
-
- - -
- -
{% elsif type == 'meta' %} -- cgit v1.2.3-70-g09d2 From 3347d46dfbde6cf41f82f75e0b3ec5022b68e6b1 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 16 Apr 2015 15:32:05 -0400 Subject: hovering over projects activates hover class on type --- site/public/assets/javascripts/_env.js | 32 ++++++++++++++++++++++---------- site/public/assets/style.css | 4 ++++ site/templates/index.liquid | 10 +++++----- 3 files changed, 31 insertions(+), 15 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/javascripts/_env.js b/site/public/assets/javascripts/_env.js index 31b10b7..e1d032a 100644 --- a/site/public/assets/javascripts/_env.js +++ b/site/public/assets/javascripts/_env.js @@ -177,6 +177,28 @@ environment.ready = function(){ }, 100) }, 500) }) + + + $("#scene_container").click(function(e){ + if ( $("body").hasClass("menuActive") ) { + return + } + else { + toggle_menu() + } + }) + $(document).on("mouseenter", ".project", function(){ + var type = $(this).data("type") + $(".entry").addClass("hover") + $(this).addClass("hover") + $(".cat[data-type=" + type + "]").addClass("hover") + }) + $(document).on("mouseleave", ".project", function(){ + var type = $(this).data("type") + $(".entry").removeClass("hover") + $(this).removeClass("hover") + $(".cat[data-type=" + type + "]").removeClass("hover") + }) } @@ -262,16 +284,6 @@ function build_scene () { scene.update() environment.update = environment.updateOnReady - - $("#scene_container").click(function(e){ - if ( $("body").hasClass("menuActive") ) { - return - } - else { - toggle_menu() - } - }) - } var entry_open_time = 0; diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 28d0013..71d8e8f 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -296,6 +296,7 @@ nav a { color:black; } +.desktop nav .cat.hover, .desktop nav .cat:hover { cursor:pointer; background:#eee; @@ -742,6 +743,9 @@ nav .sub.active a { .desktop .ready .project:hover { opacity: 1.0; } +.entry.hover .project { opacity: 0.5 } +.entry.hover .project.hover { opacity: 1.0 } + .project img { width: 100%; } diff --git a/site/templates/index.liquid b/site/templates/index.liquid index 298ec0d..c5891a1 100644 --- a/site/templates/index.liquid +++ b/site/templates/index.liquid @@ -85,25 +85,25 @@ WEBSITE BY OKFOCUS, http://okfoc.us, Internet Legends. @@ -235,7 +237,7 @@ WEBSITE BY OKFOCUS, http://okfoc.us, Internet Legends.
+
    + {% for image in spec.value %} +
  1. + + + + {{image.caption}} + +
    2. + {% endfor %} +
+
{% elsif type == 'meta' %} {% else %} -- cgit v1.2.3-70-g09d2 From 00ed9c4ee501a032ab6a85f561fb9eba0d90aa11 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Sun, 17 May 2015 14:02:43 +0200 Subject: mobile --- site/public/assets/style.css | 57 +++++++++++++++++++++++++++----------------- 1 file changed, 35 insertions(+), 22 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 2d0bd5a..4c3c69e 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -854,7 +854,7 @@ nav .sub.active a { margin: 0.5vw 0.5vw 0 0.5vw; } .brady > a:nth-child(3) { - margin-right: 1vw; + margin-right: 5vw; } .desktop .brady > a:hover:after { content: 'SAY HELLO!'; @@ -1012,34 +1012,28 @@ nav .sub.active a { @media (max-width:1200px) { - .entry span div.content { -/* - -webkit-column-count: 2; - -moz-column-count: 2; - column-count: 2; - */ - } - .project { width:33.3333%; height: 16.6vw; } - .brady a { - width: 160px; - height: 160px; - } - + .brady > a { + width: 24vw; height: 24vw; + } + .brady div { + width: 23vw; + height: 22vw; + font-size: 1.2vw; + line-height: 1.9vw; + } + .brady span { + font-size: 2vw; + } + .brady > a:nth-child(3) { + margin-right: 0vw; + } } @media (max-width:900px) { - .entry span div.content { -/* - -webkit-column-count: 2; - -moz-column-count: 2; - column-count: 2; - */ - } - .project { width:50%; height: 23vw; @@ -1113,6 +1107,25 @@ nav .sub.active a { .menuActive .project span { top: -18px; } + .brady > a { + width: 35vw; height: 35vw; + } + .brady div { + width: 34vw; + height: 34vw; + font-size: 1.6vw; + line-height: 2.3vw; + } + .brady div:nth-child(1) { + margin-left: 3vw; + } + .brady span { + font-size: 2vw; + } + .brady > a:nth-child(3) { + margin-right: 0vw; + } + } .mobile .cell iframe { width: 100%; -- cgit v1.2.3-70-g09d2 From a0d2729e311f53ecaa014c097c1a485581853100 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Sun, 17 May 2015 14:04:06 +0200 Subject: etc --- site/public/assets/style.css | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 4c3c69e..3d1ee7f 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -843,7 +843,6 @@ nav .sub.active a { } .brady div { width: 17vw; - height: 16w; position: relative; display: block; float: left; @@ -1021,7 +1020,6 @@ nav .sub.active a { } .brady div { width: 23vw; - height: 22vw; font-size: 1.2vw; line-height: 1.9vw; } @@ -1112,9 +1110,8 @@ nav .sub.active a { } .brady div { width: 34vw; - height: 34vw; - font-size: 1.6vw; - line-height: 2.3vw; + font-size: 2vw; + line-height: 2.5vw; } .brady div:nth-child(1) { margin-left: 3vw; -- cgit v1.2.3-70-g09d2 From 8879a9eb16d1913db8633bb2227cf0f274086129 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Sun, 17 May 2015 14:12:19 +0200 Subject: bolder --- site/public/assets/style.css | 1 + 1 file changed, 1 insertion(+) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 3d1ee7f..8c48c1a 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -851,6 +851,7 @@ nav .sub.active a { line-height: 1.4vw; border: 1px solid black; margin: 0.5vw 0.5vw 0 0.5vw; + font-family: 'BellGothic-Bold'; } .brady > a:nth-child(3) { margin-right: 5vw; -- cgit v1.2.3-70-g09d2 From c47be406fc9cd3eab56d8e49afb2031da2584e94 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Sun, 17 May 2015 14:33:35 +0200 Subject: mobile shit --- site/db.json | 6 ++++-- site/public/assets/javascripts/_env.js | 5 +++-- site/public/assets/style.css | 31 ++++++++++++++++++++++++++----- 3 files changed, 33 insertions(+), 9 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/db.json b/site/db.json index fe9f91b..119f50e 100644 --- a/site/db.json +++ b/site/db.json @@ -1146,9 +1146,11 @@ { "id": "contact", "title": "CONTACT", - "body": "50 WHITE STREET\r\nNEW YORK, NY 10013\r\nINFO@TWOHUSTLERS.COM\r\n+1 646 370-1180\r\nTWOHUSTLERS ©2014", + "body": "50 WHITE STREET\r\nNEW YORK, NY 10013\r\nINFO@TWOHUSTLERS.COM\r\n+1 646 370-1180\r\nTWOHUSTLERS ©2015", "image": "", - "__index": "0" + "__index": "0", + "contact": "", + "dateCreated": "" } ], "shape": [ diff --git a/site/public/assets/javascripts/_env.js b/site/public/assets/javascripts/_env.js index e74a020..dee524c 100644 --- a/site/public/assets/javascripts/_env.js +++ b/site/public/assets/javascripts/_env.js @@ -131,7 +131,8 @@ environment.ready = function(){ $("#entry_container").removeClass("visible") var $loader = $("
") - $loader.load("about .entry", function(){ + $loader.load("/about/ .entry", function(){ + console.log($loader.html()) display_entry($loader.children()[0]) }) }) @@ -414,7 +415,7 @@ function display_entry (el) { var isIndex = $el.hasClass("all") if (is_mobile) { $("body").toggleClass("menuActive", isIndex) - $el.find(".brady").remove() +// $el.find(".brady > a").remove() } if (isIndex) { var $projects = $el.find(".project") diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 8c48c1a..0a7fcc4 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -1107,15 +1107,35 @@ nav .sub.active a { top: -18px; } .brady > a { + display: none; width: 35vw; height: 35vw; } +/* + .brady > a:nth-child(2) { + margin-left: 1vw; + } + .brady > a:nth-child(2), + .brady > a:nth-child(3) { + display: block; + width: 35vw; height: 35vw; + } + */ + + .brady { + width: 100%; + } .brady div { - width: 34vw; - font-size: 2vw; - line-height: 2.5vw; + width: 100%; + font-size: 4vw; + line-height: 5vw; + border: 0; + margin: 1em; + margin-left: 2em; + padding: 0; } .brady div:nth-child(1) { - margin-left: 3vw; + padding-bottom: 1vw; + border-bottom: 1px solid #444; } .brady span { font-size: 2vw; @@ -1123,8 +1143,9 @@ nav .sub.active a { .brady > a:nth-child(3) { margin-right: 0vw; } - } + + .mobile .cell iframe { width: 100%; opacity: 0.0!important; -- cgit v1.2.3-70-g09d2 From 503e71b8860bfa929590fb4b49a94748b4b9d280 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Sun, 17 May 2015 14:42:55 +0200 Subject: videos ughhh --- site/public/assets/style.css | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 0a7fcc4..3443642 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -634,7 +634,7 @@ nav .sub.active a { z-index: 4; pointer-events: none; } -.cell.video.is-selected .play { +.desktop .cell.video.is-selected .play { pointer-events: auto; } .desktop .cell.video .play:hover { @@ -1052,6 +1052,9 @@ nav .sub.active a { width:100%; margin-left:0; } + .flickity-viewport { + height: 37vh; + } .logo img { width:50px; } -- cgit v1.2.3-70-g09d2 From fb5c451361916593edf39ed5f3614984dc29a36d Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 27 May 2015 13:22:13 -0400 Subject: box --- site/db.json | 3 ++- site/index.js | 1 + site/public/assets/style.css | 4 ++-- site/templates/about.liquid | 1 + 4 files changed, 6 insertions(+), 3 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/db.json b/site/db.json index 010ad37..16a689a 100644 --- a/site/db.json +++ b/site/db.json @@ -1139,7 +1139,8 @@ "image": "http://www.lansdowneresort.com/meetings/assets/images/masthead/meetings-team-building.jpg", "__index": "1", "contact": "FOR BRANDS WHO WANT TO PLAY WITH US, SAY HELLO!\r\n\r\nFOR ANYONE WHO WANTS TO JOIN OUR FAMILY, SHOW US WHAT YOU ARE MADE OF!\r\n\r\nWEBSITE BY OKFOCUS", - "dateCreated": "" + "dateCreated": "", + "collabs": "\"NONE OF US IS AS SMART AS ALL OF US\"\r\n\r\nWE MAKE THINGS WITH OUR FRIENDS:\r\n\r\nMERI MEDIA\r\nOKFOCUS\r\nMARK FOSTER GAGE ARCHITECTS\r\nMOVING IMAGE & CONTENT\r\nNR2154\r\nTABLE OF CONTENTS\r\nTAKE OUT MEDIA\r\nSHADES OF GREY" }, { "id": "contact", diff --git a/site/index.js b/site/index.js index 8952c46..aa1f58c 100644 --- a/site/index.js +++ b/site/index.js @@ -25,6 +25,7 @@ var app = okcms.createApp({ id: {type: 'string', hidden: true}, title: {type: 'string'}, body: {type: 'text'}, + collabs: {type: 'text'}, contact: {type: 'text'}, image: {type: 'string'} }, diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 3443642..6fbf74f 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -842,11 +842,11 @@ nav .sub.active a { float: left; } .brady div { - width: 17vw; + width: 17.1vw; position: relative; display: block; float: left; - padding: 1vw; + padding: 1vw 0.5vw 1vw 0.5vw; font-size: 0.8vw; line-height: 1.4vw; border: 1px solid black; diff --git a/site/templates/about.liquid b/site/templates/about.liquid index c693b61..14c046e 100644 --- a/site/templates/about.liquid +++ b/site/templates/about.liquid @@ -3,6 +3,7 @@
{{page.body | newline_to_br}}
{% for image in shape.images %}{{ image.label }}{% endfor %} +
{{page.collabs | newline_to_br}}
{{page.contact | newline_to_br}}
 -- cgit v1.2.3-70-g09d2 From 82324f87b003606f9bca118894ee3f1573aab90c Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 17 Jun 2015 19:00:25 -0400 Subject: about page styling --- site/public/assets/style.css | 51 ++++++++++++-------------------------------- 1 file changed, 14 insertions(+), 37 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 6fbf74f..535bed4 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -842,19 +842,23 @@ nav .sub.active a { float: left; } .brady div { - width: 17.1vw; + width: 100%; position: relative; display: block; float: left; - padding: 1vw 0.5vw 1vw 0.5vw; - font-size: 0.8vw; - line-height: 1.4vw; - border: 1px solid black; - margin: 0.5vw 0.5vw 0 0.5vw; + padding: 1em 0.5em 1em 0vw; + font-size: 0.8em; + line-height: 1.5em; + border-bottom: 1px solid black; + margin: 1em 0; font-family: 'BellGothic-Bold'; } -.brady > a:nth-child(3) { - margin-right: 5vw; +.brady div.collabscontent { + border-top: 1px solid black; +} +.brady div.contactcontent { + margin-top: 0; + padding-top: 0; } .desktop .brady > a:hover:after { content: 'SAY HELLO!'; @@ -874,7 +878,8 @@ nav .sub.active a { opacity: 0; color: black; margin-top: -4px; - font-size: 1vw; + font-size: 0.8em; + line-height: 1.5em; padding: 2px 0 1px 2px; transition: 0.1s opacity ease-in; @@ -1019,14 +1024,6 @@ nav .sub.active a { .brady > a { width: 24vw; height: 24vw; } - .brady div { - width: 23vw; - font-size: 1.2vw; - line-height: 1.9vw; - } - .brady span { - font-size: 2vw; - } .brady > a:nth-child(3) { margin-right: 0vw; } @@ -1113,36 +1110,16 @@ nav .sub.active a { display: none; width: 35vw; height: 35vw; } -/* - .brady > a:nth-child(2) { - margin-left: 1vw; - } - .brady > a:nth-child(2), - .brady > a:nth-child(3) { - display: block; - width: 35vw; height: 35vw; - } - */ - .brady { width: 100%; } .brady div { width: 100%; - font-size: 4vw; - line-height: 5vw; border: 0; margin: 1em; margin-left: 2em; padding: 0; } - .brady div:nth-child(1) { - padding-bottom: 1vw; - border-bottom: 1px solid #444; - } - .brady span { - font-size: 2vw; - } .brady > a:nth-child(3) { margin-right: 0vw; } -- cgit v1.2.3-70-g09d2 From db9058b54a6f57bf11f67f4634b6c12c7e555f2d Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 17 Jun 2015 19:13:41 -0400 Subject: about header --- site/public/assets/style.css | 16 +++++++++++++++- site/templates/about.liquid | 5 ++++- 2 files changed, 19 insertions(+), 2 deletions(-) (limited to 'site/public/assets/style.css') diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 535bed4..4f28979 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -853,6 +853,8 @@ nav .sub.active a { margin: 1em 0; font-family: 'BellGothic-Bold'; } +.brady div.aboutcontent { border: 0; } +.aboutcontenttext { display: none } .brady div.collabscontent { border-top: 1px solid black; } @@ -1113,16 +1115,28 @@ nav .sub.active a { .brady { width: 100%; } + .brady span { + font-size: 13px !important; + } .brady div { width: 100%; border: 0; - margin: 1em; + margin: 0.5em; margin-left: 2em; padding: 0; + font-size: 13px !important; } .brady > a:nth-child(3) { margin-right: 0vw; } + .brady span.aboutcontenttext { + position: static; bottom: auto; left: auto; + opacity: 1; + background: transparent; + } + .aboutcontent { display: block } + .aboutcontenttext { display: inline } + .aboutcontent img { display: none } } diff --git a/site/templates/about.liquid b/site/templates/about.liquid index 14c046e..b270879 100644 --- a/site/templates/about.liquid +++ b/site/templates/about.liquid @@ -1,7 +1,10 @@
-
{{page.body | newline_to_br}}
+
+ {{page.body | newline_to_br}} + +
{% for image in shape.images %}{{ image.label }}{% endfor %}
{{page.collabs | newline_to_br}}
{{page.contact | newline_to_br}}
-- cgit v1.2.3-70-g09d2 From e42a871b1a041ad68f6316aa1d50d1e7fe741123 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 24 Jun 2015 14:47:47 -0400 Subject: edits --- site/index.js | 1 + site/public/assets/style.css | 12 ++++++++++++ site/templates/about.liquid | 1 + site/templates/all.liquid | 1 + site/templates/index.liquid | 2 +- 5 files changed, 16 insertions(+), 1 deletion(-) (limited to 'site/public/assets/style.css') diff --git a/site/index.js b/site/index.js index aa1f58c..430f73f 100644 --- a/site/index.js +++ b/site/index.js @@ -87,6 +87,7 @@ var app = okcms.createApp({ {type: 'advertising', query: '*'}, {type: 'experiential', query: '*'}, {type: 'content', query: '*'}, + {type: 'page', query: 'about'} ], template: 'all' }, diff --git a/site/public/assets/style.css b/site/public/assets/style.css index 4f28979..2cd2d29 100644 --- a/site/public/assets/style.css +++ b/site/public/assets/style.css @@ -862,6 +862,18 @@ nav .sub.active a { margin-top: 0; padding-top: 0; } +.all .contactcontent { + width: 100%; + clear: both; + position: relative; + top: 1em; + margin-left: 10px; + padding: 1em 0; + font-size: 0.8em; + line-height: 1.5em; + border-bottom: 1px solid black; + border-top: 1px solid black; +} .desktop .brady > a:hover:after { content: 'SAY HELLO!'; position: absolute; diff --git a/site/templates/about.liquid b/site/templates/about.liquid index 86207cf..5858462 100644 --- a/site/templates/about.liquid +++ b/site/templates/about.liquid @@ -1,6 +1,7 @@
+
{{page.body | newline_to_br}}
diff --git a/site/templates/all.liquid b/site/templates/all.liquid index 5f3009f..34db1fc 100644 --- a/site/templates/all.liquid +++ b/site/templates/all.liquid @@ -20,4 +20,5 @@
{% endfor %}
+
{{page.contact | newline_to_br}}
diff --git a/site/templates/index.liquid b/site/templates/index.liquid index 738cbe7..572cf0a 100644 --- a/site/templates/index.liquid +++ b/site/templates/index.liquid @@ -108,7 +108,7 @@ WEBSITE BY OKFOCUS, http://okfoc.us, Internet Legends.
VIEW ALL PROJECTS
-
ABOUT
+
ABOUT/CONTACT
{{ page.body | newline_to_br }}
-- cgit v1.2.3-70-g09d2