auto refresh

pharo-media-center · Aug 9, 2019 · b050286 · b050286
1 parent e2451a9
commit b050286
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 27 deletions.
diff --git a/src/EMM-WebApplication/EMMListModule.class.st b/src/EMM-WebApplication/EMMListModule.class.st
@@ -1,8 +1,8 @@
 Class {
 	#name : #EMMListModule,
 	#superclass : #EMMModule,
-	#traits : 'TWithRootDialogComponent',
-	#classTraits : 'TWithRootDialogComponent classTrait',
+	#traits : 'TWithRootDialogComponent + EMMTDisplayList',
+	#classTraits : 'TWithRootDialogComponent classTrait + EMMTDisplayList classTrait',
 	#instVars : [
 		'datas'
 	],
@@ -104,11 +104,22 @@ EMMListModule >> renderOn: html menuForPlayable: song [
 				onClickUpdateRootDialogWith: [ :r | self renderDialogOn: r addPlayable: song ];
 				fullBleedDivider;
 				with: 'Add in playlist'.
-			html mdlMenuItem 
-				onClick: (html jQuery ajax callback: [ self session model addNextPlayable: song ]);
-				with: [ html text: 'Play next'].
 			html mdlMenuItem
-				onClick: (html jQuery ajax callback: [ self session model addAtTheEndPlayable: song ]);
+				onClick:
+					((html jQuery id: self listId) load
+						html: [ :canvas | 
+							self session model addNextPlayable: song.
+							self renderListOn: canvas ];
+						onComplete: 'componentHandler.upgradeDom();' js);
+				"onClick: (html jQuery ajax callback: [ self session model addNextPlayable: song ]);"
+					with: [ html text: 'Play next' ].
+			html mdlMenuItem
+				onClick:
+					((html jQuery id: self listId) load
+						html: [ :canvas | 
+							self session model addAtTheEndPlayable: song.
+							self renderListOn: canvas ];
+						onComplete: 'componentHandler.upgradeDom();' js);
 				with: [ html text: 'Play at the end' ] ]
 ]
 

diff --git a/src/EMM-WebApplication/EMMQueueModule.class.st b/src/EMM-WebApplication/EMMQueueModule.class.st
@@ -1,6 +1,8 @@
 Class {
 	#name : #EMMQueueModule,
 	#superclass : #EMMModule,
+	#traits : 'EMMTDisplayList',
+	#classTraits : 'EMMTDisplayList classTrait',
 	#category : #'EMM-WebApplication-Core'
 }
 
@@ -46,28 +48,12 @@ EMMQueueModule >> renderContentOn: html [
 				size: 6;
 				with: [ html paragraph
 						id: self musicTitleId;
-						with: (self session model currentPlayable ifNotNil: [ :song | (song title) ifNil: [ song name ] ] ifNil: [ '' ]) ] ].
+						with: (self session model currentPlayable ifNotNil: [ :song | song title ifNil: [ song name ] ] ifNil: [ '' ]) ] ].
 	html render: (MDLProgressBarWidget progression: [ self session model musicPlayer currentPosition ]).
-	html mdlTable
-		attributeAt: 'width' put: '100%';
-		with: [ html
-				tableHead: [ html
-						tableRow: [ html mdlTableHeading
-								nonNumerical;
-								with: 'Title'.
-							html mdlTableHeading: 'Lenght'.
-							html mdlTableHeading: 'Author' ] ].
-			html
-				tableBody: [ datas
-						do: [ :song | 
-							html
-								tableRow: [ html mdlTableCell
-										nonNumerical;
-										with: (song title ifNil: [ song name ]).
-									html mdlTableCell
-										nonNumerical;
-										with: [ html text: (song artists asOrderedCollection ifNotEmpty: [ :col | col first name ] ifEmpty: [ 'No Author' ]) ].
-									html mdlTableCell with: song length ] ] ] ].
+
+	html div
+		id: self listId;
+		with: [ self renderListOn: html ].
 
 	self renderJavaScriptOn: html
 ]

diff --git a/src/EMM-WebApplication/EMMTDisplayList.trait.st b/src/EMM-WebApplication/EMMTDisplayList.trait.st
@@ -0,0 +1,40 @@
+Trait {
+	#name : #EMMTDisplayList,
+	#category : #'EMM-WebApplication'
+}
+
+{ #category : #rendering }
+EMMTDisplayList >> dataPlaylist [
+	^ self session model playList.
+]
+
+{ #category : #rendering }
+EMMTDisplayList >> listId [
+	^ #listID
+]
+
+{ #category : #rendering }
+EMMTDisplayList >> renderListOn: html [
+	| datas |
+	datas := self dataPlaylist.
+	html mdlTable
+		attributeAt: 'width' put: '100%';
+		with: [ html
+				tableHead: [ html
+						tableRow: [ html mdlTableHeading
+								nonNumerical;
+								with: 'Title'.
+							html mdlTableHeading: 'Lenght'.
+							html mdlTableHeading: 'Author' ].
+					html
+						tableBody: [ datas
+								do: [ :song | 
+									html
+										tableRow: [ html mdlTableCell
+												nonNumerical;
+												with: (song title ifNil: [ song name ]).
+											html mdlTableCell
+												nonNumerical;
+												with: [ html text: (song artists asOrderedCollection ifNotEmpty: [ :col | col first name ] ifEmpty: [ 'No Author' ]) ].
+											html mdlTableCell with: song length ] ] ] ] ]
+]