From cd04abe52153abcc6ea6c0b6a0fb9968d06c79d4 Mon Sep 17 00:00:00 2001 From: HelloZeroNet Date: Fri, 31 Jul 2015 23:34:53 +0200 Subject: [PATCH] rev330, Early worker exit on file download bugfix, Reload only on py file changes, Modify wrapper render to allow content edit for plugins, File send action without sending header, Rename Sidebar to Fixbutton (it will be separate plugin), Fixbutton font and layout fix on OSX/Safari, Notifications fix on OSX/Safari --- plugins/disabled-UiPassword/login.html | 8 +- src/Config.py | 2 +- src/Debug/DebugReloader.py | 6 +- src/Ui/UiRequest.py | 14 +- .../{Sidebar.coffee => Fixbutton.coffee} | 27 ++-- src/Ui/media/Wrapper.coffee | 16 +- src/Ui/media/Wrapper.css | 32 ++-- src/Ui/media/all.css | 32 ++-- src/Ui/media/all.js | 138 ++++++++++-------- src/Ui/media/lib/jquery.cssanim.js | 17 ++- src/Worker/Worker.py | 4 +- src/lib/cssvendor/cssvendor.py | 2 +- 12 files changed, 164 insertions(+), 134 deletions(-) rename src/Ui/media/{Sidebar.coffee => Fixbutton.coffee} (64%) diff --git a/plugins/disabled-UiPassword/login.html b/plugins/disabled-UiPassword/login.html index 8880a7a1..10ed34fc 100644 --- a/plugins/disabled-UiPassword/login.html +++ b/plugins/disabled-UiPassword/login.html @@ -9,7 +9,7 @@ body { background-color: #323C4D; font-family: "Segoe UI", Helvetica, Arial; font-weight: lighter; font-size: 22px; color: #333; letter-spacing: 1px; color: white; overflow: hidden; } -.login { left: 50%; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%); width: 100%; max-width: 370px; text-align: center; } +.login { left: 50%; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); width: 100%; max-width: 370px; text-align: center; } *:focus { outline: 0; } input[type=text], input[type=password] { @@ -66,7 +66,7 @@ label { vertical-align: -1px; color: #9EA5B3; transition: all 0.3s; }
- Log In + Log In @@ -86,10 +86,10 @@ function submit() { if (form.checkValidity()) { document.getElementById("login_button").className = "button login-anim" setTimeout(function () { - document.getElementById("login_form_submit").click() + form.submit() }, 1000) } else { - document.getElementById("login_form_submit").click() + form.submit() } return false } diff --git a/src/Config.py b/src/Config.py index 5da6c2c0..24dcbde7 100644 --- a/src/Config.py +++ b/src/Config.py @@ -8,7 +8,7 @@ class Config(object): def __init__(self, argv): self.version = "0.3.1" - self.rev = 324 + self.rev = 330 self.argv = argv self.action = None self.createParser() diff --git a/src/Debug/DebugReloader.py b/src/Debug/DebugReloader.py index 5308f3cb..1c643f6e 100644 --- a/src/Debug/DebugReloader.py +++ b/src/Debug/DebugReloader.py @@ -37,7 +37,11 @@ class DebugReloader: print "File system watcher failed: %s (on linux pyinotify not gevent compatible yet :( )" % err def changed(self, evt): - if not evt.path or "%s/" % config.data_dir in evt.path or evt.path.endswith("pyc") or time.time() - self.last_chaged < 1: + if ( + not evt.path or "%s/" % config.data_dir in evt.path or + not evt.path.endswith("py") or + time.time() - self.last_chaged < 1 + ): return False # Ignore *.pyc changes and no reload within 1 sec time.sleep(0.1) # Wait for lock release self.callback() diff --git a/src/Ui/UiRequest.py b/src/Ui/UiRequest.py index f5517ee7..7e37fcef 100644 --- a/src/Ui/UiRequest.py +++ b/src/Ui/UiRequest.py @@ -189,15 +189,16 @@ class UiRequest(object): if not site: return False - return self.renderWrapper(site, path, inner_path, title, extra_headers) + + self.sendHeader(extra_headers=extra_headers[:]) + return iter([self.renderWrapper(site, path, inner_path, title, extra_headers)]) + # Dont know why wrapping with iter necessary, but without it around 100x slower else: # Bad url return False def renderWrapper(self, site, path, inner_path, title, extra_headers): - self.sendHeader(extra_headers=extra_headers[:]) - file_inner_path = inner_path if not file_inner_path: file_inner_path = "index.html" # If inner path defaults to index.html @@ -236,7 +237,7 @@ class UiRequest(object): if content.get("viewport"): meta_tags += '' % cgi.escape(content["viewport"], True) - yield self.render( + return self.render( "src/Ui/template/wrapper.html", server_url=server_url, inner_path=inner_path, @@ -326,14 +327,15 @@ class UiRequest(object): return self.error400() # Stream a file to client - def actionFile(self, file_path, block_size=64 * 1024): + def actionFile(self, file_path, block_size=64 * 1024, send_header=True): if os.path.isfile(file_path): # Try to figure out content type by extension content_type = self.getContentType(file_path) # TODO: Dont allow external access: extra_headers= # [("Content-Security-Policy", "default-src 'unsafe-inline' data: http://localhost:43110 ws://localhost:43110")] - self.sendHeader(content_type=content_type) + if send_header: + self.sendHeader(content_type=content_type) if self.env["REQUEST_METHOD"] != "OPTIONS": file = open(file_path, "rb") while 1: diff --git a/src/Ui/media/Sidebar.coffee b/src/Ui/media/Fixbutton.coffee similarity index 64% rename from src/Ui/media/Sidebar.coffee rename to src/Ui/media/Fixbutton.coffee index fceff729..1eb4f2e7 100644 --- a/src/Ui/media/Sidebar.coffee +++ b/src/Ui/media/Fixbutton.coffee @@ -1,33 +1,32 @@ -class Sidebar +class Fixbutton constructor: -> - @initFixbutton() - - - initFixbutton: -> - $(".fixbutton-bg").on "mouseover", -> - $(@).stop().animate({"scale": 0.7}, 800, "easeOutElastic") + @dragging = false + $(".fixbutton-bg").on "mouseover", => + $(".fixbutton-bg").stop().animate({"scale": 0.7}, 800, "easeOutElastic") $(".fixbutton-burger").stop().animate({"opacity": 1.5, "left": 0}, 800, "easeOutElastic") $(".fixbutton-text").stop().animate({"opacity": 0, "left": 20}, 300, "easeOutCubic") - $(".fixbutton-bg").on "mouseout", -> - $(@).stop().animate({"scale": 0.6}, 300, "easeOutCubic") + $(".fixbutton-bg").on "mouseout", => + if $(".fixbutton").hasClass("dragging") + return true + $(".fixbutton-bg").stop().animate({"scale": 0.6}, 300, "easeOutCubic") $(".fixbutton-burger").stop().animate({"opacity": 0, "left": -20}, 300, "easeOutCubic") $(".fixbutton-text").stop().animate({"opacity": 1, "left": 0}, 300, "easeOutBack") - + ###$(".fixbutton-bg").on "click", -> return false ### - $(".fixbutton-bg").on "mousedown", -> + $(".fixbutton-bg").on "mousedown", => # $(".fixbutton-burger").stop().animate({"scale": 0.7, "left": 0}, 300, "easeOutCubic") #$("#inner-iframe").toggleClass("back") #$(".wrapper-iframe").stop().animate({"scale": 0.9}, 600, "easeOutCubic") #$("body").addClass("back") - $(".fixbutton-bg").on "mouseup", -> + $(".fixbutton-bg").on "mouseup", => # $(".fixbutton-burger").stop().animate({"scale": 1, "left": 0}, 600, "easeOutElastic") - -window.Sidebar = Sidebar + +window.Fixbutton = Fixbutton diff --git a/src/Ui/media/Wrapper.coffee b/src/Ui/media/Wrapper.coffee index deb7a823..b79d1c34 100644 --- a/src/Ui/media/Wrapper.coffee +++ b/src/Ui/media/Wrapper.coffee @@ -4,7 +4,7 @@ class Wrapper @loading = new Loading() @notifications = new Notifications($(".notifications")) - @sidebar = new Sidebar() + @fixbutton = new Fixbutton() window.addEventListener("message", @onMessageInner, false) @inner = document.getElementById("inner-iframe").contentWindow @@ -146,10 +146,10 @@ class Wrapper message.params = @toHtmlSafe(message.params) # Escape html if message.params[1] then type = message.params[1] else type = "text" caption = "OK" - + @displayPrompt message.params[0], type, caption, (res) => @sendInner {"cmd": "response", "to": message.id, "result": res} # Response to confirm - + actionSetViewport: (message) -> @@ -171,7 +171,7 @@ class Wrapper actionGetLocalStorage: (message) -> - $.when(@event_site_info).done => + $.when(@event_site_info).done => data = localStorage.getItem "site.#{@site_info.address}" if data then data = JSON.parse(data) @sendInner {"cmd": "response", "to": message.id, "result": data} @@ -197,7 +197,7 @@ class Wrapper if not @site_info then @reloadSiteInfo() ), 2000 - if @ws_error + if @ws_error @notifications.add("connection", "done", "Connection with UiServer Websocket recovered.", 6000) @ws_error = null @@ -236,7 +236,7 @@ class Wrapper params = {"file_status": window.file_inner_path} # Query the current required file status else params = {} - + @ws.cmd "siteInfo", params, (site_info) => @address = site_info.address @setSiteInfo site_info @@ -272,7 +272,7 @@ class Wrapper if not $(".loadingscreen").length # Loading screen already removed (loaded +2sec) @notifications.add("modified", "info", "New version of this page has just released.
Reload to see the modified content.") # File failed downloading - else if site_info.event[0] == "file_failed" + else if site_info.event[0] == "file_failed" @site_error = site_info.event[1] if site_info.settings.size > site_info.size_limit*1024*1024 # Site size too large and not displaying it yet @loading.showTooLarge(site_info) @@ -280,7 +280,7 @@ class Wrapper else @loading.printLine("#{site_info.event[1]} download failed", "error") # New peers found - else if site_info.event[0] == "peers_added" + else if site_info.event[0] == "peers_added" @loading.printLine("Peers found: #{site_info.peers}") if @loading.screen_visible and not @site_info # First site info display current peers diff --git a/src/Ui/media/Wrapper.css b/src/Ui/media/Wrapper.css index 4b2cbc42..a3e66a4f 100644 --- a/src/Ui/media/Wrapper.css +++ b/src/Ui/media/Wrapper.css @@ -4,7 +4,7 @@ a { color: black } .template { display: none !important } -#inner-iframe { width: 100%; height: 100%; position: absolute; border: 0px; transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out } +#inner-iframe { width: 100%; height: 100%; position: absolute; border: 0px } /*; transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out*/ #inner-iframe.back { transform: scale(0.95) translate(-300px, 0px); opacity: 0.4 } .button { padding: 5px 10px; margin-left: 10px; background-color: #FFF85F; border-bottom: 2px solid #CDBD1E; border-radius: 2px; text-decoration: none; transition: all 0.5s; } @@ -17,16 +17,16 @@ a { color: black } /* Fixbutton */ -.fixbutton { +.fixbutton { position: absolute; right: 35px; top: 15px; width: 40px; z-index: 999; - text-align: center; color: white; font-family: Consolas; font-size: 25px; line-height: 40px; + text-align: center; color: white; font-family: Consolas, Menlo, monospace; font-size: 25px; } -.fixbutton-bg { +.fixbutton-bg { border-radius: 80px; background-color: rgba(180, 180, 180, 0.5); cursor: pointer; display: block; width: 80px; height: 80px; transition: background-color 0.2s, box-shadow 0.5s; transform: scale(0.6); margin-left: -20px; margin-top: -20px; /* 2x size to prevent blur on anim */ /*box-shadow: inset 105px 260px 0px -200px rgba(0,0,0,0.1);*/ /* box-shadow: inset -75px 183px 0px -200px rgba(0,0,0,0.1); */ } -.fixbutton-text { pointer-events: none; position: absolute; z-index: 999; width: 40px; backface-visibility: hidden; perspective: 1000px } +.fixbutton-text { pointer-events: none; position: absolute; z-index: 999; width: 40px; backface-visibility: hidden; perspective: 1000px; line-height: 0px; padding-top: 20px } .fixbutton-burger { pointer-events: none; position: absolute; z-index: 999; width: 40px; opacity: 0; left: -20px; font-size: 48px; line-height: 32px } .fixbutton-bg:hover { background-color: #AF3BFF } .fixbutton-bg:active { background-color: #9E2FEA; top: 1px; transition: none } @@ -35,16 +35,16 @@ a { color: black } /* Notification */ .notifications { position: absolute; top: 0px; right: 80px; display: inline-block; z-index: 999; white-space: nowrap } -.notification { +.notification { position: relative; float: right; clear: both; margin: 10px; box-sizing: border-box; overflow: hidden; backface-visibility: hidden; perspective: 1000px; padding-bottom: 5px; - color: #4F4F4F; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; /*border: 1px solid rgba(210, 206, 205, 0.2)*/ + color: #4F4F4F; font-family: 'Lucida Grande', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; /*border: 1px solid rgba(210, 206, 205, 0.2)*/ } -.notification-icon { +.notification-icon { display: block; width: 50px; height: 50px; position: absolute; float: left; z-index: 1; text-align: center; background-color: #e74c3c; line-height: 45px; vertical-align: bottom; font-size: 40px; color: white; } -.notification .body { - max-width: 420px; padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table; +.notification .body { + max-width: 560px; padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table; background-color: white; left: 50px; top: 0px; position: relative; padding-top: 5px; padding-bottom: 5px; } .notification.long .body { padding-top: 10px; padding-bottom: 10px } @@ -60,7 +60,7 @@ a { color: black } /* Notification select */ .notification .select { - display: block; padding: 10px; margin-right: -32px; text-decoration: none; border-left: 3px solid #EEE; + display: block; padding: 10px; margin-right: -32px; text-decoration: none; border-left: 3px solid #EEE; margin-top: 1px; transition: all 0.3s; color: #666 } .notification .select:hover, .notification .select.active { background-color: #007AFF; border-left: 3px solid #5D68FF; color: white; transition: none } @@ -90,9 +90,9 @@ a { color: black } /* Console */ .console { line-height: 24px; font-family: monospace; font-size: 14px; color: #ADADAD; text-transform: uppercase; opacity: 0; transform: translateY(-20px); } .console-line:last-child { color: #6C6767 } -.console .cursor { - background-color: #999; color: #999; animation: pulse 1.5s infinite ease-in-out; margin-right: -9px; - display: inline-block; width: 9px; height: 19px; vertical-align: -4px; +.console .cursor { + background-color: #999; color: #999; animation: pulse 1.5s infinite ease-in-out; margin-right: -9px; + display: inline-block; width: 9px; height: 19px; vertical-align: -4px; } .console .console-error { color: #e74c3c; font-weight: bold; animation: pulse 2s infinite linear } .console .console-warning { color: #8e44ad; } @@ -120,14 +120,14 @@ a { color: black } .progressbar { background: #26C281; position: fixed; z-index: 100; top: 0; left: 0; width: 0%; height: 2px; transition: width 0.5s, opacity 1s; display: none } -.progressbar .peg { +.progressbar .peg { display: block; position: absolute; right: 0px; width: 100px; height: 100%; box-shadow: 0 0 10px #AF3BFF, 0 0 5px #29d; opacity: 1.0; transform: rotate(3deg) translate(0px, -4px); } /* Icons */ .icon-profile { font-size: 6px; top: 0em; border-radius: 0.7em 0.7em 0 0; background: #FFFFFF; width: 1.5em; height: 0.7em; position: relative; display: inline-block; margin-right: 4px } -.icon-profile::before { position: absolute; content: ""; top: -1em; left: 0.38em; width: 0.8em; height: 0.85em; border-radius: 50%; background: #FFFFFF } +.icon-profile::before { position: absolute; content: ""; top: -1em; left: 0.38em; width: 0.8em; height: 0.85em; border-radius: 50%; background: #FFFFFF } /* Animations */ diff --git a/src/Ui/media/all.css b/src/Ui/media/all.css index be2564b5..81e8a74f 100644 --- a/src/Ui/media/all.css +++ b/src/Ui/media/all.css @@ -9,7 +9,7 @@ a { color: black } .template { display: none !important } -#inner-iframe { width: 100%; height: 100%; position: absolute; border: 0px; -webkit-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out ; -moz-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out ; -o-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out ; -ms-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out ; transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out } +#inner-iframe { width: 100%; height: 100%; position: absolute; border: 0px } /*; transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.8s ease-in-out*/ #inner-iframe.back { -webkit-transform: scale(0.95) translate(-300px, 0px); -moz-transform: scale(0.95) translate(-300px, 0px); -o-transform: scale(0.95) translate(-300px, 0px); -ms-transform: scale(0.95) translate(-300px, 0px); transform: scale(0.95) translate(-300px, 0px) ; opacity: 0.4 } .button { padding: 5px 10px; margin-left: 10px; background-color: #FFF85F; border-bottom: 2px solid #CDBD1E; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px ; text-decoration: none; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s ; } @@ -22,16 +22,16 @@ a { color: black } /* Fixbutton */ -.fixbutton { +.fixbutton { position: absolute; right: 35px; top: 15px; width: 40px; z-index: 999; - text-align: center; color: white; font-family: Consolas; font-size: 25px; line-height: 40px; + text-align: center; color: white; font-family: Consolas, Menlo, monospace; font-size: 25px; } -.fixbutton-bg { +.fixbutton-bg { -webkit-border-radius: 80px; -moz-border-radius: 80px; -o-border-radius: 80px; -ms-border-radius: 80px; border-radius: 80px ; background-color: rgba(180, 180, 180, 0.5); cursor: pointer; display: block; width: 80px; height: 80px; -webkit-transition: background-color 0.2s, box-shadow 0.5s; -moz-transition: background-color 0.2s, box-shadow 0.5s; -o-transition: background-color 0.2s, box-shadow 0.5s; -ms-transition: background-color 0.2s, box-shadow 0.5s; transition: background-color 0.2s, box-shadow 0.5s ; -webkit-transform: scale(0.6); -moz-transform: scale(0.6); -o-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6) ; margin-left: -20px; margin-top: -20px; /* 2x size to prevent blur on anim */ /*box-shadow: inset 105px 260px 0px -200px rgba(0,0,0,0.1);*/ /* -webkit-box-shadow: inset -75px 183px 0px -200px rgba(0,0,0,0.1); -moz-box-shadow: inset -75px 183px 0px -200px rgba(0,0,0,0.1); -o-box-shadow: inset -75px 183px 0px -200px rgba(0,0,0,0.1); -ms-box-shadow: inset -75px 183px 0px -200px rgba(0,0,0,0.1); box-shadow: inset -75px 183px 0px -200px rgba(0,0,0,0.1) ; */ } -.fixbutton-text { pointer-events: none; position: absolute; z-index: 999; width: 40px; backface-visibility: hidden; -webkit-perspective: 1000px ; -moz-perspective: 1000px ; -o-perspective: 1000px ; -ms-perspective: 1000px ; perspective: 1000px } +.fixbutton-text { pointer-events: none; position: absolute; z-index: 999; width: 40px; backface-visibility: hidden; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px ; line-height: 0px; padding-top: 20px } .fixbutton-burger { pointer-events: none; position: absolute; z-index: 999; width: 40px; opacity: 0; left: -20px; font-size: 48px; line-height: 32px } .fixbutton-bg:hover { background-color: #AF3BFF } .fixbutton-bg:active { background-color: #9E2FEA; top: 1px; -webkit-transition: none ; -moz-transition: none ; -o-transition: none ; -ms-transition: none ; transition: none } @@ -40,16 +40,16 @@ a { color: black } /* Notification */ .notifications { position: absolute; top: 0px; right: 80px; display: inline-block; z-index: 999; white-space: nowrap } -.notification { +.notification { position: relative; float: right; clear: both; margin: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; overflow: hidden; backface-visibility: hidden; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px ; padding-bottom: 5px; - color: #4F4F4F; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; /*border: 1px solid rgba(210, 206, 205, 0.2)*/ + color: #4F4F4F; font-family: 'Lucida Grande', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; /*border: 1px solid rgba(210, 206, 205, 0.2)*/ } -.notification-icon { +.notification-icon { display: block; width: 50px; height: 50px; position: absolute; float: left; z-index: 1; text-align: center; background-color: #e74c3c; line-height: 45px; vertical-align: bottom; font-size: 40px; color: white; } -.notification .body { - max-width: 420px; padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table; +.notification .body { + max-width: 560px; padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table; background-color: white; left: 50px; top: 0px; position: relative; padding-top: 5px; padding-bottom: 5px; } .notification.long .body { padding-top: 10px; padding-bottom: 10px } @@ -65,7 +65,7 @@ a { color: black } /* Notification select */ .notification .select { - display: block; padding: 10px; margin-right: -32px; text-decoration: none; border-left: 3px solid #EEE; + display: block; padding: 10px; margin-right: -32px; text-decoration: none; border-left: 3px solid #EEE; margin-top: 1px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s ; color: #666 } .notification .select:hover, .notification .select.active { background-color: #007AFF; border-left: 3px solid #5D68FF; color: white; -webkit-transition: none ; -moz-transition: none ; -o-transition: none ; -ms-transition: none ; transition: none } @@ -95,9 +95,9 @@ a { color: black } /* Console */ .console { line-height: 24px; font-family: monospace; font-size: 14px; color: #ADADAD; text-transform: uppercase; opacity: 0; -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); -o-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px) ; } .console-line:last-child { color: #6C6767 } -.console .cursor { - background-color: #999; color: #999; -webkit-animation: pulse 1.5s infinite ease-in-out; -moz-animation: pulse 1.5s infinite ease-in-out; -o-animation: pulse 1.5s infinite ease-in-out; -ms-animation: pulse 1.5s infinite ease-in-out; animation: pulse 1.5s infinite ease-in-out ; margin-right: -9px; - display: inline-block; width: 9px; height: 19px; vertical-align: -4px; +.console .cursor { + background-color: #999; color: #999; -webkit-animation: pulse 1.5s infinite ease-in-out; -moz-animation: pulse 1.5s infinite ease-in-out; -o-animation: pulse 1.5s infinite ease-in-out; -ms-animation: pulse 1.5s infinite ease-in-out; animation: pulse 1.5s infinite ease-in-out ; margin-right: -9px; + display: inline-block; width: 9px; height: 19px; vertical-align: -4px; } .console .console-error { color: #e74c3c; font-weight: bold; -webkit-animation: pulse 2s infinite linear ; -moz-animation: pulse 2s infinite linear ; -o-animation: pulse 2s infinite linear ; -ms-animation: pulse 2s infinite linear ; animation: pulse 2s infinite linear } .console .console-warning { color: #8e44ad; } @@ -125,14 +125,14 @@ a { color: black } .progressbar { background: #26C281; position: fixed; z-index: 100; top: 0; left: 0; width: 0%; height: 2px; -webkit-transition: width 0.5s, opacity 1s; -moz-transition: width 0.5s, opacity 1s; -o-transition: width 0.5s, opacity 1s; -ms-transition: width 0.5s, opacity 1s; transition: width 0.5s, opacity 1s ; display: none } -.progressbar .peg { +.progressbar .peg { display: block; position: absolute; right: 0px; width: 100px; height: 100%; -webkit-box-shadow: 0 0 10px #AF3BFF, 0 0 5px #29d; -moz-box-shadow: 0 0 10px #AF3BFF, 0 0 5px #29d; -o-box-shadow: 0 0 10px #AF3BFF, 0 0 5px #29d; -ms-box-shadow: 0 0 10px #AF3BFF, 0 0 5px #29d; box-shadow: 0 0 10px #AF3BFF, 0 0 5px #29d ; opacity: 1.0; -webkit-transform: rotate(3deg) translate(0px, -4px); -moz-transform: rotate(3deg) translate(0px, -4px); -o-transform: rotate(3deg) translate(0px, -4px); -ms-transform: rotate(3deg) translate(0px, -4px); transform: rotate(3deg) translate(0px, -4px) ; } /* Icons */ .icon-profile { font-size: 6px; top: 0em; -webkit-border-radius: 0.7em 0.7em 0 0; -moz-border-radius: 0.7em 0.7em 0 0; -o-border-radius: 0.7em 0.7em 0 0; -ms-border-radius: 0.7em 0.7em 0 0; border-radius: 0.7em 0.7em 0 0 ; background: #FFFFFF; width: 1.5em; height: 0.7em; position: relative; display: inline-block; margin-right: 4px } -.icon-profile::before { position: absolute; content: ""; top: -1em; left: 0.38em; width: 0.8em; height: 0.85em; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50% ; background: #FFFFFF } +.icon-profile::before { position: absolute; content: ""; top: -1em; left: 0.38em; width: 0.8em; height: 0.85em; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50% ; background: #FFFFFF } /* Animations */ diff --git a/src/Ui/media/all.js b/src/Ui/media/all.js index 0c5693fe..9e99b16e 100644 --- a/src/Ui/media/all.js +++ b/src/Ui/media/all.js @@ -154,7 +154,7 @@ jQuery.cssHooks['scale'] = { get: function(elem, computed, extra) { - var match = window.getComputedStyle(elem).transform.match("[0-9\.]+") + var match = window.getComputedStyle(elem)[transform_property].match("[0-9\.]+") if (match) { var scale = parseFloat(match[0]) return scale @@ -164,14 +164,14 @@ jQuery.cssHooks['scale'] = { }, set: function(elem, val) { //var transforms = $(elem).css("transform").match(/[0-9\.]+/g) - var transforms = window.getComputedStyle(elem).transform.match(/[0-9\.]+/g) + var transforms = window.getComputedStyle(elem)[transform_property].match(/[0-9\.]+/g) if (transforms) { transforms[0] = val transforms[3] = val //$(elem).css("transform", 'matrix('+transforms.join(", ")+")") - elem.style.transform = 'matrix('+transforms.join(", ")+')' + elem.style[transform_property] = 'matrix('+transforms.join(", ")+')' } else { - elem.style.transform = "scale("+val+")" + elem.style[transform_property] = "scale("+val+")" } } } @@ -181,6 +181,14 @@ jQuery.fx.step.scale = function(fx) { }; +if (window.getComputedStyle(document.body).transform) { + transform_property = "transform" +} else { + transform_property = "webkitTransform" +} + + + /* ---- src/Ui/media/lib/jquery.csslater.coffee ---- */ @@ -458,6 +466,69 @@ jQuery.extend( jQuery.easing, */ +/* ---- src/Ui/media/Fixbutton.coffee ---- */ + + +(function() { + var Fixbutton; + + Fixbutton = (function() { + function Fixbutton() { + this.dragging = false; + $(".fixbutton-bg").on("mouseover", (function(_this) { + return function() { + $(".fixbutton-bg").stop().animate({ + "scale": 0.7 + }, 800, "easeOutElastic"); + $(".fixbutton-burger").stop().animate({ + "opacity": 1.5, + "left": 0 + }, 800, "easeOutElastic"); + return $(".fixbutton-text").stop().animate({ + "opacity": 0, + "left": 20 + }, 300, "easeOutCubic"); + }; + })(this)); + $(".fixbutton-bg").on("mouseout", (function(_this) { + return function() { + if ($(".fixbutton").hasClass("dragging")) { + return true; + } + $(".fixbutton-bg").stop().animate({ + "scale": 0.6 + }, 300, "easeOutCubic"); + $(".fixbutton-burger").stop().animate({ + "opacity": 0, + "left": -20 + }, 300, "easeOutCubic"); + return $(".fixbutton-text").stop().animate({ + "opacity": 1, + "left": 0 + }, 300, "easeOutBack"); + }; + })(this)); + + /*$(".fixbutton-bg").on "click", -> + return false + */ + $(".fixbutton-bg").on("mousedown", (function(_this) { + return function() {}; + })(this)); + $(".fixbutton-bg").on("mouseup", (function(_this) { + return function() {}; + })(this)); + } + + return Fixbutton; + + })(); + + window.Fixbutton = Fixbutton; + +}).call(this); + + /* ---- src/Ui/media/Loading.coffee ---- */ @@ -681,61 +752,6 @@ jQuery.extend( jQuery.easing, }).call(this); -/* ---- src/Ui/media/Sidebar.coffee ---- */ - - -(function() { - var Sidebar; - - Sidebar = (function() { - function Sidebar() { - this.initFixbutton(); - } - - Sidebar.prototype.initFixbutton = function() { - $(".fixbutton-bg").on("mouseover", function() { - $(this).stop().animate({ - "scale": 0.7 - }, 800, "easeOutElastic"); - $(".fixbutton-burger").stop().animate({ - "opacity": 1.5, - "left": 0 - }, 800, "easeOutElastic"); - return $(".fixbutton-text").stop().animate({ - "opacity": 0, - "left": 20 - }, 300, "easeOutCubic"); - }); - $(".fixbutton-bg").on("mouseout", function() { - $(this).stop().animate({ - "scale": 0.6 - }, 300, "easeOutCubic"); - $(".fixbutton-burger").stop().animate({ - "opacity": 0, - "left": -20 - }, 300, "easeOutCubic"); - return $(".fixbutton-text").stop().animate({ - "opacity": 1, - "left": 0 - }, 300, "easeOutBack"); - }); - - /*$(".fixbutton-bg").on "click", -> - return false - */ - $(".fixbutton-bg").on("mousedown", function() {}); - return $(".fixbutton-bg").on("mouseup", function() {}); - }; - - return Sidebar; - - })(); - - window.Sidebar = Sidebar; - -}).call(this); - - /* ---- src/Ui/media/Wrapper.coffee ---- */ @@ -756,7 +772,7 @@ jQuery.extend( jQuery.easing, this.log("Created!"); this.loading = new Loading(); this.notifications = new Notifications($(".notifications")); - this.sidebar = new Sidebar(); + this.fixbutton = new Fixbutton(); window.addEventListener("message", this.onMessageInner, false); this.inner = document.getElementById("inner-iframe").contentWindow; this.ws = new ZeroWebsocket(ws_url); @@ -1218,4 +1234,4 @@ jQuery.extend( jQuery.easing, window.wrapper = new Wrapper(ws_url); -}).call(this); +}).call(this); \ No newline at end of file diff --git a/src/Ui/media/lib/jquery.cssanim.js b/src/Ui/media/lib/jquery.cssanim.js index 6b0aaf1b..be93a386 100644 --- a/src/Ui/media/lib/jquery.cssanim.js +++ b/src/Ui/media/lib/jquery.cssanim.js @@ -1,6 +1,6 @@ jQuery.cssHooks['scale'] = { get: function(elem, computed, extra) { - var match = window.getComputedStyle(elem).transform.match("[0-9\.]+") + var match = window.getComputedStyle(elem)[transform_property].match("[0-9\.]+") if (match) { var scale = parseFloat(match[0]) return scale @@ -10,18 +10,25 @@ jQuery.cssHooks['scale'] = { }, set: function(elem, val) { //var transforms = $(elem).css("transform").match(/[0-9\.]+/g) - var transforms = window.getComputedStyle(elem).transform.match(/[0-9\.]+/g) + var transforms = window.getComputedStyle(elem)[transform_property].match(/[0-9\.]+/g) if (transforms) { transforms[0] = val transforms[3] = val //$(elem).css("transform", 'matrix('+transforms.join(", ")+")") - elem.style.transform = 'matrix('+transforms.join(", ")+')' + elem.style[transform_property] = 'matrix('+transforms.join(", ")+')' } else { - elem.style.transform = "scale("+val+")" + elem.style[transform_property] = "scale("+val+")" } } } jQuery.fx.step.scale = function(fx) { jQuery.cssHooks['scale'].set(fx.elem, fx.now) -}; \ No newline at end of file +}; + + +if (window.getComputedStyle(document.body).transform) { + transform_property = "transform" +} else { + transform_property = "webkitTransform" +} diff --git a/src/Worker/Worker.py b/src/Worker/Worker.py index 09398e22..963aed54 100644 --- a/src/Worker/Worker.py +++ b/src/Worker/Worker.py @@ -47,9 +47,11 @@ class Worker(object): except Exception, err: self.manager.log.debug("%s: getFile error: %s" % (self.key, err)) buff = None - if self.running is False or task["done"] is True: # Worker no longer needed or got killed + if self.running is False: # Worker no longer needed or got killed self.manager.log.debug("%s: No longer needed, returning: %s" % (self.key, task["inner_path"])) break + if task["done"] is True: # Task done, try to find new one + continue if buff: # Download ok correct = site.content_manager.verifyFile(task["inner_path"], buff) else: # Download error diff --git a/src/lib/cssvendor/cssvendor.py b/src/lib/cssvendor/cssvendor.py index f7cb1ba5..49da87fb 100644 --- a/src/lib/cssvendor/cssvendor.py +++ b/src/lib/cssvendor/cssvendor.py @@ -7,7 +7,7 @@ def prefix(content): content, flags=re.DOTALL ) content = re.sub( - '([^-\*])(border-radius|box-shadow|transition|animation|box-sizing|' + + '([^-\*])(border-radius|box-shadow|appearance|transition|animation|box-sizing|' + 'transform|filter|perspective|animation-[a-z-]+): (.*?)([;}])', '\\1-webkit-\\2: \\3; -moz-\\2: \\3; -o-\\2: \\3; -ms-\\2: \\3; \\2: \\3 \\4', content )