最近，我和一个朋友开始谈论纸牌游戏。他说他只能玩扑克，但是很长一段时间都没玩，因为他忘记了所有组合。所以他们聊了起来。。我记得几年前我写了五张纸牌游戏，包括德州扑克游戏，在游戏中的任何时候，您不仅可以看到收集到的组合，还可以看到尚未打开的所有潜在选项。这很可能会成为一种教学工具，并有助于在玩机器人的过程中刷新规则。我决定重构我的旧代码，并对图形进行调整。设计对我来说一直很困难，不是我的。至少借助一些灵感，我打开了G-San Andreas的配乐，该配乐是来自K-Rose电台的乡村音乐。在我看来，它很好地传达了拉斯维加斯的氛围。我从来没有去过那里，但绝对可以传达出！我向警长发誓。（如果有的话-它是塑料的，所以这不是什么可惜的。。。）而且我也不太懒惰，自己去参加传奇的游戏本身，环游世界赌博之都的虚拟原型Las Venturas。是的，我知道拉斯维加斯位于内华达州而不是德克萨斯州。但毕竟，这类游戏首先与维加斯有关。德州扑克被带到了那里，此后得到了广泛的欢迎。拉斯维加斯是一个游戏制作人。几年前，由于某种原因，我只在Windows应用商店中发布了我的游戏，该应用并不占用大量流量。尽管也许很快，由于Windows 7的停产和向10的大规模过渡，该应用程序商店将迎来第二风。我们祝他好运，并在拉斯维加斯为他握拳。但是这篇文章不是关于这个，而是关于我的游戏的第二局面。它是用纯Javascript编写的，我决定今天可以很好地用作相应附加商店中Chrome和Firefox的浏览器扩展，以及以基于Chrome的Windows 7-10的程序集的形式。该游戏称为“ Poker 3 Bags”，包括五种游戏：“ Texas Hold'em Poker”，“ Throwing Fool”，“ Czech Fool”，“ Three Sticks”和我的作者的游戏“ 3 Bags”。仅在本地计算机上带有机器人的游戏可用。国家
因此，关于乡村音乐。来自GTA San-Andreas的音乐暗示，最好在游戏中添加一些牛仔主题：毕竟，这里的德州扑克是主要游戏。布置卡片时，我将牛仔帽和手枪放在头带上。Firefox And-在主菜单中，游戏名称左侧的小帽子图标。Google Chrome浏览器和帽子将显示在获胜者的个人资料照片上。总体设计，一种小丑，我决定从根本上改变。增强功能
除了图形元素外，游戏中的代码也已更改。我将所有内容都转移到了引擎的新版本中。但是，相对于该游戏，引擎太大声了。该引擎支持3D图形，但在这里-仅限于飞机上的纸牌精灵。但是后来我优化了动画，并使其成为多线程。 （当然，在javascript中，至少在使用浏览器窗口时，没有真正的多线程。通过依次迭代每个调用的所有动画来实现并行性。）还有更多选项。首先，出现了一个游戏内菜单，您现在可以从中控制图像比例。例如：var scaleValue=0.5;
var scale = 'scale('+scaleValue+')';
document.body.style.webkitTransform = document.body.style.msTransform = document.body.style.transform = scale;
这使您可以将图像以任何可用的尺寸放入浏览器窗口。该函数与窗口调整大小事件结合使用；预先计算了所需的比例。后者也可以手动调整。以前，在我的计算机上，该游戏看起来很小，而在电话上，它太大，并且出现滚动条。终于，这个问题解决了。没错，现在可能您必须将第二个界面固定在游戏上-纵向图像，适用于移动设备，尤其是电话...浏览器线的大小（占用手机屏幕的很大一部分）也不好。但是有一个用于将游戏扩展到全屏的按钮。Android 7.0和Windows 8.1Second。我完成了德州扑克游戏。现在可以使用以前没有的全下注，以及手动下注大小选择。所有游戏中的筹码开始按照其面额更实际地移动：例如，如果您下注15，则两个筹码-5和10将使玩家离开桌子，在那里形成一堆筹码。以前，只有一个条件筹码移动。此外，现在他们不能玩4个游戏，但最多可以玩10个游戏。好吧，还有其他一些小的改进，也许不应该停止。技术部分
正如我已经提到的，该游戏是用纯Javascript编写的，没有使用任何第三方库（甚至不使用JQuery）。我的库只有一个，它实现了在canvas标签上显示界面的功能。实际上，所有游戏内容都是界面的一部分。在后者中，我有带有支持的菜单之类的东西。例如，您可以将游戏桌本身用于“退出”菜单，该菜单由一个具有相同名称的按钮组成，作为“背景”。并且足以显示此菜单，以便在画布上显示表格和按钮。此外，按钮不必位于基材上-它也可以在附近。或者，例如，基板可能根本不是。此外，对于每个菜单，您可以显示相关的精灵或不是按钮的“卫星”。对于他们以及按钮设置相对坐标。文档树（DOM）是两个画布块，其绝对位置由浏览器窗口的大小扩展。画布所需的所有子画面都使用drawImage（）显示。背景层（渐变）和界面元素位于底层，顶层用于动画。当然，将自己限制为两层是可能的，但是我决定再增加两层。因此，在我的ui引擎中，构建了DOM：m3d.ui.initHtml([
m3d.ui.htmlCanvas('canvbk'),
m3d.ui.htmlControlsHand(),
m3d.ui.htmlDiv('help', 0,0),
m3d.ui.htmlCanvas('canvblack')
]);
- htmlCanvas是带有画布的图层，以适合浏览器窗口的大小；使用其名称（'canvbk'），以便在必要时可以禁用该层（对于此元素，则永远不需要）。该块用于显示背景渐变和界面。
- htmlControlsHand — , , . , DOM . ( ).
- htmlDiv — div- id='help', , , . . ( id display='block', display='none' : m3d.ui.layersDiv.help.div.style.display='block'; ). htmlDiv - (, ). , , , (0,0).
- htmlCanvas('canvblack') — canvas, . «» . .
因此，只有两个较低的层永久保留。通过m3d.ui.initHtml指定的所有元素均由resize函数处理，并在调整浏览器窗口大小时对其进行调整。动画引擎也是您自己的。其功能是在给定的时间内将参数从给定的初始值更改为最终值。例如，这可以是沿两个轴的坐标（对于3D-沿三个轴）和旋转角度。通常，一个动画的参数数量不受限制，您可以提供一个用于更改任何内容的公式。最后，在子画面所在的回调函数中，所有参数的当前值以取决于系统处理能力的频率进行传输。 Fps可能会下降，但是总动画时间将保持不变。上方的画布接受点击事件（对于移动设备，则是独轮车），并由坐标决定了必须按下界面上的哪个按钮。动画是这样的。将要移动的对象从底层移除（该对象必须是刚刚关闭的“卫星”），重新绘制整个界面，即所有打开的“带有衬底的菜单”（相应地，卫星不再在那里，它已删除），该对象上升到上层，移动到那里，然后消失，最后落到下层，在下层，它要么与另一个“底物菜单”绑定为卫星，要么具有不同的相对坐标。底层的菜单再次重新绘制。合并图层内容的功能留给浏览器，它是本机执行的。游戏中的DOM不会发生任何变化，并且实际上总是由彼此重叠的两个画布组成。除非重新设置浏览器窗口的大小，否则所有内容将以新比例重新绘制1次。一切都可以在Windows和Android的Chrome和Firefox中运行。通过打开index.html从本地服务器和文件系统。 IE11保留布局。似乎画布的大小或比例在此处被错误地定义，这导致了滚动条的出现。虽然，游戏本身运行良好。我没有处理这个问题：不太可能有人会使用这个过时的浏览器。在古代版本的Edge中，一切正常。IE11我尚未在iOS（+ MacOS）和Linux上进行过测试，但我认为没有理由不起作用，因为一切都非常简单。关于本地化。支持2种语言-俄语和英语。通过单击主菜单中的标志进行切换。从技术上讲，这是通过两个js文件的形式实现的，如果文件中嵌入了某些文本（例如，凹陷文本或渐变文本），则这些js文件具有不同语言的短语关联数组以及不同的图片。与世界分享
没有比浏览器扩展商店更好的了。好吧，我还针对基于Chrome的Windows进行了构建。这个版本的游戏是一个演示。它需要进一步完善。计划有30天的试用版，其中包含三款游戏。付费版本有五款游戏，没有限制。后者还将有机会在扑克中进行全押投注，并且在确定获胜者时还将考虑组合卡的资历。现在，该演示中有三款游戏，并且没有时间限制。稍后，该演示将变成试用版，并发布另一个已经完成的版本。浏览器扩展
因此，我决定将游戏放入Chrome和Firefox附加商店中的第一件事。我已经拥有开发人员帐户并有一定的经验，因为我已经在其中发布了一个浏览器扩展。顺便说一句，如果有人使用ChromeOS，那么知道我的游戏是否在这里工作会很有趣。我没有机会检查。有两种显示扩展内容的选项-在浏览器界面顶部的窗口中或在单独的标签中。由于内容占用的面积很大，并且会大大阻塞当前的打开选项卡，因此我选择了第二个选项。创建基于网页的浏览器扩展并没有什么复杂的事情，本质上，这就是我的游戏。您只需要添加清单文件，图标和屏幕截图。在Chrome Webstore中，您也可以将视频添加到我的游戏中。然后他用Firefox拍摄了另一个视频：Firefox浏览器附加组件的存档大小为4.8 Mb。压缩后的游戏-5.2 MB。当然，大部分内容都是图形。两种浏览器的游戏代码完全相同，只是在绑定的十几行中有所不同，该绑定负责通过单击命令行右侧浏览器面板中的游戏图标来打开与游戏的选项卡。由于该附加组件根本不需要任何特殊权限，并且不需要访问任何服务器或个人数据，因此在放置当天，两个商店的审核几乎都是即时的。Windows可执行文件和其他版本
我使用最简单的Windows Web2Exe实用程序在Chrome引擎上创建了程序集，并将其上载到Itch和Indiexpo商店，其中我的一款游戏已经存在。该程序集的大小为115 MB。在与用于创建安装程序的程序打包在一起后，用于下载的分发程序包的容量为40 MB。Windows 7的构建-10尽管我在那里有开发者帐户，但没有将此版本的游戏发布为Windows 10应用程序在Windows应用商店中。几年前，我已经拆掉了Visual Studio。此外，还有一个有趣的故事。我已在平板电脑上许可Windows 8.1，它完全适合我。在计算机上-Windows10。从某种版本的Visual Studio开始-在这里我不记得了-它完全不允许您创建支持Windows 8.1的javascript应用程序，或者您不希望在其中嵌入广告（如果设计的话），同样在较旧的Windows 8.1上也为“数十”（但我希望有可能获利）。通常，我已经忘记了确切的内容，但是某些问题恰恰与8.1的支持限制有关。但是很明显，我只从这家商店下载游戏，我希望能够在平板电脑上播放。我认为商店本身不以任何方式推广应用程序。因此，我还不确定我是否真的要再次将巨大的Visual Studio再次放在平板电脑上的32GB MicroSD卡上……开发人员帐户仅适用于它。或者，在权衡利弊并考虑到Microsoft商店的访问者数量之后，只需像编写笔记本一样继续编写代码，而完全不会与庞大的开发环境混为一谈？遗憾的是，您无法仅通过网站上的表单通过应用程序下载存档，因为存档是针对浏览器扩展实现的。我想把巨大的Visual Studio再次放在平板电脑的32GB MicroSD卡上吗？开发人员帐户只能使用它。或者，在权衡利弊并考虑到Microsoft商店的访问者数量之后，只需像编写笔记本一样继续编写代码，而完全不与大型开发环境混为一谈？遗憾的是，您无法仅通过网站上的表单通过应用程序下载存档，因为存档是针对浏览器扩展实现的。我想把巨大的Visual Studio再次放在平板电脑的32GB MicroSD卡上吗？开发人员帐户只能使用它。或者，在权衡利弊并考虑到Microsoft商店的访问者数量之后，只需像编写笔记本一样继续编写代码，而完全不与大型开发环境混为一谈？遗憾的是，您无法仅通过网站上的表单通过应用程序下载存档，因为存档是针对浏览器扩展实现的。我计划在不久的将来将该游戏作为i-frame应用发布到社交网络VKontakte和Facebook上。根据他们的规则，仍然有必要加强游戏中的某些社交功能，例如最佳玩家的评分表等。也许仍然值得朝Google Play市场的方向看。据我所知，现在可以在此处托管PWA（渐进式Web应用程序）。但是我没有开发者帐户，还没有弄清楚。另一方面，可以将PWA放在您的网站上，从中将游戏安装到手机上，将创建一个图标，并且所有内容看起来都像普通的Android应用程序。最有可能的是，仅在广告预算不高的情况下进入“商店”是有意义的，而我没有。通常，移动设备上还没有游戏。我认为我只是将其发布在网站上以通过浏览器播放，并将其安装为PWA应用程序，以免依赖于网络连接。是的，它很高兴像Microsoft Store一样，Google Play使得下载以Javascript编写的应用程序成为可能。我曾经在Microsoft商店中喜欢此功能。可惜的是后者并不特别受欢迎。而且非常方便-我在那里仅下载了5.2 MB（即javascript代码和图片），您就完成了。无需任何大型绑定和其他库。并且浏览器是从系统中已安装的浏览器使用的。理想情况下，它还将为用户提供选择哪个浏览器作为游戏“玩家”的机会。我记得，微软从商店下载此类应用程序时仅提供IE11。无论如何，旧版本的游戏都是在其中启动的。但是，现在，当他们从Google切换到引擎时，也许没有区别。顺便说一句，Chrome比IE11更好，可以与3D图形WebGL一起使用...但这不适用于游戏，本文将对此进行讨论。总
总而言之，这个游戏是一个模拟器。没有在线游戏，您只能与机器人一起练习。这里的主要内容是查看您已收集并可能收集的组合。为此，只需单击带有问号的菜单按钮或您的卡片即可。现成的组合在右侧带有绿色圆圈，潜在的组合包含发暗的卡片，这些卡片仍然可以从牌组中获得。最后，考虑到工具包中其他游戏的可用性，该程序可以用作例如无聊单人游戏的替代品。该程序具有Windows程序集形式和浏览器加载项形式的自主性，并且其工作不需要Internet连接。最后：清单
我想留下的地方以及已经完成的地方：+浏览器扩展商店-主Windows游戏商店（蒸汽）+辅助Windows游戏商店-移动商店-社交网络-网站Firefox中的附加组件