diff --git a/.gitignore b/.gitignore index ba6626150..e18bc4d42 100644 --- a/.gitignore +++ b/.gitignore @@ -2,6 +2,7 @@ docs/ .meteor/local .meteor/meteorite +.meteor/dev_bundle node_modules Packages/active-entry/helloworld/ -LesionTracker/tests/nightwatch/reports/ \ No newline at end of file +LesionTracker/tests/nightwatch/reports/ diff --git a/Packages/design/package.js b/Packages/design/package.js index 67b53e0c6..22cf8c377 100644 --- a/Packages/design/package.js +++ b/Packages/design/package.js @@ -29,6 +29,11 @@ Package.onUse(function(api) { 'styles/common/spacings.styl' ], 'client'); + // Component styles + api.addFiles([ + 'styles/components/radio.styl' + ], 'client'); + // Rounded Button Group api.addFiles([ 'components/roundedButtonGroup/roundedButtonGroup.html', diff --git a/Packages/design/styles/components/radio.styl b/Packages/design/styles/components/radio.styl new file mode 100644 index 000000000..c83303072 --- /dev/null +++ b/Packages/design/styles/components/radio.styl @@ -0,0 +1,36 @@ +@import "{design}/app" + +.group-radio + label + cursor: pointer + input + height: 0 + width: 0 + span + padding-left: 23px + position: relative + &:before + background: white + border-radius: 8px + content: '' + display: block + height: 16px + left: 0 + position: absolute + top: 50% + transform(translateY(-50%)) + width: 16px + input:focus + span:before + // TODO: [design] define a outline for the design + outline: none + box-shadow: 0 0 2px 2px $textSecondaryColor + input:checked + span:after + background: $uiBorderColorDark + border-radius: 5px + content: '' + height: 10px + left: 3px + position: absolute + top: 50% + transform(translateY(-50%)) + width: 10px diff --git a/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.html b/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.html index b30d2a762..da55ea498 100644 --- a/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.html +++ b/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.html @@ -1,70 +1,51 @@ diff --git a/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.styl b/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.styl index d2c0b3954..32aa271f3 100644 --- a/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.styl +++ b/Packages/lesiontracker/client/components/additionalFindings/additionalFindings.styl @@ -38,6 +38,13 @@ &:not(:last-child) border-bottom: $uiBorderThickness solid $uiBorderColorDark + & > .wrapperText + display: block + font-weight: bold + line-height: 15px + margin: 10px 0 8px + + // TODO: remove h5 font-weight: bold margin-bottom: 8px @@ -48,10 +55,11 @@ display: inline-block padding: 5px - .radio-group + // TODO: remove radio-group + .radio-group, .group-radio height: 30px - .radio-option + label display: inline-block float: left font-size: 14px diff --git a/Packages/ohif-core/components/base/mixins/form.js b/Packages/ohif-core/components/base/mixins/form.js index f03bcb7f7..2e04a6f50 100644 --- a/Packages/ohif-core/components/base/mixins/form.js +++ b/Packages/ohif-core/components/base/mixins/form.js @@ -44,7 +44,7 @@ OHIF.mixins.form = new OHIF.Mixin({ const component = instance.component; // Set the component main and style elements - component.$style = component.$element = instance.$('form').first(); + component.$style = component.$element = instance.$('form:first'); } } }); diff --git a/Packages/ohif-core/components/base/mixins/formItem.js b/Packages/ohif-core/components/base/mixins/formItem.js index 95955701d..f44fa2a6b 100644 --- a/Packages/ohif-core/components/base/mixins/formItem.js +++ b/Packages/ohif-core/components/base/mixins/formItem.js @@ -8,7 +8,7 @@ import { $ } from 'meteor/jquery'; * It may be used to manage all components that belong to forms */ OHIF.mixins.formItem = new OHIF.Mixin({ - dependencies: 'component', + dependencies: 'schemaData', composition: { onCreated() { @@ -113,7 +113,7 @@ OHIF.mixins.formItem = new OHIF.Mixin({ const component = instance.component; // Set the element to be controlled - component.$element = instance.$(':input:first'); + component.$element = instance.$(':input').first(); // Set the element to be styled component.$style = component.$element; diff --git a/Packages/ohif-core/components/base/mixins/group.js b/Packages/ohif-core/components/base/mixins/group.js index b27e67399..4e212cd2c 100644 --- a/Packages/ohif-core/components/base/mixins/group.js +++ b/Packages/ohif-core/components/base/mixins/group.js @@ -45,6 +45,14 @@ OHIF.mixins.group = new OHIF.Mixin({ component.registeredItems.forEach(child => child.readonly(isReadonly)); }; + }, + + onRendered() { + const instance = Template.instance(); + const component = instance.component; + + // Set the element to be controlled + component.$element = instance.$('.component-group:first'); } } }); diff --git a/Packages/ohif-core/components/base/mixins/groupRadio.js b/Packages/ohif-core/components/base/mixins/groupRadio.js index b760b3800..1e6530d27 100644 --- a/Packages/ohif-core/components/base/mixins/groupRadio.js +++ b/Packages/ohif-core/components/base/mixins/groupRadio.js @@ -16,8 +16,9 @@ OHIF.mixins.groupRadio = new OHIF.Mixin({ // Get the selected radio's value or select a radio based on value component.value = value => { const isGet = _.isUndefined(value); - const $elements = $(); - component.registeredItems.forEach(child => $elements.add(child.$element)); + const elements = []; + component.registeredItems.forEach(child => elements.push(child.$element[0])); + const $elements = $(elements); if (isGet) { return $elements.filter(':checked').val(); } diff --git a/Packages/ohif-core/components/base/mixins/schemaData.js b/Packages/ohif-core/components/base/mixins/schemaData.js index 1ac30d301..3fc2f7f77 100644 --- a/Packages/ohif-core/components/base/mixins/schemaData.js +++ b/Packages/ohif-core/components/base/mixins/schemaData.js @@ -3,31 +3,39 @@ import { Blaze } from 'meteor/blaze'; import { Template } from 'meteor/templating'; import { _ } from 'meteor/underscore'; +// Helper function to get the component's current schema +const getCurrentSchema = (parentComponent, key) => { + // Get the parent component schema + const schema = parentComponent && parentComponent.schema; + + // Stop here if there's no key or schema defined + if (!key || !schema) { + return; + } + + // Get the current schema data using component's key + const currentSchema = schema._schema[key]; + + // Return the component's schema definitions + return currentSchema; +}; + /* * schemaData: change the component data based on its form's schema data */ OHIF.mixins.schemaData = new OHIF.Mixin({ - dependencies: 'formItem', + dependencies: 'component', composition: { onData() { + // Get the current template data const data = Template.currentData(); + // Get the parent component const parent = OHIF.blaze.getParentComponent(Blaze.currentView); - // Get the parent component schema - const schema = parent && parent.schema; - - // Get the current component's key - const key = data.key; - - // Stop here if there's no key or schema defined - if (!key || !schema) { - return; - } - // Get the current schema data using component's key - const currentSchema = schema._schema[key]; + const currentSchema = getCurrentSchema(parent, data.key); // Stop here if there's no schema data for current key if (!currentSchema) { @@ -39,7 +47,42 @@ OHIF.mixins.schemaData = new OHIF.Mixin({ data.label = new ReactiveVar(currentSchema.label); } - // TODO: [design] convert allowedValues to items and find a way to get key/value pairs + // Fill the items if it's an array schema + if (!data.items && Array.isArray(currentSchema.allowedValues)) { + // Initialize the items array + data.items = []; + + // Get the values and labels arrays from schema + const values = currentSchema.allowedValues; + const labels = currentSchema.valuesLabels || []; + + // Iterate the allowed values array + for (let i = 0; i < values.length; i++) { + // Push the current item to the items array + data.items.push({ + value: values[i], + label: labels[i] || values[i] + }); + } + } + }, + + onMixins() { + const instance = Template.instance(); + const component = instance.component; + + // Get the current schema data using component's key + const currentSchema = getCurrentSchema(component.parent, instance.data.key); + + // Stop here if there's no schema data for current key + if (!currentSchema) { + return; + } + + // Fill the component with its default value after rendering + if (currentSchema.defaultValue) { + component.value(currentSchema.defaultValue); + } } } diff --git a/Packages/ohif-core/components/base/template.js b/Packages/ohif-core/components/base/template.js index 08ce69e4b..0df322be9 100644 --- a/Packages/ohif-core/components/base/template.js +++ b/Packages/ohif-core/components/base/template.js @@ -77,7 +77,7 @@ Template.baseComponent.constructView = function(contentFunc, elseFunc) { // Throw an error if the wrapper template does not exists if (!wrapperTemplate) { - throw new Error(`Template ${data.base} not found.`); + throw new Error(`Template ${wrapper} not found.`); } // Clone the wrapper template to avoid assigning duplicated handlers diff --git a/Packages/ohif-core/components/base/wrappers/label.html b/Packages/ohif-core/components/base/wrappers/label.html index a97d660ba..ba1bbd2dc 100644 --- a/Packages/ohif-core/components/base/wrappers/label.html +++ b/Packages/ohif-core/components/base/wrappers/label.html @@ -3,7 +3,7 @@ {{#if this.labelAfter}} {{>UI.contentBlock}} {{/if}} - {{reactive this.label}} + {{reactive this.label}} {{#unless this.labelAfter}} {{>UI.contentBlock}} {{/unless}} diff --git a/Packages/ohif-core/components/base/wrappers/title.html b/Packages/ohif-core/components/base/wrappers/title.html index f461812f3..0db25ccb5 100644 --- a/Packages/ohif-core/components/base/wrappers/title.html +++ b/Packages/ohif-core/components/base/wrappers/title.html @@ -3,7 +3,7 @@ {{#if this.labelAfter}} {{>UI.contentBlock}} {{/if}} - {{reactive this.label}} + {{reactive this.label}} {{#unless this.labelAfter}} {{>UI.contentBlock}} {{/unless}} diff --git a/Packages/ohif-core/components/bootstrap/form/group.html b/Packages/ohif-core/components/bootstrap/form/group.html index a02064ca4..05748e7a1 100644 --- a/Packages/ohif-core/components/bootstrap/form/group.html +++ b/Packages/ohif-core/components/bootstrap/form/group.html @@ -1,5 +1,6 @@