Skip to content

Commit

Permalink
Added Zip/Sharing by URL. Added download via Blob. +UI.
Browse files Browse the repository at this point in the history
  • Loading branch information
@BKcore
BKcore committed Feb 24, 2013
1 parent 7e70fcc commit a34efec
Show file tree
Hide file tree
Showing 8 changed files with 398 additions and 18 deletions.
75 changes: 69 additions & 6 deletions sources/css/main.css
View file
Expand Up @@ -223,20 +223,24 @@ button::-moz-focus-inner {
background: #222222;
}

.menu-icon-only {
padding-left: 12px;
padding-right: 12px;
}

.menu-right {
float: right !important;
}

.menu-item i, .menu-trigger i, .menu-btn i {
.menu-item i, .menu-trigger i, .menu-button i {
margin-right: 6px;
font-size: 14px;
}

.menu-icon-only {
padding-left: 12px;
padding-right: 12px;
}

.menu-icon-only i {
margin-right: 0px;
}

.menu-trigger.open {
padding-top: 4px;
font-size: 0px;
Expand All @@ -245,6 +249,65 @@ button::-moz-focus-inner {
font-size: 14px;
}

.box {
position: absolute;
z-index: 1000;
background: #1c1c1c;
-webkit-box-shadow: 0px 0px 16px 0px #333;
box-shadow: 0px 0px 16px 0px #333;
border: 1px solid #090909;
display: none;
}

.box h1 {
margin: 0;
padding: 12px;
padding-top: 16px;
color: #040404;
text-shadow: 0px 1px 0px #333;
filter: dropshadow(color=#333, offx=0, offy=1);
}

.box .close {
color: #040404;
text-shadow: 0px 1px 0px #333;
filter: dropshadow(color=#333, offx=0, offy=1);
font-size: 16px;
padding: 4px;
cursor: pointer;
position: absolute;
top: 8px;
right: 6px;
background: none;
border: none;
}

.box .close:hover {
color: #666;
}

#box-share {
z-index: 1001;
width: 400px;
top: 50%;
left: 50%;
margin-top: -50px;
margin-left: -200px;
}

#box-share-url {
margin: 12px;
margin-top: 0px;
background: #111;
border: none;
width: 356px;
line-height: 40px;
height: 40px;
color: #999;
padding: 0px 10px;
-webkit-box-shadow: inset 0px 4px 6px 0px #060606, 0px 1px 0px 0px #333333;
box-shadow: inset 0px 4px 6px 0px #060606, 0px 1px 0px 0px #333333;
}

.ace_gutter {
-webkit-touch-callout: none;
Expand Down
24 changes: 20 additions & 4 deletions sources/editor.html
View file
Expand Up @@ -19,10 +19,6 @@
<button class="menu-item" data-index="1">Vertex</button>
</div>
</div>
<div class="menu" id="menu-snippets" data-action="snippets">
<button class="menu-trigger"><i class="icon-plus"></i>Snippets</button>
<div class="menu-list"></div>
</div>
<div class="menu" id="menu-update" data-action="update">
<button class="menu-trigger"><i class="icon-circle"></i>Auto update</button>
<div class="menu-list">
Expand All @@ -31,6 +27,16 @@
<button class="menu-item" data-index="2"><i class="icon-circle-blank"></i>Ctrl+S Update</button>
</div>
</div>
<div class="menu" id="menu-snippets" data-action="snippets">
<button class="menu-trigger"><i class="icon-plus"></i>Snippets</button>
<div class="menu-list"></div>
</div>
<div class="menu" id="menu-download" data-action="download">
<button class="menu-button"><i class="icon-download-alt"></i>Download</button>
</div>
<div class="menu" id="menu-share" data-action="share">
<button class="menu-button"><i class="icon-share-alt"></i>Share</button>
</div>
<!-- LEFT/RIGHT -->
<div class="menu menu-right" id="menu-models" data-action="models">
<button class="menu-trigger"><i class="icon-reorder"></i><span>Monkey (high)</span></button>
Expand Down Expand Up @@ -58,6 +64,16 @@
</div>
</div>

<div id="box-share" class="box">
<h1 class="title">Share URL</h1>
<div class="content">
<input type="text" value="" id="box-share-url"></input>
</div>
<button class="close">
<i class="icon-remove"></i>
</button>
</div>

<div id="mid-separator"></div>
<div id="top-separator"></div>
<div id="bottom-separator"></div>
Expand Down
101 changes: 97 additions & 4 deletions sources/shdr/App.coffee
View file
Expand Up @@ -9,6 +9,7 @@ class App
constructor: (domEditor, domCanvas, conf={}) ->
# CUSTOM THREE.JS HACK
window.THREE_SHADER_OVERRIDE = true
@initBaseurl()
@documents = ['', '']
@marker = null
@conf =
Expand All @@ -19,10 +20,19 @@ class App
@viewer = new shdr.Viewer(@byId(domCanvas))
@validator = new shdr.Validator(@viewer.canvas)
@initEditor(domEditor)
@initFromURL()
@byId(domEditor).addEventListener('keyup', ((e) => @onEditorKeyUp(e)), off)
@byId(domEditor).addEventListener('keydown', ((e) => @onEditorKeyDown(e)), off)
@loop()

initBaseurl: ->
url = window.location.href
hash = url.indexOf('#')
if hash > 0
@baseurl = url.substr(0, hash)
else
@baseurl = url

initEditor: (domEditor) ->
@documents[App.FRAGMENT] = @viewer.fs
@documents[App.VERTEX] = @viewer.vs
Expand Down Expand Up @@ -66,6 +76,88 @@ class App
@ui.setStatus("Line #{line} : #{msg}",
shdr.UI.ERROR)

initFromURL: ->
obj = @unpackURL()
if obj and obj.documents and obj.documents.length is 2
@documents = obj.documents
fs = @documents[App.FRAGMENT]
vs = @documents[App.VERTEX]
[_fs, fl, fm] = @validator.validate(fs, shdr.Validator.FRAGMENT)
[_vs, vl, vm] = @validator.validate(vs, shdr.Validator.VERTEX)
if _fs and _vs
@viewer.updateShader(vs, App.VERTEX)
@viewer.updateShader(fs, App.FRAGMENT)
@editor.getSession().setValue(if @conf.mode is App.VERTEX then vs else fs)
@ui.setMenuMode(App.FRAGMENT)
@ui.setStatus("Shaders successfully loaded and compiled from URL.",
shdr.UI.SUCCESS)
else if _vs
@viewer.updateShader(vs, App.VERTEX)
@setMode(App.FRAGMENT, true)
@ui.setMenuMode(App.FRAGMENT)
@ui.setStatus("Shaders loaded from URL but Fragment could not compile. Line #{fl} : #{fm}",
shdr.UI.WARNING)
else if _fs
@viewer.updateShader(fs, App.FRAGMENT)
@setMode(App.VERTEX, true)
@ui.setMenuMode(App.VERTEX)
@ui.setStatus("Shaders loaded from URL but Vertex could not compile. Line #{vl} : #{vm}",
shdr.UI.WARNING)
else
@setMode(App.VERTEX, true)
@ui.setMenuMode(App.VERTEX)
@ui.setStatus("Shaders loaded from URL but could not compile. Line #{vl} : #{vm}",
shdr.UI.WARNING)
@editor.focus()
true
else
false

packURL: ->
try
obj =
documents: @documents
model: @viewer.currentModel
json = JSON.stringify(obj)
packed = window.btoa(RawDeflate.deflate(json))
return @baseurl + '#1/' + packed
catch e
@ui.setStatus("Unable to pack document: #{e.getMessage?()}",
shdr.UI.WARNING)

unpackURL: ->
return false if not window.location.hash
try
hash = window.location.hash.substr(1)
version = hash.substr(0, 2)
packed = hash.substr(2)
json = RawDeflate.inflate(window.atob(packed))
obj = JSON.parse(json)
return obj
catch e
@ui.setStatus("Unable to unpack document: #{e.getMessage?()}",
shdr.UI.WARNING)

download: ->
try
blob = new Blob([@editor.getSession().getValue()],
type: 'text/plain'
)
url = URL.createObjectURL(blob)
win = window.open(url, '_blank')
if win
win.focus()
else
@ui.setStatus('Your browser as blocked the download, please disable popup blocker.',
shdr.UI.WARNING)
catch e
@ui.setStatus('Your browser does not support Blob, unable to download.',
shdr.UI.WARNING)
url

updateDocument: ->
@documents[@conf.mode] = @editor.getSession().getValue()

onEditorKeyUp: (e) ->
key = e.keyCode
proc = @conf.update is App.UPDATE_ENTER and key is 13
Expand All @@ -89,19 +181,20 @@ class App
@conf.update = parseInt(mode)
this

setMode: (mode=App.FRAGMENT) ->
setMode: (mode=App.FRAGMENT, force=false) ->
mode = parseInt(mode)
return false if @conf.mode is mode
return false if @conf.mode is mode and not force
old = @conf.mode
@conf.mode = mode
session = @editor.getSession()
switch mode
when App.FRAGMENT
@documents[old] = session.getValue()
@documents[old] = session.getValue() if not force
session.setValue(@documents[App.FRAGMENT])
when App.VERTEX
@documents[old] = session.getValue()
@documents[old] = session.getValue() if not force
session.setValue(@documents[App.VERTEX])
@updateShader()
this

byId: (id) ->
Expand Down

0 comments on commit a34efec

Please sign in to comment.