[{"data":1,"prerenderedAt":421},["ShallowReactive",2],{"project-41780297":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":29,"sentiment":30,"stance_mix":31,"scored_comments":36,"aspects":37,"strip":48,"post_text":49,"what":50,"said":86,"maker_in_thread":196,"shape":208,"grid":212,"attempts":384,"same_week":385,"maker_shows":34,"maker_hidden":413,"reader_version":414,"card":415},"41780297","Player.style","Winamp and other media players, rebuilt for the web with Web Components","title","Show HN: Winamp and other media players, rebuilt for the web with Web Components","https:\u002F\u002Fplayer.style","player.style","Heff",1728412066,2024,392,63,119,3515,4,"legend","dev_tools","web media player ui themes","library",[24,25,26,27,28],"web components","video player","media chrome","video.js","winamp theme","mixed",0.073,{"positive":32,"neutral":33,"mixed":34,"critical":35},10,13,2,8,33,{"design":38,"idea":40,"pricing":43,"execution":45,"performance":46,"docs":47},{"positive":39,"critical":39},3,{"positive":41,"critical":42},5,1,{"positive":44,"critical":42},0,{"positive":44,"critical":34},{"positive":44,"critical":42},{"positive":44,"critical":44},[44,39,44,41,42,42,39,42,41,44,39,41,39,42,39,41,44,44,39,44,44,44,42,44,42,39,39,42,41,44,44,39,44,41,41,41,42,44,44,41],"Hey all, creator of Video.js and co-founder of Mux & Zencoder here. My team and I built this. I hope you like the themes we’ve built so far, and maybe even get inspired to build your own.\n\nI know Web Components are in a bit of a drama cycle right now. I’m happy to see them get any attention really. I’ve been pretty bullish on them since ~2013 when I started working with them, at least in the context of a widget like a video player. I’ve even given many related talks on them like this one (https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=N6Mh84SRoDg).\n\nI would never push them for a large app or as a full replac",{"problem":51,"audience":57,"pricing":65,"motivation":69,"time_to_build":73,"stack":74,"openness":83,"stage":84,"team_size":85},{"value":52,"source":53,"evidence":54},"Hard to style video players without learning a new UI framework.","maker",[55],{"id":56},"post",{"value":58,"source":53,"evidence":59},"Web developers building video or media player UIs.",[60,61],{"id":56},{"id":62,"by":63,"text":64},"41781798","zoogeny","I love the idea behind this and thank you for making it MIT license. I just happen to be working on a media app (a video editor) and previously I have built a few video players…",{"value":66,"source":53,"evidence":67},"Free",[68],{"id":56},{"value":70,"source":53,"evidence":71},"Make video player styling accessible to developers, avoiding the creativity gap of default controls.",[72],{"id":56},null,[75,79],{"value":76,"source":53,"evidence":77},"Web Components",[78],{"id":56},{"value":80,"source":53,"evidence":81},"React Components",[82],{"id":56},"open_source","launched","team",{"praise":87,"objections":115,"requests":137,"questions":159,"alternatives":174},[88,104],{"value":89,"source":90,"evidence":91},"Clean, impressive themes and design","commenter",[92,96,100],{"id":93,"by":94,"text":95},"41782362","dnsbty","Player.style is excellent! In my last startup I started to build my own video.js theme, and after a few hours realized it probably wasn't worth my time and stuck with the…",{"id":97,"by":98,"text":99},"41780870","andrewchilds","Nicely done. I wish Peacock had used one of these during the Olympics \u002F Paralympics, specifically one that has a visible chapter scrubber like these do. Watching a 6 hour stream…",{"id":101,"by":102,"text":103},"41784847","nimzoLarsen","Beautiful work here and thank you for making it FOSS. Congrats on shipping!",{"value":105,"source":90,"evidence":106},"Web Components praised as reusable and future-proof",[107,111],{"id":108,"by":109,"text":110},"41784342","phplovesong","Very nice! Its refreshing to see this kind of work being done. Right now all the framework authors are going berserk about web-components and spewing \"th3y suCk\" and…",{"id":112,"by":113,"text":114},"41780851","spankalee","Web components are great. You all are doing awesome things with them at Mux!",[116,123,130],{"value":117,"source":90,"evidence":118},"Page is heavy and scrolls slowly on older hardware",[119],{"id":120,"by":121,"text":122},"41780764","henning","An old version of Winamp will load very quickly and run very well on modest hardware. This webpage does not scroll smoothly on a 2019 Mac Book Pro and there's a long delay in…",{"value":124,"source":90,"evidence":125},"Keyboard focus and arrow key controls behave oddly",[126],{"id":127,"by":128,"text":129},"41782399","dpedu","There's some weirdness around focus going on here, hopefully this comes across as constructive criticism. All of them have the same problem: When you click on the video itself,…",{"value":131,"source":90,"evidence":132},"Color choice can produce unreadable contrast",[133],{"id":134,"by":135,"text":136},"41787110","pglevy","Site looks great. I checked audio, HTML, and selected a dark primary color (purple) and the first thing I see is unusable in terms of color contrast. I would expect a tool that…",[138,145,152],{"value":139,"source":90,"evidence":140},"Add subtitle track support to the wizard",[141],{"id":142,"by":143,"text":144},"41783207","redhippo","I love it. Just one kindness: could you add subtitle tracks to the wizard? They are quite hard to add for now, since there is no documentation and media-chrome seems to use a…",{"value":146,"source":90,"evidence":147},"Add a themes for foobar2000",[148],{"id":149,"by":150,"text":151},"41781781","solomonb","Any chance you can do foobar2000?",{"value":153,"source":90,"evidence":154},"Controls that do not cover the video",[155],{"id":156,"by":157,"text":158},"41785136","troupo","It would be nice to add some styles where controls don't cover the video (I don't understand why at one point everyone decided that video controls have to cover actual video).…",[160,167],{"value":161,"source":90,"evidence":162},"Whether Web Components can replace frameworks like React and Vue",[163],{"id":164,"by":165,"text":166},"41790612","sgt","What's left for Web Components to get in order to completely get rid of frameworks like VueJS and React? By getting rid of I mean for 99% of use cases. It may also mean a light…",{"value":168,"source":90,"evidence":169},"Web Components versus iframes for embedding",[170],{"id":171,"by":172,"text":173},"41780689","maelito","Thanks for the link and the work. I wonder what would be the other uses of web components. Practical case : at work we want to distribute a subsidies simulator. It's currently an…",[175,182,189],{"value":176,"source":90,"evidence":177},"Webamp",[178],{"id":179,"by":180,"text":181},"41785646","karteum","If you only care about music (not videos) then you might also have a look at https:\u002F\u002Fwebamp.org\u002F You don't even need to \"compile\" or do anything fancy to \"integrate\" it : just…",{"value":183,"source":90,"evidence":184},"Plyr",[185],{"id":186,"by":187,"text":188},"41797069","01jonny01","You can adapt your code to work with YouTube embeds. Set the youtube embed src to the following: controls=0 – Removes the player controls (like play, pause, volume).…",{"value":190,"source":90,"evidence":191},"React Player",[192],{"id":193,"by":194,"text":195},"41781583","wallawe","The Mux marketing strategy is brilliant. Take over or create new open source projects so that every developer comes across your company in the search for a video package. Another…",{"comments":197,"answered":34,"key":198},19,[199,202,205],{"id":200,"text":201},"41789153","That's a really nice implementation. I feel like it should be easy for that to support videos too, if desired. I assume it's just using a media element under the hood.",{"id":203,"text":204},"41782155","Back around the same 2015 time frame I think I was being very optimistic and stubborn when it came to Web Components. I very much wanted them to work, but didn't really get…",{"id":206,"text":207},"41781910","Thanks! \"Brilliant\" might be giving us too much credit. We're mostly just paying attention to how devs are using video and trying to solve problems in that space. Next-video.dev…",{"commenters":209,"max_depth":41,"maker_replies":197,"first_comment_mins":210,"lifespan_hours":211},37,42,39,[213,215,217,219,221,223,225,229,233,237,240,242,243,246,247,249,254,256,258,260,262,263,268,272,274,276,278,280,283,285,287,289,292,295,297,300,302,304,306,309,312,314,316,320,322,327,329,332,334,339,341,343,346,350,354,358,363,366,369,371,375,379,382],[179,44,44,214,180,44],"other\u002Fneutral\u002Fnone",[200,44,44,216,11,42],"commenter\u002Fneutral\u002Fnone",[62,42,39,218,63,44],"project\u002Fmixed\u002Fdesign",[203,42,44,220,11,42],"project\u002Fpositive\u002Fdesign",[193,34,41,222,194,44],"maker\u002Fpositive\u002Fidea",[206,34,44,224,11,42],"maker\u002Fneutral\u002Fnone",[226,39,42,227,228,44],"41785453","project\u002Fcritical\u002Fpricing","miunau",[230,39,39,231,232,44],"41786032","maker\u002Fneutral\u002Fpricing","have_faith",[234,39,42,235,236,44],"41786198","project\u002Fcritical\u002Fexecution","pjc50",[238,39,39,239,232,44],"41786587","maker\u002Fneutral\u002Fexecution",[241,39,44,231,11,42],"41790461",[127,18,42,235,128,44],[244,18,44,245,11,42],"41782564","project\u002Fneutral\u002Fexecution",[93,41,41,220,94,44],[248,41,44,224,11,42],"41782583",[250,251,39,252,253,44],"41785156",6,"project\u002Fneutral\u002Fperformance","djhn",[255,251,44,252,11,42],"41789224",[112,257,41,222,113,44],7,[259,257,39,239,113,44],"41780901",[261,257,44,224,11,42],"41780970",[186,35,39,245,187,44],[264,265,42,266,267,44],"41786426",9,"project\u002Fcritical\u002Fidea","0points",[269,32,39,270,271,44],"41786215","project\u002Fmixed\u002Fidea","thih9",[273,32,44,220,11,42],"41789515",[97,275,41,220,98,44],11,[277,275,44,214,11,42],"41781104",[164,279,44,214,165,44],12,[281,279,44,214,282,44],"41791251","lovethevoid",[171,33,39,284,172,44],"project\u002Fneutral\u002Fidea",[286,33,44,284,11,42],"41780800",[288,33,44,214,113,44],"41780840",[290,33,44,291,11,42],"41780937","project\u002Fneutral\u002Fdesign",[293,33,44,294,113,44],"41780971","commenter\u002Fneutral\u002Fdesign",[296,33,44,291,11,42],"41781070",[134,298,42,299,135,44],14,"project\u002Fcritical\u002Fdesign",[301,298,39,291,232,44],"41787666",[303,298,44,291,11,42],"41789323",[156,305,42,299,157,44],15,[142,307,39,308,143,44],16,"project\u002Fneutral\u002Fdocs",[310,307,39,308,311,44],"41783281","mmcclure",[313,307,39,308,143,44],"41783412",[315,307,39,308,311,44],"41783484",[317,318,42,299,319,44],"41781310",17,"dfox",[321,318,44,291,11,42],"41781474",[323,324,41,325,326,44],"41782211",18,"project\u002Fpositive\u002Fidea","danslinky",[328,324,44,284,11,42],"41782252",[330,197,44,214,331,44],"41784707","elnova",[333,197,44,214,11,42],"41790833",[335,336,44,337,338,44],"41781378",20,"other\u002Fneutral\u002Fidea","tomjen3",[149,340,39,284,150,44],21,[342,340,44,284,11,42],"41781926",[101,344,41,345,102,44],22,"project\u002Fpositive\u002Fnone",[347,348,41,220,349,44],"41785164",23,"doubleorseven",[351,352,44,214,353,44],"41790878",24,"cebu_blue",[355,356,41,325,357,44],"41786839",25,"pjmlp",[359,360,41,361,362,44],"41781551",26,"maker\u002Fpositive\u002Fnone","theblackdahlia",[120,364,42,365,121,44],27,"project\u002Fcritical\u002Fperformance",[367,364,44,214,368,44],"41780770","afavour",[370,364,44,252,11,42],"41780824",[372,364,44,373,374,44],"41783235","other\u002Fneutral\u002Fperformance","Narishma",[376,364,44,377,378,44],"41780976","commenter\u002Fcritical\u002Fperformance","ale42",[380,364,39,381,311,44],"41781178","maker\u002Fneutral\u002Fperformance",[108,383,41,325,109,44],28,[],[386,390,395,399,403,408],{"id":387,"name":388,"points":389,"category":20},"41742278","One",506,{"id":391,"name":392,"points":393,"category":394},"41776878","Kotlin Money",427,"languages",{"id":396,"name":397,"points":398,"category":20},"41740568","Chebyshev approximation calculator",278,{"id":400,"name":401,"points":402,"category":20},"41764635","ARIA DevTools",272,{"id":404,"name":405,"points":406,"category":407},"41743327","LiveKit Agents",266,"ai",{"id":409,"name":410,"points":411,"category":412},"41780255","URL expander",213,"other",false,"v2",{"id":416,"name":5,"line":6,"ai":413,"cat":20,"year":13,"points":14,"comments":15,"rec":29,"s":417,"top":18,"kw":418,"maker":11,"domain":10,"tier":19,"attempts":44,"strip":419,"url":9,"mix":420,"praise":89,"objection":117,"sub":21},41780297,0.07,[24,25,26,27,28],"0305113150353135003000101331500305551005",[32,33,34,35],1794036662629]