Adding platform selection to create project dialog

Resources/EditorData/AtomicEditor/editor/ui/createproject.tb.txt

@@ -1,27 +1,35 @@
 TBLayout: axis: y, distribution: gravity, position: left
-	TBLayout: distribution: gravity
-		TBLayout: distribution: gravity
-			TBTextField: text: "Project Name:"
-			TBLayout: gravity: left right, distribution-position: right bottom
-				TBEditField: id: project_name, text: "MyGame"
-					lp: min-width: 240
-		TBLayout: gravity: left right, distribution-position: right bottom
-			TBImageWidget: id: project_image
-				lp: width: 128, height: 96
-	TBSeparator: gravity: left right, skin: AESeparator
-	TBTextField: text: "Project Directory:"
-	TBLayout: axis: y, distribution: gravity, position: left
-		TBLayout: gravity: left right, distribution-position: right bottom
-			TBEditField: id: project_path
-				lp: min-width: 380
-			TBButton: text: "Choose" id: choose_path
-	TBSeparator: gravity: left right, skin: AESeparator
-	TBLayout: distribution: gravity
-		TBTextField: text: "Project Language:"
-		TBLayout: gravity: left right, distribution-position: right bottom
-			TBSelectDropdown: id: project_language
-				lp: min-width: 240
-	TBSeparator: gravity: left right, skin: AESeparator
-	TBLayout:
-		TBButton: text: Create, id: create
-		TBButton: text: Cancel, id: cancel
+    TBLayout: distribution: gravity, axis: y
+        TBLayout: distribution: gravity
+            TBTextField: text: "Project Name:"
+            TBLayout: gravity: left right, distribution-position: right bottom
+                TBEditField: id: project_name, text: "MyGame"
+                    lp: min-width: 240
+        TBLayout: distribution: gravity
+            TBTextField: text: "App ID:"
+            TBLayout: gravity: left right, distribution-position: right bottom
+                TBEditField: id: app_id, text: "com.companyname.mygame"
+                    lp: min-width: 240
+        TBLayout: gravity: left right, distribution-position: right bottom
+            TBImageWidget: id: project_image
+                lp: width: 128, height: 96
+    TBSeparator: gravity: left right, skin: AESeparator
+    TBTextField: text: "Platforms:"
+    TBLayout: id: platformcontainer
+    TBSeparator: gravity: left right, skin: AESeparator
+    TBTextField: text: "Project Directory:"
+    TBLayout: axis: y, distribution: gravity, position: left
+        TBLayout: gravity: left right, distribution-position: right bottom
+            TBEditField: id: project_path
+                lp: min-width: 380
+            TBButton: text: "Choose" id: choose_path
+    TBSeparator: gravity: left right, skin: AESeparator
+    TBLayout: distribution: gravity
+        TBTextField: text: "Project Language:"
+        TBLayout: gravity: left right, distribution-position: right bottom
+            TBSelectDropdown: id: project_language
+                lp: min-width: 240
+    TBSeparator: gravity: left right, skin: AESeparator
+    TBLayout:
+        TBButton: text: Create, id: create
+        TBButton: text: Cancel, id: cancel

Script/AtomicEditor/ui/modal/CreateProject.ts

