428 lines
10 KiB
JavaScript
428 lines
10 KiB
JavaScript
function startApp()
|
|
{
|
|
var i18n = new VueI18n({
|
|
locale: navigator.language,
|
|
fallbackLocale: 'en',
|
|
messages: messages
|
|
});
|
|
|
|
var app = new Vue({
|
|
el: '#app',
|
|
|
|
i18n: i18n,
|
|
|
|
data: {
|
|
loading: true,
|
|
saving: false,
|
|
savingSteps: false,
|
|
loadingIndicator: '|',
|
|
uploadProgress: false,
|
|
|
|
activeTab: 'status',
|
|
|
|
version: {
|
|
systemID: 'loading...',
|
|
version: 'loading...',
|
|
},
|
|
|
|
wifiStatus: {
|
|
ap: {
|
|
enabled: false,
|
|
ip: '0.0.0.0'
|
|
},
|
|
station: {
|
|
enabled: false,
|
|
status: 0,
|
|
ip: '0.0.0.0'
|
|
}
|
|
},
|
|
|
|
searchingLocation: false,
|
|
|
|
triggers: {
|
|
time: {
|
|
latlong: '',
|
|
location: ''
|
|
}
|
|
},
|
|
|
|
connection: {
|
|
hostname: null,
|
|
accesspoint: true,
|
|
station: false,
|
|
ssid: null,
|
|
password: null,
|
|
dhcp: true,
|
|
ip: null,
|
|
subnetmask: null,
|
|
gateway: null
|
|
},
|
|
|
|
allSteps: true,
|
|
allStepsValue: 0,
|
|
steps: []
|
|
},
|
|
|
|
created: function()
|
|
{
|
|
var self = this;
|
|
|
|
document.title = i18n.t('title');
|
|
var hash = window.location.hash.substr(1);
|
|
if (hash)
|
|
self.activeTab = hash;
|
|
|
|
self.startLoadingIndicator();
|
|
self.updateWiFiStatus();
|
|
|
|
self.disableStepsChanged = false;
|
|
self.savingStepsTimer = false;
|
|
|
|
axios.get('/api/version')
|
|
.then(function(response)
|
|
{
|
|
if (typeof response.data == 'object')
|
|
self.version = response.data;
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
});
|
|
|
|
axios.all([
|
|
axios.get('/api/connection')
|
|
.then(function(response)
|
|
{
|
|
if (typeof response.data == 'object')
|
|
self.connection = response.data;
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
}),
|
|
|
|
axios.get('/api/steps')
|
|
.then(function(response)
|
|
{
|
|
if (Array.isArray(response.data))
|
|
{
|
|
var allSteps = true;
|
|
var allStepsValue = false;
|
|
|
|
var total = 0;
|
|
var steps = [];
|
|
|
|
|
|
for (var i = 0; i < response.data.length; i++)
|
|
{
|
|
var value = response.data[i];
|
|
|
|
if (allStepsValue === false)
|
|
allStepsValue = value;
|
|
else if (value !== allStepsValue)
|
|
allSteps = false;
|
|
|
|
steps.push({ value: value });
|
|
total += value;
|
|
}
|
|
|
|
self.steps = steps;
|
|
self.allStepsValue = Math.floor(total / steps.length);
|
|
self.allSteps = allSteps;
|
|
}
|
|
})
|
|
])
|
|
.then(axios.spread(function(acct, perms) {
|
|
self.stopLoadingIndicator();
|
|
self.loading = false;
|
|
}));
|
|
},
|
|
|
|
methods: {
|
|
applyConnection: function()
|
|
{
|
|
var self = this;
|
|
if (self.saving) return;
|
|
|
|
self.saving = true;
|
|
|
|
axios.post('/api/connection', {
|
|
hostname: self.connection.hostname,
|
|
accesspoint: self.connection.accesspoint,
|
|
station: self.connection.station,
|
|
ssid: self.connection.ssid,
|
|
password: self.connection.password,
|
|
dhcp: self.connection.dhcp,
|
|
ip: self.connection.ip,
|
|
subnetmask: self.connection.subnetmask,
|
|
gateway: self.connection.gateway,
|
|
})
|
|
.then(function(response)
|
|
{
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
})
|
|
.then(function()
|
|
{
|
|
self.saving = false;
|
|
})
|
|
},
|
|
|
|
startLoadingIndicator: function()
|
|
{
|
|
var self = this;
|
|
|
|
self.loadingStage = 0;
|
|
self.loadingTimer = setInterval(function()
|
|
{
|
|
self.loadingStage++;
|
|
switch (self.loadingStage)
|
|
{
|
|
case 1: self.loadingIndicator = '/'; break;
|
|
case 2: self.loadingIndicator = '-'; break;
|
|
case 3: self.loadingIndicator = '\\'; break;
|
|
case 4: self.loadingIndicator = '|'; self.loadingStage = 0; break;
|
|
}
|
|
}, 250);
|
|
},
|
|
|
|
stopLoadingIndicator: function()
|
|
{
|
|
clearInterval(this.loadingTimer);
|
|
},
|
|
|
|
getWiFiStationStatus: function()
|
|
{
|
|
if (!this.wifiStatus.station.enabled)
|
|
return 'disconnected';
|
|
|
|
switch (this.wifiStatus.station.status)
|
|
{
|
|
case 0: // WL_IDLE_STATUS
|
|
case 2: // WL_SCAN_COMPLETED
|
|
return 'connecting';
|
|
|
|
case 1: // WL_NO_SSID_AVAIL
|
|
case 4: // WL_CONNECT_FAILED
|
|
case 5: // WL_CONNECTION_LOST
|
|
return 'error';
|
|
|
|
case 3: // WL_CONNECTED
|
|
return 'connected';
|
|
|
|
case 6: // WL_DISCONNECTED
|
|
default:
|
|
return 'disconnected';
|
|
}
|
|
},
|
|
|
|
getWiFiStationStatusText: function()
|
|
{
|
|
if (!this.wifiStatus.station.enabled)
|
|
return i18n.t('wifiStatus.stationmode.disabled');
|
|
|
|
switch (this.wifiStatus.station.status)
|
|
{
|
|
case 0: // WL_IDLE_STATUS
|
|
return i18n.t('wifiStatus.stationmode.idle');
|
|
|
|
case 1: // WL_NO_SSID_AVAIL
|
|
return i18n.t('wifiStatus.stationmode.noSSID');
|
|
|
|
case 2: // WL_SCAN_COMPLETED
|
|
return i18n.t('wifiStatus.stationmode.scanCompleted');
|
|
|
|
case 3: // WL_CONNECTED
|
|
return this.wifiStatus.station.ip;
|
|
|
|
case 4: // WL_CONNECT_FAILED
|
|
return i18n.t('wifiStatus.stationmode.connectFailed');
|
|
|
|
case 5: // WL_CONNECTION_LOST
|
|
return i18n.t('wifiStatus.stationmode.connectionLost');
|
|
|
|
case 6: // WL_DISCONNECTED
|
|
default:
|
|
return i18n.t('wifiStatus.stationmode.disconnected');
|
|
}
|
|
},
|
|
|
|
updateWiFiStatus: function()
|
|
{
|
|
var self = this;
|
|
if (!self.saving)
|
|
{
|
|
axios.get('/api/connection/status')
|
|
.then(function(response)
|
|
{
|
|
if (typeof response.data == 'object')
|
|
self.wifiStatus = response.data;
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
})
|
|
.then(function()
|
|
{
|
|
setTimeout(self.updateWiFiStatus, 5000);
|
|
});
|
|
}
|
|
else
|
|
setTimeout(self.updateWiFiStatus, 5000);
|
|
},
|
|
|
|
uploadFirmware: function()
|
|
{
|
|
var self = this;
|
|
if (self.saving) return;
|
|
|
|
self.saving = true;
|
|
self.uploadProgress = 0;
|
|
|
|
|
|
var data = new FormData();
|
|
data.append('file', document.getElementById('firmwareFile').files[0]);
|
|
|
|
var config = {
|
|
timeout: 360000,
|
|
onUploadProgress: function(progressEvent)
|
|
{
|
|
self.uploadProgress = Math.round((progressEvent.loaded * 100) / progressEvent.total);
|
|
}
|
|
};
|
|
|
|
axios.post('/api/firmware', data, config)
|
|
.then(function(response)
|
|
{
|
|
// TODO show "now updating, please wait"
|
|
console.log("Update sent");
|
|
|
|
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
//output.innerHTML = err.message;
|
|
// TODO show error
|
|
})
|
|
.then(function()
|
|
{
|
|
self.uploadProgress = false;
|
|
self.saving = false;
|
|
|
|
document.getElementById('firmware').reset();
|
|
});
|
|
},
|
|
|
|
stepsChanged: function()
|
|
{
|
|
var self = this;
|
|
if (self.loading || self.disableStepsChanged) return;
|
|
|
|
if (self.savingStepsTimer === false)
|
|
self.savingStepsTimer = setTimeout(function() { self.updateSteps(); }, 200);
|
|
},
|
|
|
|
updateSteps: function()
|
|
{
|
|
var self = this;
|
|
|
|
self.savingSteps = true;
|
|
self.savingStepsTimer = false;
|
|
|
|
|
|
self.disableStepsChanged = true;
|
|
|
|
if (self.allSteps)
|
|
{
|
|
var newSteps = [];
|
|
for (var i = 0; i < self.steps.length; i++)
|
|
newSteps.push({ value: self.allStepsValue });
|
|
|
|
self.steps = newSteps;
|
|
}
|
|
else
|
|
{
|
|
var total = 0;
|
|
for (var i = 0; i < self.steps.length; i++)
|
|
total += self.steps[i].value;
|
|
|
|
self.allStepsValue = Math.floor(total / self.steps.length);
|
|
}
|
|
var steps = [];
|
|
for (var i = 0; i < self.steps.length; i++)
|
|
steps.push(self.steps[i].value);
|
|
|
|
self.disableStepsChanged = false;
|
|
|
|
|
|
axios.post('/api/steps', {
|
|
// TODO configurable
|
|
transitionTime: 1000,
|
|
values: steps
|
|
})
|
|
.then(function(response)
|
|
{
|
|
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
})
|
|
.then(function()
|
|
{
|
|
self.savingSteps = false;
|
|
});
|
|
},
|
|
|
|
searchLocation: function()
|
|
{
|
|
var self = this;
|
|
if (!self.triggers.time.location) return;
|
|
|
|
self.searchingLocation = true;
|
|
|
|
axios.get('http://maps.googleapis.com/maps/api/geocode/json', { params: { address: self.triggers.time.location }})
|
|
.then(function(response)
|
|
{
|
|
alert(response.data);
|
|
})
|
|
.catch(function(error)
|
|
{
|
|
console.log(error);
|
|
})
|
|
.then(function()
|
|
{
|
|
self.searchingLocation = false;
|
|
});
|
|
}
|
|
},
|
|
|
|
watch: {
|
|
// The sync: true ensures we can wrap the internal updates with disableStepsChanged
|
|
allSteps: {
|
|
handler: function() { this.stepsChanged(); },
|
|
sync: true
|
|
},
|
|
|
|
allStepsValue: {
|
|
handler: function() { this.stepsChanged(); },
|
|
sync: true
|
|
},
|
|
|
|
steps: {
|
|
handler: function() { this.stepsChanged(); },
|
|
deep: true,
|
|
sync: true
|
|
},
|
|
|
|
activeTab: function(newValue)
|
|
{
|
|
console.log(newValue);
|
|
window.location.hash = '#' + newValue;
|
|
}
|
|
}
|
|
});
|
|
} |