* styling of client update finished; VRFS-302
This commit is contained in:
parent
cbe67553df
commit
423604f869
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
|
|
@ -3,6 +3,8 @@
|
|||
"use strict";
|
||||
|
||||
context.JK = context.JK || {};
|
||||
|
||||
|
||||
context.JK.ClientUpdate = function() {
|
||||
var self = this;
|
||||
var logger = context.JK.logger;
|
||||
|
|
@ -11,6 +13,37 @@
|
|||
var updateSize = 0;
|
||||
|
||||
|
||||
// responsible for updating the contents of the update dialog
|
||||
// as well as registering for any event handlers
|
||||
function updateClientUpdateDialog(templateId, options) {
|
||||
var template = $('#template-' + templateId).html();
|
||||
var templateHtml = context.JK.fillTemplate(template, options);
|
||||
|
||||
$('#client_update .dialog-inner').html(templateHtml);
|
||||
|
||||
// assign click handlers
|
||||
if(templateId == "update-start") {
|
||||
$("#client_update a.close-application").click(function() {
|
||||
// noop atm
|
||||
return false;
|
||||
})
|
||||
|
||||
$("#client_update a.start-update").click(function() {
|
||||
startDownload(options.uri)
|
||||
return false;
|
||||
})
|
||||
}
|
||||
else if(templateId == "update-downloading") {
|
||||
$("#client_update a.close-application").click(function() {
|
||||
// noop atm
|
||||
return false;
|
||||
})
|
||||
}
|
||||
|
||||
$('#client_update').show()
|
||||
$('#client_update_overlay').show()
|
||||
}
|
||||
|
||||
/***************************************/
|
||||
/******** CALLBACKS FROM BACKEND *******/
|
||||
/***************************************/
|
||||
|
|
@ -21,49 +54,62 @@
|
|||
bytesReceived = Number(bytesReceived)
|
||||
bytesTotal = Number(bytesTotal)
|
||||
// bytesTotal from Qt is not trust worthy; trust server's answer instead
|
||||
$('#downloadprogressbar div').width( ((bytesReceived/updateSize) * 100).toString() + "%" )
|
||||
$("#progres sbar_detail").text(parseInt(bytesReceived) + "/" + parseInt(updateSize))
|
||||
$('#progress-bar').width( ((bytesReceived/updateSize) * 100).toString() + "%" )
|
||||
//$("#progressbar_detail").text(parseInt(bytesReceived) + "/" + parseInt(updateSize))
|
||||
}
|
||||
|
||||
function clientUpdateDownloadSuccess(updateLocation) {
|
||||
logger.debug("client update downloaded successfully to: " + updateLocation);
|
||||
|
||||
updateClientUpdateDialog("update-restarting");
|
||||
|
||||
startUpdate(updateLocation);
|
||||
}
|
||||
|
||||
function clientUpdateDownloadFailure(errorMsg) {
|
||||
logger.error("client update download error: " + errorMsg)
|
||||
|
||||
alert("Unable to download client update due to reason:" + errorMsg);
|
||||
updateClientUpdateDialog("update-error", {error_msg: "Unable to download client update. Error reason: <br/>" + errorMsg });
|
||||
}
|
||||
|
||||
|
||||
function clientUpdateLaunchSuccess(updateLocation) {
|
||||
logger.debug("client update launched successfully to: " + updateLocation);
|
||||
|
||||
alert("Client updating momentarily...");
|
||||
}
|
||||
|
||||
function clientUpdateLaunchFailure(errorMsg) {
|
||||
logger.error("client update launch error: " + errorMsg)
|
||||
|
||||
alert("Unable to launch client updater due to reason: " + errorMsg)
|
||||
updateClientUpdateDialog("update-error", {error_msg: "Unable to launch client updater. Error reason: <br/>" + errorMsg});
|
||||
}
|
||||
/********************************************/
|
||||
/******** END: CALLBACKS FROM BACKEND *******/
|
||||
/********************************************/
|
||||
|
||||
// if the current version doesn't not match the server version, attempt to do an upgrade
|
||||
function shouldUpdate(currentVersion, version) {
|
||||
return true;
|
||||
if(version == null || version == "") {
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
return currentVersion != version;
|
||||
}
|
||||
}
|
||||
|
||||
// check if updated is needed
|
||||
function check() {
|
||||
|
||||
// check kill switch before all other logic
|
||||
if(!gon.check_for_client_updates) {
|
||||
logger.debug("skipping client update because the server is telling us not to")
|
||||
return;
|
||||
}
|
||||
|
||||
var product = "JamClient"
|
||||
var os = context.jamClient.GetOSAsString()
|
||||
var currentVersion = context.jamClient.ClientUpdateVersion();
|
||||
|
||||
|
||||
if(currentVersion == null || currentVersion.indexOf("Compiled") > -1) {
|
||||
// this is a developer build; it doesn't make much sense to do an packaged update, so skip
|
||||
logger.debug("skipping client update check because this is a development build")
|
||||
|
|
@ -78,18 +124,18 @@
|
|||
logger.debug("our client version: " + currentVersion + ", server client version: " + version);
|
||||
|
||||
// test url in lieu of having a configured server with a client-update available
|
||||
//response.url = "http://localhost:8000/winimager/QtGui4.dll"
|
||||
response.url = "http://localhost:8000/winimager/QtGui4.dll"
|
||||
|
||||
if(shouldUpdate(currentVersion, version)) {
|
||||
updateSize = response.size;
|
||||
|
||||
// test metadata in lieu of having a configured server with a client-update available
|
||||
// updateSize = 10000;
|
||||
// version = "1.2.3"
|
||||
if (confirm("The client will update to version " + version + " momentarily."))
|
||||
{
|
||||
startDownload(response.uri)
|
||||
}
|
||||
//updateSize = 10000;
|
||||
//version = "1.2.3"
|
||||
|
||||
// this will update the client dialog to how it should look when an update is just starting
|
||||
// and show it front-and-center on the screen
|
||||
updateClientUpdateDialog("update-start", { uri : response.uri } )
|
||||
}
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
|
|
@ -101,8 +147,7 @@
|
|||
function startDownload(url) {
|
||||
logger.debug("starting client updater download from: " + url);
|
||||
|
||||
// initialize div in page so that we have something to update. temporary until real styles come
|
||||
$('body').append($("<div id='downloadprogressbar_container'><span id='progressbar_info'>Downloading Client Update...<span id='progressbar_detail'></span></span><div id='downloadprogressbar'><div></div></div></div>"))
|
||||
updateClientUpdateDialog("update-downloading")
|
||||
|
||||
context.jamClient.ClientUpdateStartDownload(url,
|
||||
"JK.ClientUpdate.DownloadProgressCallback",
|
||||
|
|
|
|||
|
|
@ -277,6 +277,9 @@
|
|||
if(count < max) {
|
||||
fire()
|
||||
}
|
||||
else {
|
||||
JK.ClientUpdate.DownloadFailureCallback("/some/path/here")
|
||||
}
|
||||
}, 50)
|
||||
}
|
||||
fire()
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
#client_update_overlay {
|
||||
display:none;
|
||||
}
|
||||
|
||||
#client_update {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width:100%;
|
||||
background-color:#000;
|
||||
border: solid 1px #ED3618;
|
||||
height:22px;
|
||||
}
|
||||
|
||||
#progress-bar {
|
||||
width:0%;
|
||||
}
|
||||
|
||||
.progress-bar-progress {
|
||||
background-color:#ED3618;
|
||||
border:solid 1px #000;
|
||||
height:20px;
|
||||
display:block;
|
||||
}
|
||||
|
||||
#client_update h2 {
|
||||
font-weight:bold;
|
||||
font-size:x-large;
|
||||
}
|
||||
|
|
@ -37,5 +37,37 @@
|
|||
.dialog .tab {
|
||||
}
|
||||
|
||||
.dialog-fixed {
|
||||
min-height:600px;
|
||||
}
|
||||
|
||||
.dialog-overlay-sm {
|
||||
width:600px;
|
||||
height:auto;
|
||||
position:fixed;
|
||||
left:50%;
|
||||
top:20%;
|
||||
margin-left:-300px;
|
||||
background-color:#333;
|
||||
border: 1px solid #ed3618;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.dialog-overlay .dialog-inner {
|
||||
width:750px;
|
||||
height:auto;
|
||||
padding:25px;
|
||||
font-size:15px;
|
||||
color:#aaa;
|
||||
}
|
||||
|
||||
.dialog-overlay-sm .dialog-inner {
|
||||
width:550px;
|
||||
height:auto;
|
||||
padding:25px;
|
||||
font-size:15px;
|
||||
color:#aaa;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -316,12 +316,13 @@ a img {
|
|||
}
|
||||
|
||||
.overlay {
|
||||
position:absolute;
|
||||
position:fixed;
|
||||
width:100%;
|
||||
height:100%;
|
||||
top:0px;
|
||||
left:0px;
|
||||
background-image:url(../images/shared/bkg_overlay.png);
|
||||
z-index: 999;
|
||||
background-image:url('/assets/shared/bkg_overlay.png');
|
||||
}
|
||||
|
||||
.white {
|
||||
|
|
|
|||
|
|
@ -29,7 +29,14 @@ class ArtifactsController < ApiController
|
|||
if @artifact.nil?
|
||||
render :json => {}, :status => :ok
|
||||
else
|
||||
render :json => { "version" => @artifact.version, "uri" => @artifact.uri.url, "sha1" => @artifact.sha1, "size" => @artifact.size }, :status => :ok
|
||||
if SampleApp::Application.config.storage_type == :file
|
||||
# this is basically a dev-time only path of code; we store real artifacts in s3
|
||||
url = SampleApp::Application.config.jam_admin_root_url + @artifact.uri.url
|
||||
else
|
||||
url = @artifact.uri.url
|
||||
end
|
||||
|
||||
render :json => { "version" => @artifact.version, "uri" => url, "sha1" => @artifact.sha1, "size" => @artifact.size }, :status => :ok
|
||||
end
|
||||
|
||||
end
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ class ClientsController < ApplicationController
|
|||
def index
|
||||
# use gon to pass variables into javascript
|
||||
gon.websocket_gateway_uri = Rails.application.config.websocket_gateway_uri
|
||||
gon.check_for_client_updates = Rails.application.config.check_for_client_updates
|
||||
|
||||
if current_user
|
||||
render :layout => 'client'
|
||||
|
|
|
|||
|
|
@ -0,0 +1,82 @@
|
|||
|
||||
<div class="overlay" id="client_update_overlay"></div>
|
||||
<div id="client_update" class="dialog-overlay-sm">
|
||||
|
||||
<!-- dialog header -->
|
||||
<div class="content-head">
|
||||
<%= image_tag("content/icon_alert.png", :height => '24', :width => '24', :class => "content-icon") %><h1>alert</h1>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="dialog-inner">
|
||||
<!-- contents are replaced during update flow -->
|
||||
</div>
|
||||
<!-- end right column -->
|
||||
<br clear="all">
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/template" id="template-update-start">
|
||||
<div class="left w20"><%= image_tag("content/icon_information_big.png", :height => '80', :width => '80') %></div>
|
||||
|
||||
<div class="left w80">There is a new version of the JamKazam application available, and you must allow the application to be updated prior to continuing. We apologize for any inconvenience.</div>
|
||||
|
||||
<br clear="all">
|
||||
|
||||
<div class="right">
|
||||
<!--<a class="button-grey close-application" href="#">CLOSE APPLICATION</a> --><a class="button-orange start-update" href="#">START UPDATE</a>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/template" id="template-update-downloading">
|
||||
<h2 align="center">Application update is downloading</h2>
|
||||
<br />
|
||||
|
||||
<div class="progress-bar">
|
||||
<div id="progress-bar" class="progress-bar-progress"></div>
|
||||
</div>
|
||||
|
||||
<br clear="all" /><br />
|
||||
|
||||
|
||||
<!--
|
||||
<div class="right">
|
||||
<a href="#" class="button-grey close-application">CANCEL AND CLOSE APPLICATION</a>
|
||||
</div>
|
||||
-->
|
||||
</script>
|
||||
|
||||
<script type="text/template" id="template-update-restarting">
|
||||
<h2 align="center">Application update download complete</h2>
|
||||
<br />
|
||||
|
||||
<div class="progress-bar">
|
||||
<div class="progress-bar-progress w100"></div>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
<div align="center">
|
||||
Installation of update is about to start.<br />
|
||||
This application will close automatically in a moment.
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/template" id="template-update-error">
|
||||
<h2 align="center">Application Update Error</h2>
|
||||
<br />
|
||||
|
||||
<br />
|
||||
<br />
|
||||
<div align="center">
|
||||
{error_msg}
|
||||
</div>
|
||||
<br clear="all" /><br />
|
||||
|
||||
|
||||
<!--
|
||||
<div class="right">
|
||||
<a href="#" class="button-grey close-application">CANCEL AND CLOSE APPLICATION</a>
|
||||
</div>
|
||||
-->
|
||||
</script>
|
||||
|
|
@ -22,6 +22,7 @@
|
|||
<%= render "testBridge" %>
|
||||
<%= render "account" %>
|
||||
<%= render "notify" %>
|
||||
<%= render "client_update" %>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<%= stylesheet_link_tag "client/genreSelector", media: "all" %>
|
||||
<%= stylesheet_link_tag "client/sessionList", media: "all" %>
|
||||
<%= stylesheet_link_tag "client/searchResults", media: "all" %>
|
||||
<%= stylesheet_link_tag "unstyled/progressbar", media: "all" %>
|
||||
<%= stylesheet_link_tag "client/clientUpdate", media: "all" %>
|
||||
<%= include_gon %>
|
||||
<%= javascript_include_tag "application" %>
|
||||
<%= csrf_meta_tags %>
|
||||
|
|
|
|||
|
|
@ -118,5 +118,8 @@ if defined?(Bundler)
|
|||
# perf_data configs
|
||||
#config.perf_data_bucket_key = "perf_data"
|
||||
config.perf_data_signed_url_timeout = 3600 # 1 hour
|
||||
|
||||
# client update killswitch; turn on if client updates are broken and are affecting users
|
||||
config.check_for_client_updates = true;
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -44,4 +44,8 @@ SampleApp::Application.configure do
|
|||
config.websocket_gateway_enable = false
|
||||
|
||||
TEST_CONNECT_STATES = false
|
||||
|
||||
# this is totally awful and silly; the reason this exists is so that if you upload an artifact
|
||||
# through jam-admin, then jam-web can point users at it. I think 99% of devs won't even see or care about this config, and 0% of users
|
||||
config.jam_admin_root_url = 'http://192.168.1.100:3333'
|
||||
end
|
||||
|
|
|
|||
Loading…
Reference in New Issue