You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by hu...@apache.org on 2022/12/14 00:55:35 UTC

[royale-asjs] branch develop updated: New Jewel DropZone component

This is an automated email from the ASF dual-hosted git repository.

hugoferreira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git


The following commit(s) were added to refs/heads/develop by this push:
     new 83f7938209 New Jewel DropZone component
83f7938209 is described below

commit 83f79382096f0ed27fa7a9006276c009a8595df2
Author: Hugo Ferreira <hf...@solidsoft.pt>
AuthorDate: Wed Dec 14 00:56:11 2022 +0000

    New Jewel DropZone component
    
    The DropZone class defines an area on the screen into a which an object can be dragged and dropped to accomplish a task (also support multiples files)
---
 .../Jewel/src/main/resources/jewel-manifest.xml    |   2 +
 .../royale/org/apache/royale/jewel/DropZone.as     | 100 +++++++++++++++++++++
 .../royale/jewel/beads/models/DroppedModel.as      |  59 ++++++++++++
 .../org/apache/royale/jewel/events/DroppedEvent.as |  41 +++++++++
 4 files changed, 202 insertions(+)

diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 844f24b37b..b5afed4bf5 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -294,6 +294,8 @@
 
     <component id="ResponsiveSizeMonitor" class="org.apache.royale.jewel.debugger.ResponsiveSizeMonitor"/>
 
+    <component id="DropZone" class="org.apache.royale.jewel.DropZone"/>
+
     <component id="AudioPlayer" class="org.apache.royale.jewel.AudioPlayer"/>
     <component id="VideoPlayer" class="org.apache.royale.jewel.VideoPlayer"/>
     
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropZone.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropZone.as
new file mode 100644
index 0000000000..f8db70f1d6
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropZone.as
@@ -0,0 +1,100 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF 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.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.royale.jewel
+{
+    import org.apache.royale.events.Event;
+    import org.apache.royale.jewel.Group;
+    import org.apache.royale.jewel.beads.models.DroppedModel;
+    import org.apache.royale.jewel.events.DroppedEvent;
+    import org.apache.royale.utils.Base64;
+	COMPILE::JS
+	{
+		import org.apache.royale.core.WrappedHTMLElement;
+	}
+
+	/**
+	 *  Dispatched When the wizard reach to this page
+	 *
+     *  @toplevel
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.6
+	 */
+	[Event(name="dropped", type="org.apache.royale.jewel.events.DroppedEvent")]
+
+	/**
+	 *  The DropZone class defines an area on the screen into a which
+     *  an object can be dragged and dropped to accomplish a task
+	 *
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.10
+	 */
+    public class DropZone extends Group
+    {
+		public function DropZone()
+        {
+			super();
+		}
+
+		private function elementDragged(event:Event):void
+        {
+			event.preventDefault();
+		}
+
+		private function dropped(event:Event):void
+        {  
+			event.preventDefault();
+
+            COMPILE::JS
+            {
+                var fileList:FileList = event['dataTransfer'].files;
+                var data:Array = [];
+
+                for (var i:int = 0; i < fileList.length; i++)
+                {
+                    var reader:FileReader = new FileReader();
+                    reader['fileName'] = fileList[i].name;
+                    reader.addEventListener('load', function(e:Event):void
+                    {
+                        data.push(new DroppedModel(e.target['fileName'], Base64.decode(btoa(e.target['result']))));
+
+                        if (data.length == fileList.length)
+                            dispatchEvent(new DroppedEvent(DroppedEvent.DROPPED, data));
+                    });
+                    reader.readAsBinaryString(fileList[i]);
+                }
+            }
+		}
+
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            super.createElement();
+            element.setAttribute('role', 'region'); 
+            element.tabIndex = 0;
+            element.addEventListener('dragenter', elementDragged);
+            element.addEventListener('dragover', elementDragged);
+            element.addEventListener('drop', dropped);
+            return element;
+        }
+    }
+}
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/DroppedModel.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/DroppedModel.as
new file mode 100644
index 0000000000..0030b1763d
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/DroppedModel.as
@@ -0,0 +1,59 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF 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.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.royale.jewel.beads.models
+{
+	import org.apache.royale.utils.BinaryData;
+
+	/**
+	 *  The DroppedModel class defines the data associated with an DropZone task
+	 *
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.10
+	 */
+	public class DroppedModel
+	{
+		/**
+		 *  constructor.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.10
+		 */
+		public function DroppedModel(fileName:String, fileData:BinaryData)
+		{
+			super();
+
+            this.fileName = fileName;
+            this.fileData = fileData;
+		}
+		
+		/**
+		 * @royalesuppresspublicvarwarning
+		 */
+		public var fileName:String;
+
+		/**
+		 * @royalesuppresspublicvarwarning
+		 */
+		public var fileData:BinaryData;
+	}
+}
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/events/DroppedEvent.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/events/DroppedEvent.as
new file mode 100644
index 0000000000..f14b29269b
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/events/DroppedEvent.as
@@ -0,0 +1,41 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF 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.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.royale.jewel.events
+{
+	import org.apache.royale.events.Event;
+
+	/**
+	 * Programmatic (not user/UI) based wizard navigation events.
+	 */
+	public class DroppedEvent extends Event
+	{
+		public static const DROPPED:String = "dropped";
+
+		/**
+		 * @royalesuppresspublicvarwarning
+		 */
+		public var data:Array;
+
+		public function DroppedEvent(type:String, data:Array = null)
+        {
+			super(type);
+			this.data = data;
+		}
+	}
+}
\ No newline at end of file