ravindu
/
device-mgt-core
forked from community/device-mgt-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Moving the css files to public folder

Browse Source
feature/appm-store/pbac
megala21 7 years ago
parent 8f3d11fa0e
commit aae017d6f4
28 changed files with 732 additions and 171 deletions
Show Stats Download Patch File Download Diff File

37
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/pom.xml
Unescape View File

@ -31,32 +31,6 @@
<build>
<plugins>
<plugin>
<groupId>org.wso2.maven</groupId>
<artifactId>carbon-p2-plugin</artifactId>
<version>${carbon.p2.plugin.version}</version>
<executions>
<execution>
<id>4-p2-feature-generation</id>
<phase>package</phase>
<goals>
<goal>p2-feature-gen</goal>
</goals>
<configuration>
<id>org.wso2.carbon.device.application.mgt</id>
<propertiesFile>../../etc/feature.properties</propertiesFile>
<adviceFile>
<properties>
<propertyDef>org.wso2.carbon.p2.category.type:server
</propertyDef>
<propertyDef>org.eclipse.equinox.p2.type.group:false
</propertyDef>
</properties>
</adviceFile>
</configuration>
</execution>
</executions>
</plugin>
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>exec-maven-plugin</artifactId>
@ -96,8 +70,15 @@
<workingDirectory>${npm.working.dir}</workingDirectory>
</configuration>
</plugin>
</plugins>
<resources>
<resource>
<directory>${project.build.directory}/target</directory>
</resource>
<resource>
<directory>src/main/resources</directory>
</resource>
</resources>
</build>
<profiles>
<profile>
@ -116,7 +97,7 @@
<properties>
<maven.test.skip>false</maven.test.skip>
<npm.executable>npm</npm.executable>
<npm.build.command>build_prod</npm.build.command>
<npm.build.command>build_dev</npm.build.command>
<npm.working.dir>./src/main/</npm.working.dir>
</properties>
</project>

6
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/config.json
Unescape View File

@ -0,0 +1,6 @@
{
"theme": {
"type": "default",
"value": "lightBaseTheme"
}
}

2
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/index.html
Unescape View File

@ -39,11 +39,11 @@
<title>WSO2 IoT App Publisher</title>
</head>
<body>
<script src='./dist/index.js'></script>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<div id="root"></div>
<script src='./dist/index.js'></script>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/application-create-step1.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/application-create-step1.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/application-create-step2.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/application-create-step2.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/application-create-step3.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/application-create-step3.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/application-create.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/application-create.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/application-listing.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/application-listing.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/basic-layout.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/basic-layout.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/data-table.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/data-table.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/platform-create.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/platform-create.css
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/default/platform-listing.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/platform-listing.css
Unescape View File

54
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx
Unescape View File

