Skip to content
This repository has been archived by the owner on Sep 5, 2020. It is now read-only.

Changes to splash screen and onboarding #1545

Merged
merged 32 commits into from
Jan 6, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
32 commits
Select commit Hold shift + click to select a range
6fa0a78
change fast to light
duckized Nov 11, 2016
c9b9d5a
Merge branch 'develop' into light-client
duckized Nov 11, 2016
06a0366
update from develop
alexvansande Dec 16, 2016
63526df
light client
alexvansande Dec 16, 2016
efc0de4
Merge branch 'develop' into light-client
alexvansande Dec 19, 2016
57f35f8
remove '--cache' flag
Dec 19, 2016
7632a6a
remove cache
alexvansande Dec 20, 2016
a851bb3
light mode menu
alexvansande Dec 20, 2016
f1e6c5f
text changes`
alexvansande Dec 20, 2016
d854212
conflicts
alexvansande Dec 20, 2016
6799b49
changes to onboarding screen
alexvansande Dec 20, 2016
0cad5cc
changes to onboarding
alexvansande Dec 21, 2016
1d08ea5
ropstein in eth
alexvansande Dec 21, 2016
fe0b5b5
experimental label`
alexvansande Dec 21, 2016
d0fe3d5
checking network label position
alexvansande Dec 21, 2016
4cebf69
Theres no I in Ropsten
alexvansande Dec 21, 2016
6d83bdd
changes algotithm for displaying
alexvansande Dec 22, 2016
1d7d768
allows app to be ready if no sync is happening
alexvansande Dec 22, 2016
e39c0b5
bring changes to splash screen
alexvansande Dec 22, 2016
851f774
remove changes from ethereumNode
alexvansande Dec 22, 2016
afe823a
remove changes from menuItems
alexvansande Dec 22, 2016
529ad31
speed changes
alexvansande Dec 22, 2016
643e810
Merge branch 'develop' into changes-to-splash-screen
frozeman Dec 22, 2016
5c05491
Merge branch 'develop' into changes-to-splash-screen
frozeman Dec 22, 2016
8488f79
clean up and add comments
alexvansande Dec 22, 2016
a153158
Merge branch 'develop' into changes-to-splash-screen
alexvansande Dec 22, 2016
33a490a
Merge branch 'changes-to-splash-screen' of https://github.com/ethereu…
alexvansande Dec 22, 2016
d42e72c
fixes onboarding shapeshift window loading
frozeman Dec 23, 2016
df49cda
simplify code
alexvansande Dec 28, 2016
2685d7d
add comments
alexvansande Dec 28, 2016
3720b80
Merge branch 'develop' into changes-to-splash-screen
alexvansande Dec 28, 2016
8f54bf7
shows ready to launch when there are less than a 100 blocks
alexvansande Jan 5, 2017
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 5 additions & 3 deletions interface/client/styles/networkIndicator.import.less
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// Applies to both onboarding and splash screen
.network-indicator {
position: absolute;
top: 10px;
Expand All @@ -9,8 +10,10 @@
opacity: 0.8;
color: @colorGrey;
text-transform: uppercase;
}

.unknown {
// Applies only to the splash screen
.splash-screen .network-indicator .unknown {
position: absolute;
top: 155px;
text-align: center;
Expand All @@ -21,5 +24,4 @@
font-weight: normal;
text-transform: none;
color: #fff;
}
}
}
23 changes: 10 additions & 13 deletions interface/client/templates/popupWindows/onboardingScreen.html
Original file line number Diff line number Diff line change
Expand Up @@ -113,27 +113,24 @@ <h1> {{i18n "mist.popupWindows.onboarding.learnIt"}} </h1>
<footer>
<progress value="{{#with TemplateVar.get 'syncing'}}{{progress}}{{/with}}" max="100"></progress>
<progress class='stateBar' value="{{#with TemplateVar.get 'syncing'}}{{_displayStatesDownload}}{{/with}}" max="1"></progress>