@@ -38,15 +38,21 @@ class CreateProject extends ModalWindow {
 
         this.projectPathField = <Atomic.UIEditField>this.getWidget("project_path");
         this.projectNameField = <Atomic.UIEditField>this.getWidget("project_name");
+        this.appIDField = <Atomic.UIEditField>this.getWidget("app_id");
         this.projectLanguageField = <Atomic.UISelectDropdown>this.getWidget("project_language");
         this.image = <Atomic.UIImageWidget>this.getWidget("project_image");
 
+        this.desktopButton = this.addPlatformButton("desktop", "AtomicEditor/editor/images/Desktop128.png");
+        this.desktopButton.value = 1;
+        this.androidButton = this.addPlatformButton("android", "AtomicEditor/editor/images/Android128.png");
+        this.iosButton = this.addPlatformButton("ios", "AtomicEditor/editor/images/iOS128.png");
+        this.html5Button = this.addPlatformButton("html5", "AtomicEditor/editor/images/HTML5128.png");
+
         if (!projectTemplate.screenshot)
             this.image.visibility = Atomic.UI_WIDGET_VISIBILITY_GONE;
         else
             this.image.image = projectTemplate.screenshot;
 
-
         var fileSystem = Atomic.getFileSystem();
 
         var userDocuments = fileSystem.userDocumentsDir;
@@ -72,6 +78,54 @@ class CreateProject extends ModalWindow {
 
     }
 
+    addPlatformButton(platformName:string, platformLogo:string):Atomic.UIButton {
+
+        var platformcontainer = <Atomic.UILayout>this.getWidget("platformcontainer");
+
+        // IMAGE BUTTON
+
+        var id = platformName;
+        var size = 92;
+
+        var button = new Atomic.UIButton();
+        button.id = id;     
+        button.toggleMode = true;   
+
+        button.onClick = () => {
+
+        };
+
+        var lp = new Atomic.UILayoutParams();
+        lp.minWidth = size;
+        lp.minHeight = size;
+
+        button.layoutParams = lp;
+
+        button.gravity = Atomic.UI_GRAVITY_ALL;
+
+        var image = new Atomic.UIImageWidget();
+        image.image = platformLogo;
+        var rect = [0, 0, size, size];
+        image.rect = rect;
+        button.addChild(image);
+
+        if (platformName != "desktop") {
+            var greenplus = new Atomic.UIImageWidget();
+            greenplus.image = "AtomicEditor/editor/images/green_plus.png";
+            rect = [size-18, 2, size-2, 18];
+            greenplus.rect = rect;
+            greenplus.visibility = Atomic.UI_WIDGET_VISIBILITY_INVISIBLE;
+            button.addChild(greenplus);
+            button["greenPlus"] = greenplus;
+        }   
+        
+        platformcontainer.addChild(button);
+
+        return button;
+
+    }
+
+
     tryProjectCreate(): boolean {
 
         var name = this.projectNameField.text.trim();
@@ -181,6 +235,23 @@ class CreateProject extends ModalWindow {
         return false;
     }
 
+    handleLanguageSwitch(selectedLanguage:string) {
+
+        if (selectedLanguage == "CSharp" || selectedLanguage == "C#") {
+
+            this.html5Button["greenPlus"].visibility = Atomic.UI_WIDGET_VISIBILITY_INVISIBLE;
+            this.html5Button.value = 0;
+            this.html5Button.disable();
+
+        } else {
+
+            this.html5Button.enable();
+            this.html5Button["greenPlus"].visibility = this.html5Button.value == 1 ? Atomic.UI_WIDGET_VISIBILITY_VISIBLE : Atomic.UI_WIDGET_VISIBILITY_INVISIBLE;
+
+        }                
+        
+    }
+
     handleWidgetEvent(ev: Atomic.UIWidgetEvent) {
 
         if (ev.type == Atomic.UI_EVENT_TYPE_CLICK) {
@@ -207,6 +278,23 @@ class CreateProject extends ModalWindow {
                 return true;
 
             }
+        } else if (ev.type == Atomic.UI_EVENT_TYPE_CHANGED) {
+
+            // handle language change
+            if (ev.target.id == "project_language") {
+                this.handleLanguageSwitch(this.projectLanguageField.text);
+            }
+
+            if (ev.target.id == "desktop") {
+                
+                // desktop is always selected
+                this.desktopButton.value = 1;
+
+            } else if (ev.target["greenPlus"]) {
+                ev.target["greenPlus"].visibility = ev.target.value == 1 ? Atomic.UI_WIDGET_VISIBILITY_VISIBLE : Atomic.UI_WIDGET_VISIBILITY_INVISIBLE;
+            }
+
+
         }
     }
 
@@ -224,13 +312,19 @@ class CreateProject extends ModalWindow {
         this.projectLanguageField.source = this.projectLanguageFieldSource;
         this.projectLanguageField.value = 0;
     }
-
+    
     projectPathField: Atomic.UIEditField;
     projectNameField: Atomic.UIEditField;
+    appIDField: Atomic.UIEditField;
     projectLanguageField: Atomic.UISelectDropdown;
     projectLanguageFieldSource: Atomic.UISelectItemSource = new Atomic.UISelectItemSource();
     image: Atomic.UIImageWidget;
 
+    desktopButton: Atomic.UIButton;
+    androidButton: Atomic.UIButton;
+    iosButton: Atomic.UIButton;
+    html5Button: Atomic.UIButton;
+
     projectTemplate: ProjectTemplates.ProjectTemplateDefinition;
 }
 

Source/Atomic/UI/UIButton.cpp

@@ -60,6 +60,23 @@ void UIButton::SetSqueezable(bool value)
     ((TBButton*)widget_)->SetSqueezable(value);
 }
 
+void UIButton::SetToggleMode(bool toggle)
+{
+	if (!widget_)
+		return;
+
+	((TBButton*)widget_)->SetToggleMode(toggle);
+
+}
+
+bool UIButton::GetToggleMode() const
+{
+	if (!widget_)
+		return false;
+
+	return ((TBButton*)widget_)->GetToggleMode();
+}
+
 void UIButton::SetEmulationButton(int emulationButton)
 {
     emulationButton_ = emulationButton;

Source/Atomic/UI/UIButton.h

@@ -50,6 +50,10 @@ public:
     /// for example a http:// link will open the default browser
     void SetURLEnabled(bool enabled) { urlEnabled_ = enabled; }
 
+	///Set to true if the button should toggle on and off	
+	void SetToggleMode(bool toggle);
+	bool GetToggleMode() const;
+
 protected:
 
     virtual bool OnEvent(const tb::TBWidgetEvent &ev);