Fixed #4 - Styles now load on WM AU

janchaloupka · Jun 12, 2019 · 122d64f · 122d64f
1 parent 29b533a
commit 122d64f
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 23 deletions.
diff --git a/SpotifyWPW/MainPage.xaml.cs b/SpotifyWPW/MainPage.xaml.cs
@@ -148,12 +148,16 @@ public async void NavigationCompleted(WebView sender, WebViewNavigationCompleted
 		/// <summary>
 		/// Receive control messages from the web player
 		/// </summary>
-		public void ScriptNotify(object sender, NotifyEventArgs e)
+		public async void ScriptNotify(object sender, NotifyEventArgs e)
 		{
 			var data = e.Value.Split('\n');
 
 			switch (data[0])
 			{
+				// Custom styles are ready to be loaded
+				case "LoadCustomStyles":
+					await WebPlayer.InvokeScriptAsync("AppendCustomStyle", new[] { File.ReadAllText("WebPlayer/Style/Player.min.css")});
+					break;
 				// Song info change
 				case "SystemMediaControlsSong":
 					if (data.Length < 3) return;

diff --git a/SpotifyWPW/Package.appxmanifest b/SpotifyWPW/Package.appxmanifest
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <Package xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10" xmlns:mp="http://schemas.microsoft.com/appx/2014/phone/manifest" xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10" xmlns:uap3="http://schemas.microsoft.com/appx/manifest/uap/windows10/3" IgnorableNamespaces="uap mp uap3">
-  <Identity Name="34659janch32.SpotifyWebWrapper" Publisher="CN=075C9BB6-03C5-4339-BE4D-ADD882DD153B" Version="2.0.4.0" />
+  <Identity Name="34659janch32.SpotifyWebWrapper" Publisher="CN=075C9BB6-03C5-4339-BE4D-ADD882DD153B" Version="2.0.5.0" />
   <mp:PhoneIdentity PhoneProductId="d0d0508a-0cbd-4a7c-9b5e-bad333ae7f70" PhonePublisherId="00000000-0000-0000-0000-000000000000" />
   <Properties>
     <DisplayName>Spotify WPW</DisplayName>

diff --git a/SpotifyWPW/SpotifyWPW.csproj b/SpotifyWPW/SpotifyWPW.csproj
@@ -118,7 +118,6 @@
     <None Include="WebPlayer\Style\Components\_DarkMode.scss" />
     <None Include="WebPlayer\Style\Login.scss" />
     <None Include="WebPlayer\Style\Player.scss" />
-    <None Include="WebPlayer\Style\Components\Page.css.map" />
     <None Include="WebPlayer\Style\Components\_ArtistPage.scss" />
     <None Include="WebPlayer\Style\Components\_ContextMenu.scss" />
     <None Include="WebPlayer\Style\Components\_Dialog.scss" />
@@ -162,7 +161,6 @@
     <Content Include="WebPlayer\silence.mp3" />
     <Content Include="WebPlayer\Style\Login.min.css" />
     <Content Include="WebPlayer\Style\Player.min.css" />
-    <Content Include="WebPlayer\Style\Components\Page.min.css" />
     <None Include="Package.StoreAssociation.xml" />
   </ItemGroup>
   <ItemGroup>

diff --git a/SpotifyWPW/WebPlayer/Style/Components/Page.css.map b/SpotifyWPW/WebPlayer/Style/Components/Page.css.map
diff --git a/SpotifyWPW/WebPlayer/Style/Components/Page.min.css b/SpotifyWPW/WebPlayer/Style/Components/Page.min.css
diff --git a/SpotifyWPW/WebPlayer/script.js b/SpotifyWPW/WebPlayer/script.js
@@ -28,9 +28,20 @@ const DARK_MODE = "amoledDarkMode";
 	}
 })();
 
+/**
+ * Append and apply CSS content
+ * 
+ * @param {string} cssContent
+ *	String of CSS rules to be applied
+ */
+function AppendCustomStyle(cssContent) {
+	const styleElement = document.createElement("style");
+	styleElement.appendChild(document.createTextNode(cssContent));
+	document.head.appendChild(styleElement);
+}
 
 /**
- * Apply custom styles and enable mobile mode
+ * Request custom styles load and enable mobile mode
  */
 (function customStyles() {
 	// Enable mobile mode
@@ -39,11 +50,8 @@ const DARK_MODE = "amoledDarkMode";
 	metaViewport.content = "width=device-width;initial-scale=1";
 	document.head.appendChild(metaViewport);
 
-	// Load CSS
-	const customStyle = document.createElement("link");
-	customStyle.rel = "stylesheet";
-	customStyle.href = "ms-appx-web:///WebPlayer/Style/Player.min.css";
-	document.head.appendChild(customStyle);
+	// Request CSS load
+	external.notify("LoadCustomStyles");
 })();