{{#with TemplateVar.get "syncing"}}
<div class="status"> {{i18n "mist.popupWindows.onboarding.downloadingBlocks"}} ({{TemplateVar.get "peerCount"}} {{i18n 'mist.nodeInfo.peers'}})</div>
<div class="blocks">

{{ syncStatus }}

</div>

{{syncStatus}}
{{#if TemplateVar.get 'readyToLaunch'}}
<button class="launch-app"> {{i18n "mist.popupWindows.onboarding.buttons.launchApp"}} </button>
{{else}}
{{#if TemplateVar.get 'readyToLaunch'}}
<button class="launch-app"> {{i18n "mist.popupWindows.onboarding.buttons.launchApp"}} </button>
{{#with TemplateVar.get "syncing"}}
<div class="status"> {{i18n "mist.popupWindows.onboarding.downloadingBlocks"}} ({{TemplateVar.get "peerCount"}} {{i18n 'mist.nodeInfo.peers'}})</div>
<div class="blocks"> {{syncStatusMessage}} </div>
{{else}}
<div class="status">
{{#if TemplateVar.get "peerCount"}}
{{TemplateVar.get "peerCount"}} {{i18n 'mist.nodeInfo.peers'}}
{{i18n 'mist.startScreen.nodeSyncFoundPeers' peers=(TemplateVar.get 'peerCount')}}
{{else}}
{{i18n 'mist.startScreen.nodeSyncConnecting'}}
{{/if}}
</div>
{{/if}}
{{/with}}
{{/with}}
{{/if}}

</footer>
</div>
Expand Down
77 changes: 50 additions & 27 deletions interface/client/templates/popupWindows/onboardingScreen.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,12 +38,12 @@ Template['popupWindows_onboardingScreen'].onCreated(function(){

if(syncing === true) {
web3.reset(true);

} else if(_.isObject(syncing)) {
// loads syncing data and adds it to old by using 'extend'
var oldData = TemplateVar.get(template, 'syncing');

TemplateVar.set(template, 'syncing', _.extend(oldData||{}, syncing||{}));

} else {
TemplateVar.set(template, 'syncing', false);
}
Expand Down Expand Up @@ -78,50 +78,68 @@ Template['popupWindows_onboardingScreen'].helpers({
return (account) ? account.toLowerCase() : '';
},
/**
Updates the Sync Message live
Updates the Sync Data

@method syncStatus
*/
'syncStatus' : function() {

// This functions loops trhough numbers while waiting for the node to respond
var template = Template.instance();

Meteor.clearInterval(template._intervalId);

// Create an interval to quickly iterate trough the numbers
template._intervalId = Meteor.setInterval(function(){
// load the sync information
var syncing = TemplateVar.get(template, 'syncing');

// Calculates a block t display that is always getting 1% closer to target
syncing._displayBlock = (syncing._displayBlock + (syncing.currentBlock - syncing._displayBlock) / 100 )|| syncing.currentBlock;

syncing._displayStatesDownload = Number(syncing._displayStatesDownload + (syncing.pulledStates/syncing.knownStates - syncing._displayStatesDownload) / 100 ) || syncing.pulledStates/syncing.knownStates;
if (syncing) {
// If it's syncing, then it's not ready
TemplateVar.set(template, 'readyToLaunch', false);

// Calculates a block t display that is always getting a few % closer to target
syncing._displayBlock = (syncing._displayBlock + 2*(syncing.currentBlock - syncing._displayBlock) / 100 ) || Number(syncing.startingBlock);

// Calculates progress
syncing.progress = Math.round(((syncing._displayBlock - syncing.startingBlock) / (syncing.highestBlock - syncing.startingBlock)) * 100);

// Makes fancy strings
syncing.blockDiff = numeral(syncing.highestBlock - syncing.currentBlock).format('0,0');
syncing.highestBlockString = numeral(syncing.highestBlock).format('0,0');
syncing.displayBlock = numeral(Math.round(syncing._displayBlock)).format('0,0');
syncing.statesPercent = numeral(Math.round(syncing._displayStatesDownload*10000)/100).format('0.00');
syncing._displayStatesDownload = Number(syncing._displayStatesDownload + (syncing.pulledStates/(1 +syncing.knownStates) - syncing._displayStatesDownload) / 100 ) || Number(syncing.pulledStates)/Number(syncing.knownStates + 1);

// Saves the data back to the object
TemplateVar.set(template, 'syncing', syncing);
// Calculates progress
syncing.progress = 100 * (syncing._displayBlock - syncing.startingBlock) / (1 + Number(syncing.highestBlock) - syncing.startingBlock);

// Only show states if they are less than 50% downloaded
if (Math.round(1000*Number(syncing._displayStatesDownload)) !== Math.round(1000*Number(syncing.pulledStates/syncing.knownStates))) {
TemplateVar.set(template, "syncStatusMessageLive", TAPi18n.__('mist.popupWindows.onboarding.syncMessageWithStates', syncing));
} else {
TemplateVar.set(template, "syncStatusMessageLive", TAPi18n.__('mist.popupWindows.onboarding.syncMessage', syncing));
}
// Makes fancy strings
syncing.blockDiff = numeral(syncing.highestBlock - syncing.currentBlock).format('0,0');
syncing.highestBlockString = numeral(syncing.highestBlock).format('0,0');
syncing.displayBlock = numeral(Math.round(syncing._displayBlock)).format('0,0');
syncing.statesPercent = numeral(Math.round(syncing._displayStatesDownload*10000)/100).format('0.00');

// Saves the data back to the object
TemplateVar.set(template, 'syncing', syncing);


// If it's close enough, show the synced button
if (Number(syncing.highestBlock) - syncing.currentBlock < 100 ) {
TemplateVar.set(template, 'readyToLaunch', true);
}

// Only show states if they are changing
if (Math.round(1000*Number(syncing._displayStatesDownload)) !== Math.round(1000*Number(syncing.pulledStates/(syncing.knownStates+1)))) {
TemplateVar.set(template, "syncStatusMessageLive", TAPi18n.__('mist.popupWindows.onboarding.syncMessageWithStates', syncing));
} else if (syncing.displayBlock == '0') {
TemplateVar.set(template, "syncStatusMessageLive", '');
} else {
TemplateVar.set(template, "syncStatusMessageLive", TAPi18n.__('mist.popupWindows.onboarding.syncMessage', syncing));
}
}

}, 50);
},
/**
Updates the Sync Message live

return TemplateVar.get(template, "syncStatusMessageLive");
@method syncStatusMessage
*/
'syncStatusMessage' : function() {
return TemplateVar.get("syncStatusMessageLive");
}
});

Expand All @@ -136,12 +154,14 @@ Template['popupWindows_onboardingScreen'].events({
if(TemplateVar.get('testnet')) {
ipc.send('onBoarding_changeNet', false);
TemplateVar.set('testnet', false);
TemplateVar.set('syncing', null);
}
},
'click .start-testnet': function(e, template){
if(!TemplateVar.get('testnet')) {
ipc.send('onBoarding_changeNet', true);
TemplateVar.set('testnet', true);
TemplateVar.set('syncing', null);
}

TemplateVar.set('currentActive','testnet');
Expand All @@ -156,15 +176,18 @@ Template['popupWindows_onboardingScreen'].events({
},
'click .goto-tutorial-1': function(){
TemplateVar.set('currentActive','tutorial-1');
TemplateVar.set('readyToLaunch', true);
if (!TemplateVar.get('syncing'))
TemplateVar.set('readyToLaunch', true);
},
'click .goto-tutorial-2': function(){
TemplateVar.set('currentActive','tutorial-2');
TemplateVar.set('readyToLaunch', true);
if (!TemplateVar.get('syncing'))
TemplateVar.set('readyToLaunch', true);
},
'click .goto-tutorial-3': function(){
TemplateVar.set('currentActive','tutorial-3');
TemplateVar.set('readyToLaunch', true);
if (!TemplateVar.get('syncing'))
TemplateVar.set('readyToLaunch', true);
},
/**
Start the application
Expand Down
8 changes: 4 additions & 4 deletions interface/client/templates/popupWindows/splashScreen.js
Original file line number Diff line number Diff line change
Expand Up @@ -189,9 +189,9 @@ Template['popupWindows_splashScreen'].helpers({
syncData._displayKnownStates = Number(syncData.knownStates || 0);
} else {
// Increment each them slowly to match target number
syncData._displayBlock += (Number(syncData.currentBlock) - syncData._displayBlock) / 10;
syncData._displayState += (Number(syncData.pulledStates || 0) - syncData._displayState) / 10;
syncData._displayKnownStates += (Number(syncData.knownStates || 0) - syncData._displayKnownStates) / 10;
syncData._displayBlock += (Number(syncData.currentBlock) - syncData._displayBlock) / 100;
syncData._displayState += (Number(syncData.pulledStates || 0) - syncData._displayState) / 100;
syncData._displayKnownStates += (Number(syncData.knownStates || 0) - syncData._displayKnownStates) / 100;
}

// Create the fancy strings
Expand Down Expand Up @@ -224,7 +224,7 @@ Template['popupWindows_splashScreen'].helpers({
}
}

}, 100);
}, 10);

return TemplateVar.get(template, "syncStatusMessageLive");
}
Expand Down
7 changes: 6 additions & 1 deletion interface/i18n/mist.en.i18n.json
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,10 @@
"ethereumNode": "Ethereum Node",
"network": "Network",
"mainNetwork": "Main Network",
"nodeMode": "Chain download",
"fullNode": "Store full blockchain",
"lightNode": "Use light Node (experimental!)",
"mainNetwork": "Main Network",
"startMining": "⛏ Start Mining (Testnet only)",
"stopMining": "⛏ Stop Mining"
},
Expand Down Expand Up @@ -226,7 +230,7 @@
"lookupDataExplainer": "Look this up on the internet"
},
"onboarding": {
"description" : "Ethereum is a public blockchain that features a turing complete programming for building solid, decentralized applications.",
"description" : "Ethereum is a platform for decentralized blockchain apps with a fully featured programming language",
"goToTestnet" : "Use the test network",
"goToTestnetDescription" : "Test the technology freely in a sandboxed testnet, without using real ether.",
"gotoMainnet" : "Use the main network",
Expand All @@ -253,6 +257,7 @@
"downloadingBlocks": "Downloading blocks",
"syncMessage": "Block __displayBlock__ of __highestBlockString__",
"syncMessageWithStates": "Block __displayBlock__ of __highestBlockString__ (Chain structure __statesPercent__%)",
"startingSync": "Getting ready to sync..",
"tutorial1Description" : "<p> Now the only thing left to do is wait for the download to finish. Here's some reading suggestions: </p> <h4>Make your own money </h4> <p> Make a cryptocurrency with a fixed market supply, tokens representing real world assets, etc </p>",
"tutorial2Description" : "<h4> Create a crowdsale </h4> <p> Raise funds for a common goal, fully trustable without a third party. Sidestep the hurdle of traditional funding system and go directly to the source by funding an organization via the blockchain.</p>",
"tutorial3Description" : "<h4> Create a blockchain organization </h4> <p> Create an autonomous organization with rules on spending money and making decisions for you and your investors.</p>",
Expand Down
2 changes: 1 addition & 1 deletion modules/preloader/include/openPopup.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,6 @@ document.addEventListener('click', (e) => {
nodeIntegration: false,
}
});
win.loadURL(node.href, true);
win.loadURL(node.href);
}
}, false);