@ -31,23 +31,26 @@ import {
PlatformCreate,
PlatformListing
} from './components';
import Theme from './theme';
import Theme from './themes/theme';
const history = createHistory({basename: '/publisher'});
<<<<<<< HEAD
=======
/**
*Loading the theme files based on the the user-preference.
*/
let muiTheme = null;
let selected = Theme.currentTheme;
if (Theme.currentThemeType === "default") {
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
let defaultTheme = require("material-ui/styles/baseThemes/" + selected);
muiTheme = getMuiTheme(defaultTheme.default);
} else {
let customTheme = require("./themes/" + selected + "/theme.js");
muiTheme = getMuiTheme(customTheme.default);
}
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* This component defines the layout and the routes for the app.
@ -104,10 +107,53 @@ class Base extends Component {
*
* */
class Publisher extends Component {
constructor() {
super();
this.state = {
muiTheme: null,
selectedType: null,
selectedTheme: null
};
this.setTheme = this.setTheme.bind(this);
}
componentDidMount() {
/**
*Loading the theme files based on the the user-preference.
*/
let promisedConfig = Theme.loadThemeProperties();
promisedConfig.then(this.setTheme).catch(function (error) {
console.log(error);
});
}
setTheme(response) {
this.setState({
selectedType: response.data.theme.type,
selectedTheme: response.data.theme.value
});
Theme.currentThemeType = this.state.selectedType;
Theme.currentTheme = this.state.selectedTheme;
if (this.state.selectedType === "default") {
let defaultTheme = require("material-ui/styles/baseThemes/" + this.state.selectedTheme);
this.setState({
muiTheme : getMuiTheme(defaultTheme.default)
});
} else {
let customTheme = require("./themes/" + this.state.selectedTheme);
this.setState({
muiTheme : getMuiTheme(customTheme.default)
});
}
}
render() {
return (
<div className="App">
<MuiThemeProvider muiTheme={muiTheme}>
<MuiThemeProvider muiTheme={this.state.muiTheme}>
<Router basename="publisher" history={history}>
<Switch>
<Route path="/login" component={Login}/>

64
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationCreate.jsx
Unescape View File

@ -24,6 +24,11 @@ import {Step1, Step2, Step3} from './CreateSteps';
import RaisedButton from 'material-ui/RaisedButton';
import {Card, CardActions, CardTitle} from 'material-ui/Card';
import {Step, StepLabel, Stepper,} from 'material-ui/Stepper';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The App Create Component.
@ -51,17 +56,56 @@ class ApplicationCreate extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
const applicationCreateCss = "application-create.css";
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + applicationCreateCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + applicationCreateCss);
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const applicationCreateStepCss = "application-create.css";
const applicationCreateStepId = "application-create";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + applicationCreateStepCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(applicationCreateStepId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = applicationCreateStepId;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function () {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + applicationCreateStepCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
componentWillUnmount() {
let styleSheet = document.getElementById("application-create");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/application-create.css");
} else {
try {
require("../../themes/" + selected + "/application-create.css");
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../themes/default/application-create.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

62
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.jsx
Unescape View File

@ -21,6 +21,11 @@ import {withRouter} from 'react-router-dom';
import TextField from 'material-ui/TextField';
import DataTable from '../UIComponents/DataTable';
import {Card, CardActions, CardTitle} from 'material-ui/Card';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The App Create Component.
@ -112,21 +117,60 @@ class ApplicationListing extends Component {
componentWillMount() {
//Fetch all the applications from backend and create application objects.
this.setState({data: this.data});
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const applicationListingCss = "application-listing.css";
const applicationListingId = "application-listing";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + applicationListingCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(applicationListingId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = applicationListingId;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function () {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + applicationListingCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + applicationListingCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + applicationListingCss);
componentWillUnmount() {
let styleSheet = document.getElementById("application-listing");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/application-listing.css");
} else {
try {
require("../../themes/" + selected + "/application-listing.css");
} catch (ex) {
// If the particular customized file does not exist, use the default one.
require("../../themes/default/application-listing.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}
/**
* Handles the search action.
* When typing in the search bar, this method will be invoked.

67
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/CreateSteps/Step1.jsx
Unescape View File

@ -19,9 +19,15 @@
import PropTypes from 'prop-types';
import React, {Component} from 'react';
import MenuItem from 'material-ui/MenuItem';
import TextField from 'material-ui/TextField';
import SelectField from 'material-ui/SelectField';
import RaisedButton from 'material-ui/RaisedButton';
<<<<<<< HEAD
import Theme from '../../../theme';
=======
import Theme from '../../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The first step of the application creation wizard.
@ -51,19 +57,56 @@ class Step1 extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
const applicationCreationStepCss = "application-create-step1.css";
try {
require("../../../" + theme.themeFolder + "/" + selected + "/" + applicationCreationStepCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + applicationCreationStepCss);
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const applicationCreateStep1Css = "application-create-step1.css";
const applicationCreateStep1Id = "application-create-step1";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + applicationCreateStep1Css;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(applicationCreateStep1Id);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = applicationCreateStep1Id;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function () {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + applicationCreateStep1Css;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
componentWillUnmount() {
let styleSheet = document.getElementById("application-create-step1");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../../themes/default/application-create-step1.css");
} else {
try {
require("../../../themes/" + selected + "/application-create-step1.css");
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../../themes/default/application-create-step1.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
//Get the list of available platforms and set to the state.
}
/**

64
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/CreateSteps/Step2.jsx
Unescape View File

@ -28,6 +28,11 @@ import SelectField from 'material-ui/SelectField';
import RaisedButton from 'material-ui/RaisedButton';
import Clear from 'material-ui/svg-icons/content/clear';
import {GridList, GridTile} from 'material-ui/GridList';
<<<<<<< HEAD
import Theme from '../../../theme';
=======
import Theme from '../../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The Second step of application create wizard.
@ -69,17 +74,56 @@ class Step2 extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
const applicationCreationStepCss = "application-create-step2.css";
try {
require("../../../" + theme.themeFolder + "/" + selected + "/" + applicationCreationStepCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + applicationCreationStepCss);
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const applicationCreateStep2Css = "application-create-step2.css";
const applicationCreateStep2Id = "application-create-step2";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + applicationCreateStep2Css;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(applicationCreateStep2Id);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = applicationCreateStep2Id;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function() {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + applicationCreateStep2Css;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
});
}
componentWillUnmount() {
let styleSheet = document.getElementById("application-create-step2");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../../themes/default/application-create-step2.css");
} else {
try {
require("../../../themes/" + selected + "/application-create-step2.css");
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../../themes/default/application-create-step2.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

62
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/CreateSteps/Step3.jsx
Unescape View File

@ -24,6 +24,11 @@ import TextField from 'material-ui/TextField';
import FlatButton from 'material-ui/FlatButton';
import SelectField from 'material-ui/SelectField';
import RaisedButton from 'material-ui/RaisedButton';
<<<<<<< HEAD
import Theme from '../../../theme';
=======
import Theme from '../../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The Third step of application create wizard. {Application Release Step}
@ -58,17 +63,56 @@ class Step3 extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
const applicationCreationStepCss = "application-create-step1.css";
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const applicationCreateStep3Css = "application-create-step3.css";
const applicationCreateStep3Id = "application-create-step3";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + applicationCreateStep3Css;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(applicationCreateStep3Id);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = applicationCreateStep3Id;
link.rel = Theme.styleSheetRel;
try {
require("../../../" + theme.themeFolder + "/" + selected + "/" + applicationCreationStepCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + applicationCreationStepCss);
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function() {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + applicationCreateStep3Css;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
componentWillUnmount() {
let styleSheet = document.getElementById("application-create-step3");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../../themes/default/application-create-step3.css");
} else {
try {
require("../../../themes/" + selected + "/application-create-step3.css");
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../../themes/default/application-create-step3.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

64
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Base/BaseLayout.jsx
Unescape View File

@ -27,10 +27,14 @@ import {List, ListItem} from 'material-ui/List';
import Apps from 'material-ui/svg-icons/navigation/apps';
import Add from 'material-ui/svg-icons/content/add-circle';
import Feedback from 'material-ui/svg-icons/action/feedback';
import Dashboard from 'material-ui/svg-icons/action/dashboard';
import DevicesOther from 'material-ui/svg-icons/hardware/devices-other';
import NotificationsIcon from 'material-ui/svg-icons/social/notifications';
import ActionAccountCircle from 'material-ui/svg-icons/action/account-circle';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
@ -50,17 +54,58 @@ class BaseLayout extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
console.log(Theme.currentThemeType);
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const basicLayoutCss = "basic-layout.css";
const basicLayoutId = "basic-layout";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + basicLayoutCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(basicLayoutId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = basicLayoutId;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function() {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + basicLayoutCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + basicLayoutCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + basicLayoutCss);
}
componentWillUnmount() {
let styleSheet = document.getElementById("basic-layout");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/basic-layout.css");
} else {
try {
require("../../themes/" + selected + "/basic-layout.css");
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../themes/default/basic-layout.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}
@ -98,6 +143,7 @@ class BaseLayout extends Component {
render() {
return (
<div>
<AppBar title="App Publisher"
iconElementRight={

60
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformCreate.jsx
Unescape View File

@ -31,6 +31,11 @@ import {GridList, GridTile} from 'material-ui/GridList';
import Close from 'material-ui/svg-icons/navigation/close';
import {Card, CardActions, CardTitle} from 'material-ui/Card';
import AddCircleOutline from 'material-ui/svg-icons/content/add-circle-outline';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* Platform Create component.
@ -65,17 +70,56 @@ class PlatformCreate extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const platformCreateCss = "platform-create.css";
const platformCreateId = "application-listing";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + platformCreateCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(platformCreateId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = platformCreateId;
link.rel = Theme.styleSheetRel;
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + platformCreateCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + platformCreateCss);
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function(){
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + platformCreateCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
componentWillUnmount() {
let styleSheet = document.getElementById("platform-create");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/platform-create.css");
} else {
try {
require("../../themes/" + selected + "/platform-create.css");
} catch (ex) {
// If the particular customized file does not exist, use the default one.
require("../../themes/default/platform-create.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

62
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformListing.jsx
Unescape View File

@ -21,6 +21,11 @@ import {withRouter} from 'react-router-dom';
import TextField from 'material-ui/TextField';
import DataTable from '../UIComponents/DataTable';
import {Card, CardActions, CardTitle} from 'material-ui/Card';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The App Create Component.
@ -40,19 +45,58 @@ class PlatformListing extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
console.log(Theme.currentThemeType);
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const platformListingCss = "platform-listing.css";
const platformListingId = "platform-listing";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + platformListingCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(platformListingId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.id = platformListingId;
link.rel = Theme.styleSheetRel;
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + platformListingCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + platformListingCss);
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function () {
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + platformListingCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
componentWillUnmount() {
let styleSheet = document.getElementById("platform-listing");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/platform-listing.css");
} else {
try {
require("../../themes/" + selected + "/platform-listing.css");
} catch (ex) {
// If the particular customized file does not exist, use the default one.
require("../../themes/default/platform-listing.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
//Fetch all the applications from backend and create application objects.
}
/**

59
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTable.jsx
Unescape View File

@ -22,6 +22,11 @@ import DataTableRow from './DataTableRow';
import DataTableHeader from './DataTableHeader';
import RaisedButton from 'material-ui/RaisedButton';
import {Table, TableBody, TableHeader, TableRow} from 'material-ui/Table';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* The Custom Table Component.
@ -61,18 +66,54 @@ class DataTable extends Component {
componentWillMount() {
this.setState({data: this.props.data, headers: this.props.headers});
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const dataTableCss = "data-table.css";
const dataTableId = "data-table";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + dataTableCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(dataTableId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link"); link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = dataTableId;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function() {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + dataTableCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + dataTableCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + dataTableCss);
componentWillUnmount() {
let styleSheet = document.getElementById("data-table");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/data-table.css");
} else {
try {
require("../../themes/" + selected + "/data-table.css");
} catch (ex) {
// If the particular customized file does not exist, use the default one.
require("../../themes/default/data-table.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

61
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTableHeader.jsx
Unescape View File

@ -20,6 +20,11 @@ import PropTypes from 'prop-types';
import React, {Component} from 'react';
import FlatButton from 'material-ui/FlatButton';
import {TableHeaderColumn} from 'material-ui/Table';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* Data Table header component.
@ -32,17 +37,57 @@ class DataTableHeader extends Component {
}
componentWillMount() {
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
<<<<<<< HEAD
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const dataTableCss = "data-table.css";
const dataTableId = "data-table";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + dataTableCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(dataTableId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = dataTableId;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function() {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + dataTableCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + dataTableCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + dataTableCss);
}
componentWillUnmount() {
let styleSheet = document.getElementById("data-table");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/data-table.css");
} else {
try {
require("../../themes/" + selected + "/data-table.css");
} catch (ex) {
// If the particular customized file does not exist, use the default one.
require("../../themes/default/data-table.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

59
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTableRow.jsx
Unescape View File

@ -19,6 +19,11 @@
import PropTypes from 'prop-types';
import React, {Component} from 'react';
import {TableRow, TableRowColumn} from 'material-ui/Table';
<<<<<<< HEAD
import Theme from '../../theme';
=======
import Theme from '../../themes/theme';
>>>>>>> parent of 8f3d11f... refactoring theming support
/**
* Data table row component.
@ -35,18 +40,56 @@ class DataTableRow extends Component {
componentWillMount() {
this.setState({dataItem: this.props.dataItem});
<<<<<<< HEAD
//Using the particular style specific to user selected theme.
const theme = require("../../theme").default;
/**
*Loading the theme files based on the the user-preference.
*/
const selected =
(theme.currentThemeType === theme.defaultThemeType) ? theme.defaultThemeType : theme.currentTheme;
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
const dataTableCss = "data-table.css";
const dataTableId = "data-table";
let themePath = "/" + Theme.themeFolder + "/" + selected + "/" + dataTableCss;
let promisedConfig = Theme.loadThemeFiles(themePath);
let styleSheet = document.getElementById(dataTableId);
let head = document.getElementsByTagName("head")[0];
let link = document.createElement("link");
link.type = Theme.styleSheetType;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
link.id = dataTableId;
link.rel = Theme.styleSheetRel;
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
}
promisedConfig.then(function() {
head.appendChild(link);
}).catch(function () {
// If there is no customized css file, load the default one.
themePath = "/" + Theme.themeFolder + "/" + Theme.defaultThemeType + "/" + dataTableCss;
link.href = Theme.baseURL + "/" + Theme.appContext + themePath;
head.appendChild(link);
});
}
try {
require("../../" + theme.themeFolder + "/" + selected + "/" + dataTableCss);
} catch (ex){
// If the particular customized file does not exist, use the default one.
require("../../" + theme.themeFolder + "/" + theme.defaultThemeType + "/" + dataTableCss);
componentWillUnmount() {
let styleSheet = document.getElementById("data-table");
if (styleSheet !== null) {
styleSheet.disabled = true;
styleSheet.parentNode.removeChild(styleSheet);
=======
let selected = Theme.selectedTheme;
if (Theme.currentTheme === "default") {
require("../../themes/default/data-table.css");
} else {
try {
require("../../themes/" + selected + "/data-table.css");
} catch (ex) {
// If the particular customized file does not exist, use the default one.
require("../../themes/default/data-table.css");
}
>>>>>>> parent of 8f3d11f... refactoring theming support
}
}

37
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/theme.js
Unescape View File

@ -1,37 +0,0 @@
/*
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
*
* WSO2 Inc. licenses this file to you under the Apache License,
* Version 2.0 (the "License"); you may not use this file except
* in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
/**
* This class will read through the configuration file and saves the theme names for the usage in other files.
* User can define the themes in the config.json. The themes will be loaded based on the user preference.
*/
class Theme {
constructor() {
const theme = require("./config.json").theme;
this.currentThemeType = theme.type;
this.defaultThemeType = "default";
this.themeFolder = "themes";
if (this.currentThemeType === this.defaultThemeType) {
this.currentTheme = theme.value;
} else {
this.currentTheme = theme.value;
}
}
}
export default (new Theme);

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/custom-theme/theme.js → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/custom-theme.js
Unescape View File

78
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/theme.js
Unescape View File

@ -0,0 +1,78 @@
/*
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
*
* WSO2 Inc. licenses this file to you under the Apache License,
* Version 2.0 (the "License"); you may not use this file except
* in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import axios from 'axios';
/**
* This class will read through the configuration file and saves the theme names for the usage in other files.
* User can define the themes in the config.json. The themes will be loaded based on the user preference.
*/
class Theme {
constructor() {
<<<<<<< HEAD:components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/theme.js
this.defaultThemeType = "default";
this.currentThemeType = this.defaultThemeType;
this.currentTheme = "lightBaseTheme";
this.themeFolder = "themes";
this.styleSheetType = "text/css";
this.styleSheetRel = "stylesheet";
//TODO Need to get the app context properly when the server is ready
this.baseURL = window.location.origin;
this.appContext = window.location.pathname.split("/")[1];
this.loadThemeProperties.bind(this);
this.loadThemeFiles.bind(this);
=======
const theme = require("../config.json").theme;
this.currentTheme = theme.type;
if (this.currentTheme === "default") {
this.selectedTheme = theme.value;
} else {
this.selectedTheme = theme.value;
}
>>>>>>> parent of 8f3d11f... refactoring theming support:components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/theme.js
}
loadThemeProperties () {
let httpClient = axios.create({
baseURL: this.baseURL + "/" + this.appContext + "/config.json",
timeout: 2000
});
httpClient.defaults.headers.post['Content-Type'] = 'application/json';
return httpClient.get();
}
loadTheme () {
let httpClient = axios.create({
baseURL: this.baseURL + "/" + this.appContext + "/themes/custom-theme/theme.js",
timeout: 2000
});
return httpClient.get();
}
loadThemeFiles (path) {
let httpClient = axios.create({
baseURL: this.baseURL + "/" + this.appContext + path,
timeout: 2000
});
return httpClient.get();
}
}
export default (new Theme);

5
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/webpack.config.js
Unescape View File

@ -58,7 +58,12 @@ const config = {
}]
}
]
},
resolve: {
// you can now require('file') instead of require('file.coffee')
extensions: ['.jsx', '.js']
}
};
if (process.env.NODE_ENV === "development") {

Write Preview
Loading…
Cancel
Save