Skip to content

Commit

Permalink
fix #7244 move common raydata components to sirepo-component.js (#7245)
Browse files Browse the repository at this point in the history
  • Loading branch information
@moellep
moellep committed Sep 11, 2024
1 parent b3862e2 commit a9974b2
Show file tree
Hide file tree
Showing 4 changed files with 112 additions and 88 deletions.
10 changes: 9 additions & 1 deletion sirepo/package_data/static/css/sirepo-dark.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@
.modal-backdrop.in {
opacity: 0.7;
}
.panel-info > .panel-heading {
.panel-info > .panel-heading, .btn-info {
border-color: var(--sr-panel-border-dark-mode);
background-color: var(--sr-panel-heading-bg-dark-mode);
}
Expand Down Expand Up @@ -290,4 +290,12 @@
.sr-lattice-marker > path {
stroke: var(--sr-panel-text-dark-mode);
}

input[type="datetime-local"] {
color-scheme: dark;
}

.sr-button-bar {
background-color: var(--sr-bg-dark-mode);
}
}
80 changes: 0 additions & 80 deletions sirepo/package_data/static/js/raydata.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,6 @@ var srdbg = SIREPO.srdbg;

SIREPO.app.config(() => {
SIREPO.appFieldEditors += `
<div data-ng-switch-when="DateTimePicker" class="col-sm-7">
<div data-date-time-picker="" data-model="model" data-field="field"></div>
</div>
<div data-ng-switch-when="PresetTimePicker" class="col-sm-7">
<div class="text-right" data-preset-time-picker="" data-model="model" data-model-name="modelName"></div>
</div>
<div data-ng-switch-when="RecentlyExecutedScansTable" class="col-sm-12">
<div data-scans-table="" data-model-name="modelName" data-analysis-status="recentlyExecuted"></div>
</div>
Expand Down Expand Up @@ -313,34 +307,6 @@ SIREPO.app.directive('columnPicker', function() {
};
});

SIREPO.app.directive('dateTimePicker', function() {
return {
restrict: 'A',
scope: {
model: '=',
field: '=',
},
template: `<input type="datetime-local" class="form-control" ng-model="dateTime" required >`,
controller: function($scope, timeService) {
$scope.dateTime = $scope.model[$scope.field] ? timeService.unixTimeToDate($scope.model[$scope.field]) : '';
$scope.$watch('dateTime', function(newTime, oldTime) {
if (
(newTime && !oldTime) ||
(newTime && newTime.getTime() !== oldTime.getTime())
) {
$scope.model[$scope.field] = timeService.unixTime(newTime);
}
});

$scope.$watch('model.' + $scope.field, function(newTime, oldTime) {
if (newTime !== oldTime) {
$scope.dateTime = timeService.unixTimeToDate(newTime);
}
});
}
};
});

SIREPO.app.directive('dotsAnimation', function() {
return {
restrict: 'A',
Expand Down Expand Up @@ -378,52 +344,6 @@ SIREPO.app.directive('pngImage', function(plotting) {
};
});

SIREPO.app.directive('presetTimePicker', function() {
return {
restrict: 'A',
scope: {
model: '=',
modelName: '=',
},
template: `
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeLastHour()">Last Hour</button>
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeLastDay()">Last Day</button>
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeLastWeek()">Last Week</button>
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeMaxRange()">All Time</button>
`,
controller: function(appState, timeService, $scope) {
$scope.setDefaultStartStopTime = () => {
if (!$scope.model.searchStartTime && !$scope.model.searchStopTime) {
$scope.setSearchTimeLastHour();
appState.saveChanges($scope.modelName);
}
};

$scope.setSearchTimeLastDay = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeOneDayAgo());
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setSearchTimeLastHour = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeOneHourAgo());
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setSearchTimeLastWeek = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeOneWeekAgo());
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setSearchTimeMaxRange = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(60);
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setDefaultStartStopTime();
}
};
});

SIREPO.app.directive('scansTable', function() {
return {
restrict: 'A',
Expand Down
95 changes: 92 additions & 3 deletions sirepo/package_data/static/js/sirepo-components.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -305,7 +305,7 @@ SIREPO.app.directive('basicEditorPanel', function(appState, panelState) {
};
});

SIREPO.app.directive('buttons', function(appState, panelState) {
SIREPO.app.directive('buttons', function(appState, panelState, stringsService) {
return {
restrict: 'A',
scope: {
Expand All @@ -316,7 +316,7 @@ SIREPO.app.directive('buttons', function(appState, panelState) {
},
template: `
<div data-ng-show="isFormDirty()">
<button data-ng-click="saveChanges()" class="btn btn-primary sr-button-save-cancel" data-ng-disabled="! isFormValid()">Save</button>
<button data-ng-click="saveChanges()" class="btn btn-primary sr-button-save-cancel" data-ng-disabled="! isFormValid()">{{ ::saveButtonLabel() }}</button>
<button data-ng-click="cancelChanges()" class="btn btn-default sr-button-save-cancel">Cancel</button>
</div>
`,
Expand Down Expand Up @@ -365,7 +365,11 @@ SIREPO.app.directive('buttons', function(appState, panelState) {
return ctlsValid && $scope.form.$valid;
};

$scope.saveChanges = function() {
$scope.saveButtonLabel = () => {
return stringsService.saveButtonLabel($scope.modelName);
};

$scope.saveChanges = function() {
if ($scope.form.$valid) {
appState.saveChanges(Object.keys(fieldsByModel));
}
Expand Down Expand Up @@ -847,6 +851,17 @@ SIREPO.app.directive('fieldEditor', function(appState, keypressService, panelSta
<div data-ng-switch-when="ModelArray" class="col-sm-12">
<div data-model-array="" data-model-name="modelName" data-model="model" data-field="field"></div>
</div>
<div data-ng-switch-when="DateTimePicker" class="col-sm-5">
<div data-date-time-picker="" data-model="model" data-field="field"></div>
</div>
<div data-ng-switch-when="PresetTimePicker" class="col-sm-7">
<div class="text-right" data-preset-time-picker="" data-model="model" data-model-name="modelName"></div>
</div>
<div data-ng-switch-when="OptionalFloat" data-ng-class="fieldClass">
<input data-string-to-number="" data-ng-model="model[field]"
data-min="info[4]" data-max="info[5]" class="form-control"
style="text-align: right" data-lpignore="true" />
</div>
${SIREPO.appFieldEditors}
<div data-ng-switch-default data-ng-class="fieldClass">
<div data-ng-if="wantEnumButtons" class="btn-group">
Expand Down Expand Up @@ -5592,3 +5607,77 @@ SIREPO.app.directive('srDroppable', function() {
},
};
});

SIREPO.app.directive('dateTimePicker', function() {
return {
restrict: 'A',
scope: {
model: '=',
field: '=',
},
template: `<input type="datetime-local" class="form-control" ng-model="dateTime" required >`,
controller: function($scope, timeService) {
$scope.dateTime = $scope.model[$scope.field] ? timeService.unixTimeToDate($scope.model[$scope.field]) : '';
$scope.$watch('dateTime', function(newTime, oldTime) {
if (
(newTime && !oldTime) ||
(newTime && newTime.getTime() !== oldTime.getTime())
) {
$scope.model[$scope.field] = timeService.unixTime(newTime);
}
});

$scope.$watch('model.' + $scope.field, function(newTime, oldTime) {
if (newTime !== oldTime) {
$scope.dateTime = timeService.unixTimeToDate(newTime);
}
});
}
};
});

SIREPO.app.directive('presetTimePicker', function() {
return {
restrict: 'A',
scope: {
model: '=',
modelName: '=',
},
template: `
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeLastHour()">Last Hour</button>
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeLastDay()">Last Day</button>
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeLastWeek()">Last Week</button>
<button type="button" class="btn btn-info btn-xs" data-ng-click="setSearchTimeMaxRange()">All Time</button>
`,
controller: function(appState, timeService, $scope) {
$scope.setDefaultStartStopTime = () => {
if (!$scope.model.searchStartTime && !$scope.model.searchStopTime) {
$scope.setSearchTimeLastHour();
appState.saveChanges($scope.modelName);
}
};

$scope.setSearchTimeLastDay = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeOneDayAgo());
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setSearchTimeLastHour = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeOneHourAgo());
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setSearchTimeLastWeek = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeOneWeekAgo());
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setSearchTimeMaxRange = () => {
$scope.model.searchStartTime = timeService.roundUnixTimeToMinutes(60);
$scope.model.searchStopTime = timeService.roundUnixTimeToMinutes(timeService.unixTimeNow());
};

$scope.setDefaultStartStopTime();
}
};
});
15 changes: 11 additions & 4 deletions sirepo/package_data/static/js/sirepo.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -932,12 +932,16 @@ SIREPO.app.factory('appDataService', function() {
SIREPO.app.factory('stringsService', function(authState) {
const strings = SIREPO.APP_SCHEMA.strings;

function typeOfSimulation(modelName) {
function lookup(modelName, key) {
let s;
if (modelName && strings[modelName] && strings[modelName].typeOfSimulation) {
s = strings[modelName].typeOfSimulation;
if (modelName && strings[modelName] && strings[modelName][key]) {
s = strings[modelName][key];
}
return ucfirst(s || strings.typeOfSimulation);
return s || strings[key];
}

function typeOfSimulation(modelName) {
return ucfirst(lookup(modelName, 'typeOfSimulation'));
}

function ucfirst(str) {
Expand Down Expand Up @@ -972,6 +976,9 @@ SIREPO.app.factory('stringsService', function(authState) {
},
sbatchLoginServiceStatus: () => {return 'Requesting login status...';},
sbatchLoginServiceLogin: () => {return `Login to ${authState.sbatchHostDisplayName}`;},
saveButtonLabel: (modelName) => {
return lookup(modelName, 'save') || 'Save';
},
startButtonLabel: (modelName) => {
return `Start New ${typeOfSimulation(modelName)}`;
},
Expand Down

0 comments on commit a9974b2

Please sign in to comment.