1 files changed, 21 insertions, 5 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 6c5e030c..8a4073c9 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
 <!-- <copyright>
 Copyright (c) 2012, Motorola Mobility LLC.
 All Rights Reserved.
@@ -54,7 +54,6 @@ POSSIBILITY OF SUCH DAMAGE.
                        "playheadmarker": {"#": "playhead_marker"},
                        "timetext" : {"#": "time_text"},
                        "timebar" : {"#": "time_bar"},
-                        "container_tracks" : {"#" : "container-tracks"},
                        "end_hottext" : {"@" : "endHottext"},
                        "container_layers" : {"#" : "container-layers"},
                        "container_tracks" : {"#" : "container-tracks"},
@@ -62,8 +61,23 @@ POSSIBILITY OF SUCH DAMAGE.
                        "checkable_animated" : {"#" : "checkable_animated"},
                        "tl_configbutton" : {"#" : "tl-configbutton"},
                        "checkable_lock" : {"#" : "checkable_lock"},
-                        "checkable_visible":{"#" : "checkable_visible"},
+                        "checkable_visible":{"#" : "checkable_visible"}
-                        "play_button" : {"#" : "play_button"}
+                    }
+                },
+                "playButton": {
+                    "prototype": "montage/ui/toggle-button.reel",
+                    "properties": {
+                        "element": {"#": "play_button"},
+                        "identifier": "playButton",
+                        "pressedClass": "pausebutton",
+                        "pressedLabel": "",
+                        "unpressedLabel": "",
+                        "pressed": false
+                    },
+                    "bindings": {
+                        "pressed": {"<->": "@owner.stage.timelinePlay"}
                    }
                },
@@ -190,7 +204,7 @@ POSSIBILITY OF SUCH DAMAGE.
                    <div data-montage-id="leftpane_inside" class="leftinside">
                        <div data-montage-id="timeline_controller" class="timelinecontroller">
                            <div data-montage-id="timeline_controls" class="timelinecontrols">
-                                <div data-montage-id="play_button" class="playbutton"></div>
+                                <button data-montage-id="play_button" class="playbutton"></button>
                                <div data-montage-id="time_text" class="timetext">00:00:00</div>
                            </div>
                        </div>
@@ -217,7 +231,9 @@ POSSIBILITY OF SUCH DAMAGE.
                        </div>
                        <div data-montage-id="timeline_gutter" class="timelinegutter">
+                            <div class="sliderClass">
                            <div data-montage-id="tl_slider" class="tl_slider"></div>
+                            </div>
                            <input data-montage-id="end_hottext" class="endhottext">
                        </div>
                    </div>

diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html index 6c5e030c..8a4073c9 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -1,4 +1,4 @@
1	<!DOCTYPE html>	1	<!DOCTYPE html>
2	<!-- <copyright>	2	<!-- <copyright>
3	Copyright (c) 2012, Motorola Mobility LLC.	3	Copyright (c) 2012, Motorola Mobility LLC.
4	All Rights Reserved.	4	All Rights Reserved.
@@ -54,7 +54,6 @@ POSSIBILITY OF SUCH DAMAGE.
54	"playheadmarker": {"#": "playhead_marker"},	54	"playheadmarker": {"#": "playhead_marker"},
55	"timetext" : {"#": "time_text"},	55	"timetext" : {"#": "time_text"},
56	"timebar" : {"#": "time_bar"},	56	"timebar" : {"#": "time_bar"},
57	"container_tracks" : {"#" : "container-tracks"},
58	"end_hottext" : {"@" : "endHottext"},	57	"end_hottext" : {"@" : "endHottext"},
59	"container_layers" : {"#" : "container-layers"},	58	"container_layers" : {"#" : "container-layers"},
60	"container_tracks" : {"#" : "container-tracks"},	59	"container_tracks" : {"#" : "container-tracks"},
@@ -62,8 +61,23 @@ POSSIBILITY OF SUCH DAMAGE.
62	"checkable_animated" : {"#" : "checkable_animated"},	61	"checkable_animated" : {"#" : "checkable_animated"},
63	"tl_configbutton" : {"#" : "tl-configbutton"},	62	"tl_configbutton" : {"#" : "tl-configbutton"},
64	"checkable_lock" : {"#" : "checkable_lock"},	63	"checkable_lock" : {"#" : "checkable_lock"},
65	"checkable_visible":{"#" : "checkable_visible"},	64	"checkable_visible":{"#" : "checkable_visible"}
66	"play_button" : {"#" : "play_button"}	65
		66	}
		67	},
		68
		69	"playButton": {
		70	"prototype": "montage/ui/toggle-button.reel",
		71	"properties": {
		72	"element": {"#": "play_button"},
		73	"identifier": "playButton",
		74	"pressedClass": "pausebutton",
		75	"pressedLabel": "",
		76	"unpressedLabel": "",
		77	"pressed": false
		78	},
		79	"bindings": {
		80	"pressed": {"<->": "@owner.stage.timelinePlay"}
67	}	81	}
68	},	82	},
69		83
@@ -190,7 +204,7 @@ POSSIBILITY OF SUCH DAMAGE.
190	<div data-montage-id="leftpane_inside" class="leftinside">	204	<div data-montage-id="leftpane_inside" class="leftinside">
191	<div data-montage-id="timeline_controller" class="timelinecontroller">	205	<div data-montage-id="timeline_controller" class="timelinecontroller">
192	<div data-montage-id="timeline_controls" class="timelinecontrols">	206	<div data-montage-id="timeline_controls" class="timelinecontrols">
193	<div data-montage-id="play_button" class="playbutton"></div>	207	<button data-montage-id="play_button" class="playbutton"></button>
194	<div data-montage-id="time_text" class="timetext">00:00:00</div>	208	<div data-montage-id="time_text" class="timetext">00:00:00</div>
195	</div>	209	</div>
196	</div>	210	</div>
@@ -217,7 +231,9 @@ POSSIBILITY OF SUCH DAMAGE.
217	</div>	231	</div>
218		232
219	<div data-montage-id="timeline_gutter" class="timelinegutter">	233	<div data-montage-id="timeline_gutter" class="timelinegutter">
		234	<div class="sliderClass">
220	<div data-montage-id="tl_slider" class="tl_slider"></div>	235	<div data-montage-id="tl_slider" class="tl_slider"></div>
		236	</div>
221	<input data-montage-id="end_hottext" class="endhottext">	237	<input data-montage-id="end_hottext" class="endhottext">
222	</div>	238	</div>
223	</div>	239	</